﻿/*
Theme Name: Awesome 2014
Theme URI: http://example.org/awesome-2014
Author: Josh Pollock / Chris Knowles
Author URI: http://premium.wpmudev.com/blog
Description: A TwentyFourteen Child Theme that addresses the parent's flaws
Template: twentyfourteen
Version: 1.0
License: GPL v2+
*/

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

/* Theme customization starts here */

.site {
	margin: 0 auto;
}

/* Make room for the search toggle and site description in mobile sidebar */
#slideout-top {
    height:48px;
}

#slideout-top .site-description {
    display: block;
    text-align: left;
    font-family: lato;
    width: 205px;
    overflow: hidden;
}

#slideout-top .search-toggle {
    margin-right: 0;
}

/* Override Sidr Style For 2014 Search */
#slideout-top .search-box .search-field  {
    background-color: white;
    color: black;
}

/* Keep mobile toggle on the right and resize the genricon */
#menu-toggle {
	float: right;
	display: inline;
}

#menu-toggle .genericon {
	font-size: 48px;
	padding: 0 1em 0 0;
    z-index: 999;
}

/* enhancing the topbar */
#big-top {
  display: block; }

#masthead {
  height: 88px;
  position: fixed;
  top: 0;
}

.header-main {
  display: inline;
}

.site-title{
    margin: 0 0 0 20px;
}

nav#primary-navigation {
  width: 100%;
  display: block;
  top: 40px;
  left: 0px;
  position: absolute;
  padding-left: 30px; 
}

.topbar-description {
  color: #fff;
  display: inline;
  font-weight: bold;
  font-size: 100%;
  text-transform: lowercase;
  line-height: 50px;
  vertical-align: baseline;
  margin-left: 20px;
  font-style: italic;
}

/**Adjustments for the desktop topbar when screen is small**/
@media screen and (max-width: 768px) {
.search-toggle {
position: absolute;
top: -8px;
right: 0px;
}
#masthead {
height: 80px;
}
.topbar-menu {
display: block;
background-color: black;
}
.primary-navigation.toggled-on {
display: block;
padding: 48px 0 0 0px;
background-color: black;
}
.nav-toggled {
padding-top: 48px !important;
padding-left: 0px !important;
}
h2.topbar-description {
display:none;
}
}

/**
 * 6.0 Content
 * -----------------------------------------------------------------------------
 */

.content-area {
	padding-top: 48px;
}

.hentry {
	margin: 0 auto 48px;
	max-width: 672px;
}

.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content {
	margin: 0 auto;
	max-width: 794px;
}

.page-content {
	margin-bottom: 48px;
}

@media screen and (min-width: 1008px) {
	.search-box-wrapper {
		padding-left: 182px;
	}

	.main-content {
		float: left;
	}

	.site-content {
		margin-right: 27.5%;
		margin-left: 102px;
	}

	.site-content .entry-header {
		margin-top: 0;
	}

	.site-content .has-post-thumbnail .entry-header {
		margin-top: 0;
	}

	.content-sidebar {
		margin-left: -29.04761904%;
		width: 29.04761904%;
	}

	.site:before {
		background-color: #000;
		content: "";
		display: block;
		height: 100%;
		min-height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		width: 182px;
		z-index: 2;
	}

	#secondary {
		background-color: transparent;
		border: 0;
		clear: none;
		float: left;
		margin: 0 0 0 -100%;
		min-height: 100vh;
		width: 122px;
	}

	.primary-sidebar {
		padding-top: 0;
	}

	.site-description {
		display: block;
		margin: 0 0 18px;
	}

	.site-description:empty {
		margin: 0;
	}

	.secondary-navigation {
		font-size: 11px;
		margin: 0 -30px 48px;
		width: 182px;
	}

	.secondary-navigation li {
		border-top: 1px solid rgba(255, 255, 255, 0.2);
		position: relative;
	}

	.secondary-navigation a {
		padding: 10px 30px;
	}

	.secondary-navigation ul ul {
		background-color: #24890d;
		position: absolute;
		top: 0;
		left: -999em;
		width: 182px;
		z-index: 99999;
	}

	.secondary-navigation li li {
		border-top: 0;
	}

	.secondary-navigation li:hover > a,
	.secondary-navigation li.focus > a {
		background-color: #24890d;
		color: #fff;
	}

	.secondary-navigation ul ul a:hover,
	.secondary-navigation ul ul li.focus > a {
		background-color: #41a62a;
	}

	.secondary-navigation ul li:hover > ul,
	.secondary-navigation ul li.focus > ul {
		left: 162px;
	}

	.secondary-navigation .menu-item-has-children > a {
		padding-right: 38px;
	}

	.secondary-navigation .menu-item-has-children > a:after {
		-webkit-font-smoothing: antialiased;
		content: "\f501";
		display: inline-block;
		font: normal 8px/1 Genericons;
		position: absolute;
		right: 26px;
		top: 14px;
		vertical-align: text-bottom;
	}

	.footer-sidebar .widget,
	.primary-sidebar .widget {
		font-size: 12px;
		line-height: 1.5;
	}

	.footer-sidebar .widget {
		-webkit-box-sizing: border-box;
		-moz-box-sizing:    border-box;
		box-sizing:         border-box;
		float: left;
		padding: 0 30px;
		width: 25%;
	}

	.footer-sidebar .widget h1,
	.primary-sidebar .widget h1 {
		font-size: 20px;
		line-height: 1.2;
	}

	.footer-sidebar .widget h2,
	.primary-sidebar .widget h2 {
		font-size: 18px;
		line-height: 1.3333333333;
	}

	.footer-sidebar .widget h3,
	.primary-sidebar .widget h3 {
		font-size: 16px;
		line-height: 1.5;
	}

	.footer-sidebar .widget h4,
	.primary-sidebar .widget h4 {
		font-size: 14px;
		line-height: 1.7142857142;
	}

	.footer-sidebar .widget h5,
	.primary-sidebar .widget h5 {
		font-size: 12px;
		line-height: 2;
	}

	.footer-sidebar .widget h6,
	.primary-sidebar .widget h6 {
		font-size: 11px;
		line-height: 2.1818181818;
	}

	.footer-sidebar .widget code,
	.footer-sidebar .widget kbd,
	.footer-sidebar .widget tt,
	.footer-sidebar .widget var,
	.footer-sidebar .widget samp,
	.footer-sidebar .widget pre,
	.primary-sidebar .widget code,
	.primary-sidebar .widget kbd,
	.primary-sidebar .widget tt,
	.primary-sidebar .widget var,
	.primary-sidebar .widget samp,
	.primary-sidebar .widget pre {
		font-size: 11px;
		line-height: 1.6363636363;
	}

	.footer-sidebar .widget blockquote,
	.primary-sidebar .widget blockquote {
		font-size: 14px;
		line-height: 1.2857142857;
	}

	.footer-sidebar .widget blockquote cite,
	.primary-sidebar .widget blockquote cite {
		font-size: 12px;
		line-height: 1.5;
	}

	.footer-sidebar .widget input,
	.footer-sidebar .widget textarea,
	.primary-sidebar .widget input,
	.primary-sidebar .widget textarea {
		font-size: 12px;
		padding: 3px 2px 4px 4px;
	}

	.footer-sidebar .widget input[type="button"],
	.footer-sidebar .widget input[type="reset"],
	.footer-sidebar .widget input[type="submit"],
	.primary-sidebar .widget input[type="button"],
	.primary-sidebar .widget input[type="reset"],
	.primary-sidebar .widget input[type="submit"] {
		padding: 5px 15px 4px;
	}

	.footer-sidebar .widget .widget-title,
	.primary-sidebar .widget .widget-title {
		font-size: 11px;
		font-weight: 900;
		line-height: 1.6363636363;
		margin-bottom: 18px;
	}

	.footer-sidebar .widget_twentyfourteen_ephemera .entry-title,
	.footer-sidebar .widget_twentyfourteen_ephemera .entry-meta,
	.footer-sidebar .widget_twentyfourteen_ephemera .wp-caption-text,
	.footer-sidebar .widget_twentyfourteen_ephemera .post-format-archive-link,
	.footer-sidebar .widget_twentyfourteen_ephemera .entry-content table,
	.primary-sidebar .widget_twentyfourteen_ephemera .entry-title,
	.primary-sidebar .widget_twentyfourteen_ephemera .entry-meta,
	.primary-sidebar .widget_twentyfourteen_ephemera .wp-caption-text,
	.primary-sidebar .widget_twentyfourteen_ephemera .post-format-archive-link,
	.primary-sidebar .widget_twentyfourteen_ephemera .entry-content table {
		font-size: 11px;
		line-height: 1.6363636363;
	}

	.footer-sidebar .widget_archive li,
	.footer-sidebar .widget_categories li,
	.footer-sidebar .widget_links li,
	.footer-sidebar .widget_meta li,
	.footer-sidebar .widget_nav_menu li,
	.footer-sidebar .widget_pages li,
	.footer-sidebar .widget_recent_comments li,
	.footer-sidebar .widget_recent_entries li,
	.primary-sidebar .widget_archive li,
	.primary-sidebar .widget_categories li,
	.primary-sidebar .widget_links li,
	.primary-sidebar .widget_meta li,
	.primary-sidebar .widget_nav_menu li,
	.primary-sidebar .widget_pages li,
	.primary-sidebar .widget_recent_comments li,
	.primary-sidebar .widget_recent_entries li {
		border-top: 0;
		padding: 0 0 6px;
	}

	.footer-sidebar .widget_archive li:last-child,
	.footer-sidebar .widget_categories li:last-child,
	.footer-sidebar .widget_links li:last-child,
	.footer-sidebar .widget_meta li:last-child,
	.footer-sidebar .widget_nav_menu li:last-child,
	.footer-sidebar .widget_pages li:last-child,
	.footer-sidebar .widget_recent_comments li:last-child,
	.footer-sidebar .widget_recent_entries li:last-child,
	.primary-sidebar .widget_archive li:last-child,
	.primary-sidebar .widget_categories li:last-child,
	.primary-sidebar .widget_links li:last-child,
	.primary-sidebar .widget_meta li:last-child,
	.primary-sidebar .widget_nav_menu li:last-child,
	.primary-sidebar .widget_pages li:last-child,
	.primary-sidebar .widget_recent_comments li:last-child,
	.primary-sidebar .widget_recent_entries li:last-child {
		padding: 0;
	}

	.footer-sidebar .widget_categories li ul,
	.footer-sidebar .widget_nav_menu li ul,
	.footer-sidebar .widget_pages li ul,
	.primary-sidebar .widget_categories li ul,
	.primary-sidebar .widget_nav_menu li ul,
	.primary-sidebar .widget_pages li ul {
		border-top: 0;
		margin-top: 6px;
	}

	#supplementary {
		padding: 0;
	}

	.footer-sidebar {
		font-size: 12px;
		line-height: 1.5;
	}

	.featured-content {
		padding-left: 182px;
	}

	.grid .featured-content .hentry {
		width: 33.3333333%;
	}

	.grid .featured-content .hentry:nth-child( 2n+1 ) {
		clear: none;
	}

	.grid .featured-content .hentry:nth-child( 3n+1 ) {
		clear: both;
	}

	.grid .featured-content .entry-header {
		height: 120px;
	}
}

@media screen and (min-width: 1040px) {
	.site-content .has-post-thumbnail .entry-header {
		margin-top: -48px;
	}

	.archive-header,
	.comments-area,
	.image-navigation,
	.page-header,
	.page-content,
	.post-navigation,
	.site-content .entry-header,
	.site-content .entry-content,
	.site-content .entry-summary,
	.site-content footer.entry-meta {
		padding-right: 15px;
		padding-left: 15px;
	}

	.full-width .archive-header,
	.full-width .comments-area,
	.full-width .image-navigation,
	.full-width .page-header,
	.full-width .page-content,
	.full-width .post-navigation,
	.full-width .site-content .entry-header,
	.full-width .site-content .entry-content,
	.full-width .site-content .entry-summary,
	.full-width .site-content footer.entry-meta {
		padding-right: 30px;
		padding-left: 30px;
	}
}

@media screen and (min-width: 1080px) {
	.search-box .search-field {
		width: 324px;
	}

	.site-content,
	.site-main .widecolumn {
		margin-left: 222px;
	}

	.site:before {
		width: 222px;
	}

	.search-box-wrapper,
	.featured-content {
		padding-left: 222px;
	}

	#secondary {
		width: 162px;
	}

	.secondary-navigation,
	.secondary-navigation ul ul {
		width: 222px;
	}

	.secondary-navigation ul li:hover > ul,
	.secondary-navigation ul li.focus > ul {
		left: 202px;
	}

	.slider .featured-content .entry-title {
		font-size: 33px;
	}

	.slider .featured-content .entry-header,
	.slider-control-paging {
		width: 534px;
	}

	.slider-control-paging {
		padding-left: 24px;
	}

	.slider-control-paging li {
		margin: 12px 12px 12px 0;
	}

	.slider-control-paging a {
		height: 24px;
		width: 24px;
	}

	.slider-control-paging a:before {
		top: 6px;
		left: 6px;
	}
}

@media screen and (min-width: 1110px) {
	.archive-header,
	.comments-area,
	.image-navigation,
	.page-header,
	.page-content,
	.post-navigation,
	.site-content .entry-header,
	.site-content .entry-content,
	.site-content .entry-summary,
	.site-content footer.entry-meta {
		padding-right: 30px;
		padding-left: 30px;
	}
}

@media screen and (min-width: 1218px) {
	.archive-header,
	.comments-area,
	.image-navigation,
	.page-header,
	.page-content,
	.post-navigation,
	.site-content .entry-header,
	.site-content .entry-content,
	.site-content .entry-summary,
	.site-content footer.entry-meta {
		margin-right: 54px;
	}

	.full-width .archive-header,
	.full-width .comments-area,
	.full-width .image-navigation,
	.full-width .page-header,
	.full-width .page-content,
	.full-width .post-navigation,
	.full-width .site-content .entry-header,
	.full-width .site-content .entry-content,
	.full-width .site-content .entry-summary,
	.full-width .site-content footer.entry-meta {
		margin-right: auto;
	}
}

@media screen and (min-width: 1260px) {
	.site-content blockquote.alignleft,
	.site-content blockquote.alignright {
		width: -webkit-calc(50% + 18px);
		width:         calc(50% + 18px);
	}

	.site-content blockquote.alignleft {
		margin-left: -18%;
	}

	.site-content blockquote.alignright {
		margin-right: -18%;
	}
}
