/* 
    Document   : mobile
    Created on : 02.03.2013, 21:29:40
    Author     : Daniel Ighisan
    Description:
        Mobile and responsive stylesheet
*/

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

}

/* original grid size */
@media screen and (max-width: 1130px) {
    .home .zone-main .region-inner,
    #footer .region-inner {
        width: 960px;
    }
    
    .home .zone-main .region-inner {
        height: 650px;
    }
    
    .home .zone-main .region-inner {
        background: url("../images/homepage-center-758.jpg") no-repeat scroll center top transparent;
    }
    
    .home nav > a {
        background: url("../images/home-page-buttons-960.png") no-repeat scroll center top transparent;
        font: 16px/1.1 myriad-pro,Arial,Helvetica,sans-serif;
        height: 125px;
        width: 100px;
    }
    
    .home nav a.bullet-1  {
        top: 85px;
        left: 35px;
    }
    
    .home nav a.bullet-2 {
        top: 0;
        left: 165px;
    }
    
    .home nav a.bullet-3 {
        right: 166px;
        top: 0;
    }
    
    .home nav a.bullet-4 {
        right: 35px;
        top: 85px;
    }
    
        .home nav a span {
            padding: 40px 0 0;
            width: 103px;
        }
    
    .home nav > a:hover,
    .home nav > a.selected {
        background: url("../images/home-page-buttons-960.png") no-repeat scroll center -126px transparent;
    }
    
    .home .sub-menu {
        top: 215px;
    }
        
    /*=basic page */
     .basic-content {
         width: 60%;
     }
     
    .basic-page {
        padding-left: 50px;
    }
    
    /*=panel*/
    .panel-down {
        height: 770px;
        width: 960px;
    }
    .slider .details {
        height: 570px;
        width: 925px;
    }
    
    .slider .details .detail .more {
        bottom: 20px;
        right: 493px;
    }
    
    .slider .details .detail .more-buttons {
        bottom: 17px;
    }
    
        .slider .details .detail {
            height: 560px;
            padding: 0 40px;
        }
            .slider .details .detail .left {
                width: 445px;
            }

            .slider .details .detail .right {
                width: 345px;
            }
}

@media screen and (max-width: 1024px) {
     /*homepage */
    .home .upper-blocks {
        width: 195px;
    }
    
    .home .upper-blocks h3, .news-block h3 {
        font-size: 14px;
    }
        
    .home .sub-menu a {
        font-size: 16px;
    }
}

/* 960 grid */
@media screen and (max-width: 960px) {

    .services-wrapper ._jsPlumb_endpoint
    {
        display: none;
    }

    .services-wrapper .box
    {
        height: 156px !important;
        width: 156px !important;
        margin: 0px;
    }

    #cotainer-4394 img, #cotainer-7183 img, #cotainer-3587 img 
    {
        margin-top: 40px !important;
    }

    .whitepaper-button.home
    {
        width: 220px !important;
        margin-left: -45px;
    }

    .whitepaper-button.home .title
    {
        margin-left: -10px;
    }

    .rsDefault .rsArrowIcn
    {
        top: 200px !important;
    }
    
    .home .zone-main .region-inner, #footer .region-inner {
        width: auto;
    }

    .home .zone-main .region-inner {
        background: url("../images/homepage-center-600.jpg") no-repeat scroll center top transparent;
        height: 640px;
    }
    
    .home nav a.bullet-1  {
        top: 85px;
        left: 70px;
    }
    
    .home nav a.bullet-2 {
        top: -10px;
        left: 175px;
    }
    
    .home nav a.bullet-3 {
        right: 175px;
        top: -10px;
    }
    
    .home nav a.bullet-4 {
        right: 70px;
        top: 85px;
    }
    
    .home .sub-menu {
        top: 165px;
    }
    
    /*=clients-section */
    
    .da-thumbs li  article {
        height: 100px;
        width: 100px;
    }
       
     /* Initial state classes: */
    .da-slideFromTop {
        margin: 10px 0 0 65px;
    }
    .da-slideFromBottom {
        margin: 10px 0 0 65px;
    }
    .da-slideFromLeft {
        margin: 10px 0 0 65px;
    }
    .da-slideFromRight {
        margin: 10px 0 0 65px;
    }
    
    .da-thumbs li  article a {
        height: 120px;
        padding: 35px 0 0 0;
    }
    
    .image_grid,
    .clients,
    .client-slides {
        width:760px;
    }

    .image_grid li img{
        width:215px;
    }  
    
    .slide-container {
        width: 245px;
    }

    .slide-container .inner {
        height: 92px;
        margin-left: 15px;
        margin-top: 20px;
        position: relative;
        text-align: left;
        width: 225px;
    }
    
    .image_grid li {
        float: none;
        display: inline-block;
        width: auto;
        min-height: 164px;
    }

    .slider .details .detail .content { 
            
            height: 370px !important;
        }
        
    .image_grid li {
        margin-bottom: 0;
    }
    
.case-studies .image_grid li.last .client-container, .case-studies .image_grid li.last .slide-container {
    margin-right: 20px;
}

    .case-studies .client-slides { 
        height: 880px;
    }
    
    .image_grid .client-title {
        font-size: 12px;
    }
    
    .image_grid .last a.testimonial {
        margin: 0 25px 0 0;
    }
    
    #content{
        /*height: 1000px;*/
    }

     /*=panel-slide */
    .panel-down {
        height: 1000px;
        width: 760px;
    }
    .slider .details {
        height: 835px;
        height: 1000px;
        width: 725px;
    }
    
    .rsCustom .rsTabs {
        display: none;
    }
    
        .slider .details .detail {
            height: 1000px !important;
            padding: 0 40px;
            overflow: auto;
        }
            .slider .details .detail .left {
                float: none;
                margin: 0 auto;
                width: 445px;
            }

            .slider .details .detail .right {
                float: none;
                margin: 0 auto;
                width: 550px;
            }
            
            .slider .details .gallery {
                margin-top: 0;
            }
            
            .slider .details .detail .title {
                text-align: center;
            }
            
            .slider .details .detail .client-logo {
                display: block;
                margin: 0 auto;
            }

            .slider .details .detail .more 
            {
                bottom: auto;
                top: 490px;
            }

            .slider .details .detail .more-buttons
            {
                bottom: auto;
                top: 495px;
            }
    
     /*=basic page */
      .basic-content {
         width: 55%;
     }
     
     /*=careers*/
     
     .careers .orb {
         float: none;
         margin: 15px auto;
     }
     
    /*=portfolio*/
     
    #portofolio-wrapper,
    #portofolio {
        width: 760px;
    }
    
    #portofolio-details .prev ,
    #portofolio-details .next {
        display: none;
    }
    
    /*=industries*/
    .industries-wrapper .box,
    .services-wrapper .box {
        float: left;
        position: relative!important;
        top: auto!important;
        left: auto!important;
    }
    
    .services-wrapper ._jsPlumb_connector {
        display: none;
    }

    #portofolio-wrapper .arrow-prev,
    #portofolio-wrapper .arrow-next {
        display: none;
    }

}

/* 840px */

@media screen and (max-width: 840px) {
    
    /*homepage */
    
     .home nav > a {
        background: url("../images/home-page-buttons-600.png") no-repeat scroll center top transparent;
        font: 14px/1.1 myriad-pro,Arial,Helvetica,sans-serif;
        height: 100px;
        width: 85px;
    }
    
    .home nav a.bullet-1  {
        top: 100px;
        left: 95px;
    }
    
    .home nav a.bullet-2 {
        top: 10px;
        left: 185px;
    }
    
    .home nav a.bullet-3 {
        right: 185px;
        top: 10px;
    }
    
    .home nav a.bullet-4 {
        right: 95px;
        top: 100px;
    }
    
        .home nav a span {
            padding: 32px 0 0;
            width: 88px;
        }
    
    .home nav > a:hover,
    .home nav > a.selected {
        background: url("../images/home-page-buttons-600.png") no-repeat scroll center -100px transparent;
    }
    
    .basic-content { 
        width: 90%;
    }
    
    .contact-us .basic-content {
        padding-left: 0;
    }
    
        .basic-page {
            padding: 0 15px 0 ;
            box-sizing: border-box;
        }

        .basic-side {
            margin-top: 30px;
            width: 90%;
        }

            .basic-side .side-form {
                width: 50%;
            }
            
}

/* 768px */
@media screen and (max-width: 768px) {
  .slider .details .detail,
  .panel-down .rsOverflow,
  .slider .details,
  .slider.panel-down,
  #content{
    min-height: 1000px !important;
    height: auto !important;

  }

  .panel-down .rsOverflow
  {
    height: 1000px !important;
  }

  #content.home{
    height: auto !important;
  }

  
  .home nav{
    height: 350px;
  }

  .logo
  {
    padding: 30px 0 125px 0px;
    width:100% !important;
  }
    
    .slider.panel-down
    {
        width:100%;
    }

    .slider .details
    {
        max-width: 94%;
    }

    .home .zone-main .region-inner {
        background: url("../images/homepage-center-758.jpg") no-repeat scroll center top transparent;
        height: 510px;
    }
    
    .home nav > a {
        background: url("../images/home-page-buttons-960.png") no-repeat scroll center top transparent;
        font: 16px/1.1 myriad-pro,Arial,Helvetica,sans-serif;
        height: 125px;
        width: 100px;
    }
    
   .home nav a.bullet-1 {
        top: 85px;
        left: 35px;
    }
    
    .home nav a.bullet-2 {
        left: 165px;
        top: 0;
    }
    
    .home nav a.bullet-3 {
        right: 166px;
        top: 0;
    }
    
    .home nav a.bullet-4 {
        right: 35px;
    }
    
        .home nav a span {
            padding: 40px 0 0;
            width: 103px;
        }
    
    .home nav > a:hover,
    .home nav > a.selected {
        background: url("../images/home-page-buttons-960.png") no-repeat scroll center -126px transparent;
    }
    
    .home .sub-menu {
        top: 205px;
    }
    
    .upper-blocks,
    .front .news-block,
    .home .sub-menu,
    .portfolio-block,
    .home .news-block {
        /*display: none;*/
    }



    .home .zone-main .region-inner
    {
        height: auto !important;
    }

    .upper-blocks,
    .portfolio-block,
    .home .news-block 
    {
        float: none !important;
        position: relative !important;
        width: auto !important;
        margin: 30px 10px;
        top: 0px !important;
        text-align: left !important;
    }
    .news-block a.home-title-link
    {
        float: none;
    }
    .home .right
    {
        border-right: none;
        border-left: 1px solid #4814A0;
        padding-left: 2px;
        padding-right: 0px;
    }

    .home .right .upper-blocks-inner,
    .news-block-inner
    {
        padding-right: 0px;
        padding-left: 8px;
         border-right: none;
        border-left: 1px solid #4814A0;
    }

    .whitepaper-button.home
    {
        margin-left: 0px;
    }
    
    /*=clients section */
    .image_grid, .clients,
    .client-slides {
        width: 517px;
    }
    
    .image_grid li .client-container.no-margin {
        margin-right: 25px;
    }
    
     /*=clients panel */
    .panel-down {
        right: 0!important;
        left: 0!important;
        margin: 0 auto;
        width: 768px;
    }
    
     .slider .details .detail {
         padding: 0px;
         height: 820px;
     }
     
     .slider .details .detail .left {
        float: none;
        margin: 0 auto;
        width: 300px;
    }
    
    .slider .details .before-after, .slider .details .before-after img {
        height: 300px;
        margin-top: 60px;
        width: 300px;
    }
    
    .slider .details .detail .right
    {
        float: none;
        width: 400px;
        /*max-height: 500px;*/
        overflow: auto;
        clear: both;
    }
    
    .slider .details .gallery { 
            width: 300px;
            height: 300px;
            margin-left: 0px;
            
    }
    .slider .rsVideoContainer,  .slider .rsVideoContainer .rsImg {
        width: 300px;
    }
    
    .slider .details .detail .more
    {        
        bottom: auto;
        right: auto;
        left: 10px;
        top: 390px;
        top: auto;
        bottom: 10px;
    }

    .slider .details .detail .more-buttons
    {
        bottom: auto;
        top: 395px;
    }
    
    /*=industries*/
    .industries-wrapper .box,
    .services-wrapper .box {
        float: left;
        position: relative!important;
        top: auto!important;
        left: auto!important;
    }
    
    .services-wrapper ._jsPlumb_connector {
        display: none;
    }
     
    /*BASIC PAGE768 */
    .basic-side { 
        margin: 30px auto;
        width: 100%;
    }

    .not-front .process-wrapper 
    {
        max-width: 95%;
    }
} 

/* 520px */
@media screen and (max-width: 768px) {
    
    .support {
        display: none;
    }
    
    /*=clients520*/
    .image_grid, .clients,
    .client-slides {
        height: 990px;
        width: 100%;
        padding: 0 20px;
        box-sizing: border-box;
    }
    .clients .client-slides { 
        padding: 0;
    }
    
    .image_grid li.last .client-container {
        margin: 0 25px 20px 0;
    }
    
    .image_grid li.last,
    .image_grid li.first {
        clear: none;
    }
    
    .image_grid li img{
            width: 200px;
    }
    
    /*=footer520*/
    .footer-first .menu,
    .footer-first .copyright {
        display: none;
    }
    
     /*BASIC PAGE520 */
    .basic-side { 
        margin: 30px auto;
        width: 310px;
    }
    
    .basic-page .basic-side .side-form {
        width: 310px
    }

    .clients .rsDefault .rsBullets
    {
        margin-bottom: 10px !important;
    }
}

/**********************************************************************************/
/* TABLETS
/**********************************************************************************/

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
    .home .zone-main .region-inner {
        background: url("../images/homepage-center-758.jpg") no-repeat scroll center top transparent;
    }
    
    .home .zone-main .region-inner {
        height: 510px;
    }

    .home nav > a {
        background: url("../images/home-page-buttons-960.png") no-repeat scroll center top transparent;
        font: 16px/1.1 myriad-pro,Arial,Helvetica,sans-serif;
        height: 125px;
        width: 100px;
    }
    
    .home nav a.bullet-1 {
        left: 35px;
    }
    
    .home nav a.bullet-2 {
        left: 165px;
    }
    
    
    .home nav a.bullet-3 {
        right: 166px;
    }
    
    .home nav a.bullet-4{
        right: 35px;
    }
    
        .home nav a span {
            padding: 40px 0 0;
            width: 103px;
        }
    
    .home nav > a:hover,
    .home nav > a.selected {
        background: url("../images/home-page-buttons-960.png") no-repeat scroll center -126px transparent;
    }
    
    .home .sub-menu {
        top: 205px;
    }
    
      /*=clients panel */
      /*=clients section */
    .image_grid, .clients,
    .client-slides {
        width: 100%;
        padding: 0 20px;
        box-sizing: border-box;
    
    }
    
    .client-slides .clients {
        padding: 0;
    }
    
    
    .image_grid li .client-container.no-margin {
        margin-right: 25px;
    }
    
    #portofolio-wrapper .arrow-prev,
    #portofolio-wrapper .arrow-next {
        display: none;
    }
    
     /*=clients panel */
    .clients {
        height: 990px;
    }
    
    .panel-down {
        right: 0!important;
        left: 0!important;
        margin: 0 auto;
        height: 760px;
        width: 768px;
    }
    
    slider .details {
        height: 700px;
    }
    
    .slider .details .detail {
        height: 700px;
    }
            
        .slider .details .detail .title {
            font-size: 12px;
        }
        
        .slider .details .detail .content { 
            font-size: 10px;

        }
        
        .slider .details .detail .left {
            margin: 0 auto;
        }
        
        .slider .details .gallery { 
            width: 305px;
            height: 305px;
        }
        
        .slider .details .before-after, .slider .details .before-after {
            margin: 0 auto;
        }
        
        .slider .details .before-after, .slider .details .before-after img {
            height: 363px;
            width: 333px;
        }
        
        .testimonial .rsVideoContainer {
            height: 370px;
            margin: 0 auto;
            width: 400px
        }

    
    /*BASIC PAGE */
    .basic-side { 
        width: 90%;
    }
    
    .basic-page .basic-side .side-form {
        width: 50%;
    }
    
    /*=portfolio*/
     
    #portofolio-wrapper,
    #portofolio {
        width: 760px;
    }
    
    #portofolio-details .prev ,
    #portofolio-details .next {
        display: none;
    }
    
    .image_grid li {
        display: inline-block;
        float: none!important;
        width: auto;
        min-height: 164px;

    }
    
    .image_grid li.first {
        clear: none;
    }


    
    .slider .details .detail
    {
        padding: 0px !important;
    }
}

/* iPads (landscape) ----------- */
/*=ipadland*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
  #header {
        height: 140px;
    }

    .home .zone-main .region-inner, #footer .region-inner {
        width: auto;
    }

    .upper-blocks,
    .front .news-block,
    .home .sub-menu,
    .portfolio-block,
    .home .news-block {
        display: block;
    }
    
    /*=clients-section */
    .image_grid, .clients, .client-slides {
        height: 685px;
        width: 100%;
        padding: 0 20px;
        box-sizing: border-box;
    
    }
    
    .client-slides .clients {
        padding: 0;
    }

    .da-thumbs li article {
        height: 100px;
        width: 100px;
    }
       
     /* Initial state classes: */
    .da-slideFromTop {
        margin: 10px 0 0 65px;
    }
    
    .da-slideFromBottom {
        margin: 10px 0 0 65px;
    }
    
    .da-slideFromLeft {
        margin: 10px 0 0 65px;
    }
    
    .da-slideFromRight {
        margin: 10px 0 0 65px;
    }
    
    .da-thumbs li  article a {
        height: 120px;
        padding: 35px 0 0 0;
    }

    .image_grid li img{
        width:215px;
    }
    
     /*=panel-slide */
    .panel-down {
        height: 900px;
        width: 1000px;
    }
    
    .slider .details {
        height: 615px;
        width: 925px;
    }
    
    .slider .details .detail {
        height: 550px;
        padding: 0 40px;
        width: 875px;
    }
    
    .rsCustom .rsTabs {
        display: none;
    }

            .slider .details .detail .left {
               float: left;
               width: 445px;
            }

            .slider .details .detail .right {
                float: left;
                padding-left: 20px;
                width: 345px;
            }
            
            .slider .details .gallery {
                margin-left: 0;
                float: left;
            }
 
    /*=basic page */
    /*
     .basic-page {
        padding-left: 50px;
     }
     
        .basic-content {
            width: 45%;
        }*/
}

/**********************************************************************************/
/* PHONES
/**********************************************************************************/

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */

    .support {
        display: none;
    }
    
    .logo {
        background: none;
    }
    
    .top-menu nav {
        padding: 50px 0 0 0;
    }
    
    h1 {
        font-size: 16px;
    }
    
    h2 {
        font-size: 14px;
    }
    
    .just-content, .basic-content {
        font-size: 14px;
    }
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
    /*GENERAL*/
        
    .widget-area {
        left: -55px;
    }
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
    /*GENERAL*/
    
    h1 {
        font-size: 16px;
    }
    
    h2 {
        font-size: 14px;
    }
    
    .just-content, .basic-content {
        font-size: 14px;
    }
        
        .just-content {
            padding-left: 17px;
        }
    
    .not-front #content {
        padding: 10px 0 60px 0;
    }
    
    fieldset.zone-clients-logos {
        display: none;
    }
    
    .widget-area {
        left: -30px;
    }
    
    .logo {
        width: auto;
    }

        .logo img {
            margin-left: -20px;
            text-align: center;
            width: 75%;
        }

        .logo a span.slogan1 {
            font: 15px/1.6 myriad-pro,Arial,Tahoma,sans-serif;
        }

    .home .zone-main .region-inner { 
        background: none;
    }
        .home nav {
            width: 320px;
        }

            .home nav > a {
                margin: 0 auto;
                position: static;
            }
            
        .top-menu nav li a {    
            font-size: 14px;
        }
        
        .home .sub-menu {
            top: 0;
        }
    
    /*=second level page navi*/    
    .top-menu nav {
        padding: 50px 0 0 0;
        width: 305px;
    }    
    
    .footer-first {
        display: table;
        margin: 0 auto;
    }      
        
        #header {
            margin: 0 0 20px 0;
        }
        /*=clients*/
        
        #uniform-services {
            margin-bottom: 10px;
            margin-top: -10px;
        }

        .image_grid, .clients,
        .client-slides {
            height: 1000px;
            width: 225px;
            margin: 0 auto;
        }

        .image_grid li.last .client-container {
            margin: 0 25px 20px 0;
        }                
        
        .image_grid li img{
            width: 200px;
        }
        
        /*-basic-page*/
        .basic-page {
            padding: 0 5px;
            width: 290px;
        }
     
            .basic-content {
                width: 290px;
            }

            .basic-side {
                margin-top: 20px;
                width: 290px;
            }

}
@media all and (max-width: 1140px) and (min-width: 970px) {
  .slider .details .detail{
    position: relative;
  }
  .slider .details .detail .more {
    bottom: 14px;
    right: 118px;
    padding: 0 32px;
  }
}
@media all and (max-width: 1140px){
  .slider .details .before-after{
    margin-top: 20px;
  }
}

@media all and (max-width: 1024px){
  .main-container{
    /*overflow: visible !important;*/
  }

  .bottom-graphic
  {
    display: none;
  }
}


@media all and (max-width: 340px){

    .image_grid, 
    .clients,
    .client-slides ,
    .client-slides .rsOverflow
    {
        height: 1800px !important;
    }

}