/*
Theme Name: Dash
Version: 3.0
Author: Eric Schwarz
Author URI: http://schwarztech.net */

/* ///////////////////////////////////////////////////////////////////// 
//  00 - Fonts #D8FF00, 3E10B2
///////////////////////////////////////////////////////////////////// */


@import 'fonts/platypi.css';

@import 'fonts/ibm-type.css';

/* ///////////////////////////////////////////////////////////////////// 
//  01 - Global 
///////////////////////////////////////////////////////////////////// */

body {
margin: 0;
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
font-family: "IBM Plex Sans", "Avenir Next", Avenir, "Helvetica Neue", Helvetica, Corbel, Arial, sans-serif;
font-size: 16px;
line-height: 24px;
background-color: #F1C7B1;
}

a, a:visited {	
color: #5D6796;	
-webkit-tap-highlight-color: #5D6796;
background: transparent;
text-decoration: none;
}


a:hover {
color: #FFF;
background: #000;
text-decoration: none;
}

a:active {
color: #222;
background: transparent;
text-decoration: none;
}

#content a, #content a:visited {	
  color: #F46C22;
text-decoration: none;
}


#content a:hover {
color: #016;
background: none;
text-decoration: underline;
	}
	
#content a:active {
color: #FFF;
text-decoration: underline;
	}


#content .actionbutton{
	text-align: center;
	font-family: "Platypi", "IBM Plex Sans", "Avenir Next", Avenir, "Helvetica Neue", Helvetica, Corbel, Arial, sans-serif;
	margin: 60px 0 30px 0;
}

#content .actionbutton a, .actionbutton a:visited {
	background: #F00;
	background: linear-gradient(0deg,rgba(255, 0, 0, 0.9) 0%, rgba(255, 0, 0, 0.7) 50%, rgba(255, 0, 0, 0.5) 100%);
	color: #FFF;	
	-webkit-tap-highlight-color: #C41;
	text-decoration: none;
	margin: 2px auto 2px auto;
	padding: 5px 20px 10px 20px;
	border: 1px solid #F00;
	border-radius: 10px;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4);
	letter-spacing: 1px;
	font-weight: bold;
	font-size: 24px;
	text-align: center;
	text-shadow: 1px 1px 1px #660000;
	}

#content .actionbutton a:hover {
	background-color: rgba(255, 0, 0, 0.9);
	color: #FFF;	
	text-decoration: none;
	}

#content .actionbutton a:active {	
	color: #FFF;
	background-color: rgba(255, 0, 0, 1);	
	text-decoration: none;
	}


hr {
color: #DDD;
background-color: #DDD;
height: 1px;
border: 0;
margin-top: 30px;
margin-bottom: 30px;
}

#pageBody {
max-width: 900px;
margin: 0 auto;
padding: 0;
background: transparent;
}



ul {
list-style: square;
}

#header {
width: 100%;
margin: 0;
padding: 0;
}

#header .inner {
margin: 0;
padding: 0;
color: #fff;
background: #F46C22 url(images/header.png) bottom center repeat;
background-size: 54px 54px;
text-align: center;
}

#header .navigation {
margin: 0;
padding: 0;
background: #F59662 url(images/navigation.png) top center repeat;
background-size: 54px 54px
}

#header .navigation ul {
margin: 0;
padding: 5px;
list-style: none;
color: #FFF;
overflow: hidden;
background: transparent;
}

#header .navigation li {
float: left;
	width: 16%;
	border-right: 1px solid #F46C22;
}

#header .navigation li:first-child {
	width: 17%;
	background: #F00;
	background: linear-gradient(0deg,rgba(255, 0, 0, 0.9) 0%, rgba(255, 0, 0, 0.6) 50%, rgba(255, 0, 0, 0.3) 100%);
	border-right: 1px solid #FF0000;
	}
	
#header .navigation li:last-child {
	width: 17%;
	border-right: none;
	}


#header .navigation a, #header .navigation a:visited {
display: block;
color: #FFF;
text-decoration: none;
letter-spacing: 1px;
text-transform: uppercase;
font-weight: bold;
font-size: 14px;
padding: 10px;
text-align: center;
text-shadow: 1px 1px 1px #101820, 2px 2px 2px #F46C22;
}

#header .navigation a:hover {
color: #DDD;
background: #F46C22;
background: rgba(244, 108, 34, 0.5);
}

#header .navigation a:active {
color: #8CB6E1;
background: #101820;
text-shadow: none;
}


#header .inner a, #header .inner a:visited, #header .inner a:hover, #header .inner a:active {
background: none;
border: none;
}

#sitelogo {
margin: 5px;
}

.subnavigation {
text-align: center;
text-transform: uppercase;
letter-spacing: 1px;
font-size: 80%;
}

#content {
width: 100%;
margin: 0;
padding: 0;
float: none;
}

#content .inner {
margin-left: 0; 
padding: 20px 100px 20px 100px;
min-height: 450px;
color: #101820;
font-family: "IBM Plex Sans", "Avenir Next", Avenir, "Helvetica Neue", Helvetica, Corbel, Arial, sans-serif;
background: transparent;
word-wrap: break-word;
}

#footer {
clear: both;
width: 100%;
margin: 0 0 -20px 0;
padding: 0;
}

#footer .inner {
letter-spacing: 1px;
text-transform: uppercase;
font-weight: bold;
font-size: 10px;
line-height: 16px;
text-align: center;
color: #8CB6E1;
background: #101820;
padding: 20px 20px 30px 20px;
}

/* ///////////////////////////////////////////////////////////////////// 
//  03 - Content Formatting 
///////////////////////////////////////////////////////////////////// */

#content .inner .entry, #content .inner .entryindex {
padding-bottom: 0;
margin-bottom: 0;
clear: both;
}

#content .inner .entryindex {
padding-bottom: 15px;
margin-bottom: 10px;
}

#content .inner ul {
padding-left: 15px;
margin-left: 25px;
margin-top: 10px;
margin-bottom: 10px;
}

#content .inner ul li {
margin-bottom: 15px;
list-style: square;
}


#content .inner ol {
margin-left: 1px;
padding-left: 10px;
}

#content .inner ol li{
margin-left: 30px;
margin-bottom: 20px;
line-height: 20px;
}

h1, h2, h3, h4, h5, h6 {
font-family: "Platypi", "IBM Plex Serif", "Avenir Next", Avenir, "Helvetica Neue", Helvetica, Corbel, Arial, sans-serif;

} 

h1 {
	display: none;
}

h2 {
text-align: center;
color: #FFF;
border-bottom: 1px solid #F46C22;
border-bottom: 4px solid transparent;
padding: 15px;
border-image: url(images/navigation.png) 15 round;
font-weight: bold;
font-weight: 600;
font-size: 36px;
line-height: 46px;
letter-spacing: 1px;
padding: 0 0 8px 0;
margin: 30px 0 20px 0;
text-shadow: 2px 2px 1px #F59662, 3px 3px 1px #101820, 4px 4px 2px #F46C22;
}

h3 {
font-weight: bold;
font-weight: 600;
font-size: 26px;
line-height: 28px;
text-transform: none;
letter-spacing: -1px;
padding: 0;
color: #101820;
margin: 40px 0 20px 0;
}

h3.booktitle {
margin-bottom: 40px;
text-align: center;
}

#content h3.booktitle a, a:visited, #content .bookcover a, #content .bookcover a:visited {	
  color: #F46C22;
text-decoration: none;
}

#content h3.booktitle a:hover, #content .bookcover a:hover {
background: transparent;
border-bottom: none;
color: #016;
	}
	
#content h3.booktitle a:active, #content .bookcover a:active {
border-bottom: none;
color: #FFF;
	}


h4 {
font-weight: bold;
font-weight: 600;
font-size: 22px;
line-height: 24px;
text-transform: none;
letter-spacing: -1px;
padding: 0;
margin: 10px 0 0 0;
}

#content p {
margin-bottom: 20px;
text-align: left;
}

#content img{
max-width: 100%;
height: auto;
}

.pageimage, .pageimagefloat, .youtube-video-container {
/* border: 5px solid #FFF; */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
box-shadow: 1px 1px 5px #101820;
margin: 20px 0 20px 0;
}

.pageimagefloat {
margin: 20px 0 20px 40px;
float: right;
}

.bookcover {
text-align: center;
}

.bookcover img {
float: right;
box-shadow: 1px 1px 5px #101820;
margin: 10px 0px 60px 50px;
}


.youtube-video-container {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.youtube-video-container::after {
  display: block;
  content: "";
  padding-top: 56.25%;
}

.youtube-video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


blockquote {
font-weight: normal;
font-weight: 400;
font-style: italic;
color: #888;
border-left: 2px solid #EEE;
padding-left: 20px;
margin-left: 0;
}

code {
font-family: "IBM Plex Mono", Menlo, Monaco, "Courier New", Courier, monospace;
font-size: 90%;
line-height: 130%;
color: #EEE;
background: #333;
-webkit-border-radius: 3px;	
-moz-border-radius: 3px;
border-radius: 3px;
display: block;
padding: 5px;
}


/* ///////////////////////////////////////////////////////////////////// 
//  04 - Lexie Code 
///////////////////////////////////////////////////////////////////// */



@-ms-viewport { width: 1024px; }


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

	body {
	margin: 0;
	padding: 0;
	}

}


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

	body {
	margin: 0;
	padding: 0;
	}
	
	
	#header .navigation ul {
	padding: 5px 7px;
	}
	
	#header .navigation li {
	float: none;
	width: 100%;
	border-right: none;
	border-bottom:  1px solid #F46C22;
	}
	
	#header .navigation li:last-child, #header .navigation li:first-child {
	width: 100%;
	border-right: none;
	}
	
	#header .navigation li:first-child {
	background: #F00;
	background: linear-gradient(90deg,rgba(255, 0, 0, 0.9) 0%, rgba(255, 0, 0, 0.7) 50%, rgba(255, 0, 0, 0.4) 100%);
	border-bottom: 1px solid #FF0000;
	}
	
	#header .navigation li:last-child {
	border-bottom: none;
	}

		
	#sitelogo {
	height: 75px;
	width: 250px;
	}
	

	#s {
	font-size: 9px;
	width: 140px;
	}
	
	#content .inner {
	padding: 30px;
	}
	
	#content .inner .archivescategory {
	margin: 0;
	padding: 0;
	width: 100%;
	float: none;
	}
	
	#content .inner .archivesmonth {
	margin: 0;
	padding: 0;
	width: 100%;
	float: none;
	}
	
	.pageimagefloat {
margin: 20px auto 20px auto;
width: 100%;
float: none;
}

.bookcover {
text-align: center;
}

.bookcover img {
float: none;
box-shadow: 1px 1px 5px #101820;
margin: 10px 0px 10px 0;
}



}



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

.subnavigation {
text-align: center;
text-transform: uppercase;
letter-spacing: 0px;
font-size: 60%;
}

	#sitelogo {
	height: 75px;
	width: 250px;
	}

}