﻿/*font*/

.font-main-TH
{
    font-family: "Kittithada",Arial,Helvetica,sans-serif;
}
.font-main-EN
{
    font-family: Arial,Helvetica,sans-serif;
}
.font-main-TH-B
{
    font-family: "KittithadaBold",Arial,Helvetica,sans-serif;
}

/**************/
hr.line {
    padding: 0;
    border: 1px solid;
    color: #333;
    text-align: center;
}

  .cover-title .one {
    position: relative;
  }  
  .cover-title .one:before {
    content: "";
    display: block;
    border-top: solid 1px #0072ce;
    width: 100%;
    height: 1px;
    position: absolute;
    top: 50%;
    z-index: 1;
    text-align:center;
  }  
  .cover-title .one  span {
    background-color: #0072ce;
    padding: 0 20px;
    position: relative;
    z-index: 5;
    color: #FFF;
    border-radius:3px;    
  }
  .cover-title
  {
    margin-left: auto;
    margin-right: auto;
    text-align:center;
    width:80%;
    margin-bottom:20px;
    margin-top:20px;
  }
.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}
.col-xs-15 {
    width: 100%;
    float: left;
}
@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

.col-border {
    /*background: none repeat scroll 0 0 #c0d4b6;
    border: 1px solid #aaa;*/
    text-align: center;
}
.col-border img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
/*---For Store---*/





/*---For button---*/
.btn-orange {
    background-color: #ff9900;
    border-color: #eea236;
    color: #fff;
    font-size:18px;
}
.btn-orange.active, .btn-orange.focus, .btn-orange:active, .btn-orange:focus, .btn-orange:hover, .open > .dropdown-toggle.btn-orange {
    background-color: #ff9900;
    border-color: #d58512;
    color: #fff;
}
.btn-orange.active, .btn-orange:active, .open > .dropdown-toggle.btn-orange {
    background-image: none;
}
.btn-orange.disabled, .btn-orange.disabled.active, .btn-orange.disabled.focus, .btn-orange.disabled:active, .btn-orange.disabled:focus, .btn-orange.disabled:hover, .btn-orange[disabled], .btn-orange.active[disabled], .btn-orange.focus[disabled], .btn-orange[disabled]:active, .btn-orange[disabled]:focus, .btn-orange[disabled]:hover, fieldset[disabled] .btn-orange, fieldset[disabled] .btn-orange.active, fieldset[disabled] .btn-orange.focus, fieldset[disabled] .btn-orange:active, fieldset[disabled] .btn-orange:focus, fieldset[disabled] .btn-orange:hover {
    background-color: #f0ad4e;
    border-color: #eea236;
}
.btn-orange .badge {
    background-color: #fff;
    color: #f0ad4e;
}

.btn-white {
    background-color: #ffffff;
    border-color: #7a7a7a;
    color: #7a7a7a;
    font-size:18px;
}
.btn-white.active, .btn-white.focus, .btn-white:active, .btn-white:focus, .btn-white:hover, .open > .dropdown-toggle.btn-white {
    background-color: #a0a0a0;
    border-color: #7a7a7a;
    color: #fff;
}
.btn-white.active, .btn-white:active, .open > .dropdown-toggle.btn-white {
    background-image: none;
}
.btn-white.disabled, .btn-white.disabled.active, .btn-white.disabled.focus, .btn-white.disabled:active, .btn-white.disabled:focus, .btn-white.disabled:hover, .btn-white[disabled], .btn-white.active[disabled], .btn-white.focus[disabled], .btn-white[disabled]:active, .btn-white[disabled]:focus, .btn-white[disabled]:hover, fieldset[disabled] .btn-white, fieldset[disabled] .btn-white.active, fieldset[disabled] .btn-white.focus, fieldset[disabled] .btn-white:active, fieldset[disabled] .btn-white:focus, fieldset[disabled] .btn-white:hover {
    background-color: #ffffff;
    border-color: #7a7a7a;
}
.btn-white .badge {
    background-color: #fff;
    color: #7a7a7a;
}





/**For top menu***/
.second-main-menu {
    background-color: #4373b3;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    float: left;
    left: 0;
    list-style: outside none none;
    min-width: 990px;
    padding-top: 3px;
    padding-left:10px;
    position: absolute;
    text-align: left;
    top: 100%;
    z-index: 1000;
    
}
.second-main-menu li
{  
  position: relative;
  display: table-cell;
  
  color: #FFF; 
  font-size: 16pt;
}
.second-main-menu-sub,.third-menu-sub
{
    padding-left:15px;
    padding-right:15px;    
}

.second-main-menu li a
{
    color:#FFF;    
    line-height:16px; 
}
.second-main-menu li a:hover
{
    color:#37b4eb;    
    line-height:16px; 
    text-decoration:none;
}
.second-main-menu li a img
{
    margin-top:-3px;
}
.second-box
{
    width:57%;
    text-align:right;    
}
@media screen and (max-width: 767px) 
{

    .second-box
    {
        width:37%;
        text-align:right;   
        border:1px solid white; 
    }
    /*.search-box
    {
        margin-top:5px;
        width:200px;  
        margin-left:200px;
        height:30px;
        border:1px solid yellow;
    }*/
}
@media (max-device-width: 480px) and (orientation: landscape) 
{

    .second-box
    {
        width:20%;
        text-align:right;
        border:1px solid blue;    
    }
    /*.search-box
    {
        margin-top:5px;
        width:150px;  
        margin-left:200px;
        height:30px;
        border:1px solid red;
      
    }*/

}

.float-right
{
   padding-right:5px;
}
#menu-active
{
   color:#37b4eb;
}
li .third-main-menu 
{
    margin-left:0px;
}
.third-main-menu {
    background-color: #fff;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    float: left;
    list-style: outside none none;
    min-width: 990px;
    padding-top: 3px;
    padding-left:10px;
    position: absolute;
    text-align: left;
    top: 100%;
    z-index: 1000;
    left: -10px;
}

.third-main-menu li
{  
  position: relative;
  display: table-cell;
  color: #5f5f5f; 
  font-size: 16pt;
}
.third-main-menu li a
{
    color:#5f5f5f;    
    line-height:16px; 
}
/*start hover menu*/
.second-main-menu ul {
    _margin: 0; /*IE6 only*/
    opacity: 0;
    visibility: hidden;
    position: absolute;
    left: -10;
    z-index: 1;    
    background: #fff;   
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176); 
    transition: all .4s ease-in-out;
    list-style: outside none none;
}

.second-main-menu li:hover > ul {
    opacity: 1;
    visibility: visible;
    margin: 0;
}

.second-main-menu ul ul {
    top: 0;
    left: 10px;
    margin: 0 0 0 20px;
    _margin: 0; /*IE6 only*/    
}

.second-main-menu ul li {
    float: none;
    /*display: block;
    border: 0;*/
    _line-height: 0; /*IE6 only*/
}

.second-main-menu ul li:last-child {   
    box-shadow: none;    
}

.second-main-menu ul a {    
    padding: 10px 3px 10px 3px;
    _height: 10px; /*IE6 only*/
    display: block;
    white-space: nowrap;
    float: none;
    text-transform: none;
}

.second-main-menu ul a:hover 
{
    color:#37b4eb; 
}
.second-main-menu ul li:first-child a {
    border-radius: 5px 5px 0 0;
}

.second-sub1 ul li:first-child a:after {
    content: '';
    position: absolute;
    left: 30px;
    top: -5px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 10px solid #4373b3;
}

.second-sub1 ul li:first-child a:hover:after {
    border-bottom-color: #fff; 
}

.second-sub1 ul li:last-child a {
    border-radius: 0 0 5px 5px;
}
/**/

.third-body {
    background-color: #fff;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    float: left;
    left: 149px;
    list-style: outside none none;
    min-width: 990px;
    padding-left: 10px;
    padding-top: 3px;
    position: absolute;
    text-align: left;
    top: -1px;
    z-index: 1000
}
.third-body li
{  
  position: relative;
  display: table-cell;
  color: #5f5f5f; 
  font-size: 16pt;
}
.third-body li a
{
    color:#5f5f5f;    
    line-height:16px; 
}












/* Clear floated elements */
.second-main-menu:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
/**inputbox**/
.form-control-input {
    background-color: #fff;
    background-image: none;
    
    border: 1px solid #000;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555;
    display: block;
    font-size: 14pt;
    height: 30px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
    font-family:"Kittithada",Arial,Helvetica,sans-serif;
}
.form-control-input:focus {
    border-color: #66afe9;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6);
    outline: 0 none;
}
.form-control-input::-moz-placeholder {
    color: #999;
    opacity: 1;
}
.form-control-input[disabled], .form-control-input[readonly], fieldset[disabled] .form-control-input {
    background-color: #eee;
    cursor: not-allowed;
    opacity: 1;
}
.search-box
{
    /*margin-top:5px;*/
    width:auto;  
    /*margin-left:249px;*/
   /* height:30px;*/
   margin-left:10px;
      
}
.top-5{
    margin-top:5px;
}
.icon-search
{
    content:url("../Images/icon/search.png"); 
}
.icon-close
{
    content:url("../Images/icon/icon-close.png"); 
}
.icon-close::before {
    content:url("../Images/icon/icon-close.png");
}
/**margin left*/
.margin-left-15
{
    margin-left:15px;
}
/**margin right*/
.margin-right-20
{
    margin-right:20px;    
}
.margin-right-10
{
    margin-right:10px;    
}
.third-sub2
{
    left:-108px;        
}

.second-sub2 ul li:first-child a:after {
    content: '';
    position: absolute;
    left: 130px;
    top: -5px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 10px solid #4373b3;
}

.second-sub2 ul li:first-child a:hover:after {
    border-bottom-color: #fff; 
}

.second-sub2 ul li:last-child a {
    border-radius: 0 0 5px 5px;
}
.nav-search
{
    width:300px;
}


.back-border
{
    border:1px solid #333; 
    background-color:#FFF;
    
}
.border-left-none
{
    border-right:none;   
}

@media (min-width: 768px) {/*@screen-md-min*/
   
    .search-bar input
    {
        display:none;
    }
    .nav-set
    {
        margin-top:70px;   
    }
    .search-box
    {
        width:200px;    
    }
    /*.navbar-nav > li > .dropdown-menu {       
        min-width:720px;        
        display:block;
    }*/
	.second-bar
	{
		top:6px;		
		font-size:20px;
	}
}
 @media (min-width: 992px) /*large*/
 {/*@screen-md-min*/
	.second-bar
	{
		top:6px;
		
		font-size:20px;
	}
    .second
    {
        display:block; 
        background-color:#4373b3;/*5183c5;*/
        z-index:10;
        
    }
    .nav-set
    {
        margin-top:0px;   
    }
    .search-box
    {
        width:auto;    
    }
    /*.navbar-nav > li > .dropdown-menu {
       min-width:795px;
        display:block;
		position:absolute;
    }*/
}  

@media (min-width: 1200px) /*large*/
 {/*@screen-md-min*/
    
	.second-bar
	{
		top:8px;
		font-size:22px;
	}
	/*.navbar-nav > li > .dropdown-menu {
       
        min-width:990px;
        display:block;
		position:absolute;
    }*/
}
.second-bar
{
	text-align:right;
	height: auto;
	position:relative;
	overflow: hidden;
	width:auto;
	z-index:1000;
	color:#373737;
	
	padding-right:5px;
}



.menu-sub-open
{
    background: none repeat scroll 0 0 #4877b6;
    display: none;
    left: 0;
    position: absolute;
    width: 100%;
}