@charset "UTF-8";
/* CSS Document */

@media screen and (max-width: 926px){
body{background-color: #fff;}
#document{width: 96%; margin-left: 2%; margin-right: 2%;}
header, footer, #content{width: 100%;}
#logo img{max-width: 179px;}

#main-column-portfolio ol li{width: 30%; margin-right: 3.3%;}



}
/*responsive styles start here*/

@media screen and (max-width: 767px){
html, body {max-width: 100%;overflow-x: hidden;}
body{background-color: #fff; cursor: pointer;}
#document{width: 90%; position: relative;  margin-left: 5%; margin-right: 5%;}/*width: 94%*/
header{height: auto; position: fixed; top:0; left: 0; z-index: 999; background-color:#fff; padding-bottom: 20px; width:101%; padding-left: 3%; }
header .contact, .page-jump, #iFrame{display: none;}
#logo, #main-column-portfolio, #side-column-portfolio, #content-portfolio, #thumbnails, .link, #content .main-column-product, #content aside .product, #content .main-product{float: none;}
#main-column-portfolio, #content-portfolio, #thumbnails, #content .main-column-product, #content aside .product{width: 100%;}
#Hotseat-mobile{display:block !important;}

#headline .graphic{display: none;}
#headline {padding: 0px 20px 0px 0px; height:auto !important; border: 0px !important; z-index: 1; margin-top: 8em;}
#headline h1{padding-bottom: 0px; position: relative; top:0; -webkit-transform: none;-ms-transform: none;transform: none; }/*width: 659px;*/

#content{clear: both; border: 0px solid #F00; margin-top: 2em; }
.content-text{width: 100%;}

#main-column-portfolio ol li:nth-child(3n+3){margin-right:0%;}
#side-column-portfolio{clear: left; width: 100%;background: #b0bc4b; margin-left: -18%; padding-bottom: 50px; padding-left: 18%; padding-top: 2em; padding-right: 18%; margin-bottom: -38px; color: #fff; }
#side-column-portfolio .columns{-webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 3.5%; -moz-column-gap: 3.5%; column-gap: 3.5%;}
#side-column-portfolio h3{font-size: 1.5em; color: #fff;}

#thumbnails{/*background: #f6f6f6;*/ margin-left: -18%; padding-bottom: 20px; padding-left: 18%; padding-top: 2em; padding-right: 18%; margin-bottom: -40px; overflow: hidden; border: 0px;}
#thumbnails ul{margin: 0; padding: 0; width: 100%;}
#thumbnails li{float: left; max-width: 20%; margin-bottom: 26px; margin-right: 6%; }
#thumbnails li:nth-child(4n+4){margin-right:0%;}

#thumbnails h3{font-size:1.5em;color: #5a2149;margin: 0px 0px 30px 0px;line-height: 1.4em;letter-spacing: 0.02em; }
.thumbnail-on{border: 3px solid #b0bc4b; margin: -3px; overflow: hidden;}
#thumbnails .view p{font-size: 1em; line-height: 1em; padding: 2px 2px 2px 8px; position: relative;top: 40%; -webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
.thumbnails-resources{display: block !important;}
#thumbnails .thumbnails-resources .view p{font-size: 0.85em; line-height: 1.2em;}

aside .product .callout-2{width: 37%; float: right;  height: auto; padding: 4%; clear: none;}

#Hotseat-mobile .row{clear: both; margin-bottom: 60px; overflow: hidden;}
#Hotseat-mobile .row:last-child{margin-bottom: 20px;}
.Hotseat-img {cursor:-webkit-zoom-in;cursor:-moz-zoom-in;}
#Hotseat-mobile figure{float: left; max-width: 40%; margin: 0; padding:0; margin-right: 4%;}
#Hotseat-mobile figure figcaption{text-align:center; font-size: 0.6em; text-transform:uppercase; color: #b0b0b0; margin-top: -10px;}
.demo-button{margin: 40px auto 0px auto; text-align:center; clear: both;}


h1{font-size: 2em;}
.feature-image{margin-right: 0px !important; max-width: 30%;}
.link{clear: left;}
section .awards, section .events, section .news-block, section h2, section h3{display: block;}
section .awards, section .events, section .news-block{margin-left: -6%;  padding-left: 5%; margin-right: -6%; padding-right: 5%; padding-top: 20px; padding-bottom: 20px; margin-bottom: 0;}
section .awards{background-color: #b0bc4b;}
section .awards, section .awards a{color:#FFF;}
section .events{background-color:#7f7f57;}
section .events, section .events a{color:#FFF;}
section .news-block{background-color:#502649; margin-bottom: -2.5em;}
section .news-block, section .news-block a{color:#FFF;}
.news b{font-size: 1.125em;}

#main-column-portfolio .resources-block{clear: both; display: block;}
#main-column-portfolio .resources-block h2{padding-top: 50px;}
#main-column-portfolio .resources-block .bkgd{font-size: 0.875em;}

footer{border: 0; margin-top: 0px; clear: both;}
.footer-text, .footer-icons{width: 100%; text-align: left; margin-bottom: 1em;}
.footer-icons img{margin-right: 10px;}
.contact-bar{display: block; margin-left: -6%; padding-left: 0%;}

.main-product .view p{font-size: 1.5em;}



}

@media screen and (max-width: 568px){
body{}	
#content .main-column, .feature-image, footer, /*.footer-text,*/ .footer-icons, #content aside .services, #carousel-wrapper, aside .product .callout-2{float: none !important;}
#content .main-column, #content aside .services, #carousel-wrapper, aside .product .callout-2{width: 100%;}
#content .main-column{margin-right: 0;}

.callout{width: 41.5%; float: left; margin: 0%; padding: 3%; clear:none; height: 164px;}
.callout:nth-child(2n){margin-left:3%;}
.callout-2{width: 90%; float: none; height: auto;}


#content .main-product ol li{width: 47.5%; margin-right: 5%; margin-bottom: 2em;}
#content .main-product ol li:nth-child(3){margin-right:5%;}
#content .main-product ol li:nth-child(2n+2){margin-right:0%;}

#three-column-layout .column-one{width: 47%;/*width: 272px;*/float: left;margin-right: 6%;margin-bottom: 20px; clear: both;}
#three-column-layout .column-two{width: 47%;float: left; margin-right: 0%;margin-bottom: 20px;}
#three-column-layout .column-three{width: 47%;margin-bottom: 20px;float: left; margin-right: 6%; clear: left; }

.product-table th{white-space: normal;}
.product-table th:nth-child(1n+2){text-align: center;}
.product-table td:nth-child(1n+2){text-align: center;}

#carousel-wrapper{text-align: center;}

.cs-img-left, .cs-img-right{float: none; margin: 0px; max-width: 100% !important; width: 100% !important;}
.portfolio-image-zoom{max-width: 100%;height: auto;}

#home-header .nav{float: left; padding-left:4%; padding-right: 3.5%;}

h1{font-size: 1.875em;}
.view p {font-size: 150%; }

.feature-image{max-width: 100%; margin-left: 0; }

}

@media screen and (max-width: 480px){

header{height: 4.1em; margin-bottom: 1em;}
#logo img{width: 140px;}
#headline{margin-top: 6em;}




.callout{width: 92% !important; float:none!important; margin: 0px 0px 20px 0px!important; border: 2px solid #f1f1f1; padding: 4%!important; height: auto !important;}

h1{font-size: 1.75em;}

/* homepage styles*/
#home-header{max-height: 80% !important;}
#home-header .logo {float: none !important; max-width:80%; padding: 0 10% 2em 10%; }
#home-header .nav{ float: none !important;}
#home-header ul{width: 100%;}
#home-header li{margin-bottom: 0.5em; text-align:center; }

#main-column-portfolio, side-column-portfolio{width: 100%;}
#main-column-portfolio ol li{width: 47.5%; margin-right: 5%; margin-bottom: 2em;}
#main-column-portfolio ol li:nth-child(3), #main-column-portfolio ol li:nth-child(9){margin-right:5%;}
#main-column-portfolio ol li:nth-child(2n+2){margin-right:0%;}
#main-column-portfolio img{ max-width: 100%;}

#side-column-portfolio .columns{-webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-gap: 3.5%; -moz-column-gap: 3.5%; column-gap: 3.5%;}

#thumbnails li{float: left; max-width: 30%; margin-bottom: 26px; margin-right: 5%; }
#thumbnails li:nth-child(4n+4){margin-right:5%;}
#thumbnails li:nth-child(3n+3){margin-right:0%;}

#content .main-product ol li{font-size: 0.75em;}

#three-column-layout .column-one, #three-column-layout .column-two, #three-column-layout .column-three{width: 100%;/*width: 272px;*/float: none ;margin-right: 0%;margin-bottom: 50px; }

.product-table{font-size: 0.8em;}






}

@media screen and (max-width: 320px){

#logo img{width: 107px;}

#side-column-portfolio .columns{-webkit-column-count: 1; -moz-column-count: 1; column-count: 1; -webkit-column-gap: 3.5%; -moz-column-gap: 3.5%; column-gap: 3.5%;}

#thumbnails li{float: left; max-width: 45%; margin-bottom: 26px; margin-right: 10%; }
#thumbnails li:nth-child(4n+4){margin-right:10%;}
#thumbnails li:nth-child(3n+3){margin-right:10%;}
#thumbnails li:nth-child(2n+2){margin-right:0%;}


/*h1{font-size: 1.625em;}*/

}