header {position: fixed;left: 0;top: 0;z-index: 1010;width: 100%;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
header.scrol .top-header-bar {padding: 0;display: none;}
header.ptt-menu.scrol {background: rgba(0, 0, 0, 0.75); padding: 0;}
header.ptt-menu.scrol nav > ul > li > a {padding: 10px 15px;color: #fff;}
header.ptt-menu.scrol .logo {margin-top: 8px;color: #fff;}

nav {float: right;color: #fff;padding-top: 4px;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;}
nav a, nav a:focus {color: #fff;}
nav > ul > li {position: relative;float: left;margin-left: 5px;font-size: 12px;font-weight: 700;line-height: 16px;text-transform: uppercase;}
nav > ul > li > a {position: relative;display: block;padding: 7px 15px;-moz-border-radius: 4px;border-radius: 4px;margin-bottom: 2px;}
nav > ul > li > a > span {padding-left: 5px;}
nav > ul > li > .dropmenu {visibility: hidden;opacity: 0;transform: translateY(10%);-webkit-transform: translateY(10%);-moz-transform: translateY(10%);-ms-transform: translateY(10%);position: absolute;top: 32px;left: 0%;min-width: 178px;background: #fff;-moz-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.1);box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.1);transition: all 0.35s ease-out;-webkit-transition: all 0.35s ease-out;-moz-transition: all 0.35s ease-out;-ms-transition: all 0.35s ease-out;}
nav > ul > li:hover > .dropmenu {visibility: visible;opacity: 1;transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0);}
nav .dropmenu a {display: block;font-family: 'Open Sans', sans-serif;font-size: 11px;line-height: 18px;font-weight: 400;color: #888;letter-spacing: 0.5px;padding: 10px 20px 10px 15px;border-bottom: 1px solid #eee;}
nav .dropmenu li {position: relative;}
nav .dropmenu li:hover > a {background: #fafafa;}

.logo {position: relative;float: left;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
.dropmenu {transition: all 0.3s ease-in-out;}
.menu_opened {overflow: hidden;}

.top-header-bar .left-col a, .ptt-menu .top-header-bar .left-col a {
    color: #000;
}
.top-header-bar-index .right-col .folow a, .ptt-menu .top-header-bar-index .left-col a {
    color: #fff;
}

.left-col {position: relative;float: left;width: 50%;}
.left-col a {font-size: 16px;color: #fff;padding: 20px 12px;position: relative;float: left;display: block;}
.left-col a:hover {background: rgba(0, 0, 0, 0.4);}
.left-col a i {padding-right: 10px;}
.right-col {position: relative;float: left;width: 50%;}
.right-col .folow {float: right;position: relative;display: block;}
.right-col .folow a {font-size: 24px;line-height: 24px;padding: 17px 0;position: relative;float: left;display: block;width: 60px;text-align: center;}
.right-col .folow a:hover {background: rgba(0, 0, 0, 0.4);}

.nav {padding: 30px 0 30px;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
.top-header-bar {position: relative;width: 100%;padding: 30px 0 0;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
.top-header-bar .left-col {padding-left: 0;margin-left: -10px;}
.top-header-bar .right-col {display: flex;align-items: center;justify-content: flex-end;padding-right: 20px;}

.nav-menu-icon {position: relative;float: right;width: 24px;height: 24px;z-index: 200;margin-right: 0;margin-top: 4px;display: none;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;z-index: 99;}

.nav-menu-icon span {display: inline-block;width: 24px;height: 24px;cursor: pointer;text-decoration: none;}
.nav-menu-icon span i {position: relative;display: inline-block;width: 24px;height: 3px;color: #000;font: bold 14px/.4 Helvetica;text-transform: uppercase;text-indent: -55px;background: #222;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;}
.nav-menu-icon span i:before, .nav-menu-icon span i:after {content: '';width: 24px;height: 3px;background: #222;position: absolute;left: 0;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;-o-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
.nav-menu-icon span i:before {top: -7px;}
.nav-menu-icon span i:after {bottom: -7px;}
.scrol .nav-menu-icon span i, .nav-menu-icon.logo-white span i,
.scrol .nav-menu-icon span i:before, .scrol .nav-menu-icon span i:after,
.nav-menu-icon.logo-white span i:before, .nav-menu-icon.logo-white span i:after{
    background: #fff;
}

/*.nav-menu-icon a:hover i:before {top: -10px;}*/
/*.nav-menu-icon a:hover i:after {bottom: -10px;}*/
/*.nav-menu-icon a.active i:before {top: 0;-webkit-transform: rotateZ(45deg);-moz-transform: rotateZ(45deg);-ms-transform: rotateZ(45deg);-o-transform: rotateZ(45deg);transform: rotateZ(45deg);}*/
/*.nav-menu-icon a.active i:after {bottom: 0;-webkit-transform: rotateZ(-45deg);-moz-transform: rotateZ(-45deg);-ms-transform: rotateZ(-45deg);-o-transform: rotateZ(-45deg);transform: rotateZ(-45deg);}*/

.ptt-menu {background: none;}
.ptt-menu .nav {padding: 0;position: relative;}
.ptt-menu nav {padding-top: 0;}
.ptt-menu nav > ul > li {padding: 14px 10px;text-align: center;border-top: 4px solid rgba(255, 255, 255, 0);margin-top: -1px;margin-left: 0;font-size: 12px;font-weight: 300;transition: all 0.35s ease-in;-webkit-transition: all 0.35s ease-in;-moz-transition: all 0.35s ease-in;-ms-transition: all 0.35s ease-in;}
.ptt-menu nav > ul > li:hover {border-top: 3px solid #ff6600;}
.ptt-menu nav > ul > li.active {border-top: 3px solid #ff6600;}
.ptt-menu nav > ul > li > a .fa {display: none;}
.ptt-menu nav > ul > li > a {color: #222;font-weight: 400;}
.ptt-menu nav > ul > li > a {padding: 25px 15px;}
.ptt-menu nav > ul > li.active > a {color: #ff6600;}
.ptt-menu nav > ul > li:hover > a {background: none;color: #ff6600;}
.ptt-menu nav.logo-white > ul > li:hover > a {background: none;color: rgba(255, 255, 255, 0.5);}
.ptt-menu nav > ul > li > .dropmenu {top: 100%;text-align: left;border-top: 2px solid #ff6600;}
.ptt-menu .logo {margin-top: 10px;}

.ptt-menu .left-col a {padding: 20px 15px;font-size: 14px;}
.ptt-menu .right-col .folow a {font-size: 16px;padding: 18px 0;}

.ptt-menu nav > ul > li > a {color: #222;}
.ptt-menu nav.logo-white > ul > li > a {color: #fff;}

.ptt-menu .top-header-bar, .ptt-menu .top-header-bar-index {background: none;padding: 0;}
.ptt-menu .top-header-bar {
    border-bottom: 1px solid rgba(214, 214, 214, 0.46);
}
.top-header-bar a {
    padding: 20px 12px !important;
}
.ptt-menu .top-header-bar-index {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.ptt-menu .top-header-bar .left-col a {line-height: 24px;padding-top: 30px;padding-bottom: 26px;}
.ptt-menu .logo {margin-top: 16px;}
.ptt-menu .right-col .folow a {padding: 30px 0 26px;}

.left-col a {font-size: 14px;}
.right-col .folow a {font-size: 16px;}
.ptt-menu .logo {display: flex;align-items: center;text-transform: uppercase;color: #000;font-size: 20px;font-family: "Roboto Condensed", sans-serif;font-weight: 700;}
.ptt-menu .logo.logo-white {color: #fff;}
.ptt-menu .logo > img {height: 40px;width: auto;display: block;margin: 0 12px;}
.ptt-menu .logo > span {letter-spacing: 3px;}

.ptt-menu .top-header-bar .left-col a.top-phone {font-size: 20px;line-height: 24px;}
.nav-menu-logo-bg, .nav-menu-icon-name {display: none;}
@media (max-width: 1199px) {
    nav > ul > li {margin-left: 0;}
}

@media (max-width: 992px) {
    body.menu_opened .ptt-menu .nav-menu-icon {top: 4px; right: 16px;}
    body.menu_opened .ptt-menu .logo {
        z-index: 100;color: #000;
    }
    body.menu_opened header.ptt-menu.scrol .logo {color: #000;}

    header.ptt-menu nav > ul > li {margin-top: 0;padding-left: 5px;padding-right: 5px;}
    header.ptt-menu .nav-menu-icon {margin-top: 16px;}

    header.ptt-menu .top-header-bar {padding: 0;display: inline-block;width: auto;position: absolute;right: 15%;top: 50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);border: none;z-index: 10;}
    header.ptt-menu .top-header-bar > .container {width: auto;}
    header.ptt-menu.scrol .nav-menu-icon a i, header.ptt-menu.scrol .nav-menu-icon a i:before, header.ptt-menu.scrol .nav-menu-icon a i:after {background: #fff;}
    header.ptt-menu.scrol {background: rgba(0, 0, 0, 0.75);}
    header.ptt-menu.scrol nav > ul > li > a {padding: 10px 15px;color: #fff;}
    header.scrol .top-header-bar {padding: 0;}
    header.ptt-menu.scrol .logo {margin-top: 6px;top: auto;color: #fff;}
    header.ptt-menu .nav-menu-icon a.active i {background: #fff;}
    header.ptt-menu .nav-menu-icon a.active i:before, header.ptt-menu .nav-menu-icon a.active i:after {background: #222;}

    header .nav-menu-icon a i, header .nav-menu-icon a i:before, header .nav-menu-icon a i:after {background: #222;}
    header .nav-menu-icon.logo-white a i, header .nav-menu-icon.logo-white a i:before, header .nav-menu-icon.logo-white a i:after {background: #fff;}
    header.scrol .nav-menu-icon a i, header.scrol .nav-menu-icon a i:before, header.scrol .nav-menu-icon a i:after {background: #fff;}

    header .nav-menu-icon a.active i {background: none;}

    nav > ul > li {margin: 0;float: none;}
    nav {position: fixed;width: 100%;height: 100%;background: #333;left: 0;top: 0;padding-top: 100px;text-align: center;-webkit-transform: translateY(-100%);-moz-transform: translateY(-100%);-ms-transform: translateY(-100%);-o-transform: translateY(-100%);transform: translateY(-100%);overflow: hidden;}
    nav > ul > li {width: 100%;font-size: 16px;margin: 5px 0;font-weight: 400;}
    nav > ul > li:hover > .dropmenu {position: relative;}
    nav > ul > li > .dropmenu {position: relative;top: 0;margin-top: 0;padding: 0;display: none;visibility: visible;opacity: 1;transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0);}
    nav > ul > li > a {border-radius: 0;margin-bottom: 0;}
    nav > ul > li > a > span {float: none;position: relative;display: inline-block;}
    nav.slide-menu {-webkit-transform: translateY(0%);-moz-transform: translateY(0%);-ms-transform: translateY(0%);-o-transform: translateY(0%);transform: translateY(0%);overflow-y: auto;}
    nav li .dropmenu a {padding: 15px 10px 15px 30px;}

    .ptt-menu .logo {margin-top: 5px;}
    .ptt-menu nav {background: #fff;}
    .ptt-menu nav > ul > li {padding: 0;border-top: 0 none; text-align: left;margin-bottom: 0;}
    .ptt-menu nav > ul > li:hover { border-top: 0;}
    /*.ptt-menu nav > ul > li.active {border-top: 0 none !important;}*/
    .ptt-menu nav > ul > li > a {color: #222 !important;}
    .ptt-menu nav > ul > li > a .fa {display: inline-block;color: #222;}
    .ptt-menu nav > ul > li > .dropmenu {transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0);}
    .ptt-menu .nav {height: 60px;}
    .ptt-menu .menu > ul {padding: 60px 0;}
    .nav-menu-icon {display: block;}
    .top-header-bar .left-col {display: none;}
    .top-header-bar .right-col {width: auto;}
    .right-col .folow {display: none;}
    .ptt-menu .logo {margin-top: 6px;}
    .menu_opened .nav-menu-icon {position: fixed;top: 80px;right: 25px;}
}

@media (max-width: 767px) {
    .nav-menu-icon {z-index: 99;}
    .top-header-bar {display: none;}
    .ptt-menu nav > ul > li > a {padding: 15px 15px;}

}
@media (max-width: 480px) {
    header.ptt-menu .top-header-bar {right: 11%;}
    .ptt-menu .logo {font-size: 16px;}
    .ptt-menu .logo img {height: 35px;margin: 0 8px;}
    .ptt-menu nav > ul > li > a .fa.hidden-lg {font-size: 14px;position: absolute;left: 10px;}
    .ptt-menu nav > ul > li:hover > a {
        background-color: #fff;
    }
    .ptt-menu nav > ul > li > a, header.ptt-menu.scrol nav > ul > li > a {
        position: relative;
        padding: 15px 15px 15px 35px;
        background-color: #fff;
        z-index: 2;
    }
    .ptt-menu nav > ul > li {
        overflow: hidden;
    }

    .ptt-menu nav > ul > li .dropmenu {
        -o-transition: all 0.2s ease-out;transition: all 0.2s ease-in;-webkit-transition: all 0.2s ease-out;
        -moz-transition: all 0.2s ease-out;-ms-transition: all 0.2s ease-out;
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
        overflow: hidden;
        height: 0;
        display: block;
        margin: 0 5px;
        box-shadow: none;
    }
    .ptt-menu nav > ul > li.active .dropmenu {
        -webkit-transform: translateY(0%);-moz-transform: translateY(0%);
        -ms-transform: translateY(0%);-o-transform: translateY(0%);transform: translateY(0%);overflow-y: auto;
        height: inherit;
        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.1);
    }
    .menu_opened .nav-menu-logo-bg {display: block;
        background-color: #ffffff;
        height: 60px;
        z-index: 1;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
    }
    .nav-menu-icon-name {
        display: inline-block;
        position: absolute;
        font-size: 16px;
        top: 2px;
        right: 30px;
        color: #222;
    }
    .logo-white .nav-menu-icon-name, .scrol .nav-menu-icon-name {
        color: #fff;
    }
}

/* -> for loading */
.loading {background-color: #fff;height: 100%;width: 100%;position: fixed;z-index: 5000;margin-top: 0;top: 0;left: 0;overflow: hidden;}
.loading-center {width: 100%;height: 100%;position: relative;}
.loading-center-absolute {position: absolute;left: 50%;top: 50%;height: 200px;width: 200px;margin-top: -100px;margin-left: -100px;-ms-transform: rotate(-135deg);-webkit-transform: rotate(-135deg);-moz-transform: rotate(-135deg);-o-transform: rotate(-135deg);transform: rotate(-135deg);-ms-transform: rotate(-135deg);}
.object {-moz-border-radius: 50% 50% 50% 50%;border-radius: 50% 50% 50% 50%;position: absolute;border-top: 5px solid #ff6600;border-bottom: 5px solid transparent;border-left: 5px solid #ff6600;border-right: 5px solid transparent;-webkit-animation: animate 2s infinite;-o-animation: animate 2s infinite;animation: animate 2s infinite;-moz-animation: animate 2s infinite;-ms-animation: animate 2s infinite;}
.object_one {left: 75px;top: 75px;width: 50px;height: 50px;}
.object_two {left: 65px;top: 65px;width: 70px;height: 70px;-webkit-animation-delay: 0.2s;-o-animation-delay: 0.2s;animation-delay: 0.2s;-moz-animation-delay: 0.2s;-ms-animation-delay: 0.2s;}
.object_three {left: 55px;top: 55px;width: 90px;height: 90px;-webkit-animation-delay: 0.4s;-o-animation-delay: 0.4s;animation-delay: 0.4s;-moz-animation-delay: 0.4s;-ms-animation-delay: 0.4s;}
.object_four {left: 45px;top: 45px;width: 110px;height: 110px;-webkit-animation-delay: 0.6s;-o-animation-delay: 0.6s;animation-delay: 0.6s;-moz-animation-delay: 0.6s;-ms-animation-delay: 0.6s;}
@-webkit-keyframes animate {
    50% {-ms-transform: rotate(360deg) scale(0.8);-webkit-transform: rotate(360deg) scale(0.8);transform: rotate(360deg) scale(0.8);}
}
@-moz-keyframes animate {
    50% {-ms-transform: rotate(360deg) scale(0.8);-webkit-transform: rotate(360deg) scale(0.8);transform: rotate(360deg) scale(0.8);-moz-transform: rotate(360deg) scale(0.8);}
}
@-o-keyframes animate {
    50% {-ms-transform: rotate(360deg) scale(0.8);-webkit-transform: rotate(360deg) scale(0.8);-o-transform: rotate(360deg) scale(0.8);transform: rotate(360deg) scale(0.8);}
}
@keyframes animate {
    50% {-ms-transform: rotate(360deg) scale(0.8);-webkit-transform: rotate(360deg) scale(0.8);-moz-transform: rotate(360deg) scale(0.8);-o-transform: rotate(360deg) scale(0.8);transform: rotate(360deg) scale(0.8);}
}
/* -> for loading */