@media screen and (min-width: 995px){
    .portfolio-items .fade-carousel .slides{ height: 100vh; width: auto; }
}
@media screen and (max-width: 996px){
	section#whatwedo div.item{ width: 19.4%; }
	.homepage .hero{ left: 10%; }
    .bs-carousel .hero.inner-vertical {
        text-align: left;
        height: auto;
        padding: 20px;
        position: relative;
        right: 0;
        max-width: 100%;
    }
    .fade-carousel{ height: 100%;  }
    div.socialfp #bs-carousel .hero h1, div.services #bs-carousel .hero h1, .services .bs-carousel .hero h1{
        font-size: 3.6rem;
    }
    .portfolio-items .fade-carousel, .portfolio-items  .fade-carousel .carousel-inner .item {
        height: auto !important;
        min-height: auto;
    }
    .portfolio-items .fade-carousel .slides img{ margin-left:0; width: 100%; height: auto; min-height: auto; max-width: 100%; }
}
@media (min-width: 700px) {
    nav.mobile {
        display: none !important;
    }
    nav.desktop {
        display: block !important;
    }
}
@media (max-width: 700px) {
    nav.desktop {
        display: none;
    }
    nav.mobile {
        display: block;
    }
    section#whatwedo div.item {
        margin: 0px 2px 0 0;
        min-height: 0;
        width: 100% !important;
        max-height: 300px;
        overflow: hidden;
    }
    section#whatwedo h2.item-title{
        /*! height: 100%; */
        /*! padding: 48% 0px; */
        font-size: 25px;
        display: table-cell;
        vertical-align: middle;
    }
    section#whatwedo .hovereffect img {
        max-width: 100%;
        height: auto;
        max-height: none;
        width: 100%;
    }
    .hovereffect .imgoverlay {
        opacity: 1;
        filter: alpha(opacity=100);
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
    .hovereffect h2{
        opacity: 1;
        filter: alpha(opacity=1);
        -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
        transition: opacity 0.35s, transform 0.35s;
        -webkit-transform: translate3d(0,-100%,0) !important;
        transform: translate3d(-10%,-50%,0);
    }
    .services .hero{
        top: 20%;
        height: 50%;
        right: 0;
    }
    #bs-carousel2 .hero{ top: 0 !important; }
    .homepage .hero{ height: 100%; margin-top: 0; }
    .homepage section#social-footprint .hero{ margin-top: 0; }
    .homepage .hero hgroup{ margin-top: 20%; }
    .homepage section#portfolio .hero{
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
        left: 0;
        top: 150px !important;
        position: absolute;
        padding-top: 2px;
        width: 100%;
    }
    .homepage section#portfolio .hero .btn.btn-tss, .homepage section#portfolio .hero .btn.btn-tss:hover, .homepage section#portfolio .hero .btn.btn-tss:focus {
        margin: 0px auto;
        padding: 4px 10px;
    }
/*     .homepage section#portfolio .hero hgroup{ margin-top: 10%; } */
    .homepage section#portfolio .hero h2 {
        font-size: 3rem;
    }
    .homepage section#portfolio .fade-carousel .slides .slide-2 {
        background-position: 50% 0;
    }
    #bs-carousel2 .brand-logos {
        width: 100%;
        margin: 0 auto;
        position: absolute;
        right: 0;
        bottom: 200px;
        padding-top: 0;
    }
    .fade-carousel .slides .slide-2 {
        background-position: -100px top;
    }
    input, textarea, select{ max-width: 100%; }
    .contact address{ border-bottom: #CCC 1px solid; }
    .contact{ padding-bottom: 0 !important }
    .loginmenu a{ text-transform: none; }
    .loginmenu > div.login{ background: none; width: 200px; margin: 5px auto; }
    .loginmenu > div.login input {
        background-color: #fff;
        font-size: 14px;
        height: 30px;
        margin: 1px 0;
        width: 150px;
    }
    .fp-section,
    .fp-slide,
    .fp-tableCell{
        height: auto !important;
    }
    
    .services-merchandise, .services-tech-support, .services-quality-check, .services-design-development, .services-logistics, .services-merchandise, .services-tech-support, .services-quality-check, .services-design-development, .services-logistics, .fade-carousel .carousel-inner .item::not(.homepage){
      height: 50vh;
    }
    .hero a.down-arrow{
        display: none;
    }
    div.services #bs-carousel .hero.full-overlay, .services .bs-carousel .hero.full-overlay, .hero.full-overlay {
        padding: 40% 10%;
        /* display: none; */
    }
    .portfolio-items .fade-carousel .slides img {
       margin-left: -10px;
    }
    .portfolio-items .fade-carousel .women.slides img, .portfolio-items .fade-carousel .men.slides img, .portfolio-items .fade-carousel .outer.slides img {
       margin-left: 0;
    }
    /* .overlay-content-xs{ display: block; padding: 20px; } */
    div.products .overlay-content-sm{ display: none; }
    div.products .overlay-content-xs{ display: block; padding: 70px 0 0; background: #FFF; } 
    div.products .overlay-content-xs .prod-category{
        display: table;
        margin: 0 auto;
        padding: 5px 10px; 
    }
    div.products .fade-carousel .carousel-inner .item {
        height: auto;
    }

}


/* @media (max-width: 1366px) and (min-width: 700px){
    section#whatwedo div.item{
        max-height: 680px;
    }
} */

@media (min-height: 380px) and (max-height: 480px){
	#bs-carousel2 .brand-logos{ margin-top: 0px; padding-top: 0px; }
}
@media (max-height: 500px){
    .homepage section#portfolio #bs-carousel2 .brand-logos{ bottom: 53px; top: auto; }
    .homepage .hero hgroup{ margin-top: 20vh !important; }
    .homepage section#portfolio .hero{ top: 20px !important; }
}