/*

Theme Name: WebPage4.Me

Theme URI: http://webpage4.me

Description: The all new WP4ME Design

Author: Christoph Daniel Miksche

Author URI: http://wronnay.net

Tags:        webpage, for, 4, me

License:     Attribution-NonCommercial-ShareAlike 3.0 Unported (CC BY-NC-SA 3.0)

License URI: http://creativecommons.org/licenses/by-nc-sa/3.0/

*/

@font-face {
font-family: "WebPage4Me";
src: url("/wp-content/themes/webpage4me/fonts/webpage4me.ttf");
}
@import url(https://webpage4.me/wp-content/themes/webpage4me/fonts/OpenSans/OpenSans-Regular.ttf);

body        {color: #00000; font-family: 'Open Sans', sans-serif;}

@media screen and (min-width: 0px) and (max-width: 900px) {

#wrapper { };

}
@media screen and (min-width: 900px) {

#wrapper {}
.form_start {width:400px; }

}

#wrapper    {margin: 0 auto; text-align: left; background: #fff; border-bottom: 1px solid #ccc; font-size : 18px;}
#header        {font-family: WebPage4Me; text-align: center; padding: 20px; border-bottom: 1px solid #ccc; font-size : 18px;}
#header a:link{
  text-decoration: none;
}
#main       {padding: 20px; float: left; font-size : 14px;}
.form_start  {margin: 0 auto; padding: 20px; font-size : 14px; border-bottom: 1px solid #ccc;}
.form_start input { padding:10px; margin:5px; width:100%; box-sizing:border-box; }
.form_start input:focus {box-shadow: inset 0px 0px 5px #000000;}
.form_start input:hover { padding:10px; margin:5px; width:100%; box-sizing:border-box; }
.form_start input[type=submit] { padding:10px; background-color: #000; color:#fff; margin:5px; width:100%; box-sizing:border-box; }
#sidebar    {width: 300px; padding: 10px; padding-top: 20px; float: right; font-size : 14px;}
#footer        {margin: 0 auto; width:250px; clear : both;opacity : 0.800000011920928955078125;border-radius : 5px;padding : 5px 5px 5px 5px;font-size : 14px;text-align : center;}
.text {float : left;margin-left : 10px;line-height : 60px;}
#footer img {float : left;}
img {border : 0;}
table {border : 0;}
a:link    {color: #000000;  text-decoration:underline;}
a:visited {color: #000000;  text-decoration:underline;}
a:focus   {color: #000000;  text-decoration:underline;}
a:hover   {color: #000000;  text-decoration:none;}
a:active  {color: #000000;  text-decoration:underline;}
#footer a:link {color : #000000;text-decoration : none;}
#footer a:visited {color : #000000;text-decoration : none;}
#footer a:focus {color : #000000;text-decoration : none;}
#footer a:hover {color : #000000;text-decoration : none;border-bottom : 1px solid #000000;}
#footer a:active {color : #000000;text-decoration : none;}li {list-style-type: none;}
h2 {}
.comment { text-align: left;border-left:2px solid #000000;border-bottom:2px solid #000000;background-color: #ffffff;padding: 5px 5px 5px 5px;margin: 5px 5px 5px 5px;opacity: 0.8;}
.comment:hover { text-align: left;border-left:2px solid #000000;border-bottom:2px solid #000000;background-color: #ffffff;padding: 5px 5px 5px 5px;margin: 5px 5px 5px 5px;opacity: 1.0;-moz-box-shadow: 0px 0px 15px #000000; -webkit-box-shadow: 0px 0px 15px #000000; box-shadow: 0px 0px 15px #000000;}
#submit { cursor: pointer; color:#ffffff; background-color: #000000;   padding: 2px 2px 2px 2px;   font-size: 12px;   border:1px solid #ffffff;   margin-top:5px;   -moz-box-shadow: 0px 0px 5px #000000;-webkit-box-shadow: 0px 0px 5px #000000;box-shadow: 0px 0px 5px #000000; }
textarea, input {border:1px solid #000000;color:#000000;background-color : #ffffff;  padding: 2px 2px 2px 2px;   font-size: 12px;   margin-bottom:5px;opacity: 0.8; }
textarea:hover, input:hover {border:1px solid #000000;color:#000000;background-color : #ffffff;  padding: 2px 2px 2px 2px;   font-size: 12px;   margin-bottom:5px;opacity: 1.0;-moz-box-shadow: 0px 0px 15px #000000; -webkit-box-shadow: 0px 0px 15px #000000; box-shadow: 0px 0px 15px #000000; }

@media screen and (min-width: 0px) and (max-width: 900px) {

#main {
 max-width:90%;
}

#features {
  display:none;
}

.lbox {

}

}

@media screen and (min-width: 900px) and (max-width: 1500px) {

#features {
  display:none;
}

#main-cont {
  margin: 0 auto;
  width:500px;
}

.lbox {

}

}

@media screen and (min-width: 1505px) {

#content {
  margin: 0 auto;
  width:1500px;

}

#features {
  font-family: 'Open Sans', sans-serif;
  font-size : 14px;
  margin: 20px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-top: 5px;
  height:200px;
  border-right: 1px solid #ccc;
  opacity: 0.6;
}
#features:hover {
  font-family: 'Open Sans', sans-serif;
  font-size : 14px;
  margin: 20px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-top: 5px;
  height:200px;
  border-right: 1px solid #ccc;
  opacity: 1.0;
}

.lbox {
  width:500px;
  float:left;
}

.form_start {
  border-bottom: 0px solid #fff;
  margin: 20px;
  padding-left: 30px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-top: 5px;
}

.login_form {
  border-left: 1px solid #ccc;
  height:200px;
  opacity: 0.6;
}
.login_form:hover {
  border-left: 1px solid #ccc;
  height:200px;
  opacity: 1.0;
}

#features h1 {font-family: WebPage4Me; padding-left:45px; text-align: left; font-size : 24px;}
#features h2 {padding-left:40px; text-align: left;}

#main-cont {
  margin: 0 auto;
  width:1500px;
}
.trennlinie {
  border-top: 1px solid #ccc;
}

#main {
  padding-left:70px;
  padding-right:70px;
}

}
