body
{
    font-family: Arial, Tahoma, Helvetica, sans-serif, SimSun;
    font-size: 12px; 
    color: White;
}

#desk {margin-top: 6px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px}

.fieldValidator
{
    font-size: medium;
    font-weight: normal;
    color: #FF3300;
}


.inputSoft {
        width: 100%;
        padding: 0.53333333em 0.8em;
        -moz-box-shadow: inset 0 0.06666666666666667em 0 rgba(0, 0, 0, 0.1) , inset 0 0.06666666666666667em 0.06666666666666667em rgba(0, 0, 0, 0.05);
        -webkit-box-shadow: inset 0 0.06666666666666667em 0 rgba(0, 0, 0, 0.1) , inset 0 0.06666666666666667em 0.06666666666666667em rgba(0, 0, 0, 0.05);
        box-shadow: inset 0 0.06666666666666667em 0 rgba(0, 0, 0, 0.1) , inset 0 0.06666666666666667em 0.06666666666666667em rgba(0, 0, 0, 0.05);
        -webkit-border-radius: 0.2em;
        -moz-border-radius: 0.2em;
        -o-border-radius: 0.2em;
        border-radius: 0.2em;
        border: 1px solid transparent;
        border-color: #858585 #c2c2c2 #c2c2c2;
        background: #fff;
        cursor: text;
        color: #1f1f1f;
}


input.btn-action, a.btn-action, a.btn-action:visited 
{
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    font-family: "Helvetica Neue",Arial,"Lucida Grande",sans-serif;
    
    border-color: #d4a900 #aa8700 #aa8700;
    background: #ffbe00;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #ffbe00), color-stop(100%, #ffcb00));
    background: -webkit-linear-gradient(bottom, #ffbe00 0%, #ffcb00 100%);
    background: -moz-linear-gradient(bottom, #ffbe00 0%, #ffcb00 100%);
    background: -ms-linear-gradient(bottom, #ffbe00 0%, #ffcb00 100%);
    background: linear-gradient(bottom, #ffbe00 0%, #ffcb00 100%);
    color: #3d3100;
    
    display: inline-block;
    position: relative;
    margin: 1.41176471em 1.41176471em 0 0;
    border: 1px solid transparent;
    border-width: 1px 1px 2px;
    -webkit-border-radius: 0.23529412em;
    -moz-border-radius: 0.23529412em;
    -o-border-radius: 0.23529412em;
    border-radius: 0.23529412em;
    padding: 0;
    font-size: 1em;
    line-height: 1.45;
    font-weight: bold;
    cursor: pointer;    
}

/*input[type="button"], input[type="submit"], input[type="reset"], input[type="file"]::-webkit-file-upload-button, button {
text-align: center;
cursor: default;
color: buttontext;
padding: 2px 6px 3px;
border: 2px outset buttonface;
}*/

.hrseperate
{
    visibility: hidden;
    margin-top: -3px;
}

.inputfd
{
    font-size: 16px;
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 3px;
    borderwidth: 1px;
    width: 95%;
    min-width: 100px;
    height: 30px;
}

.inputDate
{
    font-size: 16px;
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 3px;
    borderwidth: 1px;
    width: 95%;
    min-width: 100px;
    height: 30px;
}


.firstDateInput
{
    font-size: 16px;
    width: 95%;
    min-width: 100px;
    padding: 3px;
    borderwidth: 1px;    
    height: 30px;

}

.inputSelect
{
     font-size: 12px;
    padding: 3px;
    borderwidth: 1px;    
    height: 30px;

}


 

/************************************************************************************
STRUCTURE
*************************************************************************************/

#mobileheader{display: none; width:95%; margin: auto 0px auto 0px; height:38px}
#mobileheader td{width:25%}    

.divFlt
{
    width: 90%;
    display: table;
    margin: auto 4% auto 6%; /*    min-width: 300px;*/
}

#oneWay{width:48%}
#rangeOfDate{width:96%}

.divFltTitle
{
    color: #808080;  
    font-weight: bold;
    padding-left: 2px;
    padding-bottom: 5px;
    padding-top: 5px;
    margin: 8px auto 0px 0;
    width: 100%;
}
    
#tbFrom, #tbTo
{
    font-size: 16px;
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 3px;  
    width: 95%;
    min-width: 100px;
    height: 30px;
    borderwidth: 1px;
}


.divReturnDate
{
    width: 50%;
    min-width: 100px;
    float: left;
    margin: 8px auto 8px auto;
}

.divPax
{
    width: 50%;
    float: left;
    font-size: 12px;
    margin: 8px auto 8px auto;    

}

.divPax1
{
    width: 33%;
    float: left;
}
    
    
#Adt, #Inf, #Kid
{
    font-size: 16px;
    width: 80%;
}   
    
   
.imgPax
{
    vertical-align: middle;
    display: none;
}

.divFrom
{
    width: 50%;
    min-width: 210px;
    float: left;
    margin: 8px auto 8px auto;
}
.divTo
{
    width: 50%;
    min-width: 210px;
    float: left;
    margin: 8px auto 8px auto;
}

.divDepDate
{
    width: 50%;
    min-width: 100px;
    float: left;
    margin: 8px auto 8px auto;
}

.divCabin
{
    float: left;
    width: 50%;
    min-width: 210px;
    margin: 8px auto 8px auto;
}

.divRangeDate
{
    float: left;
    width: 50%;
    min-width: 210px;
    margin: 14px auto 2px auto;
}

.divAirline
{
    float: left;
    width: 50%;
    min-width: 210px;
    margin: 8px auto 8px auto;
}

#ckNonStop, #ckNearbyAirport, #ckExactAirport, #btSubmit
{
    margin: 8px auto 8px auto;
}

.divFlt label[for=ckNonStop]
{
    margin-left: 10px;
    color: White; 
}

.divFlt label[for=ckNearbyAirport],.divFlt label[for=ckExactAirport]
{
    margin-left: 10px;
    color: White; 
}
.radiobuttonlist
{
    font: 12px Verdana, sans-serif;
    line-height:40px;
    display: inline-table ;/*block will not allow td length equal*/
    margin-left:-1px;
    padding-left:0px;
    /*width:50%;*/
    
    /*table-layout: fixed;*/
    
    /*RepeatLayout=flow;   use this to make tab connected together wihtout gap */
}
 
.radiobuttonlist input
{
    width: 0px;
    height: 0px;
    margin-left:0px;
    padding-left:0px;
    background-color:transparent;
    display: none;
   
}

.radiobuttonlist label
{
    color: white;
    text-align:center;
    display: block; /* make it to fill whole td */
    width:100%;
    height:100%;
    border: 0px;
    white-space: nowrap;
    clear: left;
    font-size: 14px;
    
}

.radiobuttonlist td
{
    color: white;
    background-color: rgba(107,107,107,0.54);
    border-color: rgba(107,107,107,0.54);
    margin:auto 0 auto 0;
    border:0;
    border-spacing:0;
    border-radius: .166667em;
    /*width:25%;

     overflow: hidden;*/
    
}
/*
used for server side code
.radiobuttonlist span.selectedradio label
{
    background-color: #006699;
    font-weight: bold; 
}
.radiobuttonlist label:hover
{
    background: #D1CFC2;  
}*/


/*.divLanSel{ display: none; margin-left:35px}*/

#M1, #M2, #M3{display:none}

.divPaxMsg{ display: none; height:30px; width:100%; padding-top:45px; font-size: medium}

/*#advanceOpt{display:block}
.divAdvanceToggle{display:none}*/
.divFltFont{ color: White; font-size: medium;}


@media screen and (max-width: 674px) 
{
    /*#advanceOpt{display:none}
    .divAdvanceToggle{display:block} */
      
    #desk {margin-left: auto; margin-right: auto; display:block;}
    
    .divFlt { width: 98%; margin:auto auto auto auto; display:table;  }
    
    .divFrom, .divTo{width:100%}      
    #tbFrom, #tbTo{width:100%}
    .inputfd{width:100%}
   
   .inputDate{width:95%}   
   .divDepDate, .divReturnDate{width:50%}
   #RetDate{margin-left:5%}
   
   .divPax, .divRangeDate, .divCabin, .divAirline {        width: 100%;    }
   
   
    #oneWay{width:100%}
    #rangeOfDate{width:100%}
   
   
    .divFrom,  .divTo, .divRangeDate, .divCabin, .divAirline
    {
        margin: 4px auto 4px auto;
    }
    
    .divReturnDate, .divDepDate
    {
        margin-bottom: 8px auto 4px auto;
    }
    
    .divPax
    {
        margin: 6px auto 4px auto;   
    }
   
    body
    {
        color: black;
    } 
    
    .divFlt label[for=ckNonStop], .divFltFont
    {
        color: black; 
    }  
    
    .divFlt label[for=ckNearbyAirport], .divFlt label[for=ckExactAirport]
    {
        color: black; 
    }  
    
    .divFltTitle
    {
       background-color: #EEEEEE; 
    }
       
  
    /*.divLanSel{ display: inline-block}*/
      
    #mobileheader{display: table}
    #LblComHeader, .leftCol{display:none} /* for lwf/desk.aspx use */
}

/* for 670px or less */
@media screen and (min-width: 361px) and (max-width: 674px) 
{
      #Adt, #Inf, #Kid
    {
        font-size: 16px;
        width: 70%;
    }    
   
  
    .imgPax
    {
         vertical-align: middle;
         display: inline;
    }

}

/*for 460px or less*/
@media screen and (max-width: 360px)
{
    #mobileheader .logo{width:80px}   
        
    .divPax
    {
        font-size: 11px;
    }
    
  
    #Adt, #Inf, #Kid
    {
        font-size: 16px;
        width: 50px;
    }    
    
    .imgPax
    {
         vertical-align: middle;
         display: inline;
    }
   
   /* .divLanSel{ display: inline-block}*/
}


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

    #mobileheader .logo{width:60px}         
             
    #Adt, #Inf, #Kid
    {
        font-size: 16px;
        width: 40px;
    }   
  
     

}