@charset "utf-8";
/*/id%6D61726D616E6179
  --------------------------
  RESPONSIVE CSS for
  www.visualclick.com
  
  MEDIA QUERIES 
  --------------------------  
*/


/* Content Changes */
#res_menu {}
#res_select, .navigate,
#secondary-nav li + br,
#main-menu .mobsubtn {display:none;}

#content {float: right;}
#side .side-top-arrow #secondary-nav li, 
#side .side-top #secondary-nav li {padding: 5px 15px;}

@media only screen and (max-width: 1099px) {}


/* All Mobile and Tablets (devices and browser) */
@media only screen and (max-width: 1000px) {
	.captionImg {display:none !important;}
}


/* Tablet Portrait (fixed width) */
@media only screen and (min-width: 768px) and (max-width: 1000px) {
	img, .img-res {max-width:100%; height:auto;}
	table .img-res {width:100%;}
	
	.container {width: 748px;}
	
	#header {min-width: 10px;}

	#primary-nav li.expand-item .level0 a {padding: 0 10px !important; font-size: 15px;}
	#primary-nav .expand-col3 .expand-wrapper {width: 445px;}
	#primary-nav .expand-col3 .expand-col:last-child {width: auto; float: none; clear: both;}
	#primary-nav .expand-col3 .expand-col:last-child .expand-group {float: left;}

	#banner {}
	#banner > .container {min-width: 10px;}
	.bx-wrapper .bxslider .container {margin: 0 0 0 -374px !important;}
	.bx-wrapper .bxslider li img {height: 280px;}
	.bx-wrapper .caption {left: 60px; right: 60px;}
	.caption h6 {font-size: 40px; line-height: 44px;}
	.updatebox {min-width: 10px;}
	.updatebox h3 {padding-left: 0;}
	
	#body {}
	#content.home {float: none; width: auto;}
	#home-left-side, #home-right-side {width: 45%;}

	#content {width: 480px;}
	#content:before, #content:after {content: ""; display: table; line-height: 0;}
	#content:after {clear: both;}

	.indent {width: auto;}
	
	#side {width: 220px;}
	.side-top-arrow, .side-top, .side-bot, .side-bot-green {width: 220px;}

	#side .request-demo #request-demo-form {padding-top: 60px; background-size: 100% auto;}
	#side #request-demo-form input {width: 170px;}
	#side #request-demo-form select {width: 184px;}
	#side #request-demo-form textarea {width: 170px;}

	#footer {min-width: 10px;}

}

/* All Mobile Sizes and Small Tablet (devices and browser) */
@media only screen and (max-width: 768px) {
	
	img, .img-res {max-width:100%; height:auto;}
	img.left, img.right {float:none; margin:0 0 15px !important;}

	.container {width: auto; padding: 0 15px;}

	#header {min-width: 10px;}
	#header #logo {padding-left: 0;}
	#header #logo img {vertical-align: top;}
	#header .contact {margin-top: 28px;}
	#header #cse-search-box {position: relative; padding: 15px 0 8px; height: 28px; margin: 0 45px 0 0; top: auto; width: auto; clear: both;}
	#header #cse-search-box input.search-text {width: 98%; margin-top: 1px; height: 24px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

	#main-menu {}
	#primary-nav {display: none; position: static; background: rgba(255,255,255,0.1); border-top: 1px solid rgba(255,255,255,0.5); margin: 0 0 10px;}
	#primary-nav li.expand-item {float: none; height: auto;}
	#primary-nav li.expand-item .level0 {background: none; padding: 0 !important;}
	#primary-nav li.expand-item .level0 a {border-bottom: 1px solid rgba(255,255,255,0.5);}
	#primary-nav li.expand-item .expand-container {position: static;}
	#primary-nav li.expand-item .expand-header .level1 {height: auto; margin: 0;}
	#primary-nav li.expand-item.hover .expand-container {display: none;}
	#primary-nav li.expand-item.click .expand-container {display: block;}
	#primary-nav li.expand-item .expand-header .level1 a {float: none; padding-bottom: 10px;}

	#primary-nav .expand-wrapper {width:auto !important; border-bottom: 1px solid rgba(255,255,255,0.5); padding: 10px 10px 0; -webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none;box-shadow: none;}
	#primary-nav .expand-group {background-repeat: repeat-x; width: auto; padding: 8px 0;}
	#primary-nav .expand-col {float: none; width: auto;}

	#main-menu .mobtn {border-bottom: 3px solid #fff; border-top: 3px solid #fff; cursor: pointer;  height: 17px; position: absolute; right: 15px;  top: 81px;  width: 30px; z-index: 9999;}
	#main-menu .mobtn:before {content:""; border-top: 3px solid #fff; position: absolute; top: 7px; left: 0; right: 0;}
	#main-menu .mobsubtn {display:block; background: rgba(255,255,255,0.2); position: absolute; right: 0; z-index: 100; height: 32px; width: 32px; color: #fff; text-align: center; line-height: 32px;}

	#banner {}
	#banner > .container {min-width: 10px; padding: 0;}
	.bx-wrapper .bxslider .container {margin: 0 !important; width: 100%; left: auto; padding: 0;}
	.bx-wrapper .bxslider li img {height: 280px;}
	.bx-wrapper .caption {left: 20px; right: 20px;}
	.caption h6 {font-size: 30px; line-height: 34px;}
	.updatebox {min-width: 10px; text-align: center; padding: 10px 0;}
	.updatebox h3 {padding: 0; margin: 0; border:0; line-height: 1.5; }
	.updatebox p {display: block; line-height: 1.5;}


	#body {}
	#content {width: auto !important; float: none; padding: 15px 0;}
	#content ~ #side {display: block;}
	#home-left-side, #home-right-side {width: auto; float: none;}
	.indent {width: auto;}

	#demo-form ul li label {float: none; text-align: left; display: block;}
	#demo-form ul li label.checkbox-label {display: inline-block; vertical-align: top; width: 250px;}
	#demo-form input.checkbox {margin-left: 0;display: inline-block; vertical-align: top; }
	#demo-form #submit {margin-left: 0;}

	#side {display: none;}

	#footer {min-width: 10px;}

}


/* Mobile Portrait Size  */
@media only screen and (max-width: 360px) {

	#header .contact {margin-top: 16px;}
	#header .contact a {margin: 0;}
	#header .contact span {display: block;}
	#header .contact .sep {display: none;}

	.caption h6 {font-size: 20px; line-height: 26px;} 

	#footer div.phone {width: 195px; margin: 0 auto 10px; float: none;}
	#footer #social {text-align: center;}
	#footer #social a {float: none; display: inline-block !important;}
	#footer div.copyright {float: none; text-align: center;}
	#footer div.contact {text-align: center;}
}