/*Higher Resolutions*/
@media (min-width: 1680px) {
	#portfo-content2 {float:right; width: auto; z-index:1; text-align:center; margin-right:0; padding-right:0; margin-left: 5%; }
	body.home-page-content .wrapper, body.services-pg .wrapper{max-width:1500px;}
	.wrapper { min-height:auto;margin-left:auto; margin-right:auto; height:auto; max-width:1500px;}
}
@media (min-width: 1440px) {
	.main-bg {right: 10%;}
	#main-page .two-thirds {width: 100%;}
	#portfo-content2 {float:right; width: auto; z-index:1; text-align:center; margin-right:0; padding-right:0; padding-left: 3%;}
}
@media (max-width: 1439px) {
	#portfo-content2 {float:right; width: auto; z-index:1; text-align:center; margin-right:0; padding-right:0; padding-left: 13%;}
	.content-portfolio .col-md-7 {margin-left: 130px;}
	}
@media (max-width: 1099px) {
	.portfolio-wrapper {width: 97%; max-width: 97% !important; margin: 0 auto; list-style:none; list-style-type:none; }
	
}
@media only screen and (max-width: 1023px) { 
.content-portfolio .col-md-7 {background-color: rgba( 255, 255, 255, 0.5 );
background: rgb(255, 255, 255) transparent; /* default fallback */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	}


}
/*For Portfolio Page*/
@media (min-width: 1301px)  {/*was 1100px*/.square-lists ul li{  max-width: 35%; }}
@media (max-width: 1300px) { 
.main-top-header {padding-top: 30px;text-align:center; margin:0 auto 0 auto; clear:both;margin-left: 10px;}
.square-lists ul li{  max-width: 33%;}
}
@media (max-width: 1200px) { .square-lists ul li{  max-width: 45%; float:none; }.recent-work {margin: 0 auto; width: 100%; padding:0px; padding:0rem;}
.samples-container {margin: 0 auto;width: 97%; }.portfolio-samples li {margin:3px auto; margin:.3rem auto; float:left; width: auto;}
.services-bg {background-image:url(../../BGs/services2.gif); background-repeat:no-repeat; 
 min-width: 70%; max-width:435px;min-height: 400px;  width:auto; z-index:-2;
 float:left;  position:absolute;
-moz-background-size:contain;-webkit-background-size:contain;background-size:contain;}
.menu-title-push {display:block; float:left; width:15%; clear:both; height:auto;}
.menu-title-info{clear:both; float:right; width: 90%; display:block; text-align:center; padding:0;}
.menu-info {float:right; width: 80%;}

.portfolio-wrapper .col-md-7 {float:right; margin-left:0;}
.portfo-menu2, .portfo-title2 {width:auto;}
.portfolio-responsive h2 {}
.portfolio-responsive p {font-size: 100%;}

#portfo-content2 {float:none; width: auto; z-index:1; text-align:center; margin-right:0; padding-right:0; padding-left: 20%; }
.portfo-menu2, .portfo-menu-top {padding-left: 20%;} /*changes @ 768 */
/* remove .top-info-content h1 {margin-right: 20px;}
.top-info-content2 {text-align:center; background:#3c495a; float:right; margin-right: 0%; margin: 10px auto; margin:1rem auto} */
.main-top-header {padding-top: 30px;text-align:center; margin:0 auto 0 auto; clear:both;margin-left: 10px;}
#main-page .three-fourths {margin-left:0px;}
.copyright .pull-left, .copyright .pull-right, .samples-container .pull-left{text-align:center; float:none;}
/* services */
br.mobile-show-lgportfo1, .mobile-show-lgportfo1 {display:block;}
}

@media only screen and (max-width:1070px) {
/* home top announcement area */
.tilt-announce.home1 {padding: 10px 10px;max-width: 250px; display:inline-block; float:none;}
h2.home-more {line-height:1.4; text-align:center !important; text-indent:0%;}
	}
@media (max-width: 1023px) {
	.header2 {}
	.header .container { width: 95%;  display:block; margin: 0 auto 10px !important; float:none; }
.header2 .navbar.pull-left {width: 34%; max-width: 100%;  }
.header2 .navbar.pull-left ul li{float:right !important; }
.header2 .navbar.pull-right {width:37%;}
.header2 .navbar.pull-right ul li{float:left !important;}
.logo {  width:28%;display:inline-block; padding-left: 2%;}
 .circle-lists ul li{width:50%;  margin:0px ;line-height:1.3; float:left; font-size:80%;}
}
@media (min-width: 1000px) {
	.d1 ul.demos li {max-width:75%;}
	.stayput {position:fixed; /* bottom: 10rem; /*margin-right: 1.5rem;*/ margin:0 auto; width: auto;}
.stayput ul{ } .stayput-boost {}
}

@media (max-width: 991px) { br.mobile-show-lgportfo, .mobile-show-lgportfo {display:block;}
ul.long-descr li {margin-left: 0; margin-right:0;} ul.long-descr li {clear:both;}
body.portfolio-item .container.portfolio-item .btn-group-lg>.btn, body.portfolio-item  .container.portfolio-item .btn-lg, body.portfolio-item .container.portfolio-item  a.btn-u { padding: 9px 9px;/* padding back to 9px 15px @768 break */}
.mobile-hideSMcol {display:none;}
.mobile-showSMcol {display:block;}
}
@media (max-width: 980px) {  
.services-top .area1 {text-shadow: 1px 1px #fff; float:right; padding-left: 10%;}
.area1 p.all-td {margin-top: 15px; margin-top:1.5rem;}
.services-top p{}
.logo {  padding-left: 5%;} /* remove this closer }*/
.VOs-bg h4.side {background-color:transparent; width:auto;}
.top-info-content h1 {margin-right: 0px;}
/* remove .top-info-content {text-align:center; width: auto; margin-left: 10px; }
.top-info-content2 {text-align:center; background:#3c495a; float:right; margin-right: 0%;margin: 10px auto; margin:1rem auto} */
.portfo-menu2 {width: 66%; padding-left: 15%; } 
.portfolio-wrapper .col-md-7 .pull-left, .portfolio-wrapper .col-md-7 .pull-right{ float:none;}
.portfolio-wrapper .col-md-7 {float:right;} .top-info-content {z-index: 50;}
.main-bg { background-image:url(../../BGs/main1.png); padding-bottom:0; right: 1%; 
background-repeat:no-repeat;  
-moz-background-size:contain;-webkit-background-size:contain;background-size:contain;}
.tilt-announce.home1 {margin-left:-70px}
.menu-spacer {display:block; width: 38%; float:left; min-width: 200px; min-height: 200px;}
.top-info-content {margin-top:1px;}
.contact1 {margin-top: 3%;padding-right:0 !important; margin-right: -8%; }
#contact-pg .calltoaction h1 {font-size: 155%;}
.contact-content {width: 97%;  padding:10px; /* remove repeat of info */margin:40px auto 0; background: rgba(255, 255, 255, 0.83) !important; /* nice browsers */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */}
}
/* Portrait tablet to landscape and desktop */
@media only screen and (max-width: 975px) {	.view a.info {}
.about-bg:after {}
 .abt-content {float:right; width: auto; max-width: 100%; right: 2%;}
.about-bg, .contact-bg {float:left; left: 0/*was 1%*/;} 
  .top-info-content2 a:hover, .incl-button a:hover, .incl-button p:hover, .main-top-header a h4:hover {color:#63a39f!important; text-decoration:none !important; } 
}

@media (max-width: 900px) {  .header .header2 { max-width: 100%;}
.view a.info { font-size:80%!important; width:95%!important; margin-left:0;}
.portfolio-responsive .col-md-3 {width: 33%!important; max-width: 250px; margin:0 auto;} 
.ico_block {
  display: block; margin:0 auto;
  position: absolute;
 text-align:center;
  left: auto;
  right: auto;
  width: 100%;} 
.spacedA {display:none;}
.services-bg {background-image:url(../../BGs/services3.gif); background-repeat:no-repeat; 
 min-width: 50%; max-width:435px;min-height: 380px;   margin-left: -9px;
 width:auto; z-index:0!important;
 float:left;  position:absolute;
-moz-background-size:contain;-webkit-background-size:contain;
background-size:contain;}
.portfo-menu2 {width: 67%; padding-left:0%; }
.col-md-12 #filtrable {width:80%;/*was 80%*/ } 
#main {width:99%; float:none; margin:0 auto;}/*modified*/ #contact-pg {width:95%; margin:0 auto;}
.menu-spacer {display:block; width: 38%; float:left; min-width: 200px; min-height: 200px;}
.menu-title-push {display:block; float:left; width:25%; clear:both; height:auto;}
.menu-title-info{clear:both; float:right; width: 60%; display:block; padding: 10px;}
.menu-info {float:right; width: 50%;}
.sorter {text-align:right;}
/*Slider Sequence*/
#sequence-theme .info {
		top:80px !important;
		width:60% !important;
		margin-right:50px;}
.service .desc { width: 55%}
.portfo-bg2 {  float:left; margin-left:0;
background-size:contain; min-height: 310px;  z-index:-1 !important;
max-height:317px; width: auto;
background-repeat:no-repeat;}
.copyright {z-index:13;  position:relative;}
.sorter {text-align:right;}

.portfolio-wrapper .col-md-7 .pull-left, .portfolio-wrapper .col-md-7 .pull-right{ float:none;}
	.portfolio-wrapper .col-md-7 {float:right;}
#portfo-content2 {margin-left:5%;}
.content-portfolio {color:#444; text-align:center; font-size:115%; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; margin-bottom: 1.5rem; margin-bottom:15px;}
.content-portfolio .col-md-3 {width: 60%; text-align:center;}
}
@media only screen and (max-width: 880px) {  
.header .header2 { max-width: 85%;}
.portfolio-page .tilt-announce {font-size: 16px; line-height: 1.3; padding: 5px 7px; }
#services-top-info {width:95%; margin:0 auto 10px;}
.navbar .nav > li > a {font-size:105%; } .header2 .navbar li{ margin-top:3px; margin-left:23px;}/*modified*/
.services-top .container-fluid {max-width:100%; width:100%;}
.services-top .area1a.col-md-6 {float:right; }
.services-top .area1 .col-md-4 {
border-radius: 50%;
background: rgb(255, 255, 255) transparent; /* default fallback */
background-color: rgba(255, 255, 255, 0.83); /* nice browsers */ 
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	}
/* --- */ 
	}
/* portfolio page fix overflow of x*/
@media (min-width:769px) {.container.portfolio-responsive{margin-left: 10% !important; max-width:90%;} 
/*ie 800x6000 fix? */
@media only screen and (max-width: 800px) {	
.navbar {background:transparent;}
}
/*for footer on devices and other tablet fixes; starts at ipad pro landscape*/
@media only screen 
and (max-device-width : 1366px) 
and (-webkit-min-device-pixel-ratio: 1) {
	.wrapper {min-height:83%;}
	.services-pg #main { margin-bottom:-50px;}
.services-pg .wrapper {}
.portfolio-wrapper {max-width:99%; overflow-x: hidden; }
.content-portfolio {}
}
/* ipad 1 & 2 landscape */
/*@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1)  {*/
/* ipad 1 & 2 landscape + portrait */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (-webkit-min-device-pixel-ratio: 1) {
.header2 .navbar.pull-right ul { float:right; }
.logo a span, .site-title {display:inline-block; clear:none; float:left;}
/* change height */
.wrapper {min-height:80%;}
	.services-pg #main { margin-bottom:0;}
}


/* iPad Portrait */
@media only screen and (max-width: 768px) and (orientation:portrait) {	 
/* if no-left not in place .about-bg {position:fixed; margin-left:-2%;}*/
}}
@media (max-width:768px) { .services-pg #main { margin-bottom:0;}
.vo-demos.container-fluid {text-align:center; margin-bottom:30px; }
body.portfolio-item .container.portfolio-item .btn-group-lg>.btn, body.portfolio-item  .container.portfolio-item .btn-lg, body.portfolio-item .container.portfolio-item  a.btn-u { padding: 9px 15px;}
/*portfolio samples */
.portfo-samples .modal-dialog {text-align:center;float:none; margin:0 auto;}
.portfo-samples .ekko-lightbox .glyphicon-chevron-right {right:-20px;}
.portfo-samples .ekko-lightbox .glyphicon-chevron-left {left:-20px;}
/* services page */
#services-top-info {width:100%;}
.services-pg .area1 {padding-left: 35%;}/* to 0 @ next break*/
.services-pg .push-left.no-right, .area1a {}
.services-top .area1 .col-md-4 {width: auto; margin:0 0 0 auto;  float:right; padding-right: 35%;}
.area1 .col-md-8 {padding-top: 4%;}
.services-top .area1a.col-md-6, .services-top .area1 .col-md-4, .services-top .area1 .col-md-10{}
.services-top .area1a.col-md-6, .services-top .area1 .col-md-4, .services-top .area1 .col-md-8, .services-top .area1 .col-md-10{background: rgb(255, 255, 255) transparent; /* default fallback */
background-color: rgba(255, 255, 255, 0.83); /* nice browsers */ 
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	
border-radius: 25px 0px 0px;/* curve the border*/}

.services-pg .area1 {margin-top: 50px;} /* overflow issue here on area1; remove margin-right: -30px to fix */
.services-top .area1 .col-md-4 {width: auto; margin:0 0 0 auto;  float:right; padding-right: 15%;}

#services-pg .services-bg {/* remove margin-left:-3%; */background-image:url(../../BGs/services3.gif);background-color: #f8f8f8; background-repeat:no-repeat; 
 min-width: 80%; max-width:435px;min-height: 420px; z-index:-2;
 float:left;  position:absolute;
-moz-background-size:contain;-webkit-background-size:contain;background-size:contain;
margin-top:-50px; background-color: transparent;}

/* =====end services page ==== */
.proj-info-link {display:block; text-align:right; color:#333; font-size: 90%; font-weight:bold;} 
#listed /* changes at mobile tablet 767 break list on home page for services */ { border-right: 0px }
/*remove .container.no-left {margin-left:auto; padding-left:auto;}*/
.proj-info-link a {color:#63a39f;} 
#project-information{width: 96%; margin:0 auto;}
.about-bg {margin-left:/*-4%*/ -3%;}
.contact-bg {margin-left:/*-4%*/ -2%; margin-top:-35px; background-color: transparent;z-index:0 !important;}
.container {width:98%; margin:0 auto; } .portfolio-samples li {margin:3px auto; margin:.3rem auto; float:left; width: 40%;  }
/* portfolio */
.portfo-menu2 {float:right;  width:74%;}
/* mobile menu header area */
.header2 .navbar.pull-right {width:70%; float:right; }
.header2 .navbar.pull-right ul {float:none !important;}
.logo {  width:30%;display:inline-block; }
.header2 .navbar.pull-left, .header2 .one.mobile-hide {display:none;}
.header2  .two.mobile-show ul li {float:left; }
.header2  .two.mobile-show {display:inline-block;}
.navbar-inner {margin-top:0; padding-top:0; margin-left: 5%; }
#mainMenu li {float:left; text-align:right !important; padding-left: 0px;}
#mainMenu ul { padding-left: 7% !important; width:100%; }
/*body.home-page-content #mainMenu ul {padding-left: 1% !important; }/* change home menu padding */
#mainMenu li a:hover {color:#6367a3/* was #c44d58*/;}
#mainMenu li a{color:#3c495a;}/* dark purple site-description productions */
#mainMenu { margin: 5px auto 0;  margin: .5rem auto 0; width: 98%;  }
/* ---- */
.menu-1 {border-right: 0; border-bottom: 1px solid #000; float:none;}
#main-page {margin-bottom:1px; margin-bottom:.1rem; padding-bottom:0rem; padding-bottom:0px;}
.top-info-conntent2 {float:none; text-align:center; background:#3c495a; float:none; margin-right: 0%; 
margin-top: 10px; margin-top:1rem;padding:5px 8px 3px 8px; padding:.5rem .8rem .3rem .8rem;}
.title1 {width: 90%; margin:0 auto; }
.title1 h1 {font-size:150%;}
/* remove.flexslider ul {margin-bottom:0px; margin-bottom:0rem; padding-bottom:0px; padding-bottom:0rem;}*/
#main2 {border-bottom:1px solid #3c495a;}
.info-portfo {font-size:90%;}
.content-portfolio .col-md-3 {width: auto; max-width: 250px; margin:0 auto;}
.container.portfolio-responsive{margin-left: 0%; max-width:100%;}
 .header2 .navbar.pull-right {padding-top: 10px;
    padding-top: 1rem;/* changes to 20 padding for smaller*/}
} /* end max 768 */
@media (max-width: 768px) and (min-width:600px) {.navbar-push, .nav-collapse{max-width: 90%; margin:0 auto;}
.navbar .pull-right {float:none;}

 }

@media (max-width:767px) {.mobile-hide3 {display:none !important;} 
.mobile-show3 {display:block !important;}
.button-thirds button {display:inline-block; margin-bottom: 10px; margin-left: 10px; margin-right:10px;}/* margin change @media break */
.serve-half {width:49%; display:inline-block; }/* to full about @650; was 49% -- overflow horizontal issues */
	 .home-services { max-width: 300px; margin:0 auto;}
	/* services */
	.services-top {padding-left: 0 /*was 5%; remove right float to fix overflow issue*/;}
	/* portfos */
	/* Portfolio Filtering (Categories)================================ */
.portfolio-grid {width:97%; margin:0 auto;}
	#portfolio-grid.portfolio-responsive article{margin:0 !important;  
	/*padding:0 !important; float:left !important;*/ float:none !important; padding-left: 15% !important; /*0 at break*/ max-width: 90%; }
#portfolio-grid.portfolio-responsive article img {float:none !important; text-align:center !important; 
		margin:0  auto!important;   }
	/* ----- */
	 p.alignright1, p.alignleft1 {text-align:center;}
	.logo {padding-left:0;}
	/* contact */
	#contact-pg h1 {text-align:right; padding-right: 25px; } 
	.contact1 {margin-right: -8%; float:right;}
	/* --- */
.col-md-7.portfo-info #myCarousel {margin-top: 5px;} .portfo-info {margin: 0px auto 5px;} .portfolio-item .carousel.slide.topped {margin-top: 5px;}
.thumbnails .col-md-6 {float:left; margin: 5px; margin:.5rem; width:40%;}
.thumbnails .col-md-4 {width:30%; float:left; margin: 5px; margin:.5rem; }
.fifth-end {display:none;} 
.mobile-show {display:block;}/* shows at 767*/
 .mobile-hide, .main-top-header {display:none;}
 .portfolio-item .mobile-show .col-xs-6 h3.centered.long-info {margin-bottom:0 !important; }
 .portfolio-item .mobile-show .col-xs-6 h3.centered.ht1{line-height:1px !important; margin-top:0 !important; } 
h3.pull-left {float:none !important; padding:0 0 0 0;}
.header .container  /* fix mobile menu inner pages */{padding-right: 0px;
  padding-left: 0px; 
  margin-right: 0;
  margin-left: 0;}/* remove .top-info-content {display:none;} */ 
 .top-info-content.mobile-show { text-decoration:none; float:left; text-align:center;  width:60%; margin: 10px auto; margin:1rem auto;padding:5px 8px; padding:.5rem .8rem ; color:#fff;  margin-top:0; padding-top:0;}  h1 span.two, h2 span.two a, h2 span.two { border-bottom:none; text-shadow: 1px 1px #fff;font-size:90%; margin-top:15px; } .top-info-content.mobile-show a{ text-decoration:none; }
#listed{box-shadow: 0 4px rgba(0, 0, 0, 0.1);
		-webkit-box-shadow: 0 4px rgba(0, 0, 0, 0.1);
       -moz-box-shadow: 0 4px rgba(0, 0, 0, 0.1);	}
.navbar-push, .nav-collapse {padding-left: 3%;}
		.btn-navbar { float:none !important; margin:15px auto 0px!important; width: 50%; text-align:center !important;} span.icon-bar {text-align:center !important; margin:0 auto; width: 50%;}/*modified */
.navbar {width: 100%; margin: 0 auto; padding-left:0; padding-right:0; text-align:center; float:none;}
.navbar .nav > li > a:focus, 
.navbar .nav > li > a:hover {text-decoration:none;}
.about-bg, .contact-bg {position:absolute;}
#main-page .two-thirds img {max-width: 59%; float:left;  margin-left: 10px; clear: both;}
#main-page h1 {clear:both; width: 100%; padding-top: 15px; text-shadow: 1px 1px #fff; width: 200px; margin:0 auto;}
#main-page .main-top-text {max-width: 85%;padding:0px; margin:0px; }
/* Main Page Mobile */
#main-page {padding-bottom: 0px; padding-bottom:0rem; margin-bottom:0px; margin-bottom:0rem;}
.row-fluid {margin-bottom:2px;} 
.main-bg { background-image:url(../../BGs/main1.png); background-repeat:no-repeat; background-position:top right;
position:absolute;  min-height: 394px;float:right; padding-bottom:0; max-height:400px; z-index:1;
 -moz-background-size:contain; 
background-size:contain;
-webkit-background-size:contain; max-width: 350px;
margin-left:0; }
.VOs .breadcrumbs {display:none;}
.VOs .container.pull-right {width: 60%;}
.VOs .container.pull-right .container-fluid {padding-left:0px; padding-right:0px;}/* change from 15px side padding*/
.VOs-bg .bg-img {background-color: transparent;}
.VOs-bg {background-image:url(../../BGs/VOs-beibay2.png); background-repeat:no-repeat; min-width:50%; background-position:top 20px left;  z-index: 999;
background-size:contain; -moz-background-size:contain; -o-background-size: contain; 
-webkit-background-size:contain; 
min-height:70%; max-height:100%; height:100%;  
padding-bottom:5px;/* was 5px*/ margin-top:5%; margin-bottom:0;
background-attachment:fixed;  } 
 .VOs-bg .bg-img {background-image:none; }
.VOs-bg .container {width: 50%; margin:0 auto; }
/*audio {max-width:auto;}*/
audio {max-width:99%; margin:0 auto; text-align:center;}
.VOs-bg h2 { font-size: 115%;} 
.VOs-bg .container {background: rgba(255, 255, 255, 0.8); text-align:center; }  .VOs-bg h4.side {background-color:none; width:auto;}
	body.notfound .nf3 .page-404 h3, body.notfound .nf3 .page-404 p{ background-color: rgba(255,255,255, .5); padding: 5px; max-width: 300px; }
	.page-404 .headline.hlost { float:left; clear:both;}
	
	}  /* End max-width:767 */

@media (min-width: 767px) { 
audio {max-width:99%; margin:0 auto; text-align:center;}
.navbar .nav > li > a:hover {color:#66a7c5/* was red#6367a3*/  !important; }
/*Menu*/
	.nav-collapse .nav { margin-top: 10px !important;  }
	 .navbar {float: none; border: none;width:auto;}
	/*Service Block*/
	.service .desc { width: 55%;}
	.area1a p{margin-left: 15px; }
	/*remove Registration and Login*/ /*remove Login Page v1.1+*/ /*remove Coming Soon Page*/
#portfo-content2 {float:none; width: auto; text-align:center; }	
/* portfo info in place on scroll */

} 

@media (max-width:650px) {
.serve-half {width:100%; display:block; float:none;}/* to full about @650 */
/* services page--special column setups for the smaller views here */
body.services-pg .mobile-show3 .col-xs-8 {width:58.33333333%; !important}
body.services-pg .mobile-show3 .col-xs-4 { width: 41.66666667% !important;}

}
/* Landscape phone to portrait tablet */
/* Landscape phones and down */
@media (min-width: 604px) {/* !!!important navbar toggle; change from 768 to*/
  .navbar-toggle, .mobile-show-btn {display: none;}
  
}
@media (max-width:640px) {
	.button-thirds button {display:inline-block; margin-bottom: 10px; margin-left: 2px; margin-right:2px;}/* margin change @media break */
	.mobile-showSMcol .col-md-8.col-sm-8.col-xs-8.newdesc .col-xs-6 {width:100%; float:none; clear:both; }
	.mobile-showSMcol .col-md-8.col-sm-8.col-xs-8.newdesc .col-xs-6.wedo {margin-bottom: 23px; margin-bottom:2.3rem;}
	}
@media (max-width:603px) {
		/* contact */
#contact-pg blockquote {max-width: 90%;}
#contact-pg blockquote h1 { padding-left: 15px;
    text-align: left; }
	/* services page */
/* remove for now .services-pg .area1 {padding-left: 15%; }
.services-pg .col-md-10.push-left.no-right {padding-left: 0%;}
	/* --- */
	.mobile-hide2 {display:none;} #contact-pg input {width:100%;}
	.square-lists ul li span text{  font-size:87% !important;}
/* change main bg again */
.main-bg {max-width: 50%;}
}

@media (min-width: 568px) {/* !!!important navbar toggle; change from 768 to min-width: 604px) then to here*/
  .navbar-toggle, .mobile-show-btn, .navbar button {display: none !important;}
}
@media (max-width:568px) { .VOs-bg {background-attachment:scroll; background-position: top left; }
.mobile-showsmd, br.mobile-showsmd  {display:block;}
.square-lists ul li{  max-width: 100%; float:none; } 
.portfolio-responsive .col-md-3 {width: 50%!important; max-width: 250px; margin:0 auto;}
.secondary {clear:left;} .service li {float:left; margin: 5px; width: 35%;} .header2 .navbar li{ margin-top: 15px;margin-left:0px;}/*modified*/
 /* portfolio breaks */
 #portfolio-grid.portfolio-responsive article{padding-left: 0% !important; }
.portfo-menu-top .details {display:none;}
.portfo-details2 p {color: black;}
.portfo-details2 {display:block; padding-left: 9%; padding-right: 7px; padding-top: 5px; padding-bottom:2px; text-align:left;  
background-color: rgba(255, 255, 255, 0.6);
background: rgb(255, 255, 255) transparent; /* default fallback */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	 }/*change again @480 */
.portfolio-samples li {margin:3px auto; margin:.3rem auto; float:left; width: 40%;}
.services-top {width:auto; max-width:100%; float:none;}/* go to 100% ? */
.content-portfolio {width:75%; margin:0 auto .5rem auto; margin:0 auto 5px auto; float:none;}
.container {width:95%; margin:0 auto;  }
.portfo-menu2 { width: 78%; float:right; }
.info-portfo {padding-left: 25px;}
	.col-md-12 #filtrable {width:98%;/*was 95%*/ padding: 0 0;}
#filtrable li{margin-right: 7px;}
	#main-page .main-top-text {max-width: 100%; } 
	#main-page {padding-bottom: 0px;} 
	/* change main-bg again*/
	.main-bg { background-image:url(../../BGs/main1.gif); z-index:1;background-repeat:no-repeat; background-position:top right;
position:absolute;  min-height: 314px;float:none; padding-bottom:0; max-height:410px;
margin-left:0; overflow:hidden;}
 a.tilt-announce2 { 
	 margin: 0 auto; display:block;}
	 .mobile-show.tilter { max-width: 95%; margin:0 auto;}
	.menu-1 {border-right: 0; float:none;}
	.contact-content { width: 100%;  padding:10px; margin:0 auto; /* remove repeat of bg transparency */ }
/* portfolio bottom nav */
.portfolio-samples { max-width: 100%; }
.samples-container {width:100%; }
.related-links p {}
.related-links {padding-left:0;}
.portfo-info p { width: 100%; margin:7px auto; font-size:90%;}
.portfolio-item .container-fluid {width:100% !important; padding-right:0; padding-left:0;}
/* Bootstrap menu changes; mobile menu -- moved to smaller */
.header .header2 { width: 100%; max-width: 100%; margin-right: 0;}
.header2 .navbar.pull-right {width: 63%; padding-left:0; padding-right:0; }
.navbar .nav > li > a, .navbar .nav > li > a:visited {font-size: 100%; margin: 0 0 !important;}
#mainMenu ul {padding-left: 0 !important; padding-right: 0; text-align:center !important; float:none; margin: 0 auto; max-width: 500px; }
#mainMenu li {text-align:center !important; /* change from right*/ width: 25%;}
/* -- */
} /* end max-width 568 */
@media (max-width: 567px) {/* mobile menu moved here */
/* Bootstrap menu changes; mobile menu */
.mobile-show-btn {display:inline-block;}
.header2 .navbar.pull-left, .header2 .two.mobile-show {display:none;}
.header2 .navbar.pull-right {width:60%; float:right; margin-top: .1rem; padding-top: 20px; padding-top:2rem;}
.header2 .navbar.pull-right ul {float:none !important;}
.logo { width:40%;display:inline-block; }
/* --- */}
@media only screen and (max-width:812px) and (orientation: landscape) {
.mobile-show-ipx, br.mobile-show-ipx {display:block;}} /* mobile showing*/
/* issues getting it to work @media only screen and (device-width : 375px) 
    and (device-height : 812px) 
    and (-webkit-device-pixel-ratio : 3)
	and (orientation : landscape)  {
.mobile-show-ipx, br.mobile-show-ipx {display:block !important;}}*/

@media screen and (max-width:568px) and (orientation: landscape) {
	.header2 .navbar .navbar-inner { margin-left: 0 ; }
	.header2 { } .header2 .navbar {}
	 .header2 .navbar.pull-right {  width: 55%;/* changes to 20 padding for smaller*/   } 
	.logo.site-title { width: 45%; }
.navbar .nav > li > a { padding-top:0;}
/* mobile landscape */
 #portfolio-grid.portfolio-responsive article{ width: 45%; padding:0 0; margin: 0 0;
  float:left; clear:none; display:inline-block; }
body.portfolio-page .portfolio-wrapper {  overflow-x: hidden; }
  .container.portfolio-responsive { margin-left: 13%; }
  .portfo-bg2 {}
  .portfo-menu-top {padding-left: 1%; overflow:hidden;}
  .portfo-menu-top .newdesc{ float:left; width: 50%; }
  .portfo-menu-top .centertext { padding-right:0; margin: 0 0; }
  .portfo-menu-top .tilt-announce {float:right; width: 47%; margin-top: 1.5rem;  } .portfo-menu-top .tilt-announce strong { font-weight:normal; font-size: 75% !important;}
  .portfo-menu-top .col-sm-6.centertext { width: 100%;}
}
/* portfolio background based on height*/
@media screen and (max-height:414px) {
	.portfo-bg2 {min-height: 270px; margin-top:-20px;}
}
@media screen and (max-height:381px) and (orientation : landscape) {
	.portfo-bg2 {min-height: 220px; margin-top:-20px;}
}
@media screen and (max-height:320px) and (orientation : landscape) {.portfo-bg2 {min-height: 175px;  z-index:-2;  margin-top: -20px !important; max-width: 317px;}
}
@media (max-width: 480px) {
	.mobile-show-sm {display:block; width:100%; clear:both;}
.mobile-hide-sm, img.mobile-hide-sm {display:none !important;}
.VOs .container.pull-right {width: 90%; background-color:transparent;}
ul.demos li {background:rgba(255,255,255, .7);}
.copyright small {clear:both; display:block;}/* clears the copyright info for portraits */
	/* iframe video */
.video-list iframe {height: auto; overflow:visible;}
/* -- */
.portfo-info p.longer { width: 100%; margin:7px auto; font-size:75%;}
	/* if no-left not in place.about-bg {margin-left:-7%;}*/
	/* portfolio top columns */
.portfolio-item .col-xs-6 {width:100%; clear:both; float:none; line-height:1;}
.portfolio-item .col-xs-6 a.btn-u, .portfolio-item .col-xs-6 button {display:block; margin: 0 auto 15px;min-width: 65%; max-width: 70%; width: auto;}
#contact-pg h3.alignright1 {padding-right: 1%;}
.contact1 {}
p.contactinfo {font-size:80%;}
.renovation {width:90% !important; margin:0 auto;} .mobile-show .top-info-content2{ line-height:1.3; font-size:80%; margin-bottom:0; padding: 5px 5px;} 
.clickits {display:none;} .menu-content1 {margin-right: auto; }
.ico_block {
  display: block; margin:0 auto; width:auto;
  position: absolute;
 text-align:center;
  left: auto; right: auto;
  width: 100%;} 
 .VOs-bg .container {width: 70%; margin:0 auto;}
.services-pg .area1 { margin-top: 10px;}/* remove margin-right:-30px;*/
.services-bg {background-image:url(../../BGs/services2.gif) !important;
/*remove background-color: #f8f8f8;*/ background-color:transparent !important; z-index:-2;
 min-width: 10%; max-width:235px; min-height: 270px!important; 
 background-position:top left;
 float:left; margin-top:-40px;
-moz-background-size:contain;-webkit-background-size:contain;background-size:contain; clear:both;}
.main-top h1 {display:none;}
.main-top-text {display:none;}
.main-top {width:100%; } .nav-collapse {z-index:4!important;}
.main-top-header img {margin:0; max-width:80%; z-index:-2;}
.main-bg { background-image:url(../../BGs/main1.gif); z-index:1;background-repeat:no-repeat; background-position:top right;
position:absolute; float:none; padding-bottom:0;  /*was  min-height: 294px;*/ min-height:210px; max-height:300px;  max-width: 50%;
margin-left:0; overflow:hidden; }
#main-page h1 {clear:both; width: 80%; padding-top: 15px;background-color: transparent;}
#main-page .main-top-text {max-width: 85%; padding: 7px; background: rgb(255, 255, 255) transparent; /* default fallback */
background: rgba(255, 255, 255, 0.7); /* nice browsers */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	}
.top-info-contentB {display:block; margin:0 auto; /* or just margin-left: 0?*/float:none;}
#main-page { padding-bottom: 10px;}
a:visited {text-decoration:none}
#main-page p {max-width: 100%; background:none;}
#main-page .main-top-text {background:transparent; text-shadow: 1px 1px #fff;}
.abt-content p {color:#000;}
.abt-content {float:none; width:auto;} 
.about-text { color:#000;}
.menu-1 {border-right: 0; float:none;}
.menu-info {float:none; width: 95%; margin:0 auto;}
.menu-title-push {display:block; float:left; width:25%; clear:both; height:auto;}
.menu-title-info{clear:both; float:right; width: 60%; display:block; padding: 10px;
background-color: rgba( 255, 255, 255, 0.5 );
background: rgb(255, 255, 255) transparent; /* default fallback */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	}
.home-clear {height:2px;}
.service .desc-two {margin-top:0; padding-top:0;}
.contact-content h1 {background:#fff;}
/*Portfolios Page */
.portfolio-page .tilt-announce {width: 100% !important; display:block; font-size: 13px;}
.portfo-bg2 { background-image:url(../../BGs/portfolio.svg);/* or .gif*/
-moz-background-size:contain; background-size:contain;
-webkit-background-size:contain; width:100%;
 float:left; position:absolute; z-index:-1;min-height: 255px; 
margin:0;background-repeat:no-repeat;}
.col-md-12 #filtrable {width:100%; margin-right:0;}
.info-portfo {display:none;}
.content-portfolio {width:100%; /* was 77%*/margin:0 auto .5rem auto; margin:0 auto 5px auto; float:none;}
#portfo-content2 {float:none; width: 100%; margin: 0 auto; text-align:center; clear:both; padding-left:5%;}	
.sorter {width:97%; float:right; text-align:center;}
.portfo-details2 {display:block; margin-top: 15px; padding-left: 2%; text-align:left; background-color: rgba(255,255,255, .77);}
.portfo-menu-top .newdesc p {text-shadow:-2px 2px 1px #fff; }
.portfo-menu-top .newdesc h2{text-shadow:-2px 2px 1px white; }/* for overlay with image*/
 .portfolio-responsive .col-md-3 {width: auto!important; max-width: 250px; margin:0 auto;} /*top bar line over na menu in here_iss*/.recent-work a {max-width: 130px;}
.portfolio-samples li {margin:3px auto; margin:.3rem auto; float:left; width: auto; max-width: 150px; max-width:15rem; text-align:center;}
.content-portfolio .col-md-3 {width: auto; max-width: 250px; max-height: 250px; margin: 0 auto;}
.portfo-menu2 {width:100%; font-size:95%; 
background-color: rgba( 255, 255, 255, 0.5 );
background: rgb(255, 255, 255) transparent; /* default fallback */
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF); /* IE 6/7 */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7fFFFFFF, endColorstr=#7fFFFFFF)"; /* IE8 */	  text-indent: 20%;}
.portfo-menu2 h1 {text-align:right; margin-right: 5%;}
/* footer and nav*/		
.copyright .pull-left, .copyright .pull-right, .samples-container .pull-left{text-align:center; float:none;}
#mainMenu ul {padding-left: 0; padding-right: 0; text-align:center !important; margin: 0 auto; float:none; }
#mainMenu li {text-align:center !important; /* change from right*/ margin: 2px auto; width: 50%; }
.nav-collapse {margin-bottom: 15px; } 
.nav-collapse .nav {padding-bottom: 15px; }
.btn-navbar {display:block; margin:0 auto; float:none;}
.header {width:100%; margin:0 auto; }
.navbar-inner {padding-left:0; margin-left:0;  }
.navbar {margin-top:0; padding-top:0; float:none; width:100%; padding:0;  }
 .header2 .navbar.pull-right {  width: 50%;/* changes to 20 padding for smaller*/   } 
	.logo.site-title { width: 45%; }
.logo {padding-bottom:0; margin-bottom:0; line-height: 1; text-align:center; float:none; margin-left: 5%;}
.logo .span {line-height:1;}
.container {width:98%; margin:0 auto; }
.samples-container {margin: 0 auto;width: 98%;}
	/*Slider Sequence*/
	#sequence-theme .info {
		top:70px !important;
		width:70% !important;
		margin-right:25px;}
	#sequence-theme h2 {font-size:30px !important;}
	#sequence-theme .info p {font-size:18px !important;}
	.services-top button.pull-right, .services-top button.pull-left {float:none !important; margin: 0 auto 10px;}
/* main page list change */
.home-services {/*margin:0 0 0 0px; margin: 0 0 0 0rem;*/ max-width: 270px; margin:0 auto; }
body.home-page-content .home-services ul {line-height:1.2; font-size: 96%;   padding-left:0;}/* changes for mobile*/
a.tilt-announce2 { margin: 0 auto; display:inline-block;}
.mobile-show.tilter { max-width: 80%; margin:0 auto;}
/* 404 styling */
body.notfound #main .container .pull-right {width: 100% !important;}
body.notfound .mobile-hide-sm, body.notfound .picnf { background-image:none !important;}
img.nfpicsmall {width: 40%; max-width:200px !important;margin: 0 0;}
body.notfound #main .container .col-xs-12.col-sm-12.pull-right {padding-left:0; padding-right:0; margin-left:0; }
body.notfound .nf3 .page-404 p{ padding: 5px; background-color: rgba(255,255,255, .5);}
body.notfound .nf3 {  background-position: bottom 40px right ; margin-bottom: -70px; background-size: 80%}
.nf3-sm { background-repeat:no-repeat; background-position: top right; height:100%;min-height: 350px; background-size:cover; padding:0 0 !important; margin:0 0; }

.button-thirds button {display:block; margin-bottom: 10px; margin-left: auto; margin-right:auto;}/* margin change @media break */

} /*  end 480 */


/*Navbars and smallest */
@media (min-width: 475px) {
	/* was 420 break*/
    /*Menu*/
    .navbar {
        border:0;
        padding-top: 20px;padding-top:2rem;}
    .collapse.in li a,
    .collapse.in ul.dropdown-menu a,
    .collapse.in li a.dropdown-toggle {border: none;}
}

@media (max-width: 474px) { /* was 420 break*/
 .navbar {
        border:0; padding-top:2rem;
        padding-top: 15px;}
.logo svg {max-width:130px;}
#services-pg .nav-tabs  li {width:50%; margin:0;}
.about-text {width: 100%; text-shadow: 1px 1px #fff;}
	/*Menu*/ 
/*remove .btn-navbar {text-align:center; margin-bottom: 5px; text-align:center;}
.navbar .nav-collapse .nav > li a{} 
.navbar {width:100%;} */
.main-bg { background-repeat:no-repeat; background-position:top right;
position:absolute;  min-height: 394px;float:right; padding-bottom:0; max-height:400px; 
margin-right:0;}
body.home-page-cont .home-services ul {line-height:1.2; font-size: 96%;}/* changes for mobile*/
p.mobilesm-right {text-align:right;}
.abt-content { text-shadow: 1px 1px #fff; border-radius: 95px 0px 0px;/* curve the border*/
margin-top: 50px; padding: 5px 25px;
background: rgb(255, 255, 255) transparent; /* default fallback */
background: rgba(255, 255, 255, 0.73); }

}
@media (max-width:375px){/* smaller portrait mobiles -- iphoneX  was 350px*/
.thumbnails .col-md-4 {width:28%; float:left; margin: 5px; margin:.5rem; }	
.navbar-inner {}
.btn-navbar {display:block; margin:0 auto; float:none;}
/* services page top area*/
.mobile-showSMcol .col-xs-4, .mobile-showSMcol .col-xs-8 {width:100%; float:none; clear:both;}
.mobile-showSMcol .col-xs-8 {padding-top: 30px;}	
.mobile-showSMcol .col-xs-8  .tilt-announce3 {line-height:1; font-size:15px; font-size:1.5rem; padding: 10px;}
.portfolio-wrapper .newdesc h2 {margin-left: 35px; }
}