@charset "utf-8";
/* CSS Document */
html{font-family:'Open Sans',sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;color:#003878;font-size:14px;line-height:1.5;scroll-behavior:smooth}
body{width:100%;margin:0;background-image:url("../image/template/bg.png");background-repeat:repeat;}

.container{margin-right:auto;margin-left:auto}
.container:before,.container:after{display:table;content:" "}
.container:after{clear:both}

@media(min-width:304px){
.container{width:288px}}
@media(min-width:576px){
.container{width:560px}}
@media(min-width:768px){
.container{width:752px}}
@media(min-width:992px){
.container{width:976px}}
@media(min-width:1200px){
.container{width:1184px}}

.row{margin-right:0px;margin-left:0px;width:100%}

.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-or-1,.col-or-10,.col-or-11,.col-or-12,.col-or-2,.col-or-3,.col-or-4,.col-or-5,.col-or-6,.col-or-7,.col-or-8,.col-or-9{position:relative;min-height:1px}

.col-or-1,.col-or-10,.col-or-11,.col-or-12,.col-or-2,.col-or-3,.col-or-4,.col-or-5,.col-or-6,.col-or-7,.col-or-8,.col-or-9{float:left}
.col-or-12{width:100%}
.col-or-11{width:91.66666667%}
.col-or-10{width:83.33333333%}
.col-or-9{width:75%}
.col-or-8{width:66.66666667%}
.col-or-7{width:58.33333333%}
.col-or-6{width:50%}
.col-or-5{width:41.66666667%}
.col-or-4{width:33.33333333%}
.col-or-3{width:25%}
.col-or-2{width:16.66666667%}
.col-or-1{width:8.33333333%}

@media (min-width:304px){
.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{float:left}
.col-12{width:100%}
.col-11{width:100%}
.col-10{width:100%}
.col-9{width:100%}
.col-8{width:100%}
.col-7{width:100%}
.col-6{width:100%}
.col-5{width:100%}
.col-4{width:100%}
.col-3{width:100%}
.col-2{width:50%}
.col-1{width:100%}
}

@media (min-width:576px){
.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{float:left}
.col-12{width:100%}
.col-11{width:100%}
.col-10{width:100%}
.col-9{width:100%}
.col-8{width:100%}
.col-7{width:100%}
.col-6{width:50%}
.col-5{width:50%}
.col-4{width:50%}
.col-3{width:50%}
.col-2{width:50%}
.col-1{width:100%}
}

@media (min-width:768px){
.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{float:left}
.col-12{width:100%}
.col-11{width:91.66666667%}
.col-10{width:83.33333333%}
.col-9{width:75%}
.col-8{width:66.66666667%}
.col-7{width:58.33333333%}
.col-6{width:50%}
.col-5{width:41.66666667%}
.col-4{width:33.33333333%}
.col-3{width:25%}
.col-2{width:16.66666667%}
.col-1{width:8.33333333%}
}

@media (min-width:992px){
.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{float:left}
.col-12{width:100%}
.col-11{width:91.66666667%}
.col-10{width:83.33333333%}
.col-9{width:75%}
.col-8{width:66.66666667%}
.col-7{width:58.33333333%}
.col-6{width:50%}
.col-5{width:41.66666667%}
.col-4{width:33.33333333%}
.col-3{width:25%}
.col-2{width:16.66666667%}
.col-1{width:8.33333333%}
}

@media (min-width:1200px){
.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9{float:left}
.col-12{width:100%}
.col-11{width:91.66666667%}
.col-10{width:83.33333333%}
.col-9{width:75%}
.col-8{width:66.66666667%}
.col-7{width:58.33333333%}
.col-6{width:50%}
.col-5{width:41.66666667%}
.col-4{width:33.33333333%}
.col-3{width:25%}
.col-2{width:16.66666667%}
.col-1{width:8.33333333%}
}
/*******************************************************************************END OF GRID****************************************************************************/
@media (max-width:767px){
  .mobile-hidden{display: none;}
}
@media (min-width:768px){
  .desktop-hidden{display: none;}
}
.m-button{position: relative;}
.m-text{position: absolute;left: 20%; top: 22%;z-index: 10000}
.m-rounding-border{-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;-khtml-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;margin:5px auto;border:1px solid #003878;overflow:hidden;background-color: #FFFFFF}

a,h1,h2,h3,h4,h5{color:#003878;text-decoration:none;margin:0px;padding:0px}
h1{font-size:20px;line-height:32px;font-weight:bold}
h2{font-size:20px;line-height:30px;font-weight:bold}
@media (max-width:767px){
  h2{font-size:14px;line-height:30px;font-weight:bold}
}
h3{font-size:21px;color:#FFF;line-height:24px;font-weight:300}
h4{font-size:15px;line-height:20px;font-weight:normal}
h5{font-size:15px;line-height:18px}
p{font-size:15px;line-height:18px}
hr{border: 0.5px solid #003878; width:95%; margin:15px auto ;}

.banner {
 width: 100%;
      max-width: 1200px;
      margin: 20px auto;
      overflow: hidden;
      border-radius: 10px;
      box-shadow: none;
    }
    .banner img {
      width: 100%;
      display: block;
    }

.img-responsive{display:block;max-width:100%;height:auto}
.head_bg{background-image:url("../image/template/header.jpg");background-position:bottom center;background-repeat:no-repeat;background-size:cover;-webkit-border-radius: 5px 50px 5px 5px;-moz-border-radius: 5px 50px 5px 5px;-khtml-border-radius: 5px 50px 5px 5px;border-radius: 5px 50px 5px 5px;margin:25px auto;border:1px solid #003878;overflow:hidden}
.top_menu{overflow:hidden;background-color:#003878;padding-left:35px}
.top_menu a{float:left;display:block;color:#FFF;text-align:center;font-size:14px;padding:10px 20px 10px 20px;text-decoration:none}
.top_menu a:hover{background-color:#FFFFFF;color:#003878;padding:10px 20px 10px 20px;}
.top_menu .icon{display: none;}
@media (max-width:991px){
.top_menu .hidden-menu{display: none;}
}
@media screen and (max-width: 767px){
.top_menu a:not(:first-child){display:none;}
.top_menu a.icon{float:right;display:block}
}
@media screen and (max-width: 767px){
.top_menu.responsive{position:relative;}
.top_menu.responsive .icon{position:absolute;right: 0;top: 0;}
.top_menu.responsive a{float:none;display:block;text-align:left;}
}
.rounding-border{-border-radius: 5px 5px 5px 5px;-moz-border-radius: 5px 5px 5px 5px;-khtml-border-radius: 5px 5px 5px 5px;border-radius: 5px 5px 5px 5px;margin:25px auto;border:1px solid #003878;overflow:hidden;background-color: #FFFFFF}
#refine-new{margin:10px 0px;}
#refine-new img{height:150px; width:150px; margin-top:20px;}
#refine{margin:10px 0px;}
#refine img{height:100px; width:100px; margin-top:20px;}
.refine-link{margin:5px 0px 25px 0px;color:#003878;font-weight:bold;}

.contact-form {border:none;}
.contact-form input[type=text], textarea{font-family:arial;border-radius: 5px;border:1px solid #003878;background-color: #FFFFFF; padding:10px; margin:5px; width: 88%;}
.contact-form input[type=submit] {border-radius: 5px;border:1px solid #003878;background-color: #003878; padding:10px; margin:0px 5px 25px 5px; width: 91%;color:#FFFFFF;}
.contact-form label{float:left;margin-left:40px;margin-right:40px;color:#F00}

/***************************************************************************BEGIN TOP BUTTON**************************************************************************/
#TopBtn,.category_zoom{position:fixed;z-index:99}
#TopBtn{background-color:#061496}
#TopBtn{display:none;bottom:20px;right:30px;border:1px solid #FFF;outline:0;color:#FFF;cursor:pointer;padding:15px;border-radius:10px}
@media (max-width:768px){
#TopBtn{display:none;bottom:0px;left:0px;width:100%;border:none;outline:0;color:#FFF;cursor:pointer;padding:15px;border-radius:0px;box-shadow:-1px -1px 7px grey}
}
/*******************************************************************************FOOTER*******************************************************************************/
#footer{background-color:transparent;margin:10px 0px;padding:10px 0px;color:#003878}
#footer a{color:#003878;text-decoration:underline}
#footer a:hover{font-weight:bold;text-decoration: none;}
@media (max-width:768px){
#footer{margin-bottom:45px}
}