body {
  background-color: #f1f1f1; /* border-left:thick #cccc00 solid;  */
  padding: 20px;  font-family: Arial;   }
  
.w3-animate-bottom{position:relative;-webkit-animation:animatebottom 0.4s;animation:animatebottom 0.4s}
.w3-container{padding:0.01em 16px}
.w3-open {  padding-top:8px;   border-top: gray thin solid; font-family:"roboto",sans-serif}  
.w3-theme {color:#fff; !important; background-color:#005996  !important} /*#009688*/
.w3-contopen{padding:60px; align:center}

.contentheader{padding-left: 40px; align:left;  font-family:"roboto",sans-serif}
.contopen{padding:72px;  border-top: gray thin solid; font-family:"roboto",sans-serif}
.theme {color:#000080; !important; background-color:#005996  !important} 
.themeclear {color:#000080; !important; background-color:transparent  !important} 

.w3-noserif{font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;}	
    h1,h2,h3,h4,h5,h6{font-weight:400;margin:10px 0}
	h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{ font-weight:inherit;}

.h1 { font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; font-size:40px; line-height:52px;}     /*font-size: 22px;  color: #4d4d4d; line-height: 28px;  #003366   #4d4d4d  h1*/
.h2  {font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; font-size:36px; line-height: 48px;} 
.h3  {font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; font-size:24px; line-height: 36px;}  /*h2 font-size: 20px; color:  #4d4d4d ;*/
.h3  {font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; font-size:24px; line-height: 36px;}
.h4  {font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; font-size:20px; line-height: 24px;}
 
.h1i {font-size: 48px; font-family: 'Roboto', sans-serif;line-height:48px; color: #f2f0e5 }
.h1yl {font-size: 48px; font-family: 'Roboto', sans-serif;line-height:48px; color: #ffe24d }

.vcontent {  background-color: white;}
@media screen and (min-width: 1401px)                      {.vcontent {  padding-left:20%; padding-right: 20%;  }}     /*at least 993px large*/
@media screen and (min-width: 1041px) and (max-width:1400px) {.vcontent {  padding-left:10%; padding-right: 10%;   }}     /*medium bettwen 501 and 992*/
@media screen and (min-width: 601px) and (max-width:1040px) {.vcontent { padding-left:8%; padding-right: 8%;   }}     /*medium bettwen 501 and 992*/
@media screen and (max-width: 600px)  					   {.vcontent  {  padding-left: 2%; padding-right: 2%; font-size:14px; line-height:22px;	text-align: left; }}  /*up to 500px wide: smallest*/

.vform {  background-color: white; border: medium #cbd7e3 solid; border-radius: 15px; padding-left:8px; padding-right:8px; max-width:993px}


.vcontentsm {  background-color: white; font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; font-size:12px; line-height:16px;
    padding-left:10%; padding-right:10%;  }
 
#sectionimg
	{	position: relative;  /*opacity: 0.8;*/
		background: url(../assets/cityweb.jpg) no-repeat bottom center;   /*globeTf.jpg*/
		background-attachment: fixed;
		background-size: cover;
		text-align: left;	}
#sectionimgsh
	{	position: relative;  /*opacity: 0.8;*/
		background: url(../assets/robohandsm.jpg) no-repeat bottom center;   /*globeTf.jpg*/
		background-attachment: fixed;
		background-size: cover;  height:200px;
		text-align: left;	}		
 .ohsbox{border:1px teal;background: navy;opacity:0.6;  line-height: 65px;    text-align: center; color: white;float:left;width:20%; 
    border: 18px solid white;  margin:8px;}
.logbox {border-left: 18px  #ffda1a solid;   line-height: 65px;    text-align: center; color: black; margin:0 auto;    width:30%; 
         border-right:18px solid white; border-top:18px solid white; border-bottom: 18px solid white;  margin:8px;}
 
 
.form {font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif; color: black; text-align: right;opacity:1;
    margin: 12px auto;      width: 300px;     padding: 30px 25px; background-color: white; }
h1.login-title {
    color: black;
    margin: 0px auto 25px;
    font-size: 18px;
    font-weight: 400;
    text-align: right; 
}
.login-input {
    font-size: 15px;
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 25px;
    height: 25px;
    width: calc(100% - 28px);
}
.login-input:focus {
    border-color:#6e8095;
    outline: none;
}
.login-button {
    color: #fff;
    background: grey;
    border: 0;
    outline: 0;
    width: 100%;
    height: 50px;
    font-size: 16px;
    text-align: center;
    cursor: pointer;
}

.logout-button{   box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2), 0 2px 2px 0 rgba(0,0,0,0.19);
	float: center;   border:none; background-color: white; 	
	border-radius:4px; padding:3px 5px;
	text-align: center;  color:#7f6b00;  margin: 2px;				
}

.link-button{   box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2), 0 2px 2px 0 rgba(0,0,0,0.19);
	float: center;   border:thin red solid; background-color: red;	
	border-radius:4px; padding:3px 5px;
	text-align: center;  color: white;  margin: 2px;				
}
.link {
    color: #666;
    font-size: 15px;
    text-align: center;
    margin-bottom: 0px;
}
.link a {
    color: #666;
}
h3 {
    font-weight: normal;
    text-align: center;
}