h1 {margin-bottom:30px;}

.container {min-width:320px; width:100%;}

.bootstrap-size {position:fixed; top:0; left:0; z-index:5000; background:#000; color:#fff; font-weight:700; width:100px; padding:10px; border-bottom-right-radius:10px; border:1px solid #ccc; box-shadow:0px -2px 11px 2px #666;}
#portrait-device {display:none;}

#header {position:relative;}
#header-top {padding-top:15px; padding-bottom:15px;}
#header .telno {padding:10px 0; font-size:22px;}
#header-social img {margin-left:10px;}
#company-logo img {max-width:100%; height:auto;}

#main-menu  {margin-bottom:0; border:none; border-radius:0;}
#main-menu .navbar-nav {width:100%;}
#main-menu a {font-size:18px;}
#main-menu .dropdown-menu {border-bottom-left-radius:10px; border-bottom-right-radius:10px; left:15px;}
#main-menu .dropdown-menu li {padding:0;}
#main-menu .dropdown-menu li > a {font-size:16px; padding:3px 20px !important;}

#page-middle {padding-bottom:60px; overflow:auto;}
body#services #page-middle, body#case-study #page-middle {padding-bottom:0;  background:url("/images/layout/left-menu-bgd.jpg") left repeat-y;}
body#home h1 {text-align:center;}

#panel-row {padding-top:45px; padding-bottom:30px;}
#panel-row img {max-width:100%; height:auto;}
#panel-row span {display:block; font-size:18px; text-align:center; padding:5px 0;}

#header-banner {
    background:#adc1d9;
	position:relative;
	padding:0;
    height:373px;
    overflow:hidden;
	margin-bottom:30px;    
}

#home-gallery {max-width:1366px; max-height:373px; margin:0 auto; position:relative;}
#header-banner img {max-width:100%; height:auto;}

#header-banner #alt-caption {position:absolute; z-index:110; width:100%; right:0px; bottom:0; text-align:center; background:transparent url("../images/layout/caption-bgd.png"); padding:20px 0;}
#header-banner #alt-caption ul {margin:0 auto; padding:0;}
#header-banner #alt-caption li {display:inline-block; margin:0; padding:0 15px 0 35px; list-style:none; background:url("../images/layout/bullet-arrow-green.png") left no-repeat;}

#footer {position:relative; padding-top:30px; padding-bottom:30px;}
#footer-right img {margin-bottom:15px; max-width:212px; height:auto;}

#footer-social {padding-bottom:15px;}
#footer-social img {margin-right:10px;}

#footer-contact div {padding-bottom:10px; letter-spacing: 0.02em;}

#footer-menu {padding:0;}
#footer-menu ul {margin:0; padding:0;}
#footer-menu li {margin:0; padding:0 10px 0 0; list-style:none; display:inline-block;}

.photo-gallery img {padding:5px; max-width:100%; height:auto;}

.shop-catalogue .image img {max-width:100%; height:auto;}

/* BUTTONS - based on Bootstrap default */

.shopping-cart-buttons a {
  -moz-user-select: none;
  background:#fff none;
  border: 1px solid #ccc;    
  color: #333;    
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857;
  margin-bottom: 10px;
  padding: 6px 12px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 1px 1px rgba(0, 0, 0, 0.075);
}

.shopping-cart-buttons a:focus, .shopping-cart-buttons a:hover {
  background-color: #e6e6e6;
  border-color: #adadad;
  color: #333;
  text-decoration: none;
}

#datepicker #ddMonth, #datepicker #ddYear {font-size:14px !important; margin-bottom:10px;}
#datepicker .text, #datepicker button {font-size:16px !important;}
#datepicker button {   
	background-image: linear-gradient(to bottom, #337ab7 0px, #265a88 100%);
	background-color: #337ab7;
	background-repeat: repeat-x;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset, 0 1px 1px rgba(0, 0, 0, 0.075);
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);	
	border-color: #245580; 
	color:#fff;
	-moz-user-select: none;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857;
	margin:10px 0;	
    padding: 6px 12px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

#datepicker button:hover {
	background-color: #265a88;
	border-color: #204d74;
	color: #fff;
}

#datepicker td {font-size:16px !important; padding:5px; border:2px solid #fff;}
#datepicker td[onclick] {background:#eee; cursor:pointer; border-radius:3px;}
#datepicker td[onclick]:hover {background:#C6EFFF; }

.content-section {padding-bottom:45px; margin-bottom:45px; overflow:auto;}
.content-section img {max-width:100%; height:auto;}
.content-section ul {margin:0; padding:15px;}
.content-section li {list-style:square;}

.section-IntroBlock {padding-top:45px; padding-bottom:45px;}
.section-IntroBlock h1 {margin-top:0;}

.testimonial-row { padding:15px 0;}
.testimonial-quote:before {
  content:"\201C"; 
  color: #ccc;
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.05em;
  vertical-align: -0.4em;    
}
.testimonial-name {vertical-align:sub; font-size:13px; font-style:italic;}

#contact-map {text-align:right;}
#contact-map iframe {margin:30px 0; width:100%; height:300px;}
#contact-details {}
#contact-details div {margin-bottom:5px;}

.photo-gallery {margin:0 auto;}
.photo-gallery img {display:none;  cursor:pointer;}
.gallery-loading {font-size:24px; font-weight:bold; text-align:center; padding:30px 0;}
.gallery-item {display:none; width:300px; padding:15px; text-align:center;}
.gallery-item-desc {font-weight:bold; padding:10px 0; font-size:20px;}

#gallery-lightbox {display:none;  width:100%; height:100%; position:fixed; top:0; left:0; background:#000; z-index:-1; opacity:.93; cursor:pointer;}
#gallery-lightbox-image {display:none; position:absolute; left:10%; top:40px; margin:20px 0; width:80%; z-index:-1; text-align:center; padding-top:30px;}
#gallery-lightbox-image img {max-width:100%; height:auto; cursor:pointer;}
#gallery-lightbox-close {font-size:30px; color:#fff; position:absolute; top:10px; right:10px; text-align:center; z-index:-1;} 
#lightbox-caption {color:#fff; padding:10px; text-align:center; font-weight:700;}

/* GALLERY - Slider */
#gallery-main,
#gallery-thumbnail {
    width: 100%;
    margin: auto;
    position:relative;
}

#gallery-main div {width: 100%;}

#gallery-main .cycle-slideshow > div {width:60%; margin-left:20%; overflow:hidden; max-height:590px;}

#gallery-main .cycle-slideshow img {
    width: 100%;    
    height: auto;   
    display: block;
}

#gallery-thumbnail .cycle-slide img {
    border: 3px solid #fff;
    cursor:pointer;
}
#gallery-thumbnail .cycle-slide-active img {
    border: 3px solid #d48c0f;
}
#gallery-thumbnail {    
    padding:45px 15px;    
}

#gallery-thumbnail .cycle-slide {overflow:hidden; padding:0 15px;}
#gallery-thumbnail .cycle-slideshow img {    
    width:100%;    
    height: 170px;
    display: block; 
    cursor:pointer;
}

#gallery-thumbnail-cycle {padding:15px 0;}

#gallery-top .custom-caption {color:#fff; text-align:center; display:block; padding:10px 0;}

#gallery-top .cycle-prev, #gallery-top .cycle-next {position:absolute; top:45%; color:#caa31c; font-size:60px; cursor:pointer; z-index:500; opacity:0;}
#gallery-top #gallery-thumbnail .cycle-prev, #gallery-top #gallery-thumbnail .cycle-next {top:25%;}
#gallery-top .cycle-prev:hover, #gallery-top .cycle-next:hover {opacity:.7;}
#gallery-top .cycle-prev {left:5px;}
#gallery-top .cycle-next {right:5px;}

#page-main-text {padding:15px 60px; background:#edf1f6;}
body#case-study #page-main-text {padding:15px 0 15px 60px;}
body.case-study-intro #page-main-text {padding:15px !important;}

#page-main-text h2, #page-main-text h3 {margin-top:15px;}

body#case-study #page-main, body#services #page-main {background:#365AA4;}
#left-menu {height:100%; background:#365ba5; padding-top:30px; padding-bottom:30px; overflow:auto;}
#left-menu ul {margin:0; padding:0;}
#left-menu li {margin:0 -15px; padding:0; list-style:none;}
#left-menu a {display:block; background:#365ba5; color:#fff; font-weight:900; padding:5px 10px 5px 10px;}
#left-menu li.selected > a, #left-menu a:hover {color:#365ba5; background:#39b871; text-decoration:none;}

body.news #news-detail {border-top:15px solid #ADC1D9; padding-top:15px; margin-top:15px;}

body.news h1 {text-align:left;}
#news-right h2 {text-transform:uppercase;}
body.news h1, #news-right h2, #news-right h3 {margin-top:0;}
#news-right .news-list {padding-bottom:15px;}

body.contact .glyphicon {color:#39b871;}

.case-study-panel .panel-inner {
    padding:0; 
    position:relative;
    margin:45px 15px;
    border:3px solid #ADC1D9; 
    border-radius:5px;
}

.case-study-panel .panel-image {width:100%; height:215px; overflow:hidden;}

body#case-study .case-study-panel .panel-inner h2 {
    position:absolute;
    width:100%;
    opacity:0.8;
    bottom:0;
    color:#fff; 
    background:#39b871; 
    font-size:22px; 
    padding:10px; margin:0;
    text-align:center;
}

body#case-study .case-study-panel img {width:100%; height:auto; margin:0;}

.case-study-panel .panel-inner a:hover h2 {background:#2f5cb6 !important;}

#page-main-text img {max-width:100%; height:auto; margin-bottom:15px;}

#page-header-intro h3 {position:absolute; width:100%; top:0; left:0; padding:10px; margin:0; color:#365ba5; background:#39b871; text-align:center;}

#client-list-box {background:#fff; padding:30px 0; margin:20px 0; width:100%;}

/* #header-banner #alt-caption {position:absolute; z-index:110; width:100%; right:0px; bottom:0; text-align:center; background:transparent url("/images/layout/caption-bgd.png"); padding:20px 0;} */
ul.fancy-bullet {margin:20px 0; padding:0; font-size:21px; color:#4969a3; font-weight:700; letter-spacing:0.1em; clear:both; overflow:auto; width:100%;}
ul.fancy-bullet li {float:left; min-height:3em; letter-spacing:0.05em; box-sizing:content-box; width:40%; margin:0 2% 0 0; padding:0 0 20px 35px; list-style:none; background:transparent url("/images/layout/bullet-arrow-green.png") top left no-repeat;}


/* MEDIA QUERIES */
@media (min-width:992px) {
	/* Allow sub-menu to show on hover for wider display */
	#main-menu li.dropdown:hover ul {display:block;}
}

/* Bootstrap LG */
@media (min-width:1366px) {
    .container {width:1336px; margin-left:auto; margin-right:auto;}
    #main-menu-container {padding-top:30px;} 
    #main-menu .navbar-nav li > a {padding:10px 40px;}
    #page-main > div.row {margin-right:-16px;}
}

@media (min-width:1200px) and (max-width:1365px) {
    #main-menu-container {padding-top:30px;} 
    #main-menu .navbar-nav li > a {padding:10px 30px;}
}

/* Bootstrap MD */
@media (max-width:1199px) {       
    #main-menu-container {margin-left:-50px; padding-top:30px;} 
    #main-menu .dropdown-menu {left:0px;}    
    #header-banner {height:282px;}    
    #header-banner img {margin-top:-40px;}    
    #home-gallery {max-height:282px;}
	#header-banner #alt-caption {padding:20px 0;}    
    .small-panel span {min-height:51px;}
}

/* Bootstrap SM */
@media (max-width:991px) {
	#main-menu-container {padding-top:0px; margin-left:-30px;} 
    #main-menu a {font-size:20px;}	     
    #header-banner {height:250px;}
    #home-gallery {max-height:250px;}
	#main-menu-container {position:absolute; top:-97px; left:0px; width:100%; z-index:1000; padding:15px; margin:0;}
	#main-menu {border-radius:10px; margin-left:-15px; margin-right:-15px;}
    #main-menu .navbar-nav li {padding:0;}
	#main-menu .navbar-toggle {border-radius:8px;}        
    body#services #page-middle, body#case-study #page-middle {background:transparent none;}
    #left-menu {clear:both; padding:5px; margin-bottom:0; background:transparent none !important;}  
    #left-menu li {width:32%; float:left; margin:0 0.65% 5px 0.65%; background:transparent;}
    #page-main-text {clear:both; padding-top:25px;}
    #page-main-text img {margin-top:15px;}
    #service-menu a {padding:10px 15px; }    
	body#case-study #page-main, body#services #page-main {background:transparent;}
    body#case-study .case-study-panel .panel-inner h2 {opacity:1;}
    .case-study-panel .panel-inner {margin:15px 0;}
    #client-list li {margin:10px 1.5%; width:47%;}
    ul.fancy-bullet li {font-size:16px;}
}

/* Bootstrap XS */
@media (max-width:767px) {
    #header {padding-bottom:15px;}
    #header-banner {height:auto; max-height:250px;}
    h1 {margin-top:0;}
    #main-menu .navbar-brand {display:none !important;}
    #footer-left {position:static;}
    #footer-right {clear:both; text-align:left; padding-top:15px; padding-bottom:15px;}
    #footer-right img {padding-bottom:45px;}
    #footer-menu {position:absolute; bottom:15px; left:15px; max-width:300px;}
    #footer-menu li {padding-bottom:5px;}
    .content-section {padding-top:15px; padding-bottom:15px; margin-bottom:15px;}
    form .text-right {text-align:left;}
    #gallery-top {padding-top:50px;}
    #gallery-main {padding-bottom:50px;}
    #gallery-main .cycle-slideshow > div {width:90%; margin-left:5%;}
    #gallery-thumbnail {display:none;}
    #gallery-top .cycle-prev, #gallery-top .cycle-next {font-size:90px;}
    .small-panel {width:60%; margin:0 20% 15px 20%;}   
    #panel-latest-news {padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #adc1d9; }
    /* #left-menu li {width:48%; margin:5px 1%;} */
    #left-menu a {min-height:4em;}
    .case-study-panel {clear:both;}
    
    .case-study-panel .panel-image {height:210px;}
    body#case-study #page-main-text {padding:15px !important;}
    .row {margin-left:0; margin-right:0;}
    ul.fancy-bullet {overflow:visible;}
    ul.fancy-bullet li {float:none; font-size:16px; width:100%; margin:0; height:auto;}
	#client-list-box {padding:0;}  
}

/* Extra Small Device */
@media (max-width:450px) {
	#mobile-device {display:none !important;}
	#portrait-device {display:inline-block;}	
    .shopping-cart-buttons a {display:block;}
    #header .telno {font-size:18px;}
    #company-logo img {max-width:100%; height:auto;}
    #header-social img {width:30px; height:auto;}
    #panel-row > div {width:80%; margin:10px 10%; left:0;}
    #footer-right {padding-bottom:45px;}
    .section-text {width:100%;}
    .section-image {display:none; padding-top:15px; width:100%; text-align:center;}
    .content-section {margin-bottom:0;}
    .small-panel {width:90%; margin:0 5% 15px 5%;}      
    #left-menu li {width:99%;}
    #left-menu a {min-height:0;}
    #page-main-text {padding:15px;}
    #footer-email {font-size:11px;}
    
}

/* HIDE BOOTSTRAP SIZING */
body .bootstrap-size {display:none !important;}

/* SITE COMMENTS */
.sitecomment {
    z-index:5000;
    background:#fff;
    border:1px solid #ccc;
    border-radius:10px;
    box-shadow:5px 5px 5px #333;
    padding:30px;
    position:fixed;
    right:15px;
    bottom:15px;
    font-size:15px;
    cursor:pointer;
    max-width:30%;
}
.sitecomment-pageurl {display:none;}

.sitecomment h2 {margin-top:0; font-size:18px;}
.sitecomment h3 {font-size:15px;}

.toggle-comment {position:absolute; top:10px; right:10px;}