/*
Theme Name: limotheme
Author: THISISSAF.COM
Description: SAF theme for Lisa Morfeld
License: ©2017 thisissaf.com
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: limotheme
Version: 1.0 
Theme URI:WWW.THISISSAF.COM
Tags: thisissaf, saf, lisa morfeld, design, branding, bonn, germany
Author URI: WWW.THISISSAF.COM

*/



html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-family: "open-sans", sans-serif;
	-webkit-text-size-adjust: none; 
	-webkit-font-smoothing: antialiased;
	text-align:center;
	/*-webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;*/
  	height:100%;
	width:100%;
	background:#fff;
}

body {
	margin: 0;
	height:100%;
	width:100%;
	

}



*:focus {outline:none !important}
a {
	color:inherit;
	text-decoration:none;
	background-color: transparent;
}

b,
strong {
	font-weight: 400;
}

img, svg {
	width:100%; height:auto; float:left; display:block; border: 0; 
}


/**
 * 3.0 - Typography
 */

body,
button,
input,
select,
textarea {
	font-size: 10px;
	line-height: 18px;
	font-family: 'Open Sans', sans-serif;
	color:#333;
}

h1
{
	clear: both;
	font-weight: 400;
	margin: 0;
	font-style:normal;
	font-size: 22px;
	line-height:28px;
	letter-spacing:3px;
	xxtext-decoration:underline;
	
	
	
}

.knop{
	font-size:18px;
	line-height:24px;
	text-decoration:underline;
}


.wp-caption{}
.wp-caption-text{}
.sticky{}
.screen-reader-text{}
.gallery-caption{}
.bypostauthor{}
.alignright{}
.alignleft{}
.aligncenter{}


.pagename{
	position:fixed; display:block; z-index:4; transform-origin: center center; transform: rotate(-90deg) ;
-webkit-transform: rotate(-90deg) ;
-moz-transform: rotate(-90deg) ;
-o-transform: rotate(-90deg) ;
-ms-transform: rotate(-90deg) ; width:100%;font-size:18px;
	line-height:24px; height:54px; letter-spacing:2px; right:-50%; margin-right:22px; margin-top:-26px; top:50%; pointer-events:none;
}

img.ajax-loader{width:auto!important; height:auto!important;}


input, textarea{ margin:5px 0px; border:0px; width:300px; padding:6px; display:inline-block;}

input.wpcf7-submit{width:auto; background:#111; color:#fff; cursor:pointer; font-size:16px; letter-spacing:2px; padding:10px 15px 12px 15px; border-radius:25px; -moz-border-radius:25px; -webkit-border-radius:25px;}

input.wpcf7-submit:hover{ background:#555;}

		
div.wpcf7-response-output.wpcf7-display-none.wpcf7-validation-errors{float:none; display:inline-block; border:none; color:#FFFFFF;}

span.wpcf7-not-valid-tip {position:absolute; top:-2px; text-align:right; right:15%; pointer-events:none;width:70%; display:block;}

	
.knop:hover{
	opacity:0.4;
}


a{cursor:pointer;}

h1 a{text-decoration:underline;}

#maincontent a{text-decoration:underline;}

a:hover{ opacity:0.4; }

h2
{
	clear: both;
	font-weight: 400;
	margin: 0;
	font-style:normal;
	display:inline-block;
	font-size: 27px;
	line-height:36px;
	margin-bottom:10px;
	letter-spacing:3px;
	text-decoration:underline;
	text-transform:uppercase;
	
}


h3
{
	clear:both;
	font-size:60px;
	font-weight:400;
	font-style:normal;
	line-height:60px;
	margin:0px;
	padding:0px;
	
}

p{margin:0px; float:left; width:100%; display:block;}
i{font-style:normal;}


.imagetitle p{float:none; display:inline-block; width:auto;}

.description{width:100%; height:100px; position:relative; margin:0px 0px; float:left; display:block; color:#eee; cursor:pointer;}	
	
	.description:hover{color:#aaa;}
	
	.activedesc{color:#111;}
	
	

#mainmenu{
	width:160px;
	position:fixed;
	left:30px;
	top:0px;
	bottom:0px;
	display:block;
	margin:0px;
	padding:0px;
	z-index:2;

}


#menubutton{
	width:40px; height:40px;
	right:20px; top:20px;
	z-index:4; position:fixed; display:block; cursor:pointer;
}

#menubar1{
	position:absolute; top:14px; left:6px; height:2px; width:28px; display:block; background:#111;
	-webkit-transition: all 500ms; /* Safari */
    transition: all 500ms;
	
}

#menubar2{
	position:absolute; left:6px; bottom:14px; height:2px; width:28px; display:block; background:#111;
	-webkit-transition: all 500ms; /* Safari */
    transition: all 500ms;
}

#menubar1.openmenu{
	position:absolute; top:19px; left:4px;  height:2px; width:32px; display:block; background:#111;
	transform: rotate(135deg) ; -webkit-transform: rotate(135deg) ; -moz-transform: rotate(135deg) ; -o-transform: rotate(135deg) ;
	-ms-transform: rotate(135deg) ;  transform-origin: centre centre;  z-index:3;
}

#menubar2.openmenu{
	position:absolute; left:4px; bottom:19px; height:2px; width:32px; display:block; background:#111;
	transform: rotate(225deg) ; -webkit-transform: rotate(225deg) ; -moz-transform: rotate(225deg) ; -o-transform: rotate(225deg) ;
	-ms-transform: rotate(225deg) ;  transform-origin: centre centre;  z-index:3;
}



#rightbar{
	width:40px;
	position:fixed;
	right:30px;
	top:0px;
	bottom:0px;
	display:block;
	margin:0px;
	padding:0px;
	z-index:2;
}
			
.tableit{
	display:table;
	position:absolute;
	width:100%; height:100%; 
	left:0px; top:0px;
}

.cellit{
	display:table-cell;
	position:relative;
	width:100%;
	height:100%; 
	left:0px;
	top:0px;
	text-align: left; 
	vertical-align: middle;
}

.centerit{
	display:inline-block;
	float:none;
	vertical-align: middle;
	position:relative;
	width:100%;
	height:auto;
	
}

.taleft{
	text-align:left;
}

.taright{
	text-align:right;
}


.tacenter{
	text-align:center;
}

#maincontent{
	position:absolute;
	left:220px;
	right:170px;
	height:auto; 
	display:block;
	opacity:0;
	
}

#postcontainer{
	margin-top:50px;
	margin-right:0px;
	margin-left:0px;
	margin-bottom:0px;
	float:left;
	width:100%;
	height:auto;
	display:block;
	position:relative;
}


#maincontent strong{
	font-size:32px;
	line-height:42px;
}


.knop{
	float:right;
	text-align:right;
	width:100%;
	height:auto;
	margin:0px 0px;
	cursor:pointer;
}

#overlaymenu{
width:100%; height:100%; position:fixed; top:0px; left:0px; z-index:1; background-color:#EBEAE4; display:none;
	
}


#backup{width:100%; height:100%; z-index:-1; position:fixed; top:0px; left:0px; display:block;
background-position: no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  }


#backup2{right:77px;  z-index:-1; position:fixed; top:0px; bottom:50px; left:200px; display:block;
background-repeat: no-repeat;
background-position:center center;
background-attachment:absolute; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; opacity:0;
  }

#maincontent { font-size:15px; line-height:23px;}

.overlaymenustuff{display:none;}

#credits{
	position:absolute; 
	bottom:25px;
	left:0px;
	width:100%;
	text-align:center;
}

.waypoint{
	 margin:0px 0px 50px 0px;
	 float:left;
	 width:100%;
	 height:auto;
	 position:relative;
	 display:block;
	 opacity:0.3;
	 transition-property: opacity;
     transition-duration: 0.8s;
}

.waypoint img{float:none; display:inline-block; width:100%; height:auto; -}

.imagetitle{
	position:absolute; right:-30px;
	
	transform-origin: center right 0px; -webkit-transform-origin: center right 0px; top:0%; display:block;transform: rotate(90deg) ;
-webkit-transform: rotate(-90deg) ;
-moz-transform: rotate(-90deg) ;
-o-transform: rotate(-90deg) ;
-ms-transform: rotate(-90deg) ; width:100%; text-align:center; height:40px; font-size: 10px;
	line-height: 18px;
}

.clickmenu{cursor:pointer;}

colorit{display:inline-block; float:none;}
.show{
	opacity:1;
}

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



@media screen and (max-width: 1000px) {
	
	
	


}


@media screen and (max-width: 850px) {

#mainmenu{
	width:160px;
	position:fixed;
	left:30px;
	top:60px;
	bottom:auto;
	height:auto;
	display:block;
	margin:0px;
	padding:0px;
	z-index:2;

}

#maincontent{
	position:absolute;
	left:80px;
	right:130px;
	height:auto; 
	display:block;
	opacity:0;
	top:200px;
	
}




#backup{width:100%; height:100%; z-index:-1; position:fixed; top:0px; left:0px; display:block;
background-position: no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  }


#backup2{right:77px;  top:250px; bottom:0px; left:00px;  }
  

}


@media screen and (max-width: 600px) {

}