

@media screen and (min-width: 989px) {

    .main-header .container {
        padding-left: 0px;
    }

    .slider-caption {
        top: 230px;
    }
    .col-md-15 {
        width: 16%;
        float: left;
        padding-left: 10px;
        padding-right: 10px;
    }

    .what-we-do .list-item h4 {
        font-size: 16px;
    /*    margin-right: 0px !important;
        margin-left: 0px !important;*/
    }

    .what-we-do .short {
        padding-top: 10px !important;
        padding-bottom: 22px !important;
    }
}

@media screen and (min-width: 1200px) {
    .container {
        max-width: 1200px;
    }

    .slider-caption {
        top: 380px;
    }

    .what-we-do .list-item h4 {
        margin-right: 7px !important;
        margin-left: 7px !important;
    }

}

@media screen and (max-width: 1199px) {
    
    .main-menu ul li {
        display: block;
    }

        .main-menu ul li a {
            padding: 15px 17px 17px 25px !important;
            line-height: 40px;
        }

        .main-menu ul li:last-child {
            margin-right: 20px;
        }

    .Saturno_sec .left-text p {
        margin-right: 10px !important;
        margin-left: 10px !important;
    }

}

@media screen and (max-width: 1050px) {
    .what-we-do .list-item h4 {
        margin-right: 0px !important;
        margin-left: 0px !important;
    }
}

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

    .logo-wrapper {
        height: 75px !important;
        background-position: 0px -4px !important;
    }

    .toggle-menu {
        margin-top: 15px !important;
        margin-right: 0px !important;
    }

    .menu-first {
        float: right;
        overflow: auto;
        width: 100%;
        display: none;
        padding-left: 0px;
        padding-top: 10px;
/*        padding-bottom: 10px;*/
    }

    .main-menu ul li {
        height: 45px !important;
        float: none !important;
    }

        .main-menu ul li a {
            padding: 4px 4px 4px 4px !important;
            line-height: 35px;
            font-size: 15px !important;
        }

        .main-menu ul li:last-child {
            margin-right: 0px !important;
        }


    .slider-caption {
        top: 300px !important;
    }

        .slider-caption h2 {
            font-size: 32px !important;
        }

        .slider-caption p {
            padding: 0px 40px !important;
        }
    
    .About_sec h2 {
        font-size: 40px !important;
    }

    .About_sec p {
        font-size: 17px !important;
        line-height: 22px !important;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    .About_sec br {
        display: none;
    }

    .About_sec .Tabside .TabImage {
        display: none !important;
    }

    .About_sec .Tabside .Description {
        width: 95% !important;
        margin-top: -10px !important;
        margin-left: 10px !important;
        padding-bottom: 0px !important;
        padding-top: 0px !important;
        float: none !important;
        text-align: center !important;
    }

        .About_sec .Tabside .Description h3 {
            font-size: 24px !important;
            line-height: 21px !important;
        }

        .About_sec .Tabside .Description p {
            padding: 20px 0px 20px 0px !important;
        }


    .Services_sec h2 {
        font-size: 40px !important;
    }

    .what-we-do .list-item {
        margin: 10px 0px !important;
    }

    .what-we-do .list-item h4 {
        font-size: 15px !important;
    }

    .Services_sec .rightside .text .Lorem p {
        font-size: 17px !important;
        line-height: 30px !important;
    }

    .Services_sec .left-image .content p {
        font-size: 17px !important;
        line-height: 20px !important;
    }


    .Client_sec h2 {
        font-size: 40px !important;
    }

    .Client_sec p {
        font-size: 17px !important;
        line-height: 22px !important;
    }

    .Client_sec .Center .col-xs-12 {
        padding-top: 20px !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .Client_sec .Center .col-xs-4 {
        padding: 5px 0px !important;
    }

    .Client_sec .Center .Akzo {
        padding: 12px 0px !important;
    }

    .Client_sec .Center .Apergy {
        padding: 28px 0px !important;
    }

    .Client_sec .Center .Arcor {
        padding: 9px 0px !important;
    }

    .Client_sec .Center .Colorin {
        padding: 33px 0px !important;
    }

    .Client_sec .Center .Pelco {
        padding: 16px 0px !important;
    }

    .Client_sec .Center .Kraft {
        padding: 24px 0px !important;
    }

    .Client_sec .Center .Puratos {
        padding: 15px 0px !important;
    }

    .Client_sec .Center .Crispino {
        padding: 12px 0px !important;
    }

    .Client_sec .Center .Pepsico {
        padding: 30px 0px !important;
    }

    .Client_sec .Center .Pulverlux {
        padding: 28px 0px !important;
    }

    .Client_sec .Center .Siemens {
        padding: 48px 0px !important;
    }

    .Client_sec .Center .Tipci {
        padding: 50px 0px !important;
    }

    .Client_sec .Center .Sika {
        padding: 0px 0px !important;
    }

    .Client_sec .Center .SKF {
        padding: 42px 0px !important;
    }

    .Client_sec .Center .Tradimex {
        padding: 17px 0px !important;
    }

    .Client_sec .Center .Uffenheimer {
        padding: 17px 0px !important;
    }

    .Client_sec .Center .Wenlen {
        padding: 19px 0px !important;
    }



    .Saturno_sec h2 {
        font-size: 40px !important;
    }
        
    .Saturno_sec p {
        font-size: 17px !important;
        line-height: 22px !important;
    }

    .Saturno_sec .left-text p {
        font-size: 16px !important;
        margin-right: 10px !important;
        margin-left: 10px !important;
    }

    .Contact_sec h2 {
        font-size: 40px !important;
    }

    .Contact_sec p {
        font-size: 17px !important;
        line-height: 22px !important;
    }

}

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

    .main-header {
        top: 0;
    }

    h2 {
        font-size: 40px !important;
    }

    .logo-wrapper {
        background: url(../img/BDSlogo_chico_2.png) no-repeat !important;
        float: left;
        height: 50px !important;
        background-position: 5px 3px !important;
    }

    .toggle-menu {
        margin-top: 7px !important;
        margin-right: 0px !important;
    }

    .menu-first {
        display: none;
/*        margin-top: 50px !important;*/
    }

    .main-menu ul li {
        height: 41px !important;
        float: none !important;
        display: block !important;
    }

        .main-menu ul li a {
            padding: 4px 4px 4px 4px !important;
            line-height: 30px;
            font-size: 12px !important;
        }

        .main-menu ul li:last-child {
            margin-right: 0px !important;
        }

    .slider-caption {
        top: 140px !important;
    }

        .slider-caption h2 {
            font-size: 30px !important;
            border-bottom: none !important;
        }

        .slider-caption p {
            font-size: 14px !important;
            padding: 0px 5px !important;
            margin-top: 0px !important;
            margin-bottom: 0px !important;
        }

    .About_sec {
        padding: 50px 0px 40px 0px !important;
    }

        /*.About_sec h2 {
                font-size: 40px !important;
            }*/

        .About_sec p {
            font-size: 17px !important;
            line-height: 21px !important;
            padding-left: 5px !important;
            padding-right: 5px !important;
        }

        .About_sec br {
            display: none !important
        }

        .About_sec .Tabside {
            padding: 30px 0px !important;
        }

            .About_sec .Tabside ul {
                padding-left: 0px !important;
            }

            .About_sec .Tabside li a {
                padding: 10px !important;
                font-size: 17px !important;
            }

            .About_sec .Tabside .TabImage {
                display: none !important;
            }


            .About_sec .Tabside .Description {
                width: 95% !important;
                margin-top: -10px !important;
                margin-left: 10px !important;
                padding-bottom: 0px !important;
                padding-top: 0px !important;
                float: none !important;
                text-align: center !important;
            }

                .About_sec .Tabside .Description h3 {
                    font-size: 24px !important;
                    line-height: 21px !important;
                }

                .About_sec .Tabside .Description p {
                    padding: 20px 0px 20px 0px !important;
                }

    .Services_sec {
        padding: 50px 0px 40px 0px !important;
    }

        .Services_sec .wrapper ul {
            padding-left: 0px !important;
        }

    .what-we-do .list-item {
        padding-bottom: 10px !important;
        margin: 10px 0px !important;
    }

        .what-we-do .list-item h4 {
            margin-top: 10px !important;
        }

    .Services_sec .leftside h4 {
        line-height: 25px !important;
        font-size: 23px;
    }

    .Services_sec .left-image .content {
        padding: 5px !important;
    }

        .Services_sec .left-image .content p {
            font-size: 16px !important;
            line-height: 18px !important;
        }

    .Services_sec .rightside .text {
        position: relative !important;
        padding: 0px;
    }

        .Services_sec .rightside .text .Lorem p {
            padding: 0px !important;
            font-size: 16px !important;
            line-height: 30px !important;
        }



    .Client_sec {
        padding: 50px 0px 40px 0px !important;
    }

        .Client_sec p {
            font-size: 18px !important;
        }

    /*    .Client_sec img {
            width: 80% !important;
        }*/

        .Client_sec .Center .col-xs-12 {
            padding-top: 20px !important;
            padding-left: 0px !important;
            padding-right: 0px !important;
        }

        .Client_sec .Center .col-xs-4 {
            padding: 5px 0px !important;
        }

        .Client_sec .Center .Akzo {
            padding: 6px 0px !important;
        }

        .Client_sec .Center .Apergy {
            padding: 22px 0px !important;
        }

        .Client_sec .Center .Arcor {
            padding: 5px 0px !important;
        }

        .Client_sec .Center .Colorin {
            padding: 38px 0px !important;
        }

        .Client_sec .Center .Pelco {
            padding: 0px 0px !important;
        }

        .Client_sec .Center .Kraft {
            padding: 8px 0px !important;
        }

        .Client_sec .Center .Puratos {
            padding: 3px 0px !important;
        }

        .Client_sec .Center .Crispino {
            padding: 17px 0px !important;
        }

        .Client_sec .Center .Pepsico {
            padding: 35px 0px !important;
        }

        .Client_sec .Center .Pulverlux {
            padding: 33px 0px !important;
        }

        .Client_sec .Center .Siemens {
            padding: 49px 0px !important;
        }

        .Client_sec .Center .Tipci {
            padding: 17px 0px !important;
        }

        .Client_sec .Center .Sika {
            padding: 5px 0px !important;
        }

        .Client_sec .Center .SKF {
            padding: 42px 0px !important;
        }

        .Client_sec .Center .Tradimex {
            padding: 22px 0px !important;
        }

        .Client_sec .Center .Uffenheimer {
            padding: 15px 0px !important;
        }

        .Client_sec .Center .Wenlen {
            padding: 17px 0px !important;
        }



    .Saturno_sec {
        padding: 50px 0px 40px 0px !important;
    }

        .Saturno_sec p {
            font-size: 18px !important;
        }

        .Saturno_sec .left-text p {
            padding: 20px 10px 0px 10px !important;
            font-size: 17px !important;
            line-height: 21px !important;
            margin-right: 0px !important;
        }

        .Saturno_sec .Center a {
/*            padding: 0px 10px !important;*/
        }

    .Contact_sec {
        padding: 50px 0px 0px 0px !important;
    }

    .Get_sec .Mid {
        padding: 25px 0px 20px 0px !important;
    }


    .Contact_sec p {
        padding: 20px 10px 0px 10px !important;
        font-size: 18px !important;
    }

    footer .Cntr {
        padding: 5px 0px;
    }

    footer .Cntr p {
        padding: 0px !important;
        font-size: 14px !important;
    }
}

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

    .what-we-do .list-item h4 {
        margin-right: 8px !important;
        margin-left: 8px !important;
    }

    #btnGestion {
        margin-right: 14px !important;
        margin-left: 14px !important;
    }

    .Client_sec img {
        width: 80% !important;
    }

    .Client_sec .Center .col-xs-12 {
        padding-top: 20px !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .Client_sec .Center .col-xs-4 {
        padding: 5px 0px !important;
    }

    .Client_sec .Center .Akzo {
        padding: 7px 0px !important;
    }

    .Client_sec .Center .Apergy {
        padding: 20px 0px !important;
    }

    .Client_sec .Center .Arcor {
        padding: 8px 0px !important;
    }

    .Client_sec .Center .Colorin {
        padding: 35px 0px !important;
    }

    .Client_sec .Center .Pelco {
        padding: 2px 0px !important;
    }

    .Client_sec .Center .Kraft {
        padding: 9px 0px !important;
    }

    .Client_sec .Center .Puratos {
        padding: 5px 0px !important;
    }

    .Client_sec .Center .Crispino {
        padding: 12px 0px !important;
    }

    .Client_sec .Center .Pepsico {
        padding: 45px 0px !important;
    }

    .Client_sec .Center .Pulverlux {
        padding: 44px 0px !important;
    }

    .Client_sec .Center .Siemens {
        padding: 50px 0px !important;
    }

    .Client_sec .Center .Tipci {
        padding: 10px 0px !important;
    }

    .Client_sec .Center .Sika {
        padding: 15px 0px !important;
    }

    .Client_sec .Center .SKF {
        padding: 45px 0px !important;
    }

    .Client_sec .Center .Tradimex {
        padding: 14px 0px !important;
    }

    .Client_sec .Center .Uffenheimer {
        padding: 25px 0px !important;
    }

    .Client_sec .Center .Wenlen {
        padding: 25px 0px !important;
    }

}

@media screen and (max-height: 500px) {
    .menu-first.show {
        max-height: 250px;
    }

}



#menu-wrapper {
    overflow: hidden;    
}

.logo-wrapper {
    background: url(../img/BDSlogo_chico.png) no-repeat;
    height: 67px;
    background-position: 10px;
}

h1 {
    margin-top: 10px;
}

.wrapper {
    text-align: left;
}


ul {
    list-style: none !important;
}

.main-menu ul {
    list-style: none;
    margin: 0px;
    float: right;
}

    .main-menu ul li {
        display: inline-block;
        float: left;
        padding: 0px;
        margin: 0px;
        height: 75px;
        position: relative;
        transition: all 0.3s ease;
    }

    .main-menu ul li:last-child {
        margin-right: 35px;
    }

        .main-menu ul li a {
            text-transform: uppercase;
            padding: 30px 35px 25px 35px;
            font-size: 14px;
            color: #f7f7f7;
            font-family: 'Open Sans', sans-serif;
            font-weight: 400;
            text-decoration: none;
            display: block;
            -webkit-transition: all 0.3s ease;
            transition: all 0.3s ease;
        }

        .main-menu ul li.active a {
            border-bottom: 3px solid #ff9000;
            color: #ff9000;
        }


.toggle-menu {
    width: 36px;
    height: 36px;
    float: right;
    margin-top: 33px;
    margin-right: 30px;
    text-align: center;
    line-height: 36px;
    font-size: 14px;
    background: #ff9000;
    display: inline-block;
    color: #e6e6e6;
    cursor: pointer;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

body {
    background: #f7f7f7;
    font: 80% Trebuchet MS, Arial, Helvetica, Sans-Serif;
    color: #333;
    line-height: 180%;
    margin: 0;
    padding: 0;
}

h1 {
    font-size: 200%;
    letter-spacing: -2px
}

p {
    margin: 0 0 15px 0;
    padding: 0;
    line-height:21px;
}

img {
    border:none;
}

pre {
    margin-top:-16px;
    display:block;
    font:12px "Courier New", Courier, monospace;
    padding:10px;
    border:1px solid #bae2f0;
    background:#e3f4f9;
    width:674px;
}

body {
    font:80% Trebuchet MS, Arial, Helvetica, Sans-Serif;
    color:#333;
    line-height:180%;
    margin:0;
    padding:0;
}


#container {
    margin:0 auto;
    position:relative;
    text-align:left;
    width:696px;
    background:#f7f7f7;
    margin-bottom:2em;
}

pre {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
}

/* // Sudo Slider */
#slider {
    width: 696px

} /* It can be a good idea to set a width of the slider, mostly so Old-IE can figure out how to render */

/* Numeric Navigation */
ol.numericControls {
    margin:1em 0;
    padding:0;
    height:28px;
}

ol.numericControls li {
    margin:0 10px 0 0;
    padding:0;
    float:left;
    list-style:none;
    height:28px;
    line-height:28px;
}

ol.numericControls li a {
    float:left;
    height:28px;
    line-height:28px;
    border:1px solid #ccc;
    background:#DAF3F8;
    color:#555;
    padding:0 10px;
    text-decoration:none;
}

ol.numericControls li.current a {
    background:#5DC9E1;
    color:#f7f7f7;
}

ol.numericControls li a:focus, .prevBtn a:focus, .nextBtn a:focus {
    outline:none;
}

.graphic, .prevBtn, .nextBtn {
    margin:0;
    padding:0;
    display:block;
    overflow:hidden;
    text-indent:-8000px;
}

.prevBtn, .nextBtn {
    display:block;
    width:30px;
    height:77px;
    position:absolute;
    left:-30px;
    top:71px;
    z-index:1000;
    background:url(../images/btn_prev.gif) no-repeat 0 0;
    cursor:pointer;
}

.nextBtn {
    left:696px;
}

.nextBtn {
    background:url(../images/btn_next.gif) no-repeat 0 0;
}

.slider-caption {
    position: absolute;
    z-index: 9;
    width: 100%;
    text-align: center;
    top: 250px;
    left: 0;
}

.slider-caption h2 {
    color: #e6e6e6;
    text-transform: uppercase;
    font-size: 36px;
    font-weight: 700;
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 10px;
    display: inline-block;
}

    .slider-caption p {
        color: #e6e6e6;
        text-transform: uppercase;
        font-size: 18px;
        margin-top: 20px;
        margin-bottom: 26px;
        display: block;
    }

    .slider-caption a.slider-btn {
        color: #e6e6e6;
        background-color: #ec523f;
        padding: 15px 40px;
        border-radius: 7px;
        text-transform: uppercase;
        font-weight: 700;
        font: 150% Trebuchet MS, Arial, Helvetica, Sans-Serif !important;
    }

    .slider-caption .overlay {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 8;
        background: rgba(0, 0, 0, 0.34);
        width: 100%;
        height: 100%;
    }

        .slider-caption .overlay p {
            color: #e6e6e6;
            text-transform: uppercase;
            font-size: 18px;
            margin-top: 20px;
            margin-bottom: 26px;
            display: block;
        }

    .menu-slider .overlay {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 8;
        background: rgba(0, 0, 0, 0.34);
        width: 100%;
        height: 100%;
    }

#slider .slide {
    position: relative;
    height: 100%;
    overflow: hidden;
}

#container {
    width: auto;
}

#slider, #slider img {
    width: 100%;
}

.centeredDotsControls, .centeredDotsControls a, .centeredDotsControls a span {
    z-index: 2;
    position: relative;
}

.centeredDotsControls a {
    width: 18px;
    height: 18px;
    margin: 5px;
    background: transparent;
    box-shadow: 0 1px 1px black;
    border: 2px solid #eee;
    border-radius: 20px;
    display: inline-block;
    /*text-indent: -9000px;*/
}

.controls *, .controls {
    z-index: 900;
}

.centeredDotsControls a {
    background: #333333;
    text-decoration: none;
    color: #f7f7f7;
}

.centeredDotsControls a.current {
    background: #ffffff;
    color: #333;
}

.main-header {
    position: fixed;
    background: #0c0c0cc7;
    width: 100%;
    margin: 0 auto;
    z-index: 1000;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}


.primary-button a {
    padding: 13px 20px;
    letter-spacing: 0.5px;
    background-color: #46bae2;
    color: #f7f7f7;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}


/* <<< Container >>> */
#Container {
    overflow: hidden;
    width: auto;
}

/* <<< About Section >>> */
.About_sec {
    padding: 80px 0px 70px 0px;
    width: 100%;
    overflow: hidden;
    background: #f5f5f5;
}

.About_sec .Center {
    max-width: 1200px;
    margin: auto;
    overflow: hidden;
    text-align: center;
}

.About_sec h2 {
    font-size: 45px;
    color: #000;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    margin: 0px;
    /*text-transform: uppercase;*/
    line-height: 60px;
    letter-spacing: -0.4px;
}

.About_sec p {
    padding: 24px 0px 35px 0px;
    font-size: 20px;
    color: #636363;
    margin: 0px;
    font-family: 'Open Sans', sans-serif;
    line-height: 25px;
    font-weight: 300;
    word-spacing: 2px;
}

.About_sec .Line {
    border: solid 1px #ff9408;
    height: 2px;
    width: 252px;
    margin: auto;
}

.About_sec .Tabside {
    padding: 45px 0px;
    width: 100%;
}

.About_sec .Tabside ul {
    list-style: none;
    margin: 0px;
    padding-bottom: 35px;
}

.About_sec .Tabside li {
    float: none;
    padding: 0px;
    margin: 0px -2px;
    display: inline-block;
}

.About_sec .Tabside li a {
    padding: 14px 40px 13px 40px;
    font-size: 18px;
    color: #989898;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    text-decoration: none;
    text-transform: uppercase;
    border: solid 1px #d5d5d5;
    display: block;
    transition: all 0.3s ease;
}

.About_sec .Tabside li a:hover, .About_sec .Tabside li a.activeLink {
    border: solid 1px #ff9408;
    background: #ff9408;
    color: #f7f7f7;
}

.About_sec .Tabside .TabImage {
    width: 43.63%;
    float: left;
    position: relative;
}

.About_sec .Tabside .TabImage .img1 {
    position: absolute;
    top: 0px;
    left: 42px;
    height: 260px;
    background: url(../img/about-shadow.png) no-repeat;
    background-position: 25px 223px;
}

.About_sec .Tabside .TabImage .img1 img {
    padding: 5px;
    border: solid 1px #ececec;
    background: #f7f7f7;
}

.About_sec .Tabside .TabImage .img2 {
    position: absolute;
    top: 40px;
    left: 2px;
    height: 260px;
    background: url(../img/about-shadow.png) bottom center no-repeat;
    background-position: 0px 223px;
}

.About_sec .Tabside .TabImage .img2 img {
    padding: 5px;
    border: solid 1px #ececec;
    background: #f7f7f7;
}

.About_sec .Tabside .Description {
    width: 54.3%;
    float: right;
    text-align: left;
    margin-top: -6px;
    padding-bottom: 55px;
    padding-top: 10px;
}

    .About_sec .Tabside .Description h3 {
        font-size: 26px;
        color: #ff9000;
        margin: 0px;
        text-transform: uppercase;
        font-family: 'Open Sans';
        line-height: 29px;
        font-weight: 200;
    }

.About_sec .Tabside .Description h3 span {
    padding-left: 3px;
    font-size: 14px;
    /*color: #ff9000;*/
    color: #000;
    display: block;
}

    .About_sec .Tabside .Description p {
        padding: 24px 0px 24px 0px;
        font-size: 18px;
        color: #636363;
        margin: 0px;
        font-family: 'Open Sans', sans-serif;
        line-height: 25px;
        font-weight: 300;
    }

.About_sec .Tabside .Description p .cyan {
    font-size: 16px;
    color: #08c2ff;
}


/* <<< Services Section >>> */
.Services_sec {
    padding: 80px 0px 90px 0px;
    width: 100%;
    overflow: hidden;
    background: url(../img/Services-bg.jpg) top center no-repeat;
    background-size: cover;
}

.Services_sec .Center {
    max-width: 1200px;
    margin: auto;
    overflow: hidden;
    text-align: center;
}

.Services_sec h2 {
    font-size: 45px;
    color: #f7f7f7;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    margin: 0px;
    /*text-transform: uppercase;*/
    line-height: 60px;
}

.Services_sec p {
    padding: 25px 0px 35px 0px;
    font-size: 14px;
    color: #636363;
    margin: 0px;
    font-family: 'Open Sans', sans-serif;
    line-height: 25px;
    font-weight: 400;
}

.Services_sec .Line {
    border: solid 1px #ff9408;
    height: 2px;
    width: 252px;
    margin: auto;
}

    .Services_sec .left-image {
        position: relative;
        max-width: 800px; /* Maximum width */
        margin: 0 auto; /* Center it */
    }

        .Services_sec .left-image .content {
            position: absolute; /* Position the background text */
            bottom: 0; /* At the bottom. Use top:0 to append it to the top */
            background: rgb(0, 0, 0); /* Fallback color */
            background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
            color: #f1f1f1; /* Grey text */
            width: 100%; /* Full width */
            padding: 10px; /* Some padding */
        }

            .Services_sec .left-image .content p {
                padding: 0px;
                font-size: 18px;
                color: #e6e6e6;
                font-style: italic;
                text-align: justify;
                margin: 0px;
                font-family: 'Open Sans', sans-serif;
                line-height: 25px;
                font-weight: 400;
            }

.Services_sec .nico {
        display: block;
    }

.Services_sec .rightside {
    /*width: 68.36%;
    float: right;*/
    position: relative;
}

    .Services_sec .rightside .text {
        padding: 15px 0px 15px 0px;
        position: absolute;
        /*background: rgba(0, 0, 0, 0.7);*/
    }

    .Services_sec .rightside .text .Lorem {
        float: right;
        /*width: 31%;*/
    }

        .Services_sec .rightside .text .Lorem p {
            /*padding: 0px;
            font-size: 16px;
            color: #f7f7f7;
            font-family: 'Open Sans', sans-serif;
            word-spacing: 2px;
            line-height: 45px;
            font-weight: 300;
            letter-spacing: 0.2px;*/
            padding: 24px 0px 24px 0px;
            font-size: 18px;
            color: #e6e6e6;
            margin: 0px;
            font-family: 'Open Sans', sans-serif;
            line-height: 35px;
            font-weight: 200;
        }



.Services_sec .leftside {
    /*width: 68.36%;
    float: right;*/
    position: relative;
}

    .Services_sec .leftside h4 {
        /*font-size: 22px;
        text-transform: uppercase;
        font-weight: 700;
        margin-top: 0px;
        margin-bottom: 20px;
        color: #636363;*/
        padding-bottom: 15px;
        font-size: 25px;
        color: #ff9000;
        margin: 0px;
        text-transform: uppercase;
        font-family: 'Open Sans';
        line-height: 29px;
        font-weight: 200;
    }

    .Services_sec .leftside .bx-wrapper {
        position: relative;
        z-index: 1;
    }

    .Services_sec .leftside ul {
        list-style: none;
        margin: 0px;
    }

    .Services_sec .leftside li {
        padding: 0px;
        margin: 0;
        float: none !important;
    }

    /*.Services_sec .leftside #slider {
        width: 100%;
        float: right;
        position: relative;
        z-index: 1;
    }*/

    .Services_sec .leftside .Slider .text {
        padding: 15px 20px 15px 20px;
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        background: rgba(0, 0, 0, 0.7);
    }

        .Services_sec .leftside .Slider .text .Icon {
            width: 38%;
            float: right;
        }

        .Services_sec .leftside .Slider .text ul {
            list-style: none;
            margin: 0px;
        }

        .Services_sec .leftside .Slider .text li {
            float: left !important;
            padding: 0px 30px 0px 10px;
            margin: 0px;
        }

            .Services_sec .leftside .Slider .text li a {
                display: block;
                font-size: 14px;
                color: #f7f7f7;
                text-decoration: none;
                font-family: 'Open Sans', sans-serif;
                font-weight: 400;
                transition: all 0.3s ease;
            }

            .Services_sec .leftside .Slider .text li:last-child {
                padding: 0px;
            }

            .Services_sec .leftside .Slider .text li:hover a {
                color: #ff9000 !important;
            }

            .Services_sec .leftside .Slider .text li a .fa {
                padding: 13px;
                margin-right: 10px;
                color: #f7f7f7;
                border-radius: 50px;
                border: solid 2px #f7f7f7;
                transition: all 0.3s ease;
            }

            .Services_sec .leftside .Slider .text li:hover a .fa {
                background: #ff9000;
                color: #f7f7f7;
                border: solid 2px #ff9000;
            }

            .Services_sec .leftside .Slider .text li:last-child {
                padding-right: 0px;
                padding-left: 0px;
            }

        .Services_sec .leftside .Slider .text .Lorem {
            float: right;
            /*width: 31%;*/
        }

            .Services_sec .leftside .Slider .text .Lorem p {

                padding: 0px;
                font-size: 18px;
                color: #f7f7f7;
                font-family: 'Open Sans', sans-serif;
                font-weight: 500;
                font-style: italic;
                word-spacing: 3px;
                line-height: 23px;
            }

                .Services_sec .leftside .Slider .text .Lorem p span {
                    font-size: 14px;
                    text-align: left;
                    color: #ff9000;
                    display: block;
                    text-transform: capitalize;
                }

    .Services_sec .leftside .prevBtn {
        width: 42px;
        height: 42px;
        display: block;
        text-indent: -9999px;
        background: url(../img/prev-arrow.png) no-repeat;
        position: absolute;
        top: 213px;
        left: 49px;
        z-index: 1;
        opacity: 0.5;
        transition: opacity 0.3s ease;
    }

        .Services_sec .leftside .prevBtn:hover {
            opacity: 1;
        }

    .Services_sec .leftside .nextBtn {
        width: 42px;
        height: 42px;
        display: block;
        text-indent: -9999px;
        background: url(../img/next-arrow.png) no-repeat;
        position: absolute;
        top: 213px;
        right: 47px;
        z-index: 1;
        opacity: 0.5;
        transition: opacity 0.3s ease;
    }

        .Services_sec .leftside .nextBtn:hover {
            opacity: 1;
        }

.Services_sec .leftside .Shadow {
    position: absolute;
    bottom: -3px;
    left: -25px;
    max-width: none;
}




.what-we-do .tabs li a {
    text-decoration: none;
    color: #121212;
}

    .what-we-do .tabs .active .list-item {
        background-color: #ff9000 !important;
        color: #f7f7f7 !important;
    }

.what-we-do .tabs .active .list-item .icon {
    background-color: #f7f7f7;
}

    .what-we-do .list-item {
        background-color: #f4f4f4;
        text-align: center;
        /*padding: 20px 0px;*/
        padding-top: 1px;
        padding-bottom: 13px;
        margin: 15px 0px;
        transition: all 0.5s;
    }

.what-we-do .list-item .icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    line-height: 90px;
    background-color: transparent;
}

.what-we-do .list-item h4 {
    margin-top: 15px;
    margin-bottom: 0px;
    margin-right: 7px;
    margin-left: 7px;
    font-size: 17px;
    font-weight: 700;
    text-transform: uppercase;
}

.what-we-do .tab-content-services {
    margin-top: 15px;
}

.what-we-do .tab-content-services .right-image img {
    width: 100%;
    overflow: hidden;
}

    .what-we-do .tab-content-services .left-text h4 {
        /*font-size: 22px;
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 0px;
    margin-bottom: 20px;
    color: #636363;*/
        padding-bottom: 15px;
        font-size: 25px;
        color: #ff9000;
        margin: 0px;
        text-transform: uppercase;
        font-family: 'Open Sans';
        line-height: 29px;
        font-weight: 200;
    }

    .what-we-do .tab-content-services .left-text p {
        /*color: #636363;
        padding-top: 0px;
        font-family: 'Open Sans', sans-serif;
        font-size: 15px;
        word-spacing: 2px;*/
        padding: 20px 0px 24px 0px;
        font-size: 18px;
        color: #e6e6e6;
        margin: 0px;
        font-family: 'Open Sans', sans-serif;
        /*line-height: 30px;*/
        font-weight: 200;
    }

.what-we-do .tab-content-services .left-text .primary-button {
    margin-top: 35px;
    margin-bottom: 50px;
}

.tabgroup .text-content {
    background-color: #f7f7f7;
    color: #f7f7f7;
    padding: 25px;
    text-align: left;
    margin-top: -10px;
    margin-left: 10px;
    margin-right: 10px;
    position: relative;
    box-shadow: 0px 0px 10px #cdcdcd;
}

    .tabgroup .text-content h4 {
        font-size: 20px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        color: #121212;
        margin-top: 0px;
        margin-bottom: 15px;
    }

    .tabgroup .text-content span {
        font-size: 13px;
        color: #33c1cf;
    }

    .tabgroup .text-content a {
        font-size: 13px;
        color: #33c1cf;
        text-decoration: none;
    }

    .tabgroup .text-content p {
        margin-top: 17px;
        color: #7a7a7a;
    }

    .tabgroup .text-content .primary-button {
        margin-bottom: 15px;
        margin-top: 30px;
    }

        .tabgroup .text-content .primary-button a {
            color: #f7f7f7;
        }

.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

.section-heading {
    text-align: center;
    margin-top: 80px;
    margin-bottom: 60px;
}

    .section-heading h4 {
        margin-top: 0px;
        font-size: 28px;
        text-transform: uppercase;
        font-weight: 300;
        color: #121212;
    }

    .section-heading p {
        color: #7a7a7a;
        padding: 0px 25%;
    }


/* <<< Client Section >>> */
.Client_sec {
    padding: 80px 0px 40px 0px;
    width: 100%;
    overflow: hidden;
    background: #f5f5f5;
}

    .Client_sec .Center {
        max-width: 1200px;
        margin: auto;
        overflow: hidden;
        text-align: center;
    }

        .Client_sec .Center .col-md-12 {
            padding-top: 20px;
        }

        .Client_sec .Center .col-xs-12 {
            padding-top: 10px;
            padding-left: 0px;
            padding-right: 0px;
        }

        .Client_sec .Center .col-md-3 {
            padding-top: 20px;
        }

        .Client_sec .Center .col-xs-4 {
            padding: 18px 0px;
        }

        .Client_sec .Center .Akzo {
            padding: 27px 0px;
        }

        .Client_sec .Center .Apergy {
            padding: 43px 0px;
        }

        .Client_sec .Center .Arcor {
            padding: 23px 0px;
        }

        .Client_sec .Center .Colorin {
            padding: 45px 0px;
        }

        .Client_sec .Center .Pelco {
            padding: 27px 0px;
        }

        .Client_sec .Center .Kraft {
            padding: 37px 0px;
        }

        .Client_sec .Center .Puratos {
            padding: 16px 0px;
        }

        .Client_sec .Center .Crispino {
            padding: 15px 0px;
        }

        .Client_sec .Center .Pepsico {
            padding: 30px 0px;
        }

        .Client_sec .Center .Pulverlux {
            padding: 28px 0px;
        }

        .Client_sec .Center .Siemens {
            padding: 60px 0px;
        }

        .Client_sec .Center .Tipci {
            padding: 63px 0px;
        }

        .Client_sec .Center .Sika {
            padding: 1px 0px;
        }

        .Client_sec .Center .SKF {
            padding: 54px 0px;
        }

        .Client_sec .Center .Tradimex {
            padding: 20px 0px;
        }

        .Client_sec .Center .Uffenheimer {
            padding: 20px 0px;
        }

        .Client_sec .Center .Wenlen {
            padding: 22px 0px;
        }

    .Client_sec h2 {
        font-size: 45px;
        color: #000;
        font-family: 'Oswald', sans-serif;
        font-weight: 400;
        margin: 0px;
        /*text-transform: uppercase;*/
        line-height: 60px;
    }

    .Client_sec p {
        padding: 24px 0px 24px 0px;
        font-size: 20px;
        color: #636363;
        margin: 0px;
        font-family: 'Open Sans', sans-serif;
        line-height: 25px;
        font-weight: 300;
        word-spacing: 2px;
    }

    .Client_sec .Line {
        border: solid 1px #ff9408;
        height: 2px;
        width: 252px;
        margin: auto;
    }

    .Client_sec .Clientside {
        padding: 75px 0px 0px 0px;
        width: 100%;
        overflow: hidden;
        text-align: initial;
    }

        .Client_sec .Clientside ul {
            list-style: none;
            margin: 0px;
        }

        .Client_sec .Clientside li {
            float: none;
            padding: 0px;
            margin: 0px 0px 11px 0px;
            height: 103px;
            background: #f7f7f7;
            text-align: center;
        }

            .Client_sec .Clientside li .Basic {
                width: 55px;
                float: left;
                display: table;
                height: 103px;
                background: #ff9408;
                transition: all ease 0.3s;
            }

                .Client_sec .Clientside li .Basic h5 {
                    display: table-cell;
                    vertical-align: middle;
                    font-size: 17px;
                    color: #2d2d2d;
                    font-family: 'Oswald', sans-serif;
                    font-weight: 400;
                    text-transform: uppercase;
                    margin: 0px;
                    -webkit-transform: rotate(270deg);
                    -moz-transform: rotate(270deg);
                    -o-transform: rotate(270deg);
                    -ms-transform: rotate(270deg);
                    transform: rotate(270deg);
                    clear: none;
                    text-align: center;
                }

            .Client_sec .Clientside li .Dollar {
                padding: 22px 0px 21px 0px;
                width: 205px;
                float: left;
                background: #2d2d2d;
                transition: all ease 0.3s;
            }

                .Client_sec .Clientside li .Dollar h2 {
                    font-size: 34px;
                    color: #ff9408;
                    font-family: 'Oswald', sans-serif;
                    font-weight: 400;
                    letter-spacing: 1px;
                }

            .Client_sec .Clientside li .Band {
                padding: 1px 30px;
                width: 173px;
                float: left;
                background: url(../img/divider.png) right 16px no-repeat;
                transition: all 0.3s ease;
            }

                .Client_sec .Clientside li .Band p {
                    font-size: 16px;
                    color: #636363;
                    margin: 0px;
                    font-family: 'Oswald', sans-serif;
                    font-weight: 400;
                    text-transform: uppercase;
                    line-height: 20px;
                }

                    .Client_sec .Clientside li .Band p span {
                        display: block;
                    }

                .Client_sec .Clientside li .Band.last {
                    background: none;
                }

            .Client_sec .Clientside li .Order {
                width: 147px;
                float: left;
                display: table;
                height: 103px;
            }

                .Client_sec .Clientside li .Order a {
                    font-size: 17px;
                    color: #f7f7f7;
                    font-family: 'Oswald', sans-serif;
                    font-weight: 400;
                    text-decoration: none;
                    display: table-cell;
                    vertical-align: middle;
                    text-transform: uppercase;
                    background: #2d2d2d;
                }

            .Client_sec .Clientside li:hover .Basic {
                padding: 0px;
                background: #2d2d2d;
            }

                .Client_sec .Clientside li:hover .Basic h5 {
                    color: #f7f7f7;
                }

            .Client_sec .Clientside li:hover .Band {
                padding: 0px;
                background: #2d2d2d url(../img/divider-black.png) right 16px no-repeat;
                height: 103px;
            }

                .Client_sec .Clientside li:hover .Band p {
                    color: #f7f7f7;
                }

            .Client_sec .Clientside li:hover .Dollar {
                background: #ff9408;
                color: #f7f7f7;
            }

                .Client_sec .Clientside li:hover .Dollar h2 {
                    color: #f7f7f7;
                }

            .Client_sec .Clientside li:hover .Order a {
                background: #ff9408;
                color: #f7f7f7;
                transition: all 0.3s ease;
            }



/* <<< Saturno Section >>> */
.Saturno_sec {
    padding: 80px 0px 60px 0px;
    width: 100%;
    overflow: hidden;
    background: url(../img/Services-bg.jpg) top center no-repeat;
    background-size: cover;
}

    .Saturno_sec .Center {
        max-width: 1200px;
        margin: auto;
        overflow: hidden;
        text-align: center;
    }

    .Saturno_sec h2 {
        font-size: 45px;
        color: #f7f7f7;
        font-family: 'Oswald', sans-serif;
        font-weight: 400;
        margin: 0px;
        /*text-transform: uppercase;*/
        line-height: 60px;
    }

    .Saturno_sec .left-text {
        text-align: left;
    }

        .Saturno_sec .left-text p {
            padding: 30px 0px 0px 0px;
            font-size: 18px;
            color: #e6e6e6;
            margin: 0px;
            font-family: 'Open Sans', sans-serif;
            line-height: 25px;
            font-weight: 300;
/*            margin-right: -35px;*/
        }

    .Saturno_sec .Center .Sat_Login {
        text-align: center;
        padding: 0px 0px 24px 0px;
        font-size: 20px;
        color: #636363;
/*        margin: 0px 70px;*/
        font-family: 'Open Sans', sans-serif;
        line-height: 25px;
        font-weight: 300;
        word-spacing: 2px;
    }

        .Saturno_sec .Center .Sat_Login .button:hover {
            background: #2d2d2d;
            color: #f7f7f7;
        }

        .Saturno_sec .Center .Sat_Login .button {
            padding: 13px 40px;
            /*border-radius: 5px;*/
            font-family: 'Open Sans', sans-serif;
            font-size: 14px;
            font-weight: 400;
            letter-spacing: 1px;
            /*margin-top: -3px;*/
            color: #e9ecee;
            font-family: 'Open Sans', sans-serif;
            /*font-weight: 700;*/
            text-align: center;
            background: #ea5b0c;
            border: 0px;
            text-transform: uppercase;
            width: 100%;
            cursor: pointer;
            box-shadow: 0px 2px 6px 0px #242424;
            -webkit-box-shadow: 0px 2px 6px 0px #242424;
            -moz-box-shadow: 0px 2px 6px 0px #242424;
            -o-box-shadow: 0px 2px 6px 0px #242424;
            border-radius: 0px;
            transition: all 0.3s ease;
        }

    .Saturno_sec p {
        padding: 24px 0px 30px 0px;
        font-size: 20px;
        color: #e6e6e6;
        margin: 0px;
        font-family: 'Open Sans', sans-serif;
         line-height: 25px; 
        font-weight: 300;
    }

    .Saturno_sec .Line {
        border: solid 1px #ff9408;
        height: 2px;
        width: 252px;
        margin: auto;
    }

    .Saturno_sec .right-image {
        padding: 20px 0px;
        margin-top: 35px;
        /*margin-left: 70px;
        margin-right: 70px;*/
        background: #f7f7f7;
    }



/* <<< Contact Section >>> */
.Contact_sec {
    padding: 80px 0px 0px 0px;
    width: 100%;
    overflow: hidden;
    background: #f5f5f5;
}

.Contact_sec .Contactside {
    overflow: hidden;
}

.Contact_sec .Center {
    max-width: 1200px;
    margin: auto;
    overflow: hidden;
    text-align: center;
}

    .Contact_sec h2 {
        font-size: 45px;
        color: #000;
        font-family: 'Oswald', sans-serif;
        font-weight: 400;
        margin: 0px;
        /*text-transform: uppercase;*/
        line-height: 60px;
    }

    .Contact_sec p {
        padding: 24px 0px 24px 0px;
        font-size: 20px;
        color: #636363;
        margin: 0px;
        font-family: 'Open Sans', sans-serif;
        line-height: 25px;
        font-weight: 300;
        word-spacing: 2px;
    }



.Contact_sec .Line {
    border: solid 1px #ff9408;
    height: 2px;
    width: 252px;
    margin: auto;
}

.Contact_sec .Pricingside {
    padding: 70px 0px 10px 0px;
    width: 100%;
    overflow: hidden;
    text-align: initial;
}

/* <<< Get Section >>> */
.Get_sec {
    width: 100%;
    overflow: hidden;
}

    .Get_sec .Mid {
        padding: 25px 0px 35px 0px;
        overflow: hidden;
        background: url(../img/Services-bg.jpg) top center no-repeat;
        background-size: cover;
    }

    .Get_sec .far {
        padding: 6px 10px 6px 0;
    }

.Get_sec .Leftside fieldset {
    padding: 0px;
    margin: 0px;
}

.Get_sec .Leftside p {
    padding: 0px;
    margin: 0px 0px 15px 0px;
}

    .Get_sec .Leftside input.field {
        padding: 2px 5px 2px 5px;
        font-size: 13px;
        color: #636363;
        font-family: 'Open Sans', sans-serif;
        font-weight: 400;
        border: 0px;
        width: 100%;
        box-shadow: 0px 2px 6px 0px #242424;
        -webkit-box-shadow: 0px 2px 6px 0px #242424;
        -moz-box-shadow: 0px 2px 6px 0px #242424;
        -o-box-shadow: 0px 2px 6px 0px #242424;
        border-radius: 0px;
    }

.Get_sec .Leftside input:focus {
    outline: none;
}

    .Get_sec .Leftside textarea {
        padding: 2px 5px 2px 5px;
        font-size: 13px;
        color: #636363;
        font-family: 'Open Sans', sans-serif;
        font-weight: 400;
        border: 0px;
        width: 100%;
        height: 156px;
        resize: none;
        box-shadow: 0px 2px 6px 0px #242424;
        -webkit-box-shadow: 0px 2px 6px 0px #242424;
        -moz-box-shadow: 0px 2px 6px 0px #242424;
        -o-box-shadow: 0px 2px 6px 0px #242424;
        border-radius: 0px;
    }

.Get_sec .Leftside textarea:focus {
    outline: none;
}

        .Get_sec .Leftside .button {
            padding: 16px 0px 17px 0px;
            margin-top: -3px;
            font-size: 14px;
            color: #e9ecee;
            font-family: 'Open Sans', sans-serif;
            font-weight: 700;
            text-align: center;
            background: #f88e04;
            border: 0px;
            text-transform: uppercase;
            width: 100%;
            cursor: pointer;
            box-shadow: 0px 2px 6px 0px #242424;
            -webkit-box-shadow: 0px 2px 6px 0px #242424;
            -moz-box-shadow: 0px 2px 6px 0px #242424;
            -o-box-shadow: 0px 2px 6px 0px #242424;
            border-radius: 0px;
            transition: all 0.3s ease;
        }

.Get_sec .Leftside .button:hover {
    background: #2d2d2d;
    color: #f7f7f7;
}

.Get_sec .Rightside {
    width: 48.18%;
    float: right;

}

.Get_sec .Rightside h3 {
    padding-bottom: 44px;
    font-size: 34px;
    color: #f88e04;
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
    margin: 0px;
    text-transform: uppercase;
    line-height: 46px;
}

    .Get_sec .Rightside address {
        padding: 0px 0px 27px 45px;
        margin-left: 3px;
        background: url(../img/location-icn.png) left 4px no-repeat;
        font-size: 18px;
        color: #e6e6e6;
        margin: 0px;
        font-family: 'Open Sans', sans-serif;
        line-height: 25px;
        font-weight: 300;
    }

.Get_sec .Rightside address.Number {
    background: url(../img/phone-icn.png) left 5px no-repeat;
}

.Get_sec .Rightside address.Email {
    margin-left: 4px;
    background: url(../img/mail-icn.png) left 0px no-repeat;
}

    .Get_sec .Rightside address.Email a {
        text-decoration: none;
        color: #e6e6e6;
    }

.Get_sec .Rightside address.Email a:Hover {
    color: #f88e04;
}

.Get_sec .Rightside ul {
    list-style: none;
    margin: 0px;
    padding: 27px 0px 0px 3px;
}

.Get_sec .Rightside li {
    float: left;
    padding: 0px;
    margin: 0px 22px 0px 0px;
}

.Get_sec .Rightside li a {
    text-decoration: none;
}

/* <<< footer >>> */
footer {
    overflow: hidden;
    width: 100%;
    text-align: center;
    background: rgba(0, 0, 0, 0.6);
}

footer .Cntr {
    padding: 10px 0px;
    max-width: 1200px;
    margin: auto;
}

    footer .Cntr p {
        padding: 0px;
        font-size: 13px;
        color: #e6e6e6;
        font-family: 'Open Sans';
        margin: 0px;
    }

    footer .Cntr a {
        color: #e6e6e6;
        text-decoration: none;
    }

footer .Cntr a:hover {
    color: #f7f7f7;
}


.modal-body {
    font-size: 16px !important;
}


#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #3498db;
    -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    z-index: 1001;
}

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #e74c3c;
        -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #f9c922;
        -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    }

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
        transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
    }

    100% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
        transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
        transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
    }

    100% {
        -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
        transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
    }
}

#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #222222;
    z-index: 1000;
    -webkit-transform: translateX(0); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
    transform: translateX(0); /* Firefox 16+, IE 10+, Opera */
}

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }

/* Loaded */
.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
    transform: translateX(-100%); /* Firefox 16+, IE 10+, Opera */
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
    transform: translateX(100%); /* Firefox 16+, IE 10+, Opera */
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader {
    opacity: 0;
    transition: all 0.3s ease-out;
}

.loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%); /* Chrome, Opera 15+, Safari 3.1+ */ /* IE 9 */
    transform: translateY(-100%); /* Firefox 16+, IE 10+, Opera */
    transition: all 0.3s 1s ease-out;
}

/* JavaScript Turned Off */
.no-js #loader-wrapper {
    display: none;
}
