/**
 * Author: Juno
 */

/*GLOBAL*/
html {-webkit-text-size-adjust: none;}
.mob-menu {display: none; height: 100%; text-align: center; background: #044f90 url("../images/bg-shadow.png") 0 0 repeat-x; cursor: pointer;}
.mob-menu-button {display: inline-block; width: 25px; margin-top: 10px;}
.mob-menu-line {background-color: #ffffff; width: 100%; height: 3px; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; margin-bottom: 3px;}

/*SCREEN QUERIES*/
/***************************/
/*SCREEN 1136*/
 .banner .wrapper-img{
	background-size: cover !important;
	background-position: 50% 50% !important;
}
@media screen and (max-width: 1900px) {
    .banner .wrapper-img{
		background-position: 0 50% !important;
	}
}

@media screen and (max-width: 1199px) {
    .banner .wrapper-img {background-size: 150% auto!important; height: 0; padding-top: 50%;}
    #header .section-bottom .wrapper-content {padding: 0;}
    .grid-brand li {line-height: normal; height: auto;}
    .about-us .contact-us p {width: 85%; line-height: 25px;}
    .news .list-items .col7 {width: 69%;}
    .single-brand {margin-top: 45px;}
    .single-brand .banner .wrapper-img {position: relative; padding-top: 39%; height: auto; line-height: 0;}
    .single-brand .banner .wrapper-img .wrapper-content {display: inline-block; width: 30%; position: absolute; top: 22%; right: 10%;}
}

/*SCREEN 1024*/
@media screen and (max-width: 1135px) {
    .banner {margin-bottom: 15px;}
    .home .intro { margin-bottom: 20px; }
    .home .intro p {margin-bottom: 0;}
    .category { margin-top: 0;}
    .about-us .intro img {margin-left: 20px;}
    .contact-us .title {margin-bottom: 50px;}
}

/*SCREEN 960*/
@media screen and (max-width: 1023px) {
    .home .intro {padding-left: 50px; padding-right: 50px;}
    .about-us .contact-us p {width: 80%;}
    .news .list-items .single-item {padding: 30px 0;}
    .contact-us #contact-form { padding: 20px 2.5% 30px; }
    .contact-us .col1 {width: 49%;}
    .contact-us #contact-info .col2 {width: 43%;}


}
@media screen and (min-width: 960px) {
    .brands li{width: 18.72%;}
    .brands li:nth-child(5n+1){clear: left; margin-left: 0;}
}

@media screen and (min-width: 480px) and (max-width: 959px) {
    .brands li{width: 32.26%;}
    .brands li:nth-child(3n+1){clear: left; margin-left: 0}
}

/*SCREEN 800*/
@media screen and (max-width: 959px) {
    #footer .left,
    #footer .right {display: block; width: 100%; float: none; text-align: center;}
    #footer .section-top {padding-top: 20px;}
    #footer .section-top .left {padding-bottom: 10px;}
    #footer .section-top .right {padding-bottom: 35px;}
    #footer .section-bottom {padding-top: 35px;}
    #footer .section-bottom .right {padding-bottom: 5px;}
    #footer .section-bottom .left {padding-bottom: 20px;}
    .home .intro {padding-left: 10px; padding-right: 10px;}
    .intro p { font-size: 17px;}
    .category li a,
    #header .section-bottom li a {font-size: 14px;}
    .brands {margin-top: 35px;}
    .brands ul { margin-top: 20px; }
    .grid-brand li {margin-bottom: 20px;}
    .title p {padding: 0 50px;}
    #footer .footer-newsletter-form .gfield_label{width: 100%; text-align: center; margin-bottom: 15px; font-size: 18px; margin-right: 0}
    #footer .footer-newsletter-form {
        margin: 0 auto;
        max-width: 400px;
        padding: 12px 0;
        position: relative;
        width: 80%;
    }
    #footer .footer-newsletter-form .ginput_container{width: 100%;}
    .footer-contact-sticky{margin-bottom: 15px;}
}

/*SCREEN 768*/
@media screen and (max-width: 799px) {
    .category li a {font-size: 12px;}
    .title {margin-bottom: 30px;}
    .about-us .intro {margin-bottom: 10px;}
    .about-us .col1 {margin-bottom: 10px;}
    .about-us .margin-bottom1 { margin-bottom: 30px; }
    .about-us .group-companies .margin-bottom3 { margin-bottom: 15px}
    .about-us .group-companies { margin-bottom: 15px; padding-bottom: 10px; }
    .about-us .icon { height: 170px; line-height: 170px;}
}

/*SCREEN 640*/
@media screen and (max-width: 767px) {
    #nav li { margin-left: 15px;}
    #nav li a {font-size: 13px;}
    #header .section-bottom li a {font-size: 12px;}
    .bx-wrapper .bx-pager {bottom: 1px;}
    .about-us .intro img {margin-left: 10px;}
    .about-us .contact-us p {width: 75%;}
    .news .col5,
    .news .side-bar {width: 100%; float: none;}
    .side-bar h2:not(:first-of-type) { margin-top: 40px; }
    .side-bar h2 {margin-bottom: 10px;}
    .single-brand .banner,
    .feature.margin-bottom6 {margin-bottom: 30px;}
    .single-brand .about h2 {margin-bottom: 15px;}
    .grid-brand li {margin-bottom: 15px;}
    .brands ul{
        -ms-grid-columns: 33% 33% 33%;grid-template-columns:33% 33% 33%;
    }
}

/*SCREEN 480*/
@media screen and (max-width: 639px) {
    #logo {width: 100px;}
    #header .section-top {padding: 10px 0; height: 85px;}
    #nav { margin-top: 25px; }
    #nav li a {font-size: 9px;}
    #header .section-bottom li a {font-size: 11px; line-height: 35px;}
    #header .section-bottom {height: 35px;}
    #header { margin-bottom: -35px;}
    #header .section-bottom li {display: block; width: 100%;}
    #header .section-bottom li a {background: none;}
    #header .section-bottom ul {display: block;}
    .mob-menu {display: block;}
    #menu-sectors {border-right: 2px solid #044f90; border-bottom: 2px solid #044f90; border-left: 2px solid #044f90;}
    #footer .sprite-01.phone {font-size: 16px;}
    #footer .sprite-01.mail {margin-left: 10px;}
    #footer .menu li a {font-size: 11px;}
    .category li a {font-size: 14px;}
    .feature li, .category li {width: 49.5%;}
    .feature li img, .category li img {width: 100%;}
    .feature li:nth-of-type(2n+1), .category li:nth-of-type(2n+1) {margin-left: 0;}
    .feature li:nth-of-type(2n+3), .category li:nth-of-type(2n+3),
    .feature li:nth-of-type(2n+4), .category li:nth-of-type(2n+4) {margin-top: 3px;}
    .brands {margin-top: 20px;}
    .brands ul { margin-top: 5px; }
    .sticky-wrapper {height: 35px!important;}
    .grid-brand {margin-bottom: 30px;}
    .about-us .contact-us p {width: 100%;}
    .about-us .contact-us .button {margin-top: 20px; width: 100%;}
    .about-us .col1 {width: 100%; float: none; margin-bottom: 40px; padding-bottom: 10px; border-bottom: 1px solid #E5E5E5; }
    .about-us .col1:last-of-type {border: none; }
    .news .list-items .single-item .col6 {width: 100%; float: none; text-align: center;}
    .news .list-items .col7 {width: 100%; float: none;}
    .news .list-items .single-item h2,
    .news .list-items .single-item span {text-align: center;}
    .news .list-items .single-item p {margin-top: 15px;}
    .news .list-items .single-item:last-of-type { border-bottom: 1px solid #E5E5E5; }
    .news .side-bar {margin-top: 30px; text-align: center}
    .title {padding-top: 80px;}
    .single-brand {margin-top: 34px;}
    .single-brand .about {width: 100%; float: none; margin-top: 20px;}
    .single-brand .about h2 {text-align: center;}
    .single-brand .logo {width: 100%; float: none;}
    .single-brand .margin-bottom5,
    .single-brand.margin-bottom5 { margin-bottom: 50px;}
    .single-brand .screen-shot {text-align: center; margin-top: 40px;}
    .title p {padding: 0 20px;}
    #contact-info {width: 100%; float: none;}
    #contact-info .map img {width: 100%;}
    #contact-info .col3 {width: 50%;}
    #contact-form {width: 100%; float: none; margin-top: 30px;}
    .contact-us .title {margin-bottom: 30px;}
    .about-us li {width: 32%;}
}

/*SCREEN 320*/
@media screen and (max-width: 479px) {
    #nav li {display: block; text-align: right; line-height: 1em;}
    #nav li a {font-size: 9px;}
    #nav { margin-top: -5px; }
    #footer .menu li { padding: 0 5px;}
    #footer .sprite-01.mail a,
    #footer .sprite-01.phone {font-size: 15px;}
    #footer .menu li a {font-size: 10px;}
    #footer h2 img { margin-top: -29px; width: 90px; }
    .category li a {font-size: 11px;}
    .bx-wrapper .bx-pager {display: none;}
    .grid-brand li:nth-of-type(3n) { margin-right: 2.59%; }
    .grid-brand li:nth-of-type(2n) { margin-right: 0;}
    .grid-brand li:nth-of-type(2n+1) {clear: left;}
    .grid-brand li {width: 48.6%}
    .single-brand .screen-shot {text-align: center; padding: 0 20px;}
    .single-brand .screen-shot img {float: none; margin-right: 0;}
    .single-brand .screen-shot p {padding-top: 10px;}
    .single-brand .margin-bottom5,
    .single-brand.margin-bottom5 { margin-bottom: 30px;}
    .grid-brand li {margin-bottom: 10px;}
    .title p {padding: 0 10px;}
    .brands li{width: 49.2%;}
    .brands li:nth-child(2n+1){clear: left; margin-left: 0}
}
