﻿body {     font-family: Arial; font-size:16px; line-height: 1.4;}
h1{ margin:0px!important; font-size:20px!important; margin-bottom:10px!important; font-weight:normal;}
a{  cursor:pointer;  color:black;}
a:hover{  text-decoration:underline;}
#loginarea { margin-bottom:20px; text-align:left; padding:20px;border: 1px solid #ccc;border-radius: 3px; width:450px!important;   -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 1px 6px rgba(23, 69, 88, .5);box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.4); margin-top:20px; }



@media screen  and (max-width: 600px) {

    #loginarea { width: 100%!important;  }


}



.log_input_area h1, #loginarea.reset h1{ padding-bottom:10px!important;}
    #loginarea.reset .btn {
        margin-top: 20px!important;
    }

 h1,h2, h3{ 
    margin: 0px!important;
  
 
    font-weight: normal;
    padding: 0px 25px 0px 25px;
    font-family: 'Roboto', sans-serif;}

h3 {font-size:57px}
h1 {  font-size: 22px!important;}
h2 {  font-size: 28px!important;}
.btn { display:inline-block;}
#loginarea input.dta{padding: 12px 8px 12px 8px;margin-bottom:7px;margin-top:7px;outline:0;background-color: #fff;border: 1px solid #ccc;border-radius: 3px;font-size:16px; display:block;}


.btn_cont{ display:none;}
.btn{ margin:10px 0px 10px 0px; outline:0;cursor: pointer;font-size: 16px;font-weight: bold;line-height: normal;
      color: #fff;background-color: #FF4141;  border: 1px solid #FF4141;box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
      paddinG: 10px 40px 10px 40px;
}     
.btn:hover{background-color: #f4040a;border-color: #f4040a;}

.login_name input {width:140px; margin-right:10px;}
table td { vertical-align:top; text-align:center; padding:0px 10px 0px 10px; width:220px;}

.log_alert{    background-color: #fce7e7!important;border-color: red!important;}
.alert,#loginarea input.dta { width:100%;}
#loginarea.reset { width:350px!important;}


.btn,input,#loginarea,.alert,div, body{box-sizing:border-box; 
                             -moz-box-sizing:border-box;
                             -webkit-box-sizing:border-box;

}
.center { text-align:center;
}


    .btn:hover {
     text-decoration:none;}
.alert { padding:10px;  background-color:#FFFABC; margin-top:10px;}
.forgot { padding-top:20px; margin-top:10px; border-top: 1px solid  #ccc; }
.forgot_div {     padding: 10px;    background-color: #f4f4f4;    border: 1px solid #cccccc; }
.forgot_div {margin-top:15px;}
.reset_div {margin-bottom:15px;}


.reset .exist,.reset .new ,.reset .forgot { display:none;}

.mi_logo, .mi_esp_logo,.mi_esp_takamine_logo, .mionline_logo {
    background-position: center center;
    background-repeat: no-repeat; 
    background-size: contain;
}

.mionline_logo {

    background-image: url(Images/mionline.png);
  
    
    height: 40px;
     margin-top: 30px;

    
}


.mi_logo {
          
    background-image: url(Images/mi_logo.png);
    
    height: 35px;
    width: 112px;
    
     margin-bottom:10px;
    
}

.mi_esp_logo {

    background-image: url(Images/MIOxESP.png);
  
    
    height: 40px;
    width: 361px;
    
     margin-top:30px;
    
}

.mi_esp_takamine_logo {

    background-image: url(Images/MIOxESPxTakamine.png);
  
    
    height: 80px;
    width: 777px;
    
     margin-top:30px;
    
}








  .forgot_div .btn {      }
._cap {text-transform:capitalize;}
._lower{text-transform:lowercase;}
.mi_event_day {            margin-top: 10px;            font-weight: bold;        }
.mi_event {            margin-top: 3px;           margin-left:10px;     }
.mi_rcvp {display:inline-block; padding:3px; background-color: #a00042; color: #FFF; font-size:0.9em; margin-left:5px;}
.mi_upcoming_events {    text-align: left;    width: 400px;}