
*{margin: 0px auto;}

  h1,h2,h3,h4,h5,h6 {
    font-weight:normal;
    color:#008CBA;
    margin:0 0 0 0;
  }

  /*h1 { font-size:120%} */
  h2 { font-size:115%} 
  h3 { font-size:110%} 
  h4 { font-size:100%} 

 #sidebar h1#top{ font-size:1.4vw;margin:2vh 0 2% 0}
 #sidebar h1#normal{margin:0vh 0 3% 0}

 p {
	font-size:1.3vw;
	text-align:justify;
	color:#666;
	margin:0 0 0 0;
	}
	
p#headline{
	font-size:1.5vw;
	color:#fff;
	margin:3vh 1vw;
	}
	
a, li a{
	color:#666; 
	font-size:1vw;
	text-align:left;
	margin:0 0 0 0;
	text-decoration:none;
	line-height:1;
	background:transparent;
  }
  
  a:hover{
	color:#008CBA;
  }
   
  
  /*li{font-size:133.33%;margin-bottom:1.5vh; }*/
  li a{margin-left:0;}
	
  ul { line-height:1.5em; margin:0 0 1.5em 0em; }
  ul { list-style-type:none; }
  ul ul { list-style-type:none; margin-bottom:0; }

  
  .mavies_logo{
	  width:30%; 
	  margin: 0% 35%;
	  border:none;
  }
  
  label{
		font-size:1vw;
		text-align:justify;
		vertical-align:top;
		color:#666;
		margin:0 0 0 0;
  }
 
#sidebar {
	float: left;
	position: absolute;
	top: 10vh;
	background:rgba(0,140,186,0.1);	
	width: 16vw;
	min-width:12vw;
	padding: 1vh 1vw;
	border-right: 1px solid #666;
	height: 95vh;
	webkit-user-select: none;-moz-user-select: none;-ms-user-select: none; user-select: none; 
} 
#sidebar ul{margin-left:0;padding:0;}

 
#float2 {
	float:left;
	position:fixed;
	top:10vh;
	left:18vw;
	color:#666;
	background:rgba(255,255,255,0);
	width:82vw;
	height:80vh;
	padding: 0;
	margin:0 0 20vh 0;
	display: block;
	overflow-y:scroll;
	}
	
#float2 a h2:hover {
	display: none;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor:	none;
}
 
 #welcome{
	 display:block;
	width:80%;
	height:55%;
	padding:2% 10%;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

  #welcome label {font-size: 1vw;height:auto;color:#008CBA;margin: 2vh 0 1vh 0;}
  #welcome input[type="text"] {width:40%; font-size:0.8vw;}
  #welcome input[type="password"]{font: large Verdana,sans-serif; font-size: 80%; width:25%;}
  #welcome textarea {font: large Verdana,sans-serif; font-size: 80%; width:100%;}
  
  #welcome label.reg {
    font-size: 133.33%;
    width: 20vw;
    color: #008CBA;
    padding: 0;
    margin: 1%;
}	

#sendungen
{
	display:block;
	width: 100vw;
	height: 90vh;
	margin: 10vh 0 50vh 0;
	overflow-y: scroll;
}  



#sendungen h1
{
	font-size:1.5vw;
	width:80%;
	padding:10px 10% 10px 5%;
	text-align:center;
	margin: 15px 0px 5px 0px;
	border-bottom: 2px solid #008CBA
}

#sendungen table
{
	background-color:rgba(255,255,255,1);
	width:60vw;
	border: 1px solid #f7f7f7;
	margin-top:5%;
}

#sendungen td
{
	text-align:left;
	padding-left: 5%
}

#sendungen form
{
	background-color:rgba(255,255,255,0);
	width:60vw;
	min-width:60vw;
	margin:1vh 20vw;
	margin-bottom: 5vh;
}

.infobox
{
display:block;
width:50%;
margin:5% 20%;padding:2%;
background-color:rgba(255,255,255,0.4);
border: 2px solid #008CBA;
border-radius:10px;'
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.infobox p{
	margin-top:15px;
	vertical-align:middle;
	text-align:center;
	font-weight:bold;
}

.infobox h2
{
	text-align:center;
}

.infobox a{
	color:#008CBA; 
	font-size:1vw;
	font-weight:bold;
	text-align:left;
	margin:0 0 0 0;
	text-decoration:none;
	line-height:1;
	background:transparent;
  }
  
.infobox a:hover{
	color:#666;
  }
  
.infobox #img_info{
	float:left;
	width:70px;
	height:70px;
	display:inline-block;
	margin-right:15px;
}

.infobox_shadow
{
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



.scontainer {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#label_sb {
	 display:block;
	padding-left:5vw;
}

/* Hide the browser's default checkbox */
.scontainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 0px;
  background-color: rgba(33,150,143,0.4);
}

/* On mouse-over, add a grey background color */
.scontainer:hover input ~ .checkmark {
  background-color: rgba(33,150,143,0.6);
}

/* When the checkbox is checked, add a blue background */
.scontainer input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.scontainer input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.scontainer .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


#thema1{background-image: url('../img/1_shopping-queen.jpg');}
#thema2{background-image: url('../img/2_deinKind-deinKind.jpg');}
#thema3{background-image: url('../img/3_auchdasistdeutschland.jpg');}
#thema4{background-image: url('../img/4_wirmachenswiederganz.png');}
#thema5{background-image: url('../img/5_singlesfuerlangzeitdoku.jpg');}
#thema6{background-image: url('../img/6_paareundsinglesfuerrtlshow.jpg');}
#thema7{background-image: url('../img/7_familienfuerswfverbraucherformat.jpg');}
#thema8{background-image: url('../img/8_schwanger.jpg');}
#thema9{background-image: url('../img/9_ploetzlicharm-ploetzlichreich.jpg');}
#thema10{background-image: url('../img/10_endlicheinjob.jpg');}
#thema11{background-image: url('../img/11_hilfmir.jpg');}
#thema12{background-image: url('../img/12_rechtsstreit.jpg');}
#thema13{background-image: url('../img/13_heimwerker.jpg');}
#thema14{background-image: url('../img/14_ard.jpg');}
#thema15{background-image: url('../img/15_frauentausch.jpg');}
#thema16{background-image: url('../img/16_skandale.jpg');}
#thema17{background-image: url('../img/17_komparsensuche.jpg');}
#thema18{background-image: url('../img/18_skandale.jpg');}
#thema19{background-image: url('../img/karteiaufnahme.png');}

#thema1,#thema2,#thema3,#thema4,#thema5,#thema6,#thema7,#thema8,#thema9,#thema10,#thema11,#thema12,#thema13,#thema14,#thema15,#thema16,#thema17,#thema18,#thema19
{
	background-size:125px 90px; width:125px;height:90px;
}

.themenauswahl {display:inline-block; background-color:#e7e7e7; border: 1px solid #008CBA;width:auto;max-width:90%;height:auto; margin:.5%;padding:4.5%;}
.themenauswahl:hover {
	background-color: rgba(150,207, 247,1);
    opacity:1;
    transition:1s;
}

#themen{
	width:100%;
	height:auto;
	padding:0;
	margin:0;
	background-color: rgba(255,255,255,0);
	text-align: center;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#themen a h2 {
	display:none;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
	height:15%;
	width:90%;
	margin: 6vh 0 0 0;
	padding:2vh 0 0 0;
	background-color: rgba(255,255,255,0);
    color: #008CBA;
	text-align: center;
    opacity:0;
    transition:1s;
	font-size:1.5vw;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#themen a:hover h2 {
	display:block;
    opacity:1;
	transition:1s;
}

form #left{
	position:relative;
	display:inline-block;
	top:0;
	left:0;
	float:left;
	width:40%;
	margin: 0.2vw 0 0 0;
	border: 0px solid #666;
	padding:1vh 2vw 0 0;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
form
{
	float:left;
	width:100%;
	display: block;
}

 form #left label {font-size: 1vw;width:10vw;color:#008CBA;padding:0;margin:1% 0;}
 form  #left label.bez {display:inline-block;font-size: 1vw; width: 3vw; color: #666; padding: 0; margin-top: 1vh;}
 form #left input[type="text"] {width:60%;font-size:0.8vw;}
 form #left input[type="password"] {font: large Verdana,sans-serif; font-size: 80%; width:25%;}
  
form #right{
	position:relative;
	display:inline-block;
	float:right;
	width:50%;
	margin: 2vh 0 0 0;
	border: 0px solid #666;
	padding:6vh 2vw  0 0;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

  form #right label {font-size: 1vw;width:10vw;color:#008CBA;padding:0;margin:1% 0;}
  form #right input[type="text"] {width:67%;}
  form #right input[type="password"] {font: large Verdana,sans-serif; font-size: 80%; width:60%;}
	
 #msgbox{
	 position: absolute;
	 top:250px;
	display: flex;
	width:60%;
	margin: 0 20%;
	border: 0px solid #666;
	padding:1vh 5vw 1vh 1vw;
	webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}	

  input{
	  /*height:5%;*/
	  width:auto;
	  padding:1vh;
	  margin:0 0 0 0;
   }
   
input[type=checkbox]
{
	width:1.5vw;
	height:1.5vw;
	border: 2px solid #666;
	margin:0 1vw 0 0;
}
  
  select{
	  width:auto;
	  padding:.5vh;
	  margin:0 0 0 0;
   }
  
  td{text-align:left;}
  html {height:100%;background-color:#fff;}  
  
body,html{
background-image: url(../img/background-body.png);
margin: 0;
padding: 0;
background-color: #fff;
font-family: "Lato", sans-serif;
font-size:1.3vw;
font-weight:normal;
color:#666;
line-height:1.3;
overflow-y:hidden;
 overflow-x:hidden;
}

#main  {float:left;width:100vw;}
#oben  {width:100vw;  background: #008CBA;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none; user-select: none;  }
#content {width:66vw;background:#fff;padding:0 1vw;}

#label1 {display: inline-block; width:5vw !important;margin:1% 0% 0.5 0%;}  
#label2	{display: inline-block; width:15vw;margin:0.5% 0%;text-align:left;}  
#label3	{display: inline-block; width:15vw;margin:0% 0% 1.5% 0%;}  

#labelcaptcha {display: inline-block; width:auto;margin:2% 0% 0% 0%;}  
#labellogin {display: inline-block; width:15vw;margin:1% 0%;}  
#inputlogin {display: inline-block; width:90%;margin:1% 0%; }  
#header {display: inline;width:100vw;position: fixed;background: #008CBA;height:10vh;min-height:4vw;top:0;}
#header td {color:#fff;font-weight:bold; font-size:4vh; padding:2vh 1vw;border:1px solid #008CBA;}
#footer {display: block;width:100vw;position: fixed;background: transparent;height:5vw;min-height:5vw; margin-bottom:1vw; bottom:0;left:26vw;}
#footer td {color:#fff;font-weight:bold; font-size:4vh; padding:2vh 1vw;border:1px solid #008CBA;}

.userdata{ float:left; display:block; position:relative; width:15vw; padding:2vh 1vw 5vh 0; margin: 0; }
.userdata p, .userdata a{ font-size:1.5vh; display:inline-block;}

.themen{ float:left;width:15vw; padding:0; margin:0;height:auto;display:inline-block;}
.themen p, .themen a{display:inline-block;}


#textbox{margin:0;background: rgba(0,0,0,0)}
p#textbox{font-size:1vw;}

.clear { clear: both; }
.hyphenate {-webkit-hyphens: auto; -moz-hyphens: auto;hyphens: auto;}

::-webkit-input-placeholder {
   color: #666;
}

:-moz-placeholder { /* Firefox 18- */
   color: #666;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #666;  
}

:-ms-input-placeholder {  
   color: #666;  
}

#recaptcha {
   margin:-3.5% 0 0 19%;
   width:304px;
   position: absolute;
   float: left;
}

#recaptcha_contact {
   margin:2vh 0 0 0;
   width:100%;
   position: absolute;
   float: left;
}

#recaptcha iframe {
   position: absolute;
   left: 0px;
   top: 0px;
}

.g-recaptcha {
	display: inline-block;
    text-align: left;
}

#info {
	height:2vh; min-height:2vh;max-height:2vh;padding:0.5vh 0;vertical-align:top;display:block;
}

#info_ok{
	margin:0;
	border: 1px solid green;
	padding:0.5% 1%;
}
#info_ok p{color:green;}

#info_err{
	margin:0;
	border: 1px solid red;
	padding:0.5% 1%;
}

#info_err p{color:red;}

#info_sidebar{
	margin:0 0 3% 0;
	padding:0;
	color:red;
}


input[type=radio]
{
    margin:8px 10px 10px 0;
	-webkit-appearance:button;
	width:1vh;
	height:1vh;
	border: 2px solid #666;
}

input[type=radio]:checked
{
	 background-color:#008CBA;
}

label span{float:right;width:5vw; text-align:right; margin-right:40%;padding-left:2vw;}

.btn, #btn_login, #btn_reset
{
  color: #fff;
  font-size:1vw;
  font-weight:normal;
  background: #008CBA;
  width:auto;
  min-width:12.5vh;
  height:auto;
  padding: 5px;
  margin:30px 1% 3% 0;
  border:  0px solid #008CBA;
  text-decoration: none;
  border-radius:5px;
}

 #btn_login, #btn_reset {
  min-width:40%;max-width:40%;margin:6% 3% 20% 0;
}

.btn:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

.shadow
{
  position: relative;
}
.shadow:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  right: 10px;
  left: auto;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
}
