/* 
Title:		laurelblossom.com screen styles
Author: 	gordon@slickfishstudios.com
*/
@charset "UTF-8";
/* CSS Document */




/*============================================================
GLOBALS
============================================================*/
body {
	font: 14px Helvetica, Arial, Verdana, sans-serif; 
	line-height: 1.5em; 
	color: #898989;
	background: #000;

	overflow-x: hidden;
	overflow-y: auto;
}
/*============================================================
TYPEKIT
============================================================*/

.futura {
	font-family: "futura-pt",sans-serif;
}

.penna {
  font-family: "penna-connected";
}
.serif-bold {
	font-family: "trajan-pro",sans-serif;
	font-style: normal;
	font-weight: 700;
}
.serif-fun {
	font-family: Georgia, 'trajan-pro', serif;
	font-style: italic;
	font-weight: bold;
}


/*============================================================
MISC STYLES
============================================================*/
a:link, a:hover, a:visited, a:active {
	outline: none;
	text-decoration: underline;
	color: #ffcc99; /* peach */
}
a:hover {
	text-decoration: underline;
	color: #ff9933; /* orange */
}

a.backtotop {
	color: #7f9db9;
	text-decoration: none;
	display: block;
	text-align: center;
	font-size: .85em;
	margin-bottom: 10px;
}
a.backtotop:hover {
	color: #355a7c;
	text-decoration: underline;
}
.breadcrumb {
	font-size: 1.1em;
	color: #676767;
	font-family: "futura-pt",sans-serif;
	text-transform: lowercase;
	margin-bottom: 1em;
	letter-spacing: .1em;
}
.breadcrumb a {
	text-decoration: underline;
	color: #555;
}
.breadcrumb a:hover {
	text-decoration: underline;
	color: #ffcc99; /* peach */
}
pre {
	white-space: pre-wrap;
	font: 14px Helvetica, Arial, Verdana, sans-serif; 
	line-height: 150%;
}
h1 {
	font-size: 4em; 
	font-weight: normal;
	font-family: "penna-connected",sans-serif;
	padding: .5em 0 0 0;
	margin: 0 0 1em 0;
	color: #ff9933; /* orange */
	clear: both;
	display: block;
}
.header {
	color: #cc9967; /* dusty */
	font-family: "futura-pt",sans-serif;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-size: 1.1em;
	display: block;
	margin-bottom: .7em;
}
h2 {

}
.names {
	color: #ffcc99; /* peach */
	display: block;
	text-align: right;
	margin-right: 100px;
	padding: 3px 0 0 0;
	font-size: .9em;
	
}
.title {
	color: #ff9933; /* orange */
	font-size: 1.2em;
	letter-spacing: .1em;
	font-family: "futura-pt",sans-serif;	
}
.upper {
	text-transform: uppercase;
}
.tight {
	padding-bottom: 0px;
	margin: 0;
}

.under {
	text-decoration: underline;
}
.centerit {
	text-align: center;
	display: block; 
}

.red {
	color: #cb3131;
}
.white {
	color: #fff;
}
.dusty {
	color: #cc9967; /* dusty */
}
.peach {
	color: #ffcc99; /* peach */
}
.orange {
	color: #ff9933; /* orange */
}
.gray {
	color: #666;
}

.blue {
	color: #7f9db9;
}
.darkblue {
	color: #4b667f;
}
.bright-blue {
	color: #1f7ec4; /* bright-blue */
}
hr {
	color: #555;
	background: #555;
	height: 1px; 
	border: 0;
	width: 80%;
	margin: 15px auto 10px auto;
}
.clear, .clearit {
	clear: both;
}
.clearleft {
	clear: left;
}
.clearright {
	clear: right;
}

p.copy {text-indent: 25px;}

.small {
	font-size: .9em; 
	font-weight: normal;
	text-transform: none;
}
.big {
	font-size: 1.2em; 
}
.medium {
	font-size: 1.1em; 
}
.left_side {
	float: left;
	padding: 0;
	margin: 0 15px 3px 0;
	text-align: left;
	line-height: normal;
}
.right_side {
	float: right;
	padding: 0;
	margin: 0 0 0 15px;
	text-align: left;
}
.center {
	text-align: center;
}
.lefty {
	display: block;
	text-align: left;
}
.righty {
	display: block;
	text-align: right;
}
.justify {
	text-align: justify;
	display: block;
}


/* LISTS */
ul {
	list-style-type: circle;
	color: #aaa;
	padding-left: 25px;
}

.shadowit {
	-webkit-box-shadow:  1px 0px 5px 0px rgba(0, 0, 0, .4);
	box-shadow:  1px 0px 5px 0px rgba(0, 0, 0, .4);
}
.borderit {
	border: 1px solid #a8a8a8;
}
.caption {
	color: #555;
	font-size: .9em;
	line-height: normal;
}
.special b {
	color: #ff9933; /* orange */
}
.pad50 {
	padding-top: 50px;
}
.pad40 {
	padding-top: 40px;
}
.pad25 {
	padding-top: 25px;
}
.pad15 {
	padding-top: 15px;
}

ul.listLinks {
	font-size: 1.3em;
	color: #999;
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
}
ul.listLinks li {

}
ul.listLinks li a {
	background: url(../images/white50.png);
	padding: .5em;
	display: block;
	margin-bottom: .5em;
	color: #4b667f;
}
ul.listLinks li a:hover {
	background: #fff;
}
ul.listLinks li a span {
	color: #1f7ec4; /* bright-blue */
}
ul.listLinks li a em {
	color: #666;
}


/*============================================================
CONTAINER
============================================================*/
.container {

}
/*============================================================
HEADER
============================================================*/

#slideshow {
	width: 100%;
	min-height: 275px;
	background-position: center top;
	background-repeat: no-repeat;
	background-color: #000;
	padding: 0;
	margin: 0 auto;
	z-index: -1;
	overflow: hidden;
}
#replace {
	width: 100%;
	min-height: 275px;
	background-position: center top;
	background-repeat: no-repeat;
	background-color: #000;
	padding: 0;
	margin: 0;
	z-index: -1;


	display: none;
}
#home #replace {
	background-image: url(../images/slides/home_slide1.jpg);
}
#bio #replace {
	background-image: url(../images/slides/bio_slide1.jpg);
}
#poet-laureate #replace {
	background-image: url(../images/slides/poet-laureate01.jpg);
}
#poetry #replace {
	background-image: url(../images/slides/poetry_slide1.jpg);
}
#editorial #replace {
	background-image: url(../images/slides/editorial_slide1.jpg);
}
#writers-community #replace {
	background-image: url(../images/slides/writers-community_slide1.jpg);
}
#book-reviews #replace {
	background-image: url(../images/slides/book-reviews_slide1.jpg);
}
#contact #replace {
	background-image: url(../images/slides/contact_slide1.jpg);
}



.logo {
	margin-top: -275px;
	margin-bottom: 2em;
	position: relative;
}
.logo .fourcol {
	background: url(../images/top-left-dark.png) repeat-x left top;
	border-right: 1px solid #fff;
	min-height: 264px;
}
.logo .eightcol {

}
.logo a.logo_btn {
	display: block;
	background: url(../images/laurel-blossom.gif) no-repeat left top;
	width: 239px;
	height: 70px;

	margin-top: 90px;
	float: right;
	overflow: hidden;
	outline: none;
	border: 0;
	text-decoration: none;
}
.logo a.logo_btn:hover {
	background-position: left -70px;
}
.logo a.logo_btn span {
	display: block;	
	text-indent: -10000px;
}


/*============================================================
NAVBAR
============================================================*/

.navBar {
	position: absolute; /* critical to get the position and drop menu to show */
	margin: 0;
	z-index: 66;
	top: 232px;

	padding: 0;
	width: 100%;
	min-height: 30px;

	float: left;
	display: inline;
}
.navBar ul#nav {
	padding: 0;
	list-style: none;
	float: left;
	width: 100%;
	margin: 0;
	margin-left: 0;

	background: url(../images/black70.png);
	border-top: 1px solid #000;
	border-right: 1px solid #000;
}
.navBar ul#nav li {
	float: left;
	display: block;
	min-height: 30px;
	background: none;
	padding: 0;
	margin: 0;
}
.navBar ul#nav li a {
	display: block;
	/*min-height: 30px;*/
	line-height: 30px;

	font-family: "futura-pt",sans-serif;
	font-size: .85em;
	text-decoration: none;
	color: #ccc; 
	outline: none;
	border: 0;
	border-right: 1px solid #000;
	border-left: 1px solid #000;

	padding: 0 1em;

	text-transform: uppercase;
	letter-spacing: .1em;
}

.navBar ul#nav li a:hover {
	border: 0;
	border-right: 1px solid #333;
	border-left: 1px solid #333;
	outline: none;
	text-decoration: none;
	background: url(../images/black70.png);
	background: url(../images/peach_nav_over.png);

	color: #ff9933; /* orange */
	color: #fff; /* white */
}
.navBar ul#nav li a.last {
	margin-right: 0;
}


/*============================================================
NAVBAR DROP MENU
============================================================*/

.navBar ul#nav li ul {
	width: 200px;
	background: none;
	background: #f0ba84; /* dark peach */
	padding: 0;
	margin: 0;
	float: left;
}
.navBar ul#nav li ul li {
	padding: 0;
	margin: 0;
	min-height: 20px;
}
.navBar ul#nav li ul li a {
	width: 100%;

	color: #333;
	font-size: 1em;


	line-height: 130%;

	padding: .4em 0;
	margin: 2px 0;
	border: 0;
	text-transform: capitalize;
}
.navBar ul#nav li ul li a span {
	display: block;
	padding: 0 .9em;
}
.navBar ul#nav li ul li a:hover {
	background: url(../images/peach_nav_over.png);
	border: 0;
	color: #fff;
}

/* END DROP MENU ++++++++++++++++++++++++++++++ */

/*============================================================
BODY Linking Current classes
============================================================*/
body#home .navBar ul#nav li#home-nav a,
body#bio .navBar ul#nav li#bio-nav a,
body#poet-laureate .navBar ul#nav li#poet-laureate-nav a,
body#poetry .navBar ul#nav li#poetry-nav a,
body#editorial .navBar ul#nav li#editorial-nav a,
body#writers-community .navBar ul#nav li#writers-community-nav a,
body#book-reviews .navBar ul#nav li#book-reviews-nav a,
body#contact .navBar ul#nav li#contact-nav a
{
	background: url(../images/black70.png);
	border: 0;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;

	color: #ffcc99; /* peach */
}
body#home .navBar ul#nav li#home-nav a:hover,
body#bio .navBar ul#nav li#bio-nav a:hover,
body#poet-laureate .navBar ul#nav li#poet-laureate-nav a:hover,
body#poetry .navBar ul#nav li#poetry-nav a:hover,
body#editorial .navBar ul#nav li#editorial-nav a:hover,
body#writers-community .navBar ul#nav li#writers-community-nav a:hover,
body#book-reviews .navBar ul#nav li#book-reviews-nav a:hover,
body#contact .navBar ul#nav li#contact-nav a:hover
{
	border: 0;
	border-right: 1px solid #999;
	border-left: 1px solid #999;
	outline: none;
	text-decoration: none;
	background: url(../images/peach_nav_over.png);

	color: #fff; 


}


/*============================================================
BODY DROP MENU Linking Current classes
============================================================*/
body#poetry .navBar ul#nav li#poetry-nav ul,
body#editorial .navBar ul#nav li#editorial-nav ul
{
	width: 200px;
	background: none;
	background: #f0ba84; /* dark peach */
	padding: 0;
	margin: 0;
	float: left;

}
body#poetry .navBar ul#nav li#poetry-nav ul li a,
body#editorial .navBar ul#nav li#editorial-nav ul li a
{
	background: none;
	border: 0;
	color: #333;
	padding: .4em 0;
	margin: 2px 0;
}
body#poetry .navBar ul#nav li#poetry-nav ul li a.current,
body#editorial .navBar ul#nav li#editorial-nav ul li a.current
{
	background: url(../images/peach_nav_current.png);
	border: 0;
	color: #fff;
	padding: .4em 0;
	margin: 2px 0;
}
body#poetry .navBar ul#nav li#poetry-nav ul li a:hover,
body#editorial .navBar ul#nav li#editorial-nav ul li a:hover
{
	background: url(../images/peach_nav_over.png);
	border: 0;
	color: #fff;
}
body#poetry .navBar ul#nav li#poetry-nav ul li a.current:hover,
body#editorial .navBar ul#nav li#editorial-nav ul li a.current:hover
{
	background: url(../images/peach_nav_over.png);
	border: 0;
	color: #fff;
}

/*============================================================
MAIN
============================================================*/
.main .fourcol {
	margin-right: 0;

}
.main .floatit {
	width: 60%;
	margin: 1em 20% 1em 20%;
}
.main .vert {
	max-width: 300px;
}
.main {
	color: #ccc;
	line-height: 160%;
	min-height: 550px;
	font-size: .9em; /* 13px / 14px = .857em */
}
/*============================================================
CONTAINER > footer
============================================================*/
.footer { 
	font-size: .8em;
	color: #8a7d74; /* soft tan */
	line-height: 140%;
	margin-top: 3em;
	padding-right: 0;
	padding-left: 0;
	overflow: auto;
}
.footer .row {
	background: #ffcc99;
	border-top: 1px solid #fff;
	min-height: 50px;


}
.footer p {
	padding-top: 10px;
}
.footer p.left {
	padding-left: 1em;
	text-align: left;
}
.footer p.middle {
	text-align: center;
}
.footer p.right {
	padding-right: 1em;
	text-align: right;
}
.footer a {
	text-decoration: none;
	color: #8a7d74; /* soft tan */
}
.footer a:hover {
	text-decoration: underline;
	color: #5d534c; /* dusty orange */
}

/*============================================================
CONTAINER > footer > SOCIAL MEDIA BOX
============================================================*/
#social-media-box {
	margin-top: 5px;
}
#social-media-box a.social-media {
	width: 100px;
	height: 30px;
	overflow: hidden;
	display: block;
	float: right;
	margin: 3px 0px 0 3px;
	border: none;
	background-repeat: no-repeat;
	background-position: left top;
	
	display: none; /* Removed on 03/26/19 per Laurel's request */
}
#social-media-box span {
	display: none;
}
#social-media-box a.social-media:hover {
	background-position: left -30px;
}
#social-media-box .facebook {
	background: url(../images/facebook_btn.png) no-repeat left top;
}
#social-media-box .twitter {
	background: url(../images/twitter_btn.jpg) no-repeat left top;
}
#social-media-box .blog {
	background: url(../images/blog_btn.png) no-repeat left top;
}






/*============================================================
MEDIA CALLS
============================================================*/

/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&       1030      &&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* Smaller screens */

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

	.logo .eightcol {
		padding-left: 0;
		padding-right: 0;
		width: 100%;
	}


	.navBar ul#nav {
		float: left;
		padding: 0;
		margin: 13px 0 0em 0;
		border-top: 0;
		border-right: 0;
		border-bottom: 0;
		width: 100%;
	}
	
	.navBar ul#nav li a {
		border-right: 1px solid #333;
		border-left: 1px solid #333;
	}
	.navBar ul#nav li a:hover {
		border-right: 1px solid #555;
		border-left: 1px solid #555;
	}

	.main .fourcol {
		margin-right: 3.8%;
	}
	
}



/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&       1030      &&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* Smaller screens */

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

	.navBar {
		top: 220px;
	
		padding: 0;
		width: 100%;
		margin: 0;
	}
}


/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&       767       &&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* Mobile */

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

	.footer .row {
		padding: 1em 0;
	}
	
	.footer p.left {
		padding: 0;
	}
	.footer p.middle,
	.footer p.right
	{
		padding-top: 0px;
	}
	.footer p.left,
	.footer p.middle,
	.footer p.right
	{
		margin: 0 0 1em 0;
		text-align: left;
	}
	#social-media-box {
		margin-top: 0px;
	}
	#social-media-box a.social-media {
		float: left;
		margin: 3px 0px 0 3px;
	}
	pre {
	
		white-space: pre-line;
	
	
	}

}


/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&       480       &&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* &&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&& */
/* Tiny */

@media only screen 
and (max-width: 480px) {
	.navBar {
		top: 190px;
	}
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
 
	#slideshow {
		display: none;
	}
	#replace {
		display: block;
	}
	.navBar {
		top: 190px;
	}



}


/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
	.navBar {
		top: 160px;
	}
}