﻿/* Move down content because we have a fixed navbar that is 50px tall */
body {
    /*padding-top: 50px;
    padding-bottom: 20px;*/
    font-family: Arial, Helvetica, sans-serif, Tahoma;
    font-size: 15px;    
    /*background-image: url('../Images/body8.png');
    background-repeat: repeat;*/
    background-color: #eeecec;
    width: 100%;   
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
 .body-content {
    /*padding-left: 15px;
    padding-right: 15px;*/
    margin-top: 105px;
}

.phan {
    height: 30px;
    background-color: #336699;
    color: #FFFFFF;
    font-weight: bold;
}


/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 100%;
}



/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
}

.link1{
    font-size: 12px;
    font-family:Arial;
    color:brown;
}

.linkE{
    font-size: 13px;
    font-family:Arial,Calibri,Tahoma;
    color:#004D71;
    border: 2px solid  #5bc0de;
    padding: 3px 6px 4px 6px!important;   
}

.button1 {
    width:80px;
    background-color: #00b7f0;/* #5bc0de; #428bca;*/
    border: 1px solid  #46b8da; /*#357ebd;*/
    color:  #ffffff;
    padding: 3px 5px 3px 5px!important;        
    text-align: center;
    text-decoration: none;
    font-size: 12px;
    font-family:Arial,Calibri,Tahoma;
    cursor: pointer;
    border-radius: 4px;
    box-shadow: 0 6px 8px 0 rgba(0,0,0,0.24), 0 8px 25px 0 rgba(0,0,0,0.19);
}
.radius5 {
    border-radius:5px;
}

.button1:hover,
.button1:focus,
.button1:active
{  
  background-color: #3276b1; /*#39b3d7*/
  border-color: deepskyblue; /*#269abc; #285e8e;*/
}

.button1_disable { 
     background-color:#FFFF99; /*#C7FEEA;*/     
     border: 1px solid #6A6A6A;
     color: #666666;
}

.button2 {        
    background-color:#d99494; /* #efdacb;*/
    border: 1px solid #ebcdcd;
    color:white !important; /*#9f4444*/
    padding: 3px 5px 3px 5px!important;        
    text-align: center;
    text-decoration: none!important;
    font-size: 12px;
    font-family:Arial,Calibri,Tahoma;
    cursor: pointer;
    border-radius: 4px;
    box-shadow: 0 2px rgba(0,0,0,0.24);
    min-width:80px;
}


.button2:hover,
.button2:focus,
.button2:active
{  
  color:white!important;
  background-color:#bb5d5d; /*#d49494;*/
  border-color:#fea7b9; 
}


 .center-div
{
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0; 
}

.footer {
    padding: 10px;   
    text-align: center;
    font-size: 18px;
    color: white;
    border: 1px solid #cccae6;
    border-bottom-right-radius: 13px;
    border-bottom-left-radius: 13px;   
    box-shadow: 10px 15px 20px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);    
    background-color: #6597C9; 
    width: 100%;
  
}

 .aMenu {
            padding-top:2px !important;
            height: 23px!important;
            color: white;
            margin-right:1px;
            font-size:14px;
        }

 .aMenu:hover {
             color:white;
             background-color: #006600 !important; 
             border: 1px solid #99FF99;  
             border-radius:5px 5px;
             box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
        }

 .fontMain {
             font-family: Arial, Helvetica, sans-serif, Tahoma;
             font-size: 14px;             
        }

.TitleBieu {
    padding-top: 20px;
    padding-bottom: 10px;  
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    color: #8f3d3d;
    font-family: Cambria, 'Times New Roman';       
}

 .font-main {
             font-family: Arial, Helvetica, sans-serif, Tahoma;
             font-size: 15px;
         }

    .tab-color {
        background-color: #FFFCDF;
    }
   
     .label1{
            text-align: right;
            padding-right: 10px;
            color:darkblue;
        } 
   
     .Bold {font-weight:bold; }
     .Italic { font-style:italic;}

     .TopDot {
        border-color: #B0B0B0;border-top-style: dotted; border-top-width: 1px;
     }

    .BotDot {
        border-color: #B0B0B0;border-bottom-style: dotted; border-bottom-width: 1px;
     } 

    .BotNone {
        border-bottom-style: none !important;
     }  

    .TopNone {
        border-top-style: none !important;
     }  

   .TextBox {
        font-family: Arial;
        font-size: 15px;
    }

    .combo {
        font-family: Arial;
        font-size: 14px;   
        height: 24px;
        background-color: #eef8fb;
        color:#0f095e;
    }

    .TableTab {
            width: 100%;
            text-align:left;
            background-color:#fffff4;/*: #ecf4fc;  #fffff4*/ 
            border: 3px solid #61b0fe; /*#B78B31;*/
            font-family: Arial, Helvetica, sans-serif, Tahoma;
            font-size: 15px;             
     } 
     

    /*.Muc {
       color: #87304A; font-weight: bold;  font-size: 14px; padding: 10px ; text-align: center; font-family: Cambria, 'Times New Roman'; 
       border-color:#996633; border-bottom-style:solid;border-top-style:solid;border-width:1px;
   }*/

    .TitleBC {
           color: #990033;
           font-weight: bold;
           font-size: 18px;
           padding-top:10px;
           text-align: center;
           font-family: Cambria, 'Times New Roman';
       }

     .TitleCol {
           color: forestgreen;
           font-weight: bold;
           text-align: center;
           padding-top: 5px;
           padding-bottom: 5px;        
           border-color: #B0B0B0;
           border-bottom: dotted;
           border-left: dotted;
           border-width: 1px;  
           font-size:15px;  
             
       }
     .Bang {border-style:solid;border-width:1px;border-color: yellowgreen;}     
    
       .pNote {
             font-size: 14px;
             color: #515151;
             font-style: italic;
             font-weight: normal;
             padding-left: 10px;
             /*padding-top: 20px*/
         } 

   .NoXButton .dxeEditAreaSys::-ms-clear { display: none;
         }
           
        input,
        select,
        textarea {max-width: 100%;} 

       .hide {display: none;}
       .wid100 { width: 100%;}
       .wid50 { width: 50%;}
       .wid60 { width: 60%;}
       .wid10 { width: 10%;}
       .wid7 { width: 7%;}
       .wid20 { width: 20%;}
       .wid15 { width: 15%;}
       .wid40 { width: 40%;}
       

      .padL35 {padding-left: 35px;}
      .padL50 {padding-left: 50px!important;}
      .padL10 {padding-left: 10px!important;}
      .padL45 {padding-left: 45px!important;}
      .padL60 {padding-left: 60px!important;}
      .padL80 {padding-left: 80px!important;}
      .padL100 {padding-left: 100px!important;}   
      
     
      .Cau {text-align: left;padding-top: 5px; padding-bottom:5px; color: #004D71;  } 
      .CauTLTS  {text-align: left;padding-left: 80px; width:60%; padding-top: 5px; padding-bottom:5px; color: #004D71;  } 
      .TraLoiTLTS {width: 110px; padding-top: 5px; padding-bottom: 5px; text-align:center;  }


      .Cau1 {
          padding-top: 3px; padding-bottom:3px; padding-left: 25px; color: #004D71; text-align: left; font-size:14px;  border-color: #B0B0B0;border-style: dotted; border-width: 1px;    
    } 
     
   .Cau11 {
          font-size:14px; width: 18%; padding-top: 3px; padding-bottom: 3px; padding-left: 25px; color: #004D71; text-align: left;     
    } 

     .Cau70 {
          width:70%; padding-top: 5px; padding-bottom: 5px; padding-left: 30px; padding-right:10px; color: #004D71;
            border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }

      .Cau40 {
          width:auto; padding-top: 3px; padding-bottom: 3px; padding-left: 30px; color: #004D71;
            border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }

    .CauMS {
          width: 90px; padding-top: 5px; padding-bottom: 5px; text-align:center; color: #004D71;
            border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }

    .CauDVT {
          width: 110px; padding-top: 5px; padding-bottom: 5px; text-align:center; color: #004D71;
            border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }


     .TraLoi20 {width:130px; padding-top: 5px; padding-bottom: 5px; padding-left: 20px; padding-right: 20px;
       border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }

      .TraLoi10 {width:110px; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px;
       border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }
      .TraLoi7 {width:7%; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px;
       border-color: #B0B0B0;border-style: dotted; border-width: 1px;
    }  
  .TraLoi70 {width: 70%; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; }  
  .TraLoi30 {width: 35%; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; }
  .TraLoi40 {width: 40%; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; }
   .TraLoi60 {width: 35%; padding-top: 3px; padding-bottom: 3px; color: #004D71;} 
   .TraLoi75 {width: 75%; padding-top: 3px; padding-bottom: 3px; padding-left: 15px; }  
     .variable {
            color: white;
            background-color: white;
            width:5px;
            border:none;
        }

        .gridRow-static-height{ height: 23px;} 
        .HeaderHeight { height: 40px;}  
        
           .RowHotTrack  {
               color:#990000!important;
               background-color:#e3f0ff!important;
               /*font-weight:bold!important;*/
           }
           .gridHeader {
               background-color:#def5fc;
               color:#203f7d!important;
               text-align:center!important;
               border-color:#cccccc;
               border-style:solid;
               border-width:1px;                       
           }
           .gridRow {
                  background-color:white;
                  color:#2A2A2A;
                  height: 23px!important;
           }
           .gridAlterRow {
                  background-color:#f8fbff; 
                  color:#2A2A2A;
                  height: 23px!important;
           }

           .HeadPad5 {
               padding-top:6px!important;
               padding-bottom:6px!important;
           }  
        
        .Tong {
            width: 10%;
            padding-top: 5px;  
            padding-bottom: 5px;        
            padding-left: 5px;
            padding-right: 5px;
            /*text-align: center;*/
            color:  #333333;
            /*background-color:#AAD5FF;*/            
        }    

          .table-1 {
            padding-left: 17%;
            padding-right: 17%;
        }

            @media (max-width: 768px) {
                .table-1 {
                    padding-left: 1%;
                    padding-right: 1%;
                }
            }

     
.NhapNhay {
  border-radius:25px;
  width: 300px;
  background-color:#336699;
  position: relative;
  animation-name: keyNhapNhay ;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  padding-top: 10px;
  padding-bottom: 10px;
  color:white;
  font-weight: bold;
  text-align: center;  
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

@keyframes keyNhapNhay {
  20%  { background-color:#fefbd8;}
  40%  { background-color:#ffef96;}
  60%  { background-color:#f18973;}
  80% { background-color:#f7786b;}
 100% { background-color:#622569;}
}

.padT5 {
    padding-top:5px;
}
