/*
Theme Name: Light Roast
Version: 2.1
Theme URI: http://www.chrisskoglund.com/light-roast-about.html
Author: Chris Skoglund
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Author URI: http://www.chrisskoglund.com
Description: Light Roast is a simple, light, responsive theme ideal for a blogger seeking a professional, minimalist look. It includes three layouts options -- no sidebar, left sidebar, and right sidebar. Three customizable menu locations allow for easy, intuitive navigation on any device. NOTE FOR V2.0: This revised version contains some design changes to improve readability. If you would prefer to keep the old design, you can do so in the customizer by selecting "revert to old design."
Tags: two-columns, left-sidebar, right-sidebar, sticky-post
Text Domain: light-roast
*/

body, html, div, blockquote, img, figure, label, p, h1, h2, h3, h4, h5, h6, pre, ul,
ol, li, dl, dt, dd, form, a, fieldset, input, th, td {
 	margin:0;
 	padding:0;
 	font-size: 100%;
 	outline:0;
 	line-height: 1.5em;
-ms-word-wrap: break-word;
word-wrap: break-word;
 }

/* Global */
.screen-reader-text {
	display: none;
}

body {
	font-family: 'Merriweather', 'Times New Roman', serif;
	font-size: 14px;
	margin: 10px 0 0 0;
	max-width: 100%;
}

a:link, a:visited {
	color: #75B4BD;
}

a:hover {
	text-decoration: none;
}

img {
	max-width: 100%;
	overflow: hidden;
}

li {
	margin: 5px 0;
}

ol, ul {
	margin: 10px 30px;
}

p {
	padding: 10px 0;
}

h1, h2, h3, h4, h5, h6 {
	padding: 5px 0 5px 0;
	font-weight: 500;
}

h1 {
	font-size: 30px;
}

h2 {
	font-size: 24px;
}

h3 {
	font-size: 20px;
}

h4, h5, h6 {
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	font-weight: 300;
}

h4 {
	font-size: 30px;
}

h5 {
	font-size: 24px;
}

h6 {
	font-size: 20px;
}

pre {
	white-space: pre-wrap;
	

}

/* Superscript */
sup {
    vertical-align: super;
    font-size: smaller;
}

/* Subscript */
sub {
    vertical-align: sub;
    font-size: smaller;
}

i, cite, em, var, address, dfn {
    font-style: italic;
}

cite:before {
	content: '~';
}

cite {
	padding-top: 20px;
}

acronym {
	border-bottom:1px dotted;
	cursor:help;
    cursor: help;
}

dl, dt, dd {
	padding: 5px 0;
}

fieldset {
    display: block;
	border: double black;
	padding: 10px 20px;
	margin: 10px;
}

legend {
    text-align: center;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 18px;
	text-transform: uppercase;
	padding: 0 10px;
}


/* Block Quotes */

blockquote {
  background: #f1f1f1;
  border-left: 5px solid #ccc;
  margin: 10px 10px;
  padding: 15px 10px;
  quotes: "\201C""\201D""\2018""\2019";
}

blockquote:before {
  color: #ccc;
  content: "\201C";
  font-size: 30px;
  margin-top: 10px;
  margin-right: 10px;
}

blockquote p {
	display: inline;
	padding: 5px;
}

/* Tables */

table {
	max-width: 100%;
	display: inline-block;
	overflow-x: auto;
}

tbody {
	border: black 1px solid;
	max-width: 100%;
	margin-left: 10px;

}

tr, th, td {
	padding: 10px;
}

th {
	background-color: #f1f1f1;
}

/* Input */

input.radio {
	margin: 5px;
}

label {
	text-transform: uppercase;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 18px;
}

input[type = "text"], input[type="email"], input[type="url"], textarea {
	width: 100%;
	margin-top: 5px;
}

input[type="submit"] {
	cursor: pointer;
	font-size: 14px;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
}


/* Buttons */
 input[type="submit"], .edit-link a:link, .edit-link a:visited, .reply a:link, .reply a:visited, a.more-link {
	font-family: 'Josefin Sans', sans-serif;
    font-size: 14px;
	padding: 8px 10px;
    text-align: center;
    background-color: white;
	border: 1px solid black;
	color: black;
	text-transform: uppercase;
    cursor: pointer;
    transition: 200ms;
    text-decoration: none;
}

input[type="submit"]:hover, .edit-link a:hover, a.more-link:hover, .reply a:hover {
	border: 1px solid #1c7c7c;
	color: #1c7c7c;
	transition: 200ms;
}

/* Search Form */

button.search-form{
  	overflow: hidden;
 	width: 100%;
 	white-space: nowrap;
}

.search-submit {
	background-color: white;
    border: none;
    color: black;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 20px;
    cursor: pointer;
}

.search-submit:hover {
	color: #75B4BD;
}

.search-form input{
  	width: 100%;
	border: 1px solid;
    border-color: #ccc #ccc #bbb;
 	float: left;
 	color: black;
 	padding: 0 15px 0 15px;
	height: 50px;
	font-size: 16px;
}

.search-form button {
	height: 47px;
	margin-left: -36px;
	padding-left: 10px;
	margin-top: 1px;
	font-size: 18px;
	border: none;
}

/* Galleries */

.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

.sticky {
	display: block;
}

.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}

.alignleft {
	display: inline;
	float: left;
	margin-right: 10px;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 10px;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.bypostauthor {
	display: block;
}

.wp-caption-text {
	font-size: 12px;
}

.widget-title {
	margin-bottom: 10px;
}




/* Header */
.skip-link {
	display: none;
}



.site-header {
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
}

.site-branding {
	text-align: center;
}

.site-title {
	font-size: 40px;
	font-weight: 300;
	transition: 200ms;
	padding: 0;
}



.site-title a:link, .site-title a:visited {
	text-decoration: none;
	color: black;
}

.site-title a:hover {
	color: #75B4BD;
}

.site-description {
	padding: 10px 0 5px 0;
	font-weight: 300;
	font-size: 16px;
}

/* Main Menu */

.menu-toggle {
	display: none;
}

.main-navigation {
	margin-top: 10px;
	text-align: center;
	border-top: 1px solid #C5C5C5;
	border-bottom: 1px solid #C5C5C5;
	font-weight: 500;
}

.main-navigation ul {
	display: inline-block;
	list-style: none;
	margin: 0;
	position: relative;
	
}

.main-navigation li {
	display: inline-block;
	margin: 0;
	position: relative;
}


.main-navigation li a:link, .main-navigation li a:visited {
	padding: 10px 20px;
}

.main-navigation li:hover > a {
	color: #75B4BD;
}

.main-navigation ul li ul {
	position: absolute;
	left: 0px;
	display: none;
	z-index: 99999;
	text-align: left;
	color: white;
	border: 1px solid #C5C5C5;
	border-top: 4px solid #75B4BD;
}

.main-navigation ul li ul li {
	background-color: white;
	min-width: 200px;
}

.main-navigation ul li ul li:hover {
}

.main-navigation ul li ul li:hover > a {
	color: #75B4BD;
}

.main-navigation ul li ul li ul {
	position: absolute;
	top: -4px;
	margin: 0;
	padding: 0 20px;
	left: 100%;
}

.main-navigation ul li ul li ul li {
		margin: 0 -20px;	
}

.main-navigation ul li ul a:link, .main-navigation ul li ul a:visited {
}


.main-navigation a:link, .main-navigation a:visited {
	display: block;
	text-decoration: none;
	color: black;
}

.main-navigation ul li > a:after {
  	font-family: FontAwesome;
   	content: "\f107";
   	padding-left: 5px;
} 

.main-navigation ul li:hover > ul {
	display: block;
	transition: 200ms;
}

.main-navigation ul li ul li a:after{
	font-family: FontAwesome;
	content: "\f105";
	float: right;
}

  .main-navigation li > a:only-child:after { content: ''; }  

/* Floating Menu */

#floating-header-wrapper {
	background-color: white;
	position: fixed;
	top: -100px;
	width: 100%;
	max-height: 48px;
	line-height: 48px;
    box-shadow: 2px 2px 4px #b1b2b2;
    z-index: 1;
}

#floating-header {
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 10px;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	font-weight: 300;
}

#floating-title {
	float: left;
	display: inline;
	font-size: 24px;
	line-height: 48px;
}

#floating-header a:link, #floating-header a:visited {
	color: black;
	text-decoration: none;
	line-height: 48px;
	display: inline-block;
}

#floating-header a:hover {
	color: #75B4BD;
}

#floating-title a:hover {
	color: #75B4BD;
}

#floating-header ul {
	margin: 0;
	float: right;
	position: relative;
	z-index: 99999999;
}

#floating-header li {
	display: inline-block;
	margin: 0;
	position: relative;
}

#floating-header ul li {
	display: inline-block;
	padding: 0 10px;
}

#floating-header ul li ul {
	position: absolute;
	display: none;
	left: 0px;
	top: 48px;
	z-index: 999999;
	text-align: left;
	border: 1px solid #C5C5C5;
	border-top: 4px solid #75B4BD;
	background-color: white;
}

#floating-header ul li ul li a:link, #floating-header ul li ul li a:visited {
	background-color: white;
	min-width: 180px;
	padding: 10px 0;
	line-height: 20px;
}

#floating-header ul li ul li a:link, #floating-header ul li ul li a:Visited {
	line-height: 20px;
}

#floating-header ul li ul li:hover {
}

#floating-header ul li ul li:hover > a {
	color: #75B4BD;
}

#floating-header ul li ul li ul {
	position: absolute;
	top: -4px;
	margin: 0;
	left: 100%;
}

#menu-expand-icon {
	display: inline;
	float: right;
	cursor: pointer;
	font-size: 32px;
	line-height: 48px;
	padding-left: 20px;
}

#menu-expand-icon .fa-bars {
	line-height: 48px;
}

#menu-expand-icon:hover {
	color: #75B4BD;
}

#floating-header ul li:hover > a {
	color: #75B4BD;
}

#floating-header ul li ul a:hover {
	color: #75B4BD;
}

#floating-header ul li > a:after {
  	font-family: FontAwesome;
   	content: "\f107";
   	padding-left: 3px;
} 

#floating-header ul li:hover > ul {
	display: block;
	transition: 200ms;
}

#floating-header ul li ul li a:after{
	font-family: FontAwesome;
	content: "\f105";
	float: right;
	padding-right: 20px;
}

#floating-header li > a:only-child:after { content: ''; }  

/* Slider Menu */

#slide-navigation {
	position: fixed;
	z-index: 9999;
	top: 0;
	left: -285px;
	width: 285px;
	background-color: white;
	height: 100%;
	overflow-y: auto;
	font-size: 17px;
	box-shadow: 2px 2px 4px #b1b2b2;

}

#slide-navigation-menu {
	clear: both;
	border-top: 1px solid #C5C5C5;
}

#slide-navigation-menu ul {
	list-style-type: none;
	font-weight: 500;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	margin: 0 20px;
}

#slide-navigation-menu ul li {
	margin: 5px 0;
}

#slide-navigation-menu ul > li {
		padding-bottom: 5px;
}

#slide-navigation-menu ul li ul li {
	padding: 0;
}

#slide-navigation-menu li {
	border-bottom: 1px solid #C5C5C5;
}

#slide-navigation ul li ul li {
	border-bottom: none;
}

#slide-navigation-menu a:link, #slide-navigation-menu a:visited {
		text-decoration: none;
}

#slide-navigation-menu a:hover{
	text-decoration: underline;
}

#slide-navigation-menu ul ul {
	border-bottom: none;
}

#slide-navigation .children {
	display: block;
}

#close-icon {
	float: right;
	cursor: pointer;
	font-size: 30px;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: bold;
	border-left: 1px solid #C5C5C5;
	color: #75B4BD;
	padding: 0 10px;
}

#close-icon:hover {
	color: white;
	background-color: #75B4BD;
}

/* Site Footer */
.site-footer {
	clear: both;
	border-top: 1px solid #C5C5C5;
	min-height: 50px;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	padding-top: 10px;
}

.site-copyright {
	text-align: center;
	max-width: 1080px;
	margin: auto;
	font-size: 14px;
}

.copyright-symbol {
	font-family: sans-serif;
	margin-right: 2px;
}

.site-info {
	max-width: 1080px;
	padding-top: 10px;
	margin: auto;
	text-align: center;
	padding-bottom: 10px;
}

.site-footer a:link, .site-footer a:visited {
	text-decoration: none;
}


.site-footer a:hover {
	text-decoration: underline;
}

.entry-meta {
	text-align: left;
	max-width: 100%;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 14px;
	padding-left: 0;
	border-left: 2px solid #75B4BD;
	padding-left: 10px;
}


/* Primary */

#content {
	max-width: 1080px;
	margin: 20px auto;
	padding: 10px 10px;
	overflow: hidden;
}

#primary {
	width: 100%;
}



/* Secondary/Sidebar - Not displayed in this CSS. */

#secondary {
	display: none;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	font-weight: 500;
}


.widget-title {
	text-align: left;
	font-size: 18px;
}

#secondary li {
border-bottom:1px solid #C5C5C5;
}

#secondary li a:link, #secondary li a:visited {
	text-decoration: none;
}

#secondary li a:hover {
	text-decoration: underline;
}


/* Page */

.page-title {
	font-size: 40px;
	margin-bottom: 20px;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	font-weight: 300;
}

/* Blog */

.post {
	margin-bottom: 10px;
	display: block;
	border-bottom: 1px solid #C5C5C5;
	padding-bottom: 20px;
}

.updated {
	display: none;
}

.published {
	display: inline;
}

.entry-title {
	font-size: 34px;
	font-weight: 500;
	text-align: left;
}

h1.entry-title {
	padding: 0;
	margin: 0;
}

.entry-title a:link, .entry-title a:visited {
	text-decoration: none;
	color: black;
}

.entry-title a:hover {
	color: #75B4BD;
}

.entry-content {
	padding: 20px 0;
	clear: both;
}

.entry-footer {
	padding: 5px 0;
}

.comments-link {
}

.edit-link {
	display: block;
	clear: both;
	margin-top: 30px;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
}

.tags-links {
	display: block;
	margin-top: 20px;
}

.tags-links a:link, .tags-links a:visited {
	font-family: 'Josefin Sans', sans-serif;
    font-size: 14px;
	padding: 8px 10px;
	margin-top: 10px;
    text-align: center;
    background-color: white;
	border: 1px solid black;
	color: black;
	text-transform: uppercase;
    cursor: pointer;
    transition: 200ms;
    margin-right: 10px;
    text-decoration: none;
    display: inline-block;
}

.tags-links a:hover {
	border: 1px solid #1c7c7c;
	color: #1c7c7c;
	transition: 200ms;
}

/* Post Footer */
.post-navigation {
	padding-bottom: 20px;
}

.nav-links {
	padding-bottom: 10px;
	font-size: 16px;
	margin-bottom: 10px;
	overflow: hidden;
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
	border-bottom: 1px solid #C5C5C5;
}

.nav-links a:link, .nav-links a:visited {
	text-decoration: none;

}

.nav-links a:hover {
	text-decoration: underline;
}

.nav-previous {
	float: left;
	max-width: 50%;
}

.nav-next {
	float: right;
	display: inline;
	text-align: right;
	max-width: 50%;
}

.cat-links {
	font-family: 'Josefin Sans', sans-serif;
	text-transform: uppercase;
}

/* Comments */


ol.comment-list, ol.children {
	list-style: none;
}

.comment-body {
	border-left: dotted 1px grey;
	padding: 0 10px;
	margin: 30px 0;
}

.says {
	display: none;
}

.avatar {
	float: left;
	width: 50px;
	height: 50px;
}

.comment-content {
	clear: both;
	overflow: hidden;
	padding: 0 10px;
}

.reply {
	padding: 20px 10px;
}

.comment-meta .fn {
	padding: 0 10px;
}

.comment-meta .fn a:link, .comment-meta .fn a:visited,
.comment-metadata a:link, .comment-metadata a:visited {
	text-decoration: none;
}

.comment-metadata {
	float: left;
	padding: 0 10px;
}

.comment-metadata .edit-link {
	margin: 10px 0;
}

#respond {
	margin: 20px 0;
	border-top: 1px solid #C5C5C5;
	padding: 20px 0;
}

#reply-title {
	font-size: 24px;
}

.comments-link::before {
	content: '/';
	padding: 0 10px;
}


/* Responsive Styles */

/* Tablet Screen */
@media screen and (max-width: 782px) {
h1, .entry-title, h4 {
	font-size: 28px;
}

h2, h5 {
	font-size: 24px;
}

h3, h6 {
	font-size: 22px;
}


#content {
	margin-top: 50px;
}

.site-header {
	display: none;
}

#floating-header-wrapper {
	top: 0;
}

#floating-header ul {
	display: none;
}



.entry-content {
	padding: 10px 0;
}

.comments-link {
	display: inline;
}

.comments-link a {
	white-space: nowrap;
}



}


/* Phone Screen*/
@media screen and (max-width: 480px) {
	.site-title {
		font-size: 24px;
	}
	
	.site-title:hover {
		font-size: 25px;
	}
	
	.site-description {
		font-size: 12px;
	}
	
	.nav-next {
		margin-top: 20px;
		clear: both;
		text-align: center;
		max-width: 100%;
		width: 100%;
		float: left;
	}
	
	.nav-previous {
		clear: both;
		text-align: center;
		max-width: 100%;
		width: 100%;
	}

h1, .entry-title, h4 {
	font-size: 26px;
}

h2, h5 {
	font-size: 24px;
}

h3, h6 {
	font-size: 20px;
}

}