@import url(http://fonts.googleapis.com/css?family=Asap:400,700,400italic|Lato:400,700,300);

* { text-decoration:none; border:none; outline:none; }
a, input[type="submit"], input:hover, textarea:hover, img { transition-property:all; transition-duration:0.12s; transition-timing-function:linear, ease-in; }
html { overflow-x:auto; }
html, body, #container { margin:0; padding:0; width:100%; height:100%; min-height:100%; }
body { background:url(../images/template/bg.jpg) repeat center; }
#container { position:relative; margin:auto; min-width:320px; max-width:1920px; overflow-x:auto; }
.centre { position:relative; width:100%; max-width:1200px; margin:auto;  }
.clear { clear:both; }
.text-center { text-align:center; }
.image-resize { width:100%; height:auto; display:block; margin:auto; }
.pad { padding:0 30px; }
hr { background:url(../images/template/hr-bg.png) repeat-x; height:3px; width:100%; margin:0; }
.text-left { text-align:left !important;}
.text-center { text-align:center !important;}
.icon-slide-container {float: left; height: 43px; overflow: hidden; position: absolute; text-align: left; width: 164px; }
.slide-icon { height: auto; margin-top: -43px; position: absolute; transition: all 0.4s ease 0s; width: 164px; }
.slide-icon:hover { margin-top: 0; position: absolute; }

/* Header */

header { z-index:2; background:url(../images/template/header-bg.png) repeat; position:relative; }
.logo { position:relative; top:5px; float:left; height:120px; }
header .logo:hover { opacity:.7; }
header hr { position:absolute; bottom:0;}
#registration { width:164px; height:43px; right:0; float:right; margin:20px 0; }

/* Navigation  */

nav { width:80%; height:50px; z-index:200; right:0; float:right; }
nav ul { width:100%; margin:0; padding:0; list-style:none; display:table; }
nav ul li { margin:0; padding:0; display:table-cell; }
nav a { padding:0 4px; height:50px; font:bold 16px/50px 'Asap', sans-serif; color:#666; text-align:center; display:block; }
nav a:hover { color:#6DB0BA; }
nav li.active a.main { height:48px !important; color:#6DB0BA; }

nav ul li ul { width:auto; margin-left:1px; position:absolute; display:none; z-index:200; }
nav ul li ul li { display:inline; z-index:100; }
nav ul li ul li a { height:35px; padding:0 30px; font:bold 16px/35px 'Asap', sans-serif; text-align:left; background:#f4f5f5; border:none; }
nav ul li ul li a:hover, nav ul li ul li.active a { height:35px !important; background:#fdde49; border-bottom:none !important; color:#fff; }

nav ul li ul li:first-child a:hover, nav ul li.active ul li:first-child a { height:33px !important; }
nav ul li ul li:first-child a { height:33px; line-height:33px; border-radius:0; border-top:2px solid #f4f5f5; }
nav ul li ul li:last-child a { border-radius:0; box-shadow:0 2px 0 rgba(0, 0, 0, 0.15); }
nav li:last-child ul { right:0; }

.clearfix:before, .clearfix:after { content:" "; display:table; }
.clearfix:after { clear:both; }
.clearfix { *zoom:1; }
nav a#pull { display:none; color:#FFF !important; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.2) !important; }

/* Slideshow */

#slideshow { width:100%; min-height:300px; margin:0; overflow:hidden; max-height:490px; }
#slideshow .slider { overflow:hidden; }
#slideshow .centre { background:#fff; z-index:1; }
#slideshow .item { position:relative; min-height:490px; }
#slideshow .item img { width:100%; height:auto; min-width:550px; min-height:490px; display:block; }
/*#slideshow .left, #slideshow .right { position:absolute; top:130px; width:25%; height:500px; max-height:500px; }
#slideshow .left { background:url(../images/image1.jpg) no-repeat center right; background-size:cover; left:0; }
#slideshow .right { background:url(../images/image2.jpg) no-repeat center left; background-size:cover; right:0; }*/
a.nav { position:absolute; top:50%; width:83px; height:83px; margin-top:-41px; cursor:pointer; z-index:100; }
a.nav.prev { background:url(../images/template/slide-nav-prev.png) bottom left; left:25px; }
a.nav.next { background:url(../images/template/slide-nav-next.png) top left; right:25px; }
a.nav.prev:hover, a.nav.next:hover { opacity:0.5; }

/* Content */

#content { position:relative; width:100%; min-height:500px; z-index:1; }
section { padding:20px 0 0 0; min-height:500px; width:66%; float:left; }
article { font:15px/23px 'Asap', sans-serif; color:#333; margin-right:40px; margin-top:20px; }
article h1, .blog-container h1 { font:40px/40px 'Lato', sans-serif; letter-spacing:-0.4px; color:#6db0ba; margin:10px 0; padding:0; text-align:left; text-transform:uppercase; text-align:center; }
article h2 { font:30px/35px 'Lato', sans-serif; color:#6db0ba; margin:0 0 10px 0; padding:0; }
article h3 { font:18px/35px 'Lato', sans-serif; color:#333; margin:0 0 10px 0; padding:0; }
article p { margin:0 0 25px 0; padding:0; }
article p.intro { font:400 18px/28px 'Asap', sans-serif; padding:0; }
article p a, article a { color:#55a1ac; }
article a:hover, article a:hover { color:#333; }
article ul { margin:0 0 25px; padding:0; list-style:none; }
/*article .pad { padding:0 30px; margin-left:-30px; margin-right:-30px; }*/
article .col-2{ width:45%; padding-right:5%; float:left; display:block; }
article .col-2 p { padding:0 30px; }
.facebook-feed { margin-bottom:20px; }
.facebook-feed.medium { display:none; }

/* Webapp List View */

article .listbox { display: block; width:100%; margin:20px 0; }
article .listbox .list-image { float:left; margin:0 20px 10px 0; }
article .detail-image img { float:left; margin:0 20px 20px 0; width:100%; max-width:712px; height:auto !important; }
article a.button { background:#8dc2ca; color:#fff; padding:10px 20px; font:bold 14px/35px 'Asap', sans-serif; cursor:pointer; }
article a.button:hover { background:#ffd300; }
article .date { font-size:11px; font-style:italic; margin:0 0 5px 0;}
aside .date { font-size:11px; font-style:italic; margin:0 0 5px 0; color:#fff;}
aside ul li { list-style-type:none; font:15px/23px "Asap",sans-serif; }

/* Sidebar */

aside { width:33%; padding:20px 0; float:right; }
aside .box { width:100%; display:block; float:left; margin:0; position:relative;  }
aside .box p { margin:0; padding:30px; font:bold 14px/24px 'Lato', sans-serif; text-transform:uppercase; color:#fff; text-align:left; }
aside a { color:#fff; }
aside a:hover { color:#55A1AC; }
aside .box .title { font:bold 30px/30px 'Lato', sans-serif; letter-spacing:3px; text-align:center; }
aside .box.subscribe { background:url(../images/template/subscribe-bg.jpg) no-repeat; height:260px; background-size: cover; margin-top:20px; text-align:center; }
aside .box.subscribe .title { padding-top:80px; padding-bottom:10px; }
aside .box.subscribe p { text-align:center; font:30px/35px 'Abel', sans-serif; color:#fff; margin:0; }

/* Subscribe Form */
#form { width:100%; clear:both; margin:0; }
#form label, #form input, #form select { height:15px; line-height:12px; margin:0 0 8px 0; }
#form label { width:150px; padding:10px 0 0; line-height:19px; float:left; }
#form input, #form select, #form textarea { width:70%; font:15px/21px 'Asap', sans-serif; color:#333; padding:10px; background:url(../images/template/form-bg.png) repeat; }
#form select { width:70%; height:37px; padding:5px; }
#form input[type="text"], #form input[type="email"] {  }
#form br { clear:both; }
#form .wrap-submit { width:70%; margin:-43px auto 0; padding:0; }
#form .submit { background:transparent; width:50px; height:36px; font:400 20px/28px 'Asap', sans-serif; color:#333; margin-right:-10px; text-align:center; text-transform:uppercase; cursor:pointer; position:relative; float:right;  }
#form .submit:hover { color:#fff; }

/* Testimonials */
p.testimonial { font-size:12px; font-style:italic; }

aside .box.registration { background:url(/images/template/registration-bg.jpg) no-repeat; background-size: cover;  text-transform:uppercase; height:260px; }
aside .box.registration p.title { text-align:left; }
aside .box.karunjie img { width:100%; display:block; }
aside .box.latest-news { background:url(/images/template/latest-news-bg.jpg) no-repeat; background-size: cover;  height:350px;}
aside .box.latest-news .title { padding-top:80px; padding-bottom:70px; }
aside .box.latest-news .blogsitesummary { margin:15px 20px 0;}
aside .box.latest-news .blogsitesummary a{ float:left; clear:both; font:16px/23px 'Asap', sans-serif; color:#fff;}
aside .box.latest-news .blogsitesummary ul, .blogsitesummary ol{ margin:0; padding:0 !important;}
aside .box.latest-news .blogsitesummary li{ list-style-type:none; background:none !important; text-align:left !important;}
aside .box.latest-news .blogsitesummary .author { display:none; } 
aside .box.latest-news .blogsitesummary .date{ clear:both; float:left; font:italic 12px/14px 'Asap', sans-serif; color:#fff;}
aside .box.latest-news ol{ padding-left:0 !important;}
aside .box.latest-news ul.pagination li { display:none; }

/* Footer */

#bar { width:100%; height:440px; background:url(../images/template/the-gibb-challenge-crossing.jpg) center top no-repeat; position:relative; z-index:200; }
#bar .tagline { font:40px/45px 'Lato', sans-serif; color:#fff; position:absolute; top:35px; text-transform:uppercase; }
#bar .tagline span { font:50px/45px 'Lato', sans-serif; }
#bar .testimonial { background: url("../images/template/testimonials-bg.png") repeat scroll 0 0 rgba(0, 0, 0, 0); color: #FFFFFF; float: right; font: 25px/35px 'Lato',sans-serif; margin-top: 200px; padding: 2%; width: 40%; }
#bar .testimonial p { float: right; margin: 0 0 0 1%; width: 85%; }
#bar .testimonial span { float: left; font: 100px/45px 'Lato',sans-serif;  margin-top: 5%; width: 10%; }

#sitemap { width:100%; padding:31px 0 42px; background: url(../images/template/footer-overlay.png) repeat; position:relative; z-index:1; }
#sitemap .col { width:33%; float:left; }
#sitemap .col .title { padding:9px 0 17px; font:25px/45px 'Lato', sans-serif; text-transform:uppercase; color:#fff; }
#sitemap .col ul { margin:0 30px 0 0; padding:0; list-style:none; }
#sitemap .col li { margin:0; padding:0; }
#sitemap .col a { padding:9px 0; font:16px/19px 'Asap', sans-serif; color:#FFF; display:block; }
#sitemap .col a:hover { color:#FFD300; }
#sitemap #social { height:120px; margin:5px auto; }
#sitemap #social .share { clear:both; margin:40px 0 0 0; padding:10px 0 0 0; }
#sitemap #social .share .stButton { margin:0; }

#copyright { width:100%; }
#copyright p { margin:0; padding:0; font:12px/50px 'Asap', sans-serif; color:#666; width:50%; }
#copyright p.copy { float:left; }
#copyright p.footer-logo { float:right; margin-bottom:30px; margin-top:10px; }
.id { float:right; }
.id:hover { opacity:.7; }

/* Galleries */
.photogalleryItem img{ background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #e9e6e6; padding: 1px; box-shadow:0 0 5px #DCDCDA; }

/* Contact Form */
input.cat_textbox, textarea.cat_listbox, select.cat_dropdown, select.cat_listbox, .form input, .webform input { padding:5px; }
.form label, .webform label { font-size:14px; }
.button { background:#8dc2ca; color:#fff; padding:10px 20px !important; font:bold 14px/25px 'Asap', sans-serif; cursor:pointer; }
.button a:hover { background:#6da2aa; }

/* Blog Module */
.BlogRecentPost li, .BlogTagList li, .BlogPostArchive li { margin:0; }
#catblogoutput { width: 100% !important; float:left; display:block; }
.blog-container .side-panel { width:27% !important; float:left; display:block; }
.blog-container .post-list { width:69%; margin-left:4%;}
.comment-list { background: none; border:none; padding:0;}

/* Colorbox (for testimonials form) */

#colorbox, #cboxOverlay, #cboxWrapper{ position:absolute; top:0; left:0; z-index:9999; }
#cboxOverlay{ position:fixed; width:100%; height:100%; }
#cboxMiddleLeft, #cboxBottomLeft{ clear:left; }
#cboxContent{ position:relative; }
#cboxLoadedContent{ overflow:auto; -webkit-overflow-scrolling:touch; }
#cboxTitle { font:bold 18px arial; color:#FFF; text-transform:lowercase; position:absolute; top:-28px; left:0; width:450px; }
#cboxLoadingOverlay, #cboxLoadingGraphic{ position:absolute; top:0; left:0; width:100%; height:100%; }
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{ cursor:pointer; }
.cboxPhoto{ float:left; margin:auto; border:0; display:block; max-width:none; }
.cboxIframe{ width:100%; height:100%; display:block; border:0; }
#colorbox, #cboxContent, #cboxLoadedContent{ box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; }
#cboxOverlay{ background:#000; }
#cboxContent{ margin-top:32px; overflow:visible; background:#fff;}
.cboxIframe{ background:#fff; }
#cboxError{ padding:50px; }
#cboxLoadedContent{ background:#fff; }
#cboxLoadingGraphic{ background:#fff url(/_System/images/bg-colorbox-loader.gif) center center no-repeat; }
#cboxLoadingOverlay{ background:#fff; }
#cboxTitle{ font:bold 18px arial; color:#FFF; text-transform:lowercase; position:absolute; top:-28px; left:0; width:450px; }
#cboxCurrent{ font:bold 11px arial; position:absolute; top:-21px; right:30px; color:#888; }
#cboxPrevious { position:absolute; top:50%; left:-19px; margin-top:-27px; background:url(/images/template/bg-colorbox-nav.png) top left; width:50px; height:50px; text-indent:-9999px; }
#cboxPrevious:hover { background-position:bottom left; }
#cboxNext { position:absolute; top:50%; right:-21px; margin-top:-27px; background:url(/images/template/bg-colorbox-nav.png) top right; width:50px; height:50px; text-indent:-9999px; }
#cboxNext:hover { background-position:bottom right; }
#cboxClose { position:absolute; top:-15px; right:-17px; display:block; background:url(/images/template/bg-colorbox-close.png) top; width:42px; height:42px; text-indent:-9999px; z-index:9999; border: 0; }
#cboxClose:hover { background-position:bottom; }
	
@media only screen and (max-width:1200px) {
#slideshow, #slideshow .item, #slideshow .item img { min-height:250px; }
#slideshow .left, #slideshow .right { display:none; }
}

@media only screen and (max-width:1100px) {
nav { width:100%; left:0; height:65px; margin:auto; margin-top:10px; }
aside .box.latest-news .blogsitesummary { margin-top:0;}
}

@media only screen and (max-width:960px) {
aside { width:100%; padding:20px 0 0 0; float:none; clear:both; }
aside .box { width:50%; }
section { width:100%;}
article { margin-right:0; }
aside .box.subscribe { margin-top:0; }
aside .box.latest-news { height:480px; }
aside .box.latest-news .blogsitesummary { margin-top:45px;}
#bar .testimonial { width:80%; }
}



@media only screen and (max-width:780px) {

nav ul#main { display:none; }
nav ul li ul { display:none !important; }
nav { height:auto; min-height:50px; width: 100%; background:#8ec3cb; }
nav li {  font:bold 25px/50px 'Lato', sans-serif; width:100%; height:50px; display:inline; float:left; }
nav li a { height:50px; border-left:none; border-bottom:1px solid #abd8df !important; color:#fff; }
nav li a:hover { background:#86b8c0; border-bottom:1px solid #abd8df !important; color:#fff; }
nav a#pull { width:100%; height:50px; font:bold 25px/50px 'Lato', sans-serif; color:#fff; display:block; position:relative; }
nav a#pull:hover { background:#86b8c0; }
nav a#pull:after { content:""; background:url('../images/template/nav-icon.png') no-repeat; width:30px; height:30px; display:inline-block; position:absolute; right:15px; top:15px; }
nav .hide { display:inline; }

aside .box.latest-news { height: 400px;}
aside .box.latest-news .blogsitesummary { margin-top:0;}
#catblogoutput { width: 100%; }
.blog-container .side-panel { width:100%;}

}


@media only screen and (max-width:680px) {
header p.logo { width:100%; text-align:center; top:10px; left:0; }
article .col-2{ width:100%; }
#sitemap .col { width:100%; text-align:center; }
#sitemap .col #social { margin:15px  auto; width:164px; }
aside .box .title { font:bold 25px/25px 'Lato',sans-serif; }
aside .box.latest-news .blogsitesummary { margin-top:0px;}
.photogalleryItem img{ width: 150px !important; }
.blog-container .side-panel { width:100% !important;}
.blog-container .post-list { width:100%; margin-left:0; }
.mobile-hide { display:none;}
.facebook-feed.full { display:none; }
.facebook-feed.medium { display:block; }

}

@media only screen and (max-width:560px) {
article .listbox .list-image { margin-right:0; width:100%; }
article .listbox .list-image img { width:100%; }
aside .box { width:100%; }
aside .box .title { font:bold 30px/30px 'Lato',sans-serif; }
#bar .testimonial { font: 20px/35px 'Lato',sans-serif; }
#bar .tagline { font: 30px/35px 'Lato',sans-serif; }
#bar .testimonial span { margin-left:-10%; }
#bar .testimonial { padding:4% 4% 4% 10%; width:60%; }
aside .box.latest-news .blogsitesummary { margin-top:20px;}	
.logo { float:left; width:100%; text-align:center; margin:0 auto; }
#registration { width:100%; }
#registration .icons { margin:0 auto; width:164px; }
.photogalleryItem img{ width: 120px !important; }
#copyright p.copy, #copyright p.footer-logo  { width:100%; text-align:center; }
.id { float:none; }
#bar .testimonial { width:90%; }
}

@media only screen and (max-width:320px) {
.photogalleryItem img{ width: 90px !important; }
aside .box.latest-news .blogsitesummary { margin-top:0;}	
}
