/* =============================================================================
    RESPONSIVE - MEDIA QUERIES  1280px MAX
============================================================================= */
@media only screen and (min-width: 1180px) and (max-width: 1380px){
/* width: 1180px; */
.beam-content {width:1160px;margin:0px auto;}
.top-content {width:1160px;margin:0px auto;}

#mainbanner-wrapper {width:100%;min-height:630px;}
.mainbanner-content {width:90%;margin:0 auto;}
.mainbanner-title h1 {font-size:52px;line-height:52px;font-weight:100;color:#fff;}

.layer1-services {width:1120px;min-height:320px;margin:0px auto;}
.layer1-content {width:100%;margin:0 auto;}
.layer1-intro {width:90%;margin:0 auto;text-align:center;}

.moretext-container {width:1160px;}
.moretext-l {width:350px;float:left;}
.moretext-m {width:350px;float:left;margin:0 55px 0 55px;}
.moretext-r {width:350px;float:right;}

.layer3-content {width:100%;min-height:344px;margin:0 auto;background: url('../img/photos/layer3-back.jpg') no-repeat top right;}
.layer3-text {width:535px;margin:0 0 0 20px;}

.layer4-content {width:100%;min-height:344px;margin:0 auto;background: url('../img/photos/layer4-back.jpg') no-repeat top left;}
.layer4-text {width:535px;float:right;margin:0 20px 0 0;}

.layer5-content {width:1160px;margin:0 auto;}
.layer5-left {width:661px;float:left;}
.layer5-right {width:489px;float:right;}

/* ============================================================================
    LOFTS
============================================================================ */   
.beamline-sub {width:100%;}
.def-container {width:1160px;margin:0 auto;}

.llay1box-l {width:560px;float:left;}
.llay1box-r {width:560px;float:right;}

.llay2-line1 {font-size:26px;line-height:28px;font-weight:400;color:#fff;padding:160px 0 0 0;}

.llay3box-l {width:460px;float:left;}
.llay3box-m {width:240px;float:left;}
.llay3box-r {width:460px;float:right;}

.def-subport {width:920px;margin:0 auto;}
.igallcontents-def {width: 440px;display: inline-block;vertical-align: middle;margin:20px 20px 0 0;position:relative;}
.igallcontents-last {width: 440px;display: inline-block;vertical-align: middle;margin:20px 0 0 0;position:relative;}

.loft-circle-box {width:1020px;margin:0px auto;}  
.loft_circle1 {margin:0 20px 20px 0;float:left;}  
.loft_circle2 {margin:0 20px 20px 0;float:left;}
.loft_circle3 {margin:0 20px 20px 0;float:left;}
.loft_circle4 {margin:0 0 20px 0;float:left;}
.loft_circle5 {margin:0;float:left;}

/* ============================================================================
    ABOUT
============================================================================ */
.about-circle-box {width:1020px;margin:0px auto;}  
.ab_circle1 {margin:0 20px 20px 0;float:left;}  
.ab_circle2 {margin:0 20px 20px 0;float:left;}
.ab_circle3 {margin:0 20px 20px 0;float:left;}
.ab_circle4 {margin:0 0 20px 0;float:left;}
.ab_circle5 {margin:0;float:left;}

/* ============================================================================
    EXTENSIONS
============================================================================ */   
.prc_circle1 {margin:0 20px 20px 0;float:left;}  
.prc_circle2 {margin:0 20px 20px 0;float:left;}
.prc_circle3 {margin:0 20px 20px 0;float:left;}
.prc_circle4 {margin:0 0 20px 0;float:left;}
.prc_circle5 {margin:0;float:left;}

/* ============================================================================
    PLAN AND DESIGN
============================================================================ */ 
.design-container {width:1160px;margin:0 auto;padding:0 0 55px 0;}
.design-left {width:318px;float:left;}
.design-middle {width:522px;float:left;}
.design-right {width:308px;float:right;}

.plan-box1 {width:310px;height:168px;}
.plan-box2 {width:310px;height:151px;}
.plan-box3 {width:310px;height:131px;}

.sideright {margin:0 0 0 10px;}

/* more */
.designmore-container {width:1160px;margin:0 auto;padding:0 0 55px 0;}
.plan-container {width:1160px;margin:30px auto 30px auto;position:relative;}
.plan-inside {height:280px !important;overflow-y:none;}
.plan-block-l {width:500px;float:left;}
.plan-block-r {width:630px;float:right;}

/* ============================================================================
    PORTFOLIO
============================================================================ */
.gallery-container {width:1160px;margin:0px auto;}
.photos-container {width:920px;margin:0px auto;}
.gallcontents-def {width: 440px;display: inline-block;vertical-align: middle;margin:20px 20px 0 0;position:relative;}
.gallcontents-last {width: 440px;display: inline-block;vertical-align: middle;margin:20px 20px 0 0;position:relative;}

/* ============================================================================
    BLOG
============================================================================ */
#blog-index-wrapper {width:100%;padding:35px 0 20px 0;}
.blog-container {width:1160px;margin:0px auto;}
.blog-top-line {width:1160px;height:2px;margin:0 auto 0 auto;background:#f5f5f5;} 

.blog-side-def {width:540px;float:left;padding:25px 0 30px 0;}
.blog-side-last {width:540px;float:right;padding:25px 0 30px 0;}


iframe{max-width: 100%;height: auto;}
img{max-width: 100%;height: auto;}
/* FOOTER
------------------------------------------------------------------------- */
.footer-content {width:1160px;margin:0 auto;}
.footer-left {width:240px;float:left;}
.footer-middle {width:740px;float:left;}
.footer-right {width:70px;float:right;}
}


@media only screen and (min-width: 959px) and (max-width: 1180px){
/* width: 950px; */
.beam-content {width:920px;margin:0px auto;}
.top-content {width:940px;margin:0px auto;}
.top-left {width:180px;float:left;margin:5px 0 0 20px;}
.top-right {width:700px;float:left;}

.nav-brk {margin-right: 20px;}

#mainbanner-wrapper {width:100%;min-height:530px;}
.mainbanner-content {width:90%;margin:0 auto;}
.mainbanner-title h1 {font-size:42px;line-height:42px;font-weight:100;color:#fff;} 

.layer1-services {width:940px;min-height:250px;margin:0px auto;}
.layer1-content {width:100%;margin:0 auto;}
.layer1-intro {width:90%;margin:0 auto;text-align:center;}

.moretext-container {width:90%;margin:0 auto;}
.moretext-l {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-m {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-r {width:100%;float:none;margin:0 auto 0 auto;} 

.layer3-content {width:100%;min-height:344px;margin:0 auto;background: url('../img/photos/layer3-back.jpg') no-repeat top right;}
.layer3-text {width:90%;margin:0 auto 0 auto;padding:364px 0 0 0;}

.layer4-content {width:100%;min-height:344px;margin:0 auto;background: url('../img/photos/layer4-back.jpg') no-repeat top left;}
.layer4-text {width:90%;float:none;margin:0 auto 0 auto;padding:364px 0 0 0;}

.layer5-content {width:940px;margin:0 auto;}
.layer5-left {width:537px;float:left;}
.layer5-right {width:393px;float:right;}

.iprtphoto-hover:hover .visiticon {width:130px;height:130px;display:block;position:relative;top:29%;margin:0px auto;background: url('../img/icons/circle-orange.png') no-repeat center;}
.iprtphoto-hover:hover .visiticonsmall {width:130px;height:130px;display:block;position:relative;margin:35px auto 0 auto;background: url('../img/icons/circle-orange.png') no-repeat center;}

/* ============================================================================
    LOFTS
============================================================================ */   
.beamline-sub {width:100%;}
.def-container {width:940px;margin:0 auto;}

.llay1box-l {width:450px;float:left;}
.llay1box-r {width:450px;float:right;}

.llay2-line1 {font-size:26px;line-height:28px;font-weight:400;color:#fff;padding:160px 0 0 0;}

.llay3box-l {width:940px;float:none;margin:0 auto;}
.llay3box-m {width:940px;float:none;margin:20px auto 0 auto;}
.llay3box-r {width:940px;float:none;margin:40px auto 0 auto;}

.def-subport {width:920px;margin:0 auto;}
.igallcontents-def {width: 440px;display: inline-block;vertical-align: middle;margin:20px 20px 0 0;position:relative;}
.igallcontents-last {width: 440px;display: inline-block;vertical-align: middle;margin:20px 0 0 0;position:relative;}

.loft-circle-box {width:800px;margin:0px auto;}  
.loft_circle1 {margin:0 20px 20px 0;float:left;}  
.loft_circle2 {margin:0 20px 20px 0;float:left;}
.loft_circle3 {margin:0 0 20px 0;float:left;}
.loft_circle4 {margin:0 20px 20px 0;float:left;}
.loft_circle5 {margin:0;float:left;}

/* ============================================================================
    ABOUT
============================================================================ */
.about-circle-box {width:800px;margin:0px auto;}  
.ab_circle1 {margin:0 20px 20px 0;float:left;}  
.ab_circle2 {margin:0 20px 20px 0;float:left;}
.ab_circle3 {margin:0 0 20px 0;float:left;}
.ab_circle4 {margin:0 20px 20px 0;float:left;}
.ab_circle5 {margin:0;float:left;}

/* ============================================================================
    EXTENSIONS
============================================================================ */   
.prc_circle1 {margin:0 20px 20px 0;float:left;}  
.prc_circle2 {margin:0 20px 20px 0;float:left;}
.prc_circle3 {margin:0 0 20px 0;float:left;}
.prc_circle4 {margin:0 20px 20px 0;float:left;}
.prc_circle5 {margin:0;float:left;}

/* ============================================================================
    PLAN AND DESIGN
============================================================================ */ 
#design-wrapper {display:none;}
#design-wrapper-resp {display:block;width:100%;padding:0 0 0 0;}
.design-container-resp {width:90%;margin:0 auto;padding:0 0 55px 0;}
                                   
.plan-box1 {width:100%;height:130px;}
.plan-box2 {width:100%;height:130px;}
.plan-box3 {width:100%;height:130px;}
.plan-box4 {width:100%;height:130px;}
.plan-box5 {width:100%;height:130px;}
.plan-box6 {width:100%;height:130px;}
.planins-line-l {width:100%;height:10px;background: url('../img/design/arrow-r.png') no-repeat left;}

.content_toggle {display:none;padding:0 0 20px 0;}
.plan-box1:hover {color:#fe9759;cursor:pointer;}
.plan-box2:hover {color:#fe9759;cursor:pointer;}
.plan-box3:hover {color:#fe9759;cursor:pointer;}
.plan-box4:hover {color:#fe9759;cursor:pointer;}
.plan-box5:hover {color:#fe9759;cursor:pointer;}
.plan-box6:hover {color:#fe9759;cursor:pointer;}

.plan-box-desc {display:block;max-width:90%;}

.plan-block-l {width:100%;float:none;margin:0 auto;padding:0 0 20px 0;}
.plan-block-r {width:100%;float:none;margin:0 auto;}

.plan-slide-desc {display:block;margin:0px auto;font-size:16px;line-height:20px;padding:20px 0 20px 0;}

/* ============================================================================
    PORTFOLIO
============================================================================ */
.gallery-container {width:940px;margin:0px auto;}
.photos-container {width:920px;margin:0px auto;}
.gallcontents-def {width: 440px;display: inline-block;vertical-align: middle;margin:20px 20px 0 0;position:relative;}
.gallcontents-last {width: 440px;display: inline-block;vertical-align: middle;margin:20px 20px 0 0;position:relative;}

/* ============================================================================
    BLOG
============================================================================ */
#blog-index-wrapper {width:100%;padding:35px 0 20px 0;}
.blog-container {width:100%;margin:0px auto;}
.blog-top-line {width:100%;} 

.blog-side-def {width:95%;float:none;padding:25px 0 30px 0;}
.blog-side-last {width:95%;float:none;padding:25px 0 30px 0;}

/* ============================================================================
    TESTIMONIALS
============================================================================ */
.index-testi {width:90%;position:relative;margin:0 auto;padding:60px 0 0 0;}
.itst-inside {width:80%;position:relative;margin:0 0 0 90px;}


iframe{max-width: 100%;height: auto;}
img{max-width: 100%;height: auto;}
/* FOOTER
------------------------------------------------------------------------- */
.footer-content {width:940px;margin:0 auto;}
.footer-left {width:200px;float:left;}
.footer-middle {width:640px;float:left;}
.footer-right {width:70px;float:right;}

}

@media only screen and (min-width: 768px) and (max-width: 959px){
/* width: 728px; */
#beam-wrapper {font-size:28px;line-height:34px;text-align:center;padding:15px 0 15px 0;}
.toptxt {display:none;}
.tfntico {display:none;}
.beam-content {width:90%;margin:0px auto;}
.top-content {width:100%;margin:0px auto;}
.top-left {width:100%;float:none;margin:0px auto;}
.top-right {width:100%;float:none;margin:0px auto;}        
.sticky {position: relative;}
        
.logo {text-align:center;}        
        
/* -----------------------------------------------------------------------------
   Navigation
----------------------------------------------------------------------------- */
.nav-responsive {display:block;position:fixed;top:10px;right:10px;z-index:9999;} 
.nav-resp-button {width:40px;height:40px;cursor:pointer;}
.nav-resp-button:hover {border:1px solid #707070;}
.nav-default {display:none;}  

/* ============================================================================
    HOME PAGE
============================================================================ */
#mainbanner-wrapper {width:100%;min-height:430px;margin:0 auto;background: url('../img/photos/main-banner.jpg') no-repeat top center;}        
.mainbanner-content {width:90%;margin:0 auto;padding:35px 0 0 0;position:relative;}
.mainbanner-title h1 {font-size:32px;line-height:32px;font-weight:300;text-align:center;} 
.marginx {margin:40px 0 0 0;}  

.layer1-title {font-weight:400;font-size:22px;line-height:26px;}
.layer1-content {width:90%;margin:0 auto;}
.layer1-intro {width:100%;margin:0 auto;text-align:center;}
       
.moretext-container {width:100%;margin:0 auto;}
.moretext-l {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-m {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-r {width:100%;float:none;margin:0 auto 0 auto;}       
.moretitle {font-size:18px;line-height:22px;}        
        
#layer2-wrapper {background: url('../img/photos/parallax-banner.jpg') no-repeat bottom center;background-attachment:scroll;}        
        
.layer3-content {width:100%;min-height:244px;margin:0 auto;background: none;}
.layer3-text {width:90%;margin:0 auto;}        
        
.layx-title h2 {font-weight:400;font-size:22px;line-height:26px;}        
        
        
.layer4-content {width:100%;min-height:244px;margin:0 auto;background: none;}
.layer4-text {width:90%;float:none;margin:0 auto;}        

.layer5-content {width:90%;margin:0 auto;}
.layer5-left {width:570px;float:none;margin:0 auto;}
.layer5-right {width:570px;float:none;margin:0 auto;}

.iprtphoto-hover:hover .visiticon {width:90px;height:90px;display:block;position:relative;top:39%;margin:0px auto;background: url('../img/icons/circle-orange_resp.png') no-repeat center;}
.iprtphoto-hover:hover .visiticonsmall {width:90px;height:90px;display:block;position:relative;margin:95px auto 0 auto;background: url('../img/icons/circle-orange_resp.png') no-repeat center;}
.iporttxt {padding:17px 0 0 0;color:#fff;font-size:16px;line-height:23px;text-align:center;font-weight:300;text-transform:uppercase;} 

.lay5-smallphoto1 {width:570px;position:relative;margin:20px auto 0 auto;}
.lay5-smallphoto2 {width:570px;position:relative;margin:20px auto 0 auto;}

/* ============================================================================
    LOFTS
============================================================================ */   
.beamline-sub {width:100%;}
.def-container {width:90%;margin:0 auto;}
.llay1box-l {width:100%;float:none;margin:0 auto;}
.llay1box-r {width:100%;float:none;margin:40px auto 0 auto;}

.llay3box-l {width:100%;float:none;margin:0 auto;}
.llay3box-m {width:100%;float:none;margin:20px auto 0 auto;}
.llay3box-r {width:100%;float:none;margin:40px auto 0 auto;}

.def-subport {width:100%;margin:0 auto;}
.igallcontents-def {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.igallcontents-last {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}

.laysectitle h2 {font-size:18px;line-height:24px;}

.llay2-line1 {display:none;}
.llay2-line1-resp {font-size:26px;line-height:32px;font-weight:400;color:#fff;padding:90px 0 0 0;display:block;}
.llay2-line2 {font-size:24px;line-height:32px;font-weight:400;color:#fff;padding:20px 0 0 0;}

.loft-circle-box {width:500px;margin:0px auto;}  
.loft_circle1 {margin:0 20px 20px 0;float:left;}  
.loft_circle2 {margin:0 0 20px 0;float:left;}
.loft_circle3 {margin:0 20px 20px 0;float:left;}
.loft_circle4 {margin:0 0 20px 0;float:left;}
.loft_circle5 {margin:0;float:left;}

/* ============================================================================
    ABOUT
============================================================================ */
.about-circle-box {width:500px;margin:0px auto;}  
.ab_circle1 {margin:0 20px 20px 0;float:left;}  
.ab_circle2 {margin:0 0 20px 0;float:left;}
.ab_circle3 {margin:0 20px 20px 0;float:left;}
.ab_circle4 {margin:0 0 20px 0;float:left;}
.ab_circle5 {margin:0;float:left;}

/* ============================================================================
    EXTENSIONS
============================================================================ */   
.prc_circle1 {margin:0 20px 20px 0;float:left;}  
.prc_circle2 {margin:0 0 20px 0;float:left;}
.prc_circle3 {margin:0 20px 20px 0;float:left;}
.prc_circle4 {margin:0 0 20px 0;float:left;}
.prc_circle5 {margin:0;float:left;}

/* ============================================================================
    PLAN AND DESIGN
============================================================================ */ 
#design-wrapper {display:none;}
#design-wrapper-resp {display:block;width:100%;padding:0 0 0 0;}
.design-container-resp {width:90%;margin:0 auto;padding:0 0 55px 0;}
                                   
.plan-box1 {width:100%;height:130px;}
.plan-box2 {width:100%;height:130px;}
.plan-box3 {width:100%;height:130px;}
.plan-box4 {width:100%;height:130px;}
.plan-box5 {width:100%;height:130px;}
.plan-box6 {width:100%;height:130px;}
.planins-line-l {width:100%;height:10px;background: url('../img/design/arrow-r.png') no-repeat left;}

.content_toggle {display:none;padding:0 0 20px 0;}
.plan-box1:hover {color:#fe9759;cursor:pointer;}
.plan-box2:hover {color:#fe9759;cursor:pointer;}
.plan-box3:hover {color:#fe9759;cursor:pointer;}
.plan-box4:hover {color:#fe9759;cursor:pointer;}
.plan-box5:hover {color:#fe9759;cursor:pointer;}
.plan-box6:hover {color:#fe9759;cursor:pointer;}

.plan-box-desc {display:block;max-width:90%;}

.plan-block-l {width:100%;float:none;margin:0 auto;padding:0 0 20px 0;}
.plan-block-r {width:100%;float:none;margin:0 auto;}

.plan-slide-desc {display:block;margin:0px auto;font-size:16px;line-height:20px;padding:20px 0 20px 0;}

/* ============================================================================
    PORTFOLIO
============================================================================ */
.gallery-container {width:100%;margin:0px auto;}
.photos-container {width:100%;margin:0px auto;}
.gallcontents-def {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.gallcontents-last {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}

/* ============================================================================
    TESTIMONIALS
============================================================================ */
.index-testi {width:700px;position:relative;margin:0 auto;padding:60px 0 0 0;}
.itst-inside {width:650px;position:relative;margin:0 auto 0 auto;}

/* ============================================================================
    BLOG
============================================================================ */
#blog-index-wrapper {width:100%;padding:35px 0 20px 0;}
.blog-container {width:100%;margin:0px auto;}
.blog-top-line {width:100%;} 

.blog-side-def {width:95%;float:none;padding:25px 0 30px 0;}
.blog-side-last {width:95%;float:none;padding:25px 0 30px 0;}

/* ============================================================================
    CONTACT
============================================================================ */
.cntform-container {width:90%;}
.formbox-l {width:100%;float:none;}
.formbox-r {width:100%;float:none;text-align:left;}

.sub-box-l {width:100%;float:none;}
.sub-box-r {width:100%;float:none;}

.wpcf7-text{width: 90%;padding: 0 5px 0 20px;}

.wpcf7-submit{
    float:none;
    text-align:center;
    margin:20px auto 0 auto;
}
.lab-l {width:30px;float:left;}
.lab-r {width:390px;float:left;}


/* iphone style */
input.text,
input[type="text"],
input[type="email"],
input[type="button"],
input[type="submit"],
.input-checkbox {
-webkit-appearance: none;
border-radius: 0;
}

iframe{max-width: 100%;height: auto;}
img{max-width: 100%;height: auto;}
/* FOOTER
------------------------------------------------------------------------- */
.footer-content {width:90%;margin:0 auto;}
.footer-left {width:100%;float:none;margin:0 auto;}
.footer-middle {width:100%;float:none;margin:0 auto;}
.footer-right {width:100%;float:none;margin:0 auto;}

.imonda {display:none;}
.imonda_resp {display:block;font-size:10px;line-height:46px;color:#cfcfcf;letter-spacing:1px;text-align:center;padding:0 0 5px 0;}
.foot-menu {font-size:14px;line-height:36px;text-align:center;}
.footer-copy {font-size:12px;line-height:22px;padding:15px 0 10px 0;}
.footer-social {font-size:34px;line-height:46px;padding:10px 0 0 0;}
}

@media only screen and (min-width: 480px) and (max-width: 767px){
/* width: 440px; */
#beam-wrapper {font-size:28px;line-height:34px;text-align:center;padding:15px 0 15px 0;}
.toptxt {display:none;}
.tfntico {display:none;}
.beam-content {width:90%;margin:0px auto;}
.top-content {width:100%;margin:0px auto;}
.top-left {width:100%;float:none;margin:0px auto;}
.top-right {width:100%;float:none;margin:0px auto;}        
.sticky {position: relative;}
        
.logo {text-align:center;}        
        
/* -----------------------------------------------------------------------------
   Navigation
----------------------------------------------------------------------------- */
.nav-responsive {display:block;position:fixed;top:10px;right:10px;z-index:9999;} 
.nav-resp-button {width:40px;height:40px;cursor:pointer;}
.nav-resp-button:hover {border:1px solid #707070;}
.nav-default {display:none;}  

/* ============================================================================
    HOME PAGE
============================================================================ */
#mainbanner-wrapper {width:100%;min-height:430px;margin:0 auto;background: url('../img/photos/main-banner.jpg') no-repeat top center;}        
.mainbanner-content {width:90%;margin:0 auto;padding:35px 0 0 0;position:relative;}
.mainbanner-title h1 {font-size:32px;line-height:32px;font-weight:300;text-align:center;} 
.marginx {margin:40px 0 0 0;}  

.layer1-title {font-weight:400;font-size:22px;line-height:26px;}
.layer1-content {width:90%;margin:0 auto;}
.layer1-intro {width:100%;margin:0 auto;text-align:center;}
       
.moretext-container {width:100%;margin:0 auto;}
.moretext-l {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-m {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-r {width:100%;float:none;margin:0 auto 0 auto;}       
.moretitle {font-size:18px;line-height:22px;}        
        
#layer2-wrapper {background: url('../img/photos/parallax-banner.jpg') no-repeat bottom center;background-attachment:scroll;}        
        
.layer3-content {width:100%;min-height:344px;margin:0 auto;background: none;}
.layer3-text {width:90%;margin:0 auto;}        
        
.layx-title h2 {font-weight:400;font-size:22px;line-height:26px;}        
        
.layer4-content {width:100%;min-height:344px;margin:0 auto;background: none;}
.layer4-text {width:90%;float:none;margin:0 auto;}        

.layer5-content {width:90%;margin:0 auto;}
.layer5-left {width:100%;float:none;margin:0 auto;}
.layer5-right {width:100%;float:none;margin:0 auto;}

.iprtphoto-hover:hover .visiticon {width:90px;height:90px;display:block;position:relative;top:39%;margin:0px auto;background: url('../img/icons/circle-orange_resp.png') no-repeat center;}
.iprtphoto-hover:hover .visiticonsmall {width:90px;height:90px;display:block;position:relative;margin:65px auto 0 auto;background: url('../img/icons/circle-orange_resp.png') no-repeat center;}
.iporttxt {padding:17px 0 0 0;color:#fff;font-size:16px;line-height:23px;text-align:center;font-weight:300;text-transform:uppercase;} 

.lay5-smallphoto1 {width:100%;position:relative;margin:20px 0 0 0;}
.lay5-smallphoto2 {width:100%;position:relative;margin:20px 0 0 0;}

/* ============================================================================
    LOFTS
============================================================================ */   
.beamline-sub {width:100%;}
.def-container {width:90%;margin:0 auto;}
.llay1box-l {width:100%;float:none;margin:0 auto;}
.llay1box-r {width:100%;float:none;margin:40px auto 0 auto;}

.llay3box-l {width:100%;float:none;margin:0 auto;}
.llay3box-m {width:100%;float:none;margin:20px auto 0 auto;}
.llay3box-r {width:100%;float:none;margin:40px auto 0 auto;}

.def-subport {width:100%;margin:0 auto;}
.igallcontents-def {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.igallcontents-last {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}

.laysectitle h2 {font-size:18px;line-height:24px;}

.llay2-line1 {display:none;}
.llay2-line1-resp {font-size:26px;line-height:32px;font-weight:400;color:#fff;padding:90px 0 0 0;display:block;}
.llay2-line2 {font-size:24px;line-height:32px;font-weight:400;color:#fff;padding:20px 0 0 0;}

.loft_circle1 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}  
.loft_circle2 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.loft_circle3 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.loft_circle4 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.loft_circle5 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}

/* ============================================================================
    ABOUT
============================================================================ */  
.ab_circle1 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}  
.ab_circle2 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.ab_circle3 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.ab_circle4 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.ab_circle5 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}

/* ============================================================================
    EXTENSIONS
============================================================================ */   
.prc_circle1 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}  
.prc_circle2 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.prc_circle3 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.prc_circle4 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.prc_circle5 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}

/* ============================================================================
    PLAN AND DESIGN
============================================================================ */ 
#design-wrapper {display:none;}
#design-wrapper-resp {display:block;width:100%;padding:0 0 0 0;}
.design-container-resp {width:90%;margin:0 auto;padding:0 0 55px 0;}
                                   
.plan-box1 {width:100%;height:160px;}
.plan-box2 {width:100%;height:160px;}
.plan-box3 {width:100%;height:160px;}
.plan-box4 {width:100%;height:160px;}
.plan-box5 {width:100%;height:160px;}
.plan-box6 {width:100%;height:160px;}
.planins-line-l {width:100%;height:10px;background: url('../img/design/arrow-r.png') no-repeat left;}

.content_toggle {display:none;padding:0 0 20px 0;}
.plan-box1:hover {color:#fe9759;cursor:pointer;}
.plan-box2:hover {color:#fe9759;cursor:pointer;}
.plan-box3:hover {color:#fe9759;cursor:pointer;}
.plan-box4:hover {color:#fe9759;cursor:pointer;}
.plan-box5:hover {color:#fe9759;cursor:pointer;}
.plan-box6:hover {color:#fe9759;cursor:pointer;}

.plan-box-desc {display:block;max-width:100%;}

.plan-block-l {width:100%;float:none;margin:0 auto;padding:0 0 20px 0;}
.plan-block-r {width:100%;float:none;margin:0 auto;}

.plan-slide-desc {display:block;margin:0px auto;font-size:16px;line-height:20px;padding:20px 0 20px 0;}

/* ============================================================================
    PORTFOLIO
============================================================================ */
.gallery-container {width:100%;margin:0px auto;}
.photos-container {width:100%;margin:0px auto;}
.gallcontents-def {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.gallcontents-last {width: 440px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}

/* ============================================================================
    TESTIMONIALS
============================================================================ */
.index-testi {width:90%;position:relative;margin:0 auto;padding:60px 0 0 0;}
.itst-inside {width:100%;position:relative;margin:0 0 0 0;}
.tcontent {font-style:italic;font-size:16px;line-height:22px;color:#000;display:block;}
.tname {font-size:16px;line-height:22px;font-weight:500;display:block;text-align:center;padding:28px 0 30px 0;}

/* ============================================================================
    BLOG
============================================================================ */
#blog-index-wrapper {width:100%;padding:35px 0 20px 0;}
.blog-container {width:100%;margin:0px auto;}
.blog-top-line {width:100%;} 

.blog-side-def {width:95%;float:none;padding:25px 0 30px 0;}
.blog-side-last {width:95%;float:none;padding:25px 0 30px 0;}
.blog-title h3 {font-weight:300;font-size:22px;line-height:26px;}

/* ============================================================================
    CONTACT
============================================================================ */
.cntform-container {width:90%;}
.formbox-l {width:100%;float:none;}
.formbox-r {width:100%;float:none;text-align:left;}

.sub-box-l {width:100%;float:none;}
.sub-box-r {width:100%;float:none;}

.wpcf7-text{width: 90%;padding: 0 5px 0 20px;}

.wpcf7-submit{
    float:none;
    text-align:center;
    margin:20px auto 0 auto;
}
.lab-l {width:30px;float:left;}
.lab-r {width:340px;float:left;}

/* iphone style */
input.text,
input[type="text"],
input[type="email"],
input[type="button"],
input[type="submit"],
.input-checkbox {
-webkit-appearance: none;
border-radius: 0;
}

iframe{max-width: 100%;height: auto;}
img{max-width: 100%;height: auto;}   
/* FOOTER
------------------------------------------------------------------------- */
.footer-content {width:90%;margin:0 auto;}
.footer-left {width:100%;float:none;margin:0 auto;}
.footer-middle {width:100%;float:none;margin:0 auto;}
.footer-right {width:100%;float:none;margin:0 auto;}

.imonda {display:none;}
.imonda_resp {display:block;font-size:10px;line-height:46px;color:#cfcfcf;letter-spacing:1px;text-align:center;padding:0 0 5px 0;}
.foot-menu {font-size:14px;line-height:36px;text-align:center;}
.footer-copy {font-size:12px;line-height:22px;padding:15px 0 10px 0;}
.footer-social {font-size:34px;line-height:46px;padding:10px 0 0 0;}
}

@media only screen and (min-width: 320px) and (max-width: 479px){
/* width: 280px; */
#beam-wrapper {font-size:22px;line-height:28px;text-align:center;padding:15px 0 15px 0;}
.toptxt {display:none;}
.tfntico {display:none;}
.beam-content {width:90%;margin:0px auto;}
.top-content {width:100%;margin:0px auto;}
.top-left {width:100%;float:none;margin:0px auto;}
.top-right {width:100%;float:none;margin:0px auto;}        
.sticky {position: relative;}
        
.logo {text-align:center;}        
        
/* -----------------------------------------------------------------------------
   Navigation
----------------------------------------------------------------------------- */
.nav-responsive {display:block;position:fixed;top:10px;right:10px;z-index:9999;} 
.nav-resp-button {width:40px;height:40px;cursor:pointer;}
.nav-resp-button:hover {border:1px solid #707070;}
.nav-default {display:none;}  

/* ============================================================================
    HOME PAGE
============================================================================ */
#mainbanner-wrapper {width:100%;min-height:430px;margin:0 auto;background: url('../img/photos/main-banner.jpg') no-repeat top center;}        
.mainbanner-content {width:90%;margin:0 auto;padding:35px 0 0 0;position:relative;}
.mainbanner-title h1 {font-size:32px;line-height:32px;font-weight:300;text-align:center;} 
.marginx {margin:40px 0 0 0;}  

.layer1-title {font-weight:400;font-size:22px;line-height:26px;}
.layer1-content {width:90%;margin:0 auto;}
.layer1-intro {width:100%;margin:0 auto;text-align:center;}
       
.moretext-container {width:100%;margin:0 auto;}
.moretext-l {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-m {width:100%;float:none;margin:0 auto 20px auto;}
.moretext-r {width:100%;float:none;margin:0 auto 0 auto;}       
.moretitle {font-size:18px;line-height:22px;}        
        
#layer2-wrapper {background: url('../img/photos/parallax-banner.jpg') no-repeat bottom center;background-attachment:scroll;}        
        
.layer3-content {width:100%;min-height:344px;margin:0 auto;background: none;}
.layer3-text {width:90%;margin:0 auto;}        
        
.layx-title h2 {font-weight:400;font-size:22px;line-height:26px;}        
        
.layer4-content {width:100%;min-height:344px;margin:0 auto;background: none;}
.layer4-text {width:90%;float:none;margin:0 auto;}        

.layer5-content {width:90%;margin:0 auto;}
.layer5-left {width:100%;float:none;margin:0 auto;}
.layer5-right {width:100%;float:none;margin:0 auto;}

.iprtphoto-hover:hover .visiticon {width:90px;height:90px;display:block;position:relative;top:29%;margin:0px auto;background: url('../img/icons/circle-orange_resp.png') no-repeat center;}
.iprtphoto-hover:hover .visiticonsmall {width:90px;height:90px;display:block;position:relative;margin:25px auto 0 auto;background: url('../img/icons/circle-orange_resp.png') no-repeat center;}
.iporttxt {padding:17px 0 0 0;color:#fff;font-size:16px;line-height:23px;text-align:center;font-weight:300;text-transform:uppercase;} 

.lay5-smallphoto1 {width:100%;position:relative;margin:20px 0 0 0;}
.lay5-smallphoto2 {width:100%;position:relative;margin:20px 0 0 0;}

/* ============================================================================
    LOFTS
============================================================================ */   
.beamline-sub {width:100%;}
.def-container {width:90%;margin:0 auto;}
.llay1box-l {width:100%;float:none;margin:0 auto;}
.llay1box-r {width:100%;float:none;margin:40px auto 0 auto;}

.llay3box-l {width:100%;float:none;margin:0 auto;}
.llay3box-m {width:100%;float:none;margin:20px auto 0 auto;}
.llay3box-r {width:100%;float:none;margin:40px auto 0 auto;}

.def-subport {width:100%;margin:0 auto;}
.igallcontents-def {width: 100%;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.igallcontents-last {width: 100%;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}

.laysectitle h2 {font-size:18px;line-height:24px;}

.llay2-line1 {display:none;}
.llay2-line1-resp {font-size:26px;line-height:32px;font-weight:400;color:#fff;padding:90px 0 0 0;display:block;}
.llay2-line2 {font-size:24px;line-height:32px;font-weight:400;color:#fff;padding:20px 0 0 0;}

.loft_circle1 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}  
.loft_circle2 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.loft_circle3 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.loft_circle4 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.loft_circle5 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}

/* ============================================================================
    ABOUT
============================================================================ */  
.ab_circle1 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}  
.ab_circle2 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.ab_circle3 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.ab_circle4 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.ab_circle5 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}

/* ============================================================================
    EXTENSIONS
============================================================================ */   
.prc_circle1 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}  
.prc_circle2 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.prc_circle3 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.prc_circle4 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}
.prc_circle5 {width:240px;height:240px;margin:0 auto  40px auto;float:none;}

/* ============================================================================
    PLAN AND DESIGN
============================================================================ */ 
#design-wrapper {display:none;}
#design-wrapper-resp {display:block;width:100%;padding:0 0 0 0;}
.design-container-resp {width:90%;margin:0 auto;padding:0 0 55px 0;}
                                   
.plan-box1 {width:100%;height:160px;}
.plan-box2 {width:100%;height:160px;}
.plan-box3 {width:100%;height:160px;}
.plan-box4 {width:100%;height:160px;}
.plan-box5 {width:100%;height:160px;}
.plan-box6 {width:100%;height:160px;}
.planins-line-l {width:100%;height:10px;background: url('../img/design/arrow-r.png') no-repeat left;}

.content_toggle {display:none;padding:0 0 20px 0;}
.plan-box1:hover {color:#fe9759;cursor:pointer;}
.plan-box2:hover {color:#fe9759;cursor:pointer;}
.plan-box3:hover {color:#fe9759;cursor:pointer;}
.plan-box4:hover {color:#fe9759;cursor:pointer;}
.plan-box5:hover {color:#fe9759;cursor:pointer;}
.plan-box6:hover {color:#fe9759;cursor:pointer;}

.plan-block-l {width:100%;float:none;margin:0 auto;padding:0 0 20px 0;}
.plan-block-r {width:100%;float:none;margin:0 auto;}

.plan-slide-desc {display:block;margin:0px auto;font-size:16px;line-height:20px;}

/* more */
.plan-slide-desc {padding:20px 0 20px 0;}

/* ============================================================================
    PORTFOLIO
============================================================================ */
.gallery-container {width: 100%;margin:0px auto;}
.photos-container {width:100%;max-width:420px;margin:0px auto;}
.gallcontents-def {width: 100%;max-width:420px;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.gallcontents-last {width: 100%;display: block;vertical-align: middle;margin:20px auto 0 auto;position:relative;}
.gallcontainer img {max-width:100%;height:330px;}
.gallcontainer-last img {max-width:100%;height:330px;}

.cover {object-fit: cover;width: 100%;height: 330px;}

/* ============================================================================
    TESTIMONIALS
============================================================================ */
.index-testi {width:90%;position:relative;margin:0 auto;padding:60px 0 0 0;}
.itst-inside {width:100%;position:relative;margin:0 0 0 0;}
.tcontent {font-style:italic;font-size:16px;line-height:22px;color:#000;display:block;}
.tname {font-size:16px;line-height:22px;font-weight:500;display:block;text-align:center;padding:28px 0 30px 0;}

/* ============================================================================
    BLOG
============================================================================ */
#blog-index-wrapper {width:100%;padding:35px 0 20px 0;}
.blog-container {width:100%;margin:0px auto;}
.blog-top-line {width:100%;} 

.blog-side-def {width:95%;float:none;padding:25px 0 30px 0;}
.blog-side-last {width:95%;float:none;padding:25px 0 30px 0;}
.blog-title h3 {font-weight:300;font-size:22px;line-height:26px;}

/* ============================================================================
    CONTACT
============================================================================ */
.cntform-container {width:90%;}
.formbox-l {width:100%;float:none;}
.formbox-r {width:100%;float:none;text-align:left;}

.det-row1 {display:block;padding:20px 0 0 0;}

.sub-box-l {width:100%;float:none;}
.sub-box-r {width:100%;float:none;}

.wpcf7-text{width: 90%;padding: 0 5px 0 20px;}

.wpcf7-submit{
    display: inline-block;
    padding: 20px 25px 20px 25px; 
    font-size:14px;
    float:none;
    text-align:center;
    margin:20px auto 0 auto;
}
.lab-l {width:30px;float:left;}
.lab-r {width:210px;float:right;}

/* iphone style */
input.text,
input[type="text"],
input[type="email"],
input[type="button"],
input[type="submit"],
.input-checkbox {
-webkit-appearance: none;
border-radius: 0;
}
        
iframe{max-width: 100%;height: auto;}
img{max-width: 100%;height: auto;}
/* FOOTER
------------------------------------------------------------------------- */
.footer-content {width:90%;margin:0 auto;}
.footer-left {width:100%;float:none;margin:0 auto;}
.footer-middle {width:100%;float:none;margin:0 auto;}
.footer-right {width:100%;float:none;margin:0 auto;}

.imonda {display:none;}
.imonda_resp {display:block;font-size:10px;line-height:46px;color:#cfcfcf;letter-spacing:1px;text-align:center;padding:0 0 5px 0;}
.foot-menu {font-size:14px;line-height:36px;text-align:center;}
.footer-copy {font-size:12px;line-height:22px;padding:15px 0 10px 0;}
.footer-social {font-size:34px;line-height:46px;padding:10px 0 0 0;}
}