﻿/*CSS CHUNG*/
body {
    background:#fff;
}

.container {
    max-width: 1400px;
    background: #fff;
    padding: 0;
}
.container-fluid{
    background: #fff;
}
.max-width-container-fluid{max-width:1400px;}
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.loading {
	position:fixed;
    left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 9998;
}
.loading .loading1{position:absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
    background:#d3cfcf;
    opacity:0.2;}
.loading i{position:absolute;left:50%;top:50%;color:#e91414; opacity:2;z-index: 10000;}
img{max-width: 100%;
    height: auto;}
.langa{margin-right:0px;}
.langa img{border:1px solid #f3f1f1;}
h1{
    font-size:30px;
}
h2, h3 {
    font-size: 16px;
    margin-top: 20px;
    margin-bottom: 10px;
}

a:hover {
    text-decoration: none !important;
    color: #e91414;
}

.divtop {
    background: #fff;
    border-top: 1px solid #5FB0E4;
}

.fix-padding {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.margin-0 {
    margin: 0px;
}

.padding-0 {
    padding: 0px;
}
.padding-5{padding:5px;}
.padding-10{
    padding:10px;
}
.header {
    background: #fff;
    margin: 10px 0 10px 0;
}
#pnl_Control_Register_News {
    margin-top: 15px;
}
.Title_Register_News {
    background: #e91414;
    padding: 10px 0 10px 0;
    text-align: center;
    color: #fff;
    font-weight: bold;
}
.Title_Register_News_Horizonal {
    background: #e91414;
    padding: 5px 0 5px 0;
    text-align: center;
    color: #fff;
    font-weight: bold;
}
.PostShort {
    border-bottom: 1px solid #ddd;
}

.margin10 {
    margin-bottom: 10px;
    margin-right: 10px;
}

.postCol {
    border: 1px solid #ff6a00;
    border-radius: 5px;
    margin-bottom: 10px;
    padding: 10px;
}
.BrandOther{margin-bottom:10px; margin-top:10px;}

.GroupTitle {
    /*background: #ff6a00;*/
    margin-top: 10px;
    margin-bottom: 5px;
    padding: 10px;
    /*border-radius: 5px;*/
    color: #000;
    font-weight: bold;
    text-transform:uppercase;
    font-size:25px;
    text-align:center;
}
.GroupTitlechild{
    background: #ff6a00;
     padding: 10px;
    color: #fff;
    font-weight: bold;
    text-transform:uppercase;
    font-size:17px;
    text-align:left;
}
.title_header {
    margin-top: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 10px;
    color: #ff6a00;
    border-top: solid 1px #ff6a00;
    background: #f1eded;
}

/********list inline***********/
.custom-list {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
}

.custom-list-item > span {
    vertical-align: middle;
    padding-left: 3px;
}

.round_icon {
    width: 10px;
    height: 10px;
    min-width: 10px;
    min-height: 10px;
    border-radius: 10px;
    display: inline-block;
}
/******************************/
.otto {
    font-family: 'Myriad Pro', Helvetica, Arial sans-serif;
    font-weight: bold;
    color: #ff6a00;
    text-shadow: 0 2px 0 #be1c0c, 0px 2px 5px rgba(0,0,0,0.5);
}
.margin-left {
    margin: 0 5px 0 5px;
}
/********************Breadcrumb*******************************/
.breadcrumb {
    margin: 15px 5px 10px 5px;
}

    .breadcrumb li a {
        color: #4d4a4a;
        font-size: 13px;
    }

    .breadcrumb > li + li::before {
        color: #99999f;
        content: ">>";
    }
/*****************************End Breadcrumb********************************/
/***********************Product List Item*********************/
.card{border:0px;}
.card-product:after {
    content: "";
    display: table;
    clear: both;
    visibility: hidden;
}

.card-product .img-wrap {
    border-radius: 3px 3px 0 0;
    overflow: hidden;
    height: 220px;
    text-align: center;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

    .card-product .img-wrap img {
        max-height: 100%;
        max-width: 100%;
        object-fit: cover;
    }

.card-product .info-wrap {
    overflow: hidden;
    padding: 15px;
    border-top: 1px solid #eee;
}

.card-product .action-wrap {
    padding-top: 4px;
    margin-top: 4px;
}

.card-product .bottom-wrap {
    padding: 15px;
    border-top: 1px solid #eee;
}

.card-product .title {
    margin-top: 0;
    text-align:center;
}
/***********************End Product List**********************/
/********************menu*******************************/
   
/*.bg-light1 {
    background-color: #f37e20 !important;
    box-shadow: 0px 0.5px 4px #c3c2c2;}

.bg-light {
    background-color: #f58320 !important;
}

.navbar-light .navbar-nav .nav-link {
    padding: 5px;
    color: #fff;
    font-weight: 500;
    text-transform:uppercase;
    font-size:18px;
}
.nav-link:hover {
    background: #fff;
}


*/
.bg-light1 {
    background-color: #f37e20 !important;
    box-shadow: 0px 0.5px 4px #c3c2c2;
    }
.navbar{background:#f37e20; padding : 0.1em; }
.navbar-dark .navbar-nav .nav-link{color:#fff; border-radius:0;}
.nav-item::after{content:'';display:block;width:0px;height:2px;background:#fff;transition: 0.2s;}
.nav-item:hover::after{width:100%;}
.nav-item::after:active{width:100%;}
/*.navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show > .nav-link,.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover{color:#000;}*/
.nav-link{padding:10px 10px;transition:0.2s; color:#fff !important; font-size:20px; border-radius:0;}
.dropdown-item.active, .dropdown-item:active{color:#fff;}
.dropdown-item:focus, .dropdown-item:hover{background:#fff;}
.nav-item .nav-link.active{
    background: none !important ;
    color: #070000 !important;
    border-bottom:2px #fff solid;
    cursor:text;
    font-weight:500;
}
/************************End menu******************************/
/*************************Footer*************************/
.Footer {
    font-size: 14px;
    width: 100%;
    background: #005da4;
    color: #fff;
    padding: 20px 0px 0px 0px;
}

    .Footer h2 {
        font-size: 16px !important;
        margin: 0px;
        color: #fff;
    }

    .Footer span {
        font-weight: bold;
    }

    .Footer a {
        color: #fff;
    }
    .Footer a:hover{color:#f7eb04;}


.Title_Footer {
    padding: 10px 0 10px 0;
    text-align: left;
    color: #fff;
    font-weight: bold;
    font-size:18px;
}
/***********************End Footer*****************************/
.link_Social {
    color: #ff6a00;
}

    .link_Social:hover {
        color: #fff;
    }

.pnl_Control_Brand_Distributor {
    margin-top: 10px;
}
/**************************col-5*************************/
.col-2, /*extra small*/
.col-sm-2, /*small*/
.col-md-2, /*medium*/
.col-lg-2, /*large*/
.col-xl-2 { /*extra large*/
    position: relative;
    min-height: 1px;
}

.col-2dot4, /*extra small*/
.col-sm-2dot4, /*small*/
.col-md-2dot4, /*medium*/
.col-lg-2dot4, /*large*/
.col-xl-2dot4 { /*extra large*/
    position: relative;
    width: 50%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.col-2dot4 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}

.col-2dot7, /*extra small*/
.col-sm-2dot8, /*small*/
.col-md-2dot8, /*medium*/
.col-lg-2dot8, /*large*/
.col-xl-2dot8 { /*extra large*/
    position: relative;
    width: 50%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.col-2dot8 {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 14.28%;
    flex: 0 0 14.28%;
    max-width: 14.28%;
}
/*****************************Banner Slide*********************/
.carousel {
    background: #005da4;
    width: 100%;
}

.carousel-inner {
    padding: 0px;
}

.slide-box {
    display: flex;
    justify-content: space-between;
}

ol {
    margin: 0;
}

.carousel-caption {
    position: absolute;
    right:60%;
    left: 8%;
    top:20%;
    z-index: 10;
    padding:10px;
    text-align: left;
    background: rgba(195, 192, 192,.4);
    color: #000;
    font-size:20px;
    border-radius:10px;
}

    .carousel-caption h5 {
        text-align:center;
        font-size:30px;
       /* text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb,0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,0.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,0.3), 0 3px 5px rgba(0,0,0,0.2), 0 5px 10px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.2), 0 20px 20px rgba(0,0,0,0.15);*/
    }
    .carousel-control-next, .carousel-control-prev{width:5%;}
/**********************End Banner Slide************************/
/*******************RESPONSIVE***********************************/
@media (min-width: 300px) {
    .col-sm-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-sm-2dot8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
        flex: 0 0 12.5%;
        max-width: 12.5%;
    }

    #pnl_Control_Banner_slide {
        display: none;
    }

    .otto {
        font-size: 17px;
        text-align: center;
        line-height: 15px;
    }

    .aligncenter {
        clear: both;
        display: block;
        margin: 0 auto;
        width: 200px;
    }

    pnl_Control_Brand_Distributor div {
        margin-bottom: 5px;
    }
}
/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .col-sm-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-sm-2dot8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
        flex: 0 0 12.5%;
        max-width: 12.5%;
    }

    #pnl_Control_Banner_slide {
        display: none;
    }

    .otto {
        font-size: 2em;
        text-align: center;
        line-height: 75px;
    }

    .carousel-inner .active.left {
        left: -100%;
    }

    .carousel-inner .next {
        left: 100%;
    }

    .carousel-inner .prev {
        left: -100%;
    }

    .active > div {
        display: none;
    }

        .active > div:first-child {
            display: block;
        }
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    .col-md-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-md-2dot8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
        flex: 0 0 12.5%;
        max-width: 12.5%;
    }

    #pnl_Control_Banner_slide {
        display: block;
    }

    .otto {
        font-size: 2em;
        text-align: left;
        line-height: 75px;
    }

    .carousel-inner .active.left {
        left: -33.3%;
    }

    .carousel-inner .next {
        left: 33.3%;
    }

    .carousel-inner .prev {
        left: -33.3%;
    }

    .active > div:first-child {
        display: block;
    }

        .active > div:first-child + div {
            display: block;
        }

    .active > div:last-child {
        display: none;
    }
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .container {
        max-width: 1400px;
    }

    .col-lg-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-lg-2dot8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
        flex: 0 0 12.5%;
        max-width: 12.5%;
    }

    #pnl_Control_Banner_slide {
        display: block;
    }

    .otto {
        font-size: 2em;
        text-align: left;
        line-height: 75px;
    }

    .carousel-inner .active.left {
        left: -25%;
    }

    .carousel-inner .next {
        left: 25%;
    }

    .carousel-inner .prev {
        left: -25%;
    }
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .container {
        max-width: 1400px;
    }

    .col-xl-2dot4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-xl-2dot8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 12.5%;
        flex: 0 0 12.5%;
        max-width: 12.5%;
    }

    #pnl_Control_Banner_slide {
        display: block;
    }

    .otto {
        font-size: 28px;
        text-align: left;
        line-height: 75px;
    }
}
/**************END RESPONSIVE****************************************************/
.carousel-control-next,
.carousel-control-prev {
    filter: invert(100%);
}

/***************hover Box**************************/
/*********************** Demo - 1 *******************/
.box21{overflow:hidden}
.mt-30{margin-top:30px}
.mt-40{margin-top:40px}
.mb-30{margin-bottom:30px}

/*********************** Demo - 21 *******************/
.box21{text-align:center;position:relative; border:1px solid #f0f0f0}
.box21:after,.box21:before{content:"";width:2px;height:2px;border-radius:50%;background:rgba(0,0,0,.6);position:absolute;top:50%;left:50%;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0)}
.box21:hover:after{-webkit-transform:scale(400);-moz-transform:scale(400);-ms-transform:scale(400);-o-transform:scale(400);transform:scale(400)}
.box21:before{-o-transition:all .5s linear .3s;-moz-transition:all .5s linear .3s;-ms-transition:all .5s linear .3s;-webkit-transition:all .5s linear .3s;transition:all .5s linear .3s}
.box21:hover:before{-moz-transition-delay:0s;-webkit-transition-delay:0s;-o-transition-delay:0s;-ms-transition-delay:0s;transition-delay:0s}
.box21:after{-o-transition:all .2s linear .3s;-moz-transition:all .2s linear .3s;-ms-transition:all .2s linear .3s;-webkit-transition:all .2s linear .3s;transition:all .2s linear .3s}
.box21:hover:after{-moz-transition-delay:.2s;-webkit-transition-delay:.2s;-o-transition-delay:.2s;-ms-transition-delay:.2s;transition-delay:.2s}
.box21 img{width:100%;height:auto}
.box21 .box-content{width:100%;height:100%;position:absolute;top:0;left:0;background:0 0;color:#fff;padding-top:25px;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-ms-transition:all .3s linear 0s;-o-transition:all .3s linear 0s;-webkit-transition:all .3s linear 0s;-moz-transition:all .3s linear 0s;transition:all .3s linear 0s;z-index:1}
.box21:hover .box-content{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-moz-transition-delay:.4s;-webkit-transition-delay:.4s;-o-transition-delay:.4s;-ms-transition-delay:.4s;transition-delay:.4s}
.box21 .title{font-size:20px;font-weight:500;text-transform:uppercase;padding-bottom:15px;padding-top:15px; padding-left:5px; padding-right:5px;}
.box21 .description{font-size:14px;font-style:italic;padding:0 10px;margin:15px 0}
.box21 .read-more{display:block;width:120px;background:#005da3;border-radius:5px;font-size:14px;color:#fff;text-transform:capitalize;padding:10px 0;margin:0 auto}
@media only screen and (max-width:990px){.box21{margin-bottom:0px}
}
@media only screen and (max-width:479px){.box21 .box-content{padding-top:0}
}
@media only screen and (max-width:359px){.box21 .title{padding-bottom:0px}
}
/***********************css 404***********************/
.mainMessage{
        font-family: 'Viga', sans-serif;
}
.mainMessage h1{
    font-size: 13em;
    color: #ff6a00;
	margin:0.4em 0 0;
    line-height: 1;
}
.mainMessage h2{
	font-size: 1em;
    color: #ff6a00;
    text-transform: capitalize;
}
.mainMessage .more_w3ls {
    margin: 3em 0 5em;
}
.mainMessage .more_w3ls a{
	padding: 8px 70px;
    background:#61DDF0;
    text-decoration: none;
    color: #212121;
    font-size: 1em;
    text-transform: uppercase;
	transition:.5s ease-in;
	-webkit-transition:.5s ease-in;
	-moz-transition:.5s ease-in;
	-o-transition:.5s ease-in;
	-ms-transition:.5s ease-in;
}
.mainMessage .more_w3ls a:hover{
	background:#fff;
	color:#212121;
}
.form-group{
    margin-bottom:5px;
}
.g-recaptcha-outer{
    text-align: center;
    width: 100%;
    margin-bottom:5px;
}
.g-recaptcha-inner{
    width: 140px;
    height:50px;
    overflow: hidden;
    margin: 0 auto;
}
.g-recaptcha{
    position:relative;
    left: -2px;
    top: -1px;
}


.tns-outer {
  position: relative;
}
[data-controls] {
  border: 0;
  padding: 0;
  font-size: 30px;
  position: absolute;
  top: 50%;
  margin-top: -18px;
  z-index: 1;
  background: transparent;
}
[data-controls="prev"] {
  left: 20px;
}
[data-controls="next"] {
  right: 20px;
}
table td{padding:10px;}
