#table1{
width:80%;
MARGIN-LEFT:AUTO;
MARGIN-RIGHT:AUTO;

}
#D1{
border:none;
}
#TD1{
border-color:grey;
}
#firsttab{
border:none;
}
.TAB1A{
BORDER-TOP:NONE;
border-BOTTOM:NONE;
BORDER-LEFT:NONE;
BORDER-RIGHT:NONE;

}
.MYH4{
color:darkblue;
text-align:center;

}
#P1{
padding-left:2%;
padding-right:2%;
}
#P2{
padding-left:2%;
padding-right:2%;
}

#P3{
padding-left:2%;
padding-right:2%;
}
#P4{
padding-left:2%;
padding-right:2%;
}

#P5{
padding-left:2%;
padding-right:2%;
}

#EXPLAIN{
float:right;
margin-right:15%;
margin-top:7%;
width:35%;
padding:10px;
background-image: linear-gradient(DARKBLUE,BLACK);
COLOR:WHITE;
BORDER-RADIUS:25PX;
font-family:verdana;
font-size:14px;
}
#P6{
text-align:center;
font-weight:bold;
font-family:verdana;
font-style:italic;
}
#P7{
text-align:center;
}
#COURSES{
text-align:center;
border:none;
color:darkblue;
}

.TAB2{
WIDTH:95%;
BORDER:1PX SOLID;
FONT-SIZE:100%;




}

#DATEF{
padding-left:5px;
padding-right:5px;
}
#Btn1{
width:100%;
height:25px;
background-color:lightgrey;
}
#dateg{
padding-left:5px;
padding-right:5px;
}
#Btn2{
width:100%;
height:25px;
background-color:lightgrey;
}
.TAB3{
WIDTH:95%;
BORDER:1PX SOLID;
FONT-SIZE:100%;


}
#dateh{
padding-left:5px;
padding-right:5px;
}
#Btn3{
width:100%;
height:25px;
background-color:lightgrey;
}
#datei{
padding-left:5px;
padding-right:5px;
}
#Btn4{
width:100%;
height:25px;
background-color:lightgrey;
}
.TAB4{
WIDTH:95%;
BORDER:1PX SOLID;
FONT-SIZE:100%;
}

#TH1{
background-color:darkblue;
color:white;
font-size:95%;
}
#datej{
padding-left:5px;
padding-right:5px;
}
#Btn5{
width:100%;
height:25px;
background-color:lightgrey;
}
#datek{
padding-left:5px;
padding-right:5px;
}
#Btn6{
width:100%;
height:25px;
background-color:lightgrey;
}
#datel{
padding-left:5px;
padding-right:5px;
}
#Btn7{
width:100%;
height:25px;
background-color:lightgrey;
}
.TAB5{
WIDTH:95%;
BORDER:1PX SOLID;
FONT-SIZE:100%;"
}
#datem{
padding-left:5px;
padding-right:5px;
}
#Btn8{
width:100%;
height:25px;
background-lightgrey;
}
.TAB6{
WIDTH:95%;
BORDER:1PX SOLID;
FONT-SIZE:100%;

}
#dateN{
padding-left:5px;
padding-right:5px;
}
#Btn9{
width:100%;
height:25px;
background-color:lightgrey;
}
#dateo{
padding-left:5px;
padding-right:5px;
}
#Btn10{
width:100%;
height:25px;
background-color:lightgrey;
}
.TAB7{
WIDTH:95%;
BORDER:1PX SOLID;
FONT-SIZE:100%;

}
#datep{
padding-left:5px;
padding-right:5px;
}
#Btn11{
width:100%;
height:25px;
background-color:lightgrey;
}
#dateq{
padding-left:5px;
padding-right:5px;
}
#Btn12{
width:100%;
height:25px;
background-color:lightgrey;
}
.mytable2{
border:none;
MARGIN-LEFT:2.5%;
MARGIN-RIGHT:2.5%;
}
#dater{
border:none;WIDTH:50%;
}
#form{
border-radius:4%;
background-color:#b2cecf;
display:none;
padding-left:1%;
}

@media screen and (max-width: 600px) {
   #table1{
width:90%;
font-size:80%;

    }
}

@media screen and (max-width: 600px) {
   .TAB2{
width:100%;
font-size:100%;


    }
}
@media screen and (max-width: 600px) {
   #date1b{
padding-left:22px;padding-right:22px;
font-size:100%;

    }
}
@media screen and (max-width: 600px) {
   #date3b{
padding-left:22px;padding-right:22px;
font-size:100%;


    }
}
@media screen and (max-width: 600px) {
   #date5c{
padding-left:22px;padding-right:22px;
font-size:100%;


    }
}
@media screen and (max-width: 600px) {
   #date6c{
padding-left:22px;padding-right:22px;
font-size:100%;

    }
}
@media screen and (max-width: 600px) {
   #date7c{
padding-left:24px;padding-right:24px;
font-size:100%;


    }
}
@media screen and (max-width: 600px) {
   #date8c{
padding-left:24px;padding-right:24px;
font-size:100%;


    }
}
@media screen and (max-width: 600px) {
   #btn1{
width:auto;
font-size:100%;

    }
}
@media screen and (max-width: 600px) {
   #btn2{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn3{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn4{
width:auto;
font-size:100%;
    }
}

@media screen and (max-width: 600px) {
   #btn5{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn6{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn7{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn8{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn9{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn10{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn11{
width:auto;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #btn12{
width:auto;
font-size:100%;

    }
}
@media screen and (max-width: 600px) {
   .TAB3{
width:100%;
FONT-SIZE:100%;
    }
}
@media screen and (max-width: 600px) {
   .TAB4{
width:100%;
FONT-SIZE:100%;
    }
}
@media screen and (max-width: 600px) {
   .TAB5{
width:100%;
FONT-SIZE:100%;
    }
}
@media screen and (max-width: 780px) {
   #EXPLAIN{
DISPLAY:NONE;
    }
}




@media screen and (max-width: 600px) {
   .TAB6{
width:100%;
FONT-SIZE:100%;
    }
}
@media screen and (max-width: 600px) {
   .TAB7{
width:100%;
FONT-SIZE:100%;
    }
}


@media screen and (max-width: 600px) {
   #form{
width:100%;
font-size:100%;
    }
}
@media screen and (max-width: 600px) {
   #form8{
width:100%;
font-size:100%;
    }
}
@media screen and (min-width: 991px) {
   #form{
width:50%;
font-size:100%;
    }
}
@media screen and (min-width: 1199px) {
   #form{
width:40%;
font-size:100%;
    }
}

@media screen and (max-width: 600px) {
   #refresh{
width:60%;
font-size:100%;


margin-top:-200%;


    }
}
   
#input{
width:90%;
}