*{box-sizing: border-box;}
body {
  margin: 0;
}

#sdiv{display:none;
    position: absolute;
    margin: 0 0 0 83.33%;
    width:16.66%;
    z-index:9;
}  
#sdiv input[type=text] {
  width: 80%;   
  margin: 2% 20% 0 0;
  font-size: 16px;
  background-color: white;
}
input[type=text]:focus {
  background-color: lightyellow;
} 

/********/
.header {
	position:fixed; 
	background-color:#0000ff;
	width:100%;
	z-index:9; 
} 
.topbar {
  overflow: hidden;
  padding: 0 10px 0 10px;
  margin:0 0 0 30%;
  border-bottom: 2px solid #ccc;
}

.topbar a {
  float: right;
  display: block;
  color: lightblue; 
  text-align: center;
  padding: 2% 3% 0;
  text-decoration: none;
  font-size: 16px;
}
.topbar a.active{margin-right:5%;}
.topbar a:hover {
  color: white;
}

.topbar a.active {
  background-color:white ;
  color: #0000ff;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
}

.topbar .icon {
  display: none;
}
.name1 {
 display: inline;
  color: #fff;
  font-size: 1.5em;
  /*margin-top: 0.83em;*/
  margin-bottom: 0.83em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
 /* margin: 0;*/
  padding:10px 0 0 0;
}

#titu2{ float:left; /*width:65%;*/ text-align:center; padding-right:25%;
    font-size: small; margin-top:0.5em;}

h1 { float:left; 
	font-family: Arial,sans-serif;
	margin: 0;
	padding: 0;
	color: #f2f2f2;
	}



h3 {  font-family: Arial,sans-serif;
    font-size:90%;
    margin: 0;
    color: #f2f2f2;}
 
@media screen and (max-width: 768px) {
  .topbar a:not(:first-child){display: none;}
  .topbar a.icon {
    float: left;
    display: block;
  }
}

@media screen and (max-width: 768px) {
    .topbar,.header, #titu2 {width:100%; text-align:center; margin-right:auto;
        margin-left:auto; padding: 0 10px 0 10px;
    }
	.topbar a.active{margin-right:0px;}
    .topbar.responsive {position: relative;}
    .header h2{margin:auto; width:100%; text-align:center;}
    .topbar.responsive .icon {
		position: absolute;
		right: 0;
		top: 0;
	}
		
	.topbar.responsive a {
			float: none;
			display: inline;
			text-align: left;
	}
	.topbar.responsive a.active{display:none;}
	
    
	#sdiv{
		position: absolute;
		margin: 0 0 0 50%;
		width:41.66%;	
		}
	#sdiv input[type=text] {
		width: 100%; 
		margin:0;
		}
		
}
