/* styles for html5 sample */

/* Main Colors 
    Yellow: #e9cb00;
    Light blue: #0bcadb;
*/

* {margin:0;padding:0;} 

html {
  margin: 0;
  padding: 0;
  height: 100%;
}
body {
  background: #242424; /*url(gfx/bg.jpg) no-repeat;*/
  background-attachment:fixed;
  background-position:center;
  height: 100%;
  font-family: 'PT Sans', arial, serif;
  font-size: 18px;
  line-height: 22px;
  color: #ffffff;
  margin: 0 0 0 0;
  padding: 0;
}

p {margin: 0 0 1em 0;}

h1, h2, h2.entry-title a {
  font-family: 'Copse', Georgia, serif;
  color: #e9cb00;
  font-weight: 500;
  
  }
  
h2, h3 {
  margin-bottom: 0;
  clear: left;
  }
  
h2.entry-title {
}

h1 {
	font-size: 2.5em;
	line-height: 1.1em;
	margin: 0 0 0.4em 0;
  }
  
h2 {
	font-size: 2.3em;
	line-height: 1.1em;
	margin: 0.4em 0;
}
 
strong {
  }
    
p {}
  
h3 {
	font-size: 1.5em;
	line-height: 1.1em;
	margin: 0.4em 0;
	font-weight: 900;
	color: #e9cb00;
  } 

time {
  font-size: 0.65em;
  }

a {text-decoration: none;
  color: #0bcadb;
}

.tmukooTags {
 color: #0bcadb;
}

a:hover {
  text-decoration: underline;
  color: #fff;
  }

a:hover h3 {
  color: #fff;
  }

a img {
  border: 0;
  }

section, nav {
	display: block;
}

/* Gallery overlay */

#gallery {
  display: none;
  height: 100%;
  width: 100%;
  text-align: center;
  }
#galleryBg {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: #242424;
  background-attachment:fixed;
  background-position:center;
  }
  
#galleryWrap {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  }

#galleryCenter {
  width: 100%;
  height: 5%;
  margin: 0 auto;
  text-align: center;
  }

.closeGallery {
  float: left;
  width: 90%;
  margin: 0 3% 0 2%;
  padding: 10px 0 10px 0;
  text-align: center;
  font-weight: 900;
  border-bottom: 1px solid white;
  font-size: 1.5em;
  cursor: pointer;
  }
  
.closeGallery.bottom {
  border-top: 1px solid white;
  border-bottom: 0;
}

.galleryItemContent {
  display: none;
  }  
.galleryPicture {
  width: 152px;
  height: 152px;
  float: left;
  cursor: pointer;
  }
#bigPicture {
  display: none;
  position: absolute;
  top: 10px;
  left: 0%;
  padding: 1%;
  text-align: center;
  border: 1px solid white;
  background: #000;
  -moz-box-shadow: 0px 0px 5px #000;
  -webkit-box-shadow: 0px 0px 5px #000;
  box-shadow: 0px 0px 5px #000;
  width: 90%;
  margin: 0 4%;
  }
  
#closeImage {
  display: block;
  width: 100%;
  height: 24px;
  font-weight: 900;
  margin-bottom: 5px;
  cursor: pointer;
  color: #0bcadb;
  }
  
#closeImage:hover {
  text-decoration: underline;
}
      
#photos, #drawings {
  /* width: 470px; */
  width: 96%;
  min-width: 308px;
  float: left;
  text-align: left;
  padding: 1em 0;
  margin: 0 1%;
  }
  
#photos h2, #drawings h2 {
  margin-bottom: 10px;
  }

#wrap {
 width: 90%;
 padding: 0 5%;
 height: 100%;
  }
  
#main {
  width: 100%;
  max-width: 1024px;
  height: 100%;
}

nav#navi, #tricolorBg {
	padding-top: 2.1em;
	width: 100%;
	float: left;
	}
	
#tricolorBg {
  padding: 5% 0;
  min-height: 90%; 
}
	
#content {
	float: left;
	text-shadow: #000 1px 3px 6px;
 }

#frontpage #content div.post {
  padding-bottom: 0;
  }

#content div.post {
  float: left;
  clear: left;
   }
   
#content ul {
  margin: 0 0 1em 1em;
}

#content img {
  float: left;
  display: block;
  border: 2px solid #000;
  }
  
#content img.alignright {float: none;}

.post, .post p, .post h3, .post .tmukooTags, .singlepost {
	width: 100%;
	float: left;
	clear: left;
	margin: 0.2em 0;
}
.wp-caption, #video, video {
	max-width: 100% !important;
	height: auto !important;
	margin: 1em 0;
}
.singlepost img {
	max-width: 100% !important;
	height: auto !important;
	margin: 0.4em 0;
}

.post {
	margin: 0.8em 0;
}

#content img.attachment-post-thumbnail {
  border: 2px solid #000;
  float: left;
  clear: left;
  width: 150px;
  margin: 0.4em 0;
  }


nav#navi ul {
	  margin: 0 0 0 0;
	  padding: 0;
	  list-style: none;
}
nav#navi ul li {
  display: block;
  float: left;
  clear: left;
  margin: 0 0 0 0;
  padding: 0;
  list-style: none;
  }
  
nav#navi ul li a img {
  margin: 0;
  padding: 0;
  float: left;
  }

nav#navi ul li a {
	color: #ffffff;
	color: #e9cb00;
	font-size: 1.6em;
	line-height: 1.4em;
}

nav#navi ul li a:hover, nav#navi ul li.selected a {
	color: #0bcadb;
	text-decoration: none;
}

.contact {
 color: #aaa;
 clear: both;
 text-align: left;
 width: 260px;
}


@media only screen and (min-width: 772px){
#tricolorBg {
	background: url(gfx/tricolorlines.png) repeat-y -705px;
	padding-left: 40px;
}
nav#navi ul li a {
	font-size: 2em;
	line-height: 1.4em;
}

nav#navi ul {
	  margin: 10px 0 0 0;
	  padding: 0;
	  list-style: none;
}

nav#navi ul li {
  display: block;
  float: right;
  clear: right;
  margin: 0 0 0 0;
  padding: 0 18px 0;
  list-style: none;
  }
  
.contact {
 text-align: right;
}

h1 {
	font-size: 3.5em;
	line-height: 1.1em;
}
    nav#navi {
		max-width: 300px;
		width: 50%;
	}
	#tricolorBg {
		width: 50%;
	}
}

@media only screen and (min-width: 799px){
nav#navi ul {
	  margin: 18px 0 0 0;
	  padding: 0;
	  list-style: none;
}
	body {
	font-size: 14px;
  	line-height: 18px;
  }
    nav#navi {
    max-width: 280px;
		width: 32%;
	}
	#tricolorBg {
		width: 62%;
	}
	
	#content img.attachment-post-thumbnail {
  		float: right;
  		clear: none;
  		width: 150px;
  }
  .post p, .post h3, .post .tmukooTags {
		clear: none;
		width: 65%;
	  }
}
@media only screen and (min-width: 980px){
    #photos {
  margin: 0 0 0 2%;
}

#drawings {
  margin: 0 2% 0 0;
}

}

/*-- Footer --*/
footer {
	clear:both;
}
#footerImg { 
 
    }
.clearer {
	clear: both;
}

/* comments */
#content .vcard img {
  display: none;
}

#commentform input {
  border: 1px solid #ccc;
  color: #fff;
  background: #222;
}

#commentform p {
  float: left;
  clear: left;
  display: block;
}

#commentform textarea {
  border: 1px solid #ccc;
  color: #fff;
  background: #222;
}

p.comment-form-comment label {
  font-weight: 900;
  float: left;
  clear: left;
  display: block;
  }
  

textarea#comment {
  display: block;
  float: left;
  clear: left;
  
  }
  
p.form-allowed-tags {
  display: block;
  float: left;
  clear: left;
}

.captchaSizeDivLarge #si_image_com{
  display: block;
  float: left;
  clear: left;
}
  
#commentform #submit {
  cursor: pointer;
  background: #0bcadb;
  border: #000;
  padding: 5px;
  display: block;
  float: left;
  clear: left;
  margin-left: 0;
}

.wp-caption img {
  display: block;
}

#bigPicture .wp-caption {
  width: 100% !important;
  margin: 0;
  text-align: center;
  
}  


#bigPicture .wp-caption img {
  display: inline;
  max-width: 98% !important;
  height: auto !important;
  margin: 0 auto 0.6em auto;
  }


.wp-caption-text {
  font-style: italic;
  clear: left;
}

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
/*content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;*/ /* thank you Erik J - negate effect of float*/
}

