/*
Theme Name:   Spun Child
Theme URI:   http://oldtokyo.com/spun/
Description:  Child theme for the Spun design
Author:     Steve Sundberg
Author URI:   http: //www.noodleman.com
Template:    spun
Version:    0.1
*/

@import url("../spun/style.css");

/*@import url(https://fonts.googleapis.com/css?family=Lora); */

@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

@import url(http://fonts.googleapis.com/css?family=Gentium+Book+Basic);

@import url(http://fonts.googleapis.com/css?family=IM+Fell+Great+Primer);

@import url('https://fonts.googleapis.com/css?family=Playfair+Display');

@media screen and (min-width: 1025px) {
#page {
width: 90%; }
#content {
margin: 0 0 0 30px ;}
#entry-content {
width: 100% ;}
}

@media screen and (max-width: 1024px) {
#page {
width: 90%; }
#content {
margin: 0 0 0 60px ;}
#entry-content {
width: 100% ;}
}

@media only screen and (min-width:321px) and (max-width: 480px) {
#page {
width: 100%; }
#masthead {
margin: 0 0 0 120px ;}
#entry-content {
width: 80% ;}
p {font-size: 2rem ;}
}

/* get rid of defaults */
	
	* {						/* selects everything on the web page */
		margin: 0px ;
		padding: 0px ;
		}
		
/* Customizations */

.hentry.no-thumbnail { /* keeps the circular thumbnails grey */
 background: #444 ;
}

#header #headerleft{
    display: block;
    text-align: center ;
    padding-top: 6px;
}

#masthead {
 opacity: 1 ;
 min-height: 70px;
}

#masthead img {			/* adjusts position of header image */
 position: absolute;
 top: 10px ;
 width: auto;
 max-height: 150px;
 left: 50%;
 margin-left: -242px;
 border: none ;
 -webkit-box-shadow: none;
  -moz-box-shadow: none ;
  box-shadow: none ;
}

.two-columns {			/* displays content in two columns */
	-moz-column-count: 2;
	-moz-column-gap: 10px;
	-moz-column-rule: none;
	-webkit-column-count: 2;
	-webkit-column-gap: 10px;
	-webkit-column-rule: none;
	column-count: 2;
	column-gap: 10px;
	column-rule: none;
	}

.three-columns {			/* displays content in three columns */
	-moz-column-count: 3;
	-moz-column-gap: 10px;
	-moz-column-rule: none;
	-webkit-column-count: 3;
	-webkit-column-gap: 10px;
	-webkit-column-rule: none;
	column-count: 3;
	column-gap: 10px;
	column-rule: none;
	}
	
.four-columns {			/* displays content in four columns */
	-moz-column-count: 4;
	-moz-column-gap: 8px;
	-moz-column-rule: none;
	-webkit-column-count: 4;
	-webkit-column-gap: 8px;
	-webkit-column-rule: none;
	column-count: 4;
	column-gap: 8px;
	column-rule: none;
	}
	
.five-columns {			/* displays content in five columns */
	-moz-column-count: 5;
	-moz-column-gap: 4px;
	-moz-column-rule: none;
	-webkit-column-count: 5;
	-webkit-column-gap: 4px;
	-webkit-column-rule: none;
	column-count: 5;
	column-gap: 4px;
	column-rule: none;
	}

.six-columns {			/* displays content in six columns */
	-moz-column-count: 6;
	-moz-column-gap: 4px;
	-moz-column-rule: none;
	-webkit-column-count: 6;
	-webkit-column-gap: 4px;
	-webkit-column-rule: none;
	column-count: 6;
	column-gap: 4px;
	column-rule: none;
	}


#secondary {			/* displays widget area */
	clear: both;
	/*display: none;*/
	padding: 50px 0;
}

#comments {						/* show comments toggle on/off with display */
  background-color: #fff;
  background-image: none;
  background-repeat: repeat;
  background-attachment: scroll;
  background-position: 0% 0%;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: auto auto;
  clear: both;
  display: block;
  padding-top: 0px;
  padding-right: 50px;
  padding-bottom: 50px;
  padding-left: 50px;
  margin-top: -20px ;
}

#respond {						/* comment box(?) */
  padding-top: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
}

		.footnote {
			font-size: 1.3rem ;
			}

.main-navigation {		/* Main navigation menu */
	color: #999;
	display: block;
	/*float: left ; */ /*right; */
	font-family: /*Quicksand, */Arial, Helvetica, Arial, sans-serif;
	-webkit-text-stroke: .35px; /* Hack to fix thin text in Windows */
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: bold ;
	letter-spacing: 1px ;
	margin: 130px 0 0 0;
	position: relative;
	text-align: center ; /* right; */
	text-transform: uppercase;
	width: 100%;
	
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation a {
color: #000 ;
}

.main-small-navigation {
 position: relative;
}

.main-navigation li {
float: none;
text-align: center;
margin: 0 10px 5px 10px;
position: relative;
display: inline-block;
}

.main-navigation li:before {
	content: "";
	margin: 0;
	padding: 0;
}
.main-navigation a {
	color: #000;
	display: block;
	padding: 4px 12px;
	text-decoration: none;
}
.main-navigation a:hover {
	color: #fff;
	display: block;
	background: #93B6B6;
	text-decoration: none;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	width: 0 140% ;
}
.main-navigation ul ul {
	float: left;
	opacity: 0;
	position: absolute;
		top: 2.2em /*1.6em*/;
		left: 0.5em;
	text-align: left;
	letter-spacing: 0px ;
	padding: 4px ;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	visibility: hidden;
	z-index: 99999;
}
.main-navigation ul ul ul {
	left: 100%;
	top: 0;
}

.main-navigation ul ul a {
	background: rgba(226,243,243,.8) /*(255,255,255,.9)*/;
	color: #333 ;
	font-weight: bold ;
	margin-left: 0px ;
	padding: 6px;
	text-align: center ;
	text-transform: none;
	width: 200% 180%; /*180px; */
}

.main-navigation ul ul a:hover {
	color: #fff ;
	background: #93B6B6 ;
	}
.main-navigation ul ul li,
.main-navigation ul ul li:hover {
	margin: 0 0 0 -10px;
}
.main-navigation ul ul ul li,
.main-navigation ul ul ul li:hover {
	margin: 0;
}
.main-navigation li:hover > a {
}
.main-navigation ul ul :hover > a {
}

/* .main-navigation ul ul a,
.main-navigation ul ul a:hover {
	color: #fff ;
	background: #93B6B6 ;
	}
*/

.main-navigation ul li:hover > ul {
	display: block;
	opacity: 1;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
	visibility: visible;
}
.main-navigation li.current_page_item a,
.main-navigation li.current-menu-item a {

}
.main-navigation ul li.current_page_item ul a,
.main-navigation ul li.current-menu-item ul a,
.main-navigation ul ul li.current_page_item a,
.main-navigation ul ul li.current-menu-item a {

}
.main-navigation ul ul .parent > a:after {
	color: #999;
	content: " » ";
	display: inline-block;
	margin: 0 0 0 .5em;
}

.site-navigation {
	position: /*absolute*/ relative ;
	/*margin: 0 0 400px 0 ;*/
}

.fixed {	/* ## for sticky header ## */
    position:fixed;
    top:0;
}

.single .hentry, .error404 .hentry, .page .hentry, .search-no-results .no-results		/* adjusts page padding */
{
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 1.5em;
  margin-left: 0px;
  padding-top: 0px;
  padding-right: 50px;
  padding-bottom: 70px;
  padding-left: 50px;
  width: 700px;
  height: auto;
  z-index: 10;
}
	
.site-content #nav-below .nav-previous a,				/* adjusts color/opacity of previous-next arrows */
.site-content #nav-below .nav-next a,
.site-content #image-navigation .nav-previous a,
.site-content #image-navigation .nav-next a {
color: rgba(170,183,192,1); 
display: block;
font-size: 200px;
font-size: 20.0rem;
line-height: 100px;
opacity: .3;
position: fixed;
top: 0;
width: 120px;
height: 100%;
z-index: 1;
}

.entry-meta {
	margin-top: -10px ;
	opacity: 1;
	}

.entry-title, .entry-title a
{
  color: #044;
  font-family: "Fredericka the Great", "Lora","Times New Roman", Times, serif;
  font-size: 4.9rem;
  font-style: italic;
  line-height: 1em;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: -40px;
  margin-left: 0px;
  text-align: center ;
}
	
.site-info {
	text-align: center ;
	opacity: 1 ;
	color: #000 ;
	}
	
.post-date, .cat-links, .tag-links	/* adjusts position category and tag links */
{
  display: block;
  max-width: 90%;
  text-align: center ;
  margin-left: 30px ;
  font-weight: 500 ;
  letter-spacing: 1px ;
  top: -60 px ;
}

.cat-links {font-family: Georgia, "Times New Roman", Times, Serif ; font-size: 1.6rem ;}

.cat-links  a {color: #3C5B6D ;}

.cat-links a:hover {color: #ccc ;}

.tag-links {margin-top: -20px ; font-family: Tahoma, "MS Trebuchet", Arial, Sans-serif ; font-size: 1.2rem ; /*font-variant: small-caps ;*/ font-weight: normal ; letter-spacing: 2px; color: #111 ;}

.tag-links a {color: #111 ;}

.tag-links a:hover {color: #ccc ;}

.tagged {font-size: 1.0rem ; font-family: Tahoma, "MS Trebuchet", Arial, Sans-serif  ; letter-spacing: 1px ; font-style: italic ; }

ol.quote {
	font: 1.6rem "IM Fell Great Primer", "Gentium Book Basic", Georgia, "Times New Roman", Times, Serif ;
	line-height: 3rem ;
	color: #036 ;
	}

p {font: 400 .9em "Open Sans", Tahoma, Arial, Sans-serif ; color: #330000 ; line-height: 1.8em ;}

/* p {font: .9em "Lora", Georgia, "Times New Roman", Serif ; color: #000 ; line-height: 1.8em ;} */

.page-header h1 {
  color: #fafafa;
  display: table-cell;
  font-family: "Lora","Baskerville","Times New Roman",serif;
  font-size: 3.2rem;
  font-style: italic;
  line-height: 32px;
  overflow-x: hidden;
  overflow-y: hidden;
  text-align: center;
  transition-property: background;
  transition-duration: 0.4s;
  transition-timing-function: ease-in-out;
  transition-delay: 0s;
  vertical-align: middle;
  word-wrap: normal;
  width: 140px;
  height: 110px;
  background-color: #708D8D /* #444444 */;
  background-image: none;
  background-repeat: repeat;
  background-attachment: scroll;
  background-position: 0% 0%;
  background-clip: border-box;
  background-origin: padding-box;
  background-size: auto auto;
  border-top-left-radius: 180px;
  border-top-right-radius: 180px;
  border-bottom-right-radius: 180px;
  border-bottom-left-radius: 180px;
	}

	.page-header h1 span {
		color: #fff;
		font-size: 2.1rem;
		line-height: 0rem ;
		vertical-align: top ;
		text-align: center ;
	}

	
.wp-caption-text
{
  color: #000;
  font-size: 1.3rem;
  line-height: 1.8rem ;
  text-align: center;
  font-family: Tahoma, "MS Trebuchet", Arial, Sans-serif ;
  letter-spacing: 1px;
  text-transform: none ;
}

.wp-caption .wp-caption-text
{
  margin-top: 0.8075em;
  margin-right: 0px;
  margin-bottom: 0.8075em;
  margin-left: 0px;
}

a img
{
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-right-width: 1px ;
  border-left-width: 1px ;
  border-top-style: solid;
  border-bottom-style: solid ;
  border-right-style: solid ;
  border-left-style: solid ;
  border-color: #bbb ;
  border-radius: 4px ;
  border-right-width-value: 1px;
  border-left-width-value: 1px;
  border-right-style-value: solid;
  border-left-style-value: solid;
  border-image-source: none;
  border-image-slice: 100% 100% 100% 100%;
  border-image-width: 1 1 1 1;
  border-image-outset: 0 0 0 0;
  border-image-repeat: stretch stretch;
 -webkit-box-shadow: 0px 2px 3px  0px rgba(51,51,51,1);
  -moz-box-shadow: 0px 2px 3px  0px rgba(51,51,51,1);
  box-shadow: 0px 2px 3px  0px rgba(51,51,51,1);
}

h2.comments-title
{
  padding-top: 50px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: auto;
  margin-left: 0px;
  font-size: 1.6rem ;
}

/* OLD STYLINGS FOR HOME PAGE CIRCLES
.blog .hentry a img, .archive .hentry a img, .search .hentry a img {
  -webkit-box-shadow: 1px 3px 3px 0px rgba(51,51,51,1);
  -moz-box-shadow: 1px 3px 3px 0px rgba(51,51,51,1);
  box-shadow: 1px 3px 3px 0px rgba(51,51,51,1);
  }
*/

/*
.blog .hentry a:hover img, .archive .hentry a:hover img, .search .hentry a:hover img
{
  border-top-left-radius: 180px;
  border-top-right-radius: 180px;
  border-bottom-right-radius: 180px;
  border-bottom-left-radius: 180px;
  filter: none;
  opacity: 1;
  transition-property: all;
  transition-duration: 0.3s;
  transition-timing-function: ease-in-out;
  transition-delay: 0s;
  width: 100%;
  height: 100%;
  -webkit-box-shadow: 1px 3px 3px 0px rgba(51,51,51,1);
  -moz-box-shadow: 1px 3px 3px 0px rgba(51,51,51,1);
  box-shadow: 1px 3px 3px 0px rgba(51,51,51,1);
}
*/

/* .blog .hentry */span.hometitle {	/*text control for text-in-circle in tags, categories*/
 	position: absolute;
 	top: 73px;
 	width: 100%;
 	vertical-align: top ;
 	text-align: center;
 	font-style: italic ;
 	font-weight: bold ;
 	color: #004747 ;
 	text-shadow: 1px 1px 0px rgba(255, 255, 255, 1);
 	filter: none;
	-webkit-filter: none;
	-webkit-filter: none; 
	-moz-filter: none;
	-o-filter: none;
	-ms-filter: none;
	filter: none;
        opacity: 1;
}

span.hometitle:hover {
	color: #330000 ;
	/*text-shadow: 1px 1px 0px rgba(256,256,256, 1) ;*/
	}

.blog .hentry {
 position: relative;
}


#colophon {
  color: #000;
  clear: both;
  font-family: Trebuchet,Helvetica,Arial,sans-serif;
  font-size: 1.1rem;
  padding-top: 100px;
  padding-right: 0px;
  padding-bottom: 50px;
  padding-left: 0px;
  text-align: left;
  text-transform: uppercase;
  width: 100%;
}

	#colophon a {
		color: #000;
		opacity: 1 ;
	}


	#colophon:hover a {
		color: #ccc;
		opacity: 1 ;
	}
	
	.copyright {
		font-family: "Lora", Georgia, "Times New Roman", Times, serif ;
		font-size: 1.4rem ;
		text-transform: none ;
		}
		
.pp_gallery {
margin-top: 5px; /* default -50px */
}


/* LINKS */

a {
	color: #333;
	text-decoration: none;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
a {
	color: #333;
}
a:hover,
a:focus,
a:active {
	color: #333;
	text-decoration: none;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}

a.web {
	color: #09c;
	text-decoration: underline;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
a.web:visited {
	color: #09c;
}
a.web:hover,
a.web:focus,
a.web:active {
	color: #09c;
	text-decoration: none;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}

a.web-red {
	color: #c00;
	text-decoration: underline;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}
a.web-red:visited {
	color: #c00;
}
a.web-red:hover,
a.web-red:focus,
a.web-red:active {
	color: #c00;
	text-decoration: none;
	transition: all .4s ease-in-out;
	-webkit-transition: all .4s ease-in-out;
	-moz-transition: all .4s ease-in-out;
	-o-transition: all .4s ease-in-out;
}

blockquote {
	text-indent: 24px ;
	text-align: justify ;
	}

blockquote p{
	font: 1.8rem "IM Fell Great Primer", "Gentium Book Basic", Georgia, "Times New Roman", Times, Serif ;
	line-height: 3rem ;
	color: #036 ;
	}

blockquote em {font-style: italic ;}

p.lg-quote {
	font: italic 2.4rem Georgia, "Times New Roman", Times, Serif ;
	line-height: 3rem ;
	color: #aaa ;
	text-indent: 24px ;
	}

blockquote li {
	list-style-position: outside ;
	list-style-type: circle;
	margin-left: 20px ;
	text-indent: 0px ; 
	font: 1.8rem "IM Fell Great Primer", "Gentium Book Basic", Georgia, "Times New Roman", Times, Serif ;
	line-height: 3rem ;
	color: #036 ;
	}

	
/* Turns home page & search thumbnails into circle ... or not */

/* TURN CIRCLES TO SQUARES */
.hentry.no-thumbnail .blog .hentry a .attachment-post-thumbnail .archive .hentry a .attachment-post-thumbnail .search .hentry a .attachment-post-thumbnail .hentry a:hover img .hentry a:hover img .hentry a:hover img {
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 border-radius: 0;
}

.blog .hentry a .attachment-post-thumbnail, .archive .hentry a .attachment-post-thumbnail, .search .hentry a .attachment-post-thumbnail
{
  border-top-left-radius: 8px; /*180px*/
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  filter: url("inc/desaturate.svg#greyscale");
  opacity: 0.8;
  transition-property: all;
  transition-duration: 0.3s;
  transition-timing-function: ease-in-out;
  transition-delay: 0s;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* Same as above but for hover */
.blog .hentry a:hover img, .archive .hentry a:hover img, .search .hentry a:hover img
{
  border-top-left-radius: 8px; /*180px*/
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  filter: none;
  opacity: 1;
  transition-property: all;
  transition-duration: 0.3s;
  transition-timing-function: ease-in-out;
  transition-delay: 0s;
  width: 100%;
  height: 100%;
}

/* Displays title in home page circles  display */
/*also change content-home.php and add functions.php & text-in-circles.js */
	
.blog .hentry span.hometitle {			
     width: 96%;
     position: absolute;
     top: 40px; /* 73px ; */
     display: table-cell;
     font-family: "Lora", Georgia, "Times New Roman", serif;
     /*font-size: 28px;*/
     font-size: 1.7rem;
     font-style: italic ;
	 font-weight: bold ;
	 color: #004747 ;
     text-shadow: 1px 1px 0px #fff;
     text-align: center;
     line-height: 1.2;
     vertical-align: top;
     word-wrap: normal;  
	word-break: keep-all ;   
     overflow: hidden;
     transition: background .4s ease-in-out;
     -webkit-transition: background .4s ease-in-out;
     -moz-transition: background .4s ease-in-out;
     -o-transition: background .4s ease-in-out;
     -ms-transition: background .4s ease-in-out;
    }
     
    .blog .hentry {
     position: relative;
    }
     
    @media screen and ( max-width: 800px ) {
            .blog .hentry span.hometitle {
                    font-size: 24px;
                    font-size: 2.4rem;
            }
    }

.blog .hentry span.hometitle {
    display: none;
}

.blog .hentry a:focus span.hometitle,
.blog .hentry a:hover span.hometitle {display: block;}
	
/* Color thumbnails turn grey on-hover */

.blog .hentry a .attachment-post-thumbnail,
.archive .hentry a .attachment-post-thumbnail,
.search .hentry a .attachment-post-thumbnail {
	border-radius: 180px;
	filter: none;
	-webkit-filter: none;
	-webkit-filter: none; /* Older versions of webkit */
	-moz-filter: none;
	-o-filter: none;
	-ms-filter: none; /* IE 10 */
	filter: none; /* IE 9 */
        opacity: 1;
}

.blog .hentry a:hover img,
.archive .hentry a:hover img,
.search .hentry a:hover img {
		filter: url(desaturate.svg#greyscale);	/* place in root or inc */
		filter: grayscale(100%);
        -webkit-filter: grayscale(100%);
        -webkit-filter: grayscale(1);
        -moz-filter: grayscale(100%);
        -o-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        opacity: .4;
        -webkit-opacity: .4;
        -moz-opacity: .4;
}

/* MISC LAYOUT STYLINGS */

.two-columns {
	-moz-column-count: 2;
	-moz-column-gap: 10px;
	-moz-column-rule: none;
	-webkit-column-count: 2;
	-webkit-column-gap: 10px;
	-webkit-column-rule: none;
	column-count: 2;
	column-gap: 10px;
	column-rule: none;
	}

/* MISC FONT STYLES */

.typewriter strong {
	font: 1.1em "Oxygen Mono" ;
	font-weight: 700 ;
	color: #000 ;
	}

.typewriter p {
	font: 0.7em "Oxygen Mono" ;
	line-height: 1.9em ;
	color: #000 ;
	}

footnote {
	font: .8em Geneva, Arial, Sans-serif ;
	letter-spacing: 0.1em ;
	line-height: 0.6em ;
	}
	
/* PRINT STYLINGS */


/* CONTACT FORM STYLINGS */

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea
	{
 border: 1px solid #333;
}