/*
 Theme Name:   Hashi Child
 Template:     hashi
*/

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

/* =Theme customization starts here
-------------------------------------------------------------- */
html {
    font-size:1em;
}
body {
    background:none;
}
body, header#header-main {
    width:94%;
    max-width:1200px;
}
header#header-main {
    top:0;
    width:100%;
}
h1 {
    font-size:1.2em;
}
h2 {
    font-size:1.1em;
}
h3, h4, h5, h6 {
    font-size:1em;
}
h1, .wisequot {
    color:#600;
}
h3.hmpg {
    color:white;
    background-color:#600;
    padding:2px 5px;
}
h3.hmpg a {
    color:white;
}
h3.hmpg a:hover {
    color:#ffb871;
}
main {
    width:50% !important; 
    text-align:left;
}
nav#lcol {
    width:16%;
}
aside#rcol {
    width:25%;
    background:none;
    background-color:white;
    border:none;
}
article {
    width:100% !important;
}
img.alignleft, img.alignright, img.aligncenter, img.alignnone {
    border: none;
    padding: 0;
}
footer {
    width:90%;
    margin:0 auto;
}
span.date {
    display:none;
}
#mysearch {
    position:absolute;
    right:0;
    top:210px;
}
.post-title {
    border:none;
    padding:0;
    margin-bottom:0.5em;
}
.wisequot {
    margin: 1.25em 0;
}
.leftbox, .rightbox {
    width:45%;
    margin-bottom:2em;
}
.leftbox {
    float:left;
}
.rightbox {
    float:right;
}
.text404 {
    margin:0 15em;
}
.floatright {
    float:right;
    padding:0.5em;
    max-width:50%;
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
 
.clearfix:after {
  clear: both;
}
 
.clearfix {
  zoom: 1; /* ie 6/7 */
}

header#header-main {
    background-color: #600;
    background-image: url("nashdr.png");
}

a, .post-title a {
    color: #600;
}

ul#mainnav a {
    background-image: none;
}

.wpp-list li {
    overflow: visible !important;
}

@media (max-width: 1294px) {
    .leftbox, .rightbox {
        float:none;
        width:100%;
    }
}

@media (max-width: 1200px) {
    body {
        width:100%;
		margin: 0 auto;
		background-image: url('wbg-smaller.png');
	}
	html {
		background-size: 1px 156px;
	}
	header#header-main {
                width:100%;
		height: 156px;
                margin-bottom:25px;
	}
	header#header-main #blog-title {
		top: 38px; left: 50px; right: 50px;
		font-size: 25px;
	}
	header#header-main #blog-tagline {
		bottom: 38px; left: 50px; right: 50px;
		font-size: 19px;
	}
	nav#lcol {
		width: 100%;
		margin-right: 0;
                margin-bottom: 12px;
                padding-bottom: 8px;
	}
	nav#lcol>* {
		margin-left: 16px; margin-right: 16px;
	}
	aside#rcol {
		background-image: none;
		padding: 10px 5px;
                margin:0 2px;
                width:29%;
	}
        main {
            width:61% !important;
            margin: 0 2%;
        }
        article {
            width:100% !important;
        }
        .text404 {
            margin:0 1em;
        }
	/* menu */
	main {
		clear: left;
	}
	nav#lcol>* {
		display: none;
	}
	nav#lcol a.menu-toggle {
		font-size: 16px;
		margin-top: 0; margin-bottom: 4px;
		padding: 0.25em 0.25em 0.25em 1.35em;
		line-height: 150%;
		background-image: url('../hashi/close_menu.png');
		background-position: left center;
		background-size: auto 1.15em;
		background-repeat: no-repeat;
		border-bottom: 1px solid #848484;
	}
	nav#lcol a.menu-toggle#menu-toggle-open {
		background-image: url('../hashi/open_menu.png');
		background-size: auto 1.25em;
		display: block;
	}
	nav#lcol span#m1:target~* {
		display: block;
	}
	nav#lcol span#m1:target~a#menu-toggle-open {
		display: none;
	}
        #mysearch {
            right:15px;
            top:182px;
        }
	.leftbox, .rightbox {
    	    width:45%;
    	    margin-bottom:2em;
	}
	.leftbox {
    	    float:left;
	}
	.rightbox {
    	    float:right;
	}
}    

@media (max-width: 1000px) {
    .leftbox, .rightbox {
        float:none;
        width:100%;
    }
}

@media (max-width: 714px) {
    main, article {
            width:98% !important;
    }
    main {
    	margin:0;
    }
    aside#rcol {
        float:none;
        width:98%;
        margin:0 auto;
	}
    header#header-main #blog-title {
        top: 8px;
        left: 8px;
        right: auto;
        font-size: 1em;
        white-space: normal;
        text-shadow:none;
    }
    .floatright {
        float:none;
        max-width:none;
    }
    #blog-tagline {
        display:none;
    }
    header#header-main {
        height: 40px;
    }
    #mysearch {
        top:66px;
    }    
}

@media (max-width: 549px) {
    header#header-main {
        background-image:none;
    }
}

@media (max-width: 340px) {
    #mysearch {
        top:46px;
    }    
}