/*
Theme Name:     Twenty Twelve Child
Theme URI:      http://www.flintsky.com/
Description:    Child theme for the Twenty Twelve theme developed for Flintsky by Guntribe
Author:         Paul Weingartz [Guntribe]
Author URI:     http://www.guntribe.com
Template:       twentytwelve
Version:        0.1.0
*/

/* =TwentyTwelve default style import
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@import url(../twentytwelve/style.css);
@import url(editor-style.css);



/* =Font Replacement (FontSquirrel)
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@font-face {
    font-family: 'dinregular';
    src: url('fonts/din-reg-webfont.eot');
    src: url('fonts/din-reg-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-reg-webfont.woff') format('woff'),
         url('fonts/din-reg-webfont.ttf') format('truetype'),
         url('fonts/din-reg-webfont.svg#dinregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'dinlight';
    src: url('fonts/din-light-webfont.eot');
    src: url('fonts/din-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/din-light-webfont.woff') format('woff'),
         url('fonts/din-light-webfont.ttf') format('truetype'),
         url('fonts/din-light-webfont.svg#dinlight') format('svg');
    font-weight: normal;
    font-style: normal;
}



/* =Twenty Twelve Overrides
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
html, body {
	background: #FFC040;
}
body .site {
	background: #fff;
	box-shadow: none;
	margin-top: 0px;
	margin-bottom: 0;
	padding: 0 0;
	max-width: none;
	border-bottom: 30px solid #FFC040;
}
.main-navigation div.nav-menu > ul,
.main-navigation ul.nav-menu {
	border-bottom: 0px none;
	border-top: 0px none;
}
.site-content article {
	border-bottom: 0px none;
}
hr {
	background-color: #DDDCDD;
	border: 0;
	height: 1px;
	margin: 30px 0;
}
.entry-content img,
.comment-content img,
.widget img,
img.header-image,
.author-avatar img,
img.wp-post-image {
	/* Add fancy borders to all WordPress-added images but not things like badges and icons and the like */
	border-radius: 0px;
	box-shadow: 0 0 0 rgba(255, 255, 255, 0);
}



/* =Fludi Grids
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.fgrids {
	clear:both;
	overflow: hidden;
	max-width:960px;
	margin:0 0 0 -2.083%;
	list-style:none; /* So we can make grids out of lists */
}
[class^="fgrid-"] {
	float:left;
	margin:0 2.083% 0 0;
}
.fgrids [class^="fgrid-"] {
	margin:0 0 0 2.083%;
}
.fgrid-1 { width:6.25% }
.fgrid-2 { width:14.583% }
.fgrid-3 { width:22.917%; float: left; margin: 0 0 0 2.083%; }
.fgrid-4 { width:31.25% }
.fgrid-5 { width:39.583% }
.fgrid-6 { width:47.917% }
.fgrid-7 { width:56.25% }
.fgrid-8 { width:64.583% }
.fgrid-9 { width:72.917% }
.fgrid-10 { width:81.25% }
.fgrid-11 { width:89.583% }
.fgrid-12 { width:97.917%; margin:0 }



/* =Shared Settings
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#main #content,
#main .site-content,
.blog #main,
.header-wrapper,
.footer-wrapper,
#credit {
	max-width: 960px;
	margin: 0 auto;
	float: none;
	overflow: hidden;
}
.blog #main {
    overflow: visible;
}
.blog #main .sub-nav,
.page-id-60 #main .sub-nav,
.pod-page-projects #main .sub-nav {
    margin: -41px 0 30px;
}
.section {
	max-width: 960px;
	margin: 0 auto;
}
.section-divider {
    width: 100%;
    clear: both;
    display: inline-block;
}
#main .site-content,
.blog #main,
.single #main {
	width: auto;
	max-width: none;
}
#masthead {
	border-bottom: 1px solid #DDDCDD;
	margin-bottom: 40px;
}
.floater {
    position: fixed !important;
    top: 0;
    margin-left: 720px !important;
    width: 220px;
}
::selection {
	background: #FFBF4C; /* Safari */
}
::-moz-selection {
	background: #FFBF4C; /* Firefox */
}



/* =Typography
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
body,
body.custom-font-enabled {
	font-family: 'dinregular', Helvetica, Arial, sans-serif;
	font-size: 14px;
}
#colophon p {
	font-size: 13px;
	line-height: 1.5;
	color: #767478;
}
.entry-content p,
.entry-summary p,
.comment-content p,
.mu_register p {
	margin: 0 0 24px;
	margin: 0 0 1.714285714rem;
	line-height: 1.5;
}
.project-content,
.project-content p {
    line-height: 1.5;
}
#credit {
	font-size: 12px;
	color: #ABAAAC;
}
.tagline {
	font-size: 12px;
	color: #ABAAAC;
	line-height: 1.5;
}
h3, h3 a {
	line-height: 1.5;
}

/**  EDITOR STYLES **/
.article-content p {
	margin-bottom: 15px;
}
.article-content h2 {
	font-size: 18px;
}



/* =Links & Navigation
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
a {
	outline: none;
	color: #111;
	text-decoration: none;
}
a:hover {
	color: #767378;
	text-decoration: underline;
}
#credit a {
	color: #ABAAAC;
}
#credit a:hover {
	color: #767378;
}
a.readmore {
	font-size: 14px;
	color: #767478;
	padding: 0 12px 0 0;
	background: transparent url(images/rarr-g.png) no-repeat right 60%;
}
a.readmore:hover {
	text-decoration: none;
	color: #111;
}
.main-navigation li a {
	color: #767578;
	font-size: 14px;
}
.main-navigation li a:hover {
	color: #111;
}



/* =Header
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#masthead .site-title {
	text-indent: -9999px;
}
.site-header {
	padding: 0 0 0;
}
#masthead .site-title a {
	display: block;
	height: 145px;
	width: 110px;
	background: transparent url(images/flintsky-logo.png) no-repeat;
}
#masthead .site-description {
	display: none;
}
#masthead .spyglass {
	display: block;
	float: right;
	width: 70px;
	height: 145px;
	background: transparent url(images/spyglass-glyph.png) no-repeat center 90%;
	border-left: 1px solid #DDDCDD
}
#masthead hgroup {
	border-right: 1px solid #DDDCDD
}
#masthead .main-navigation ul.nav-menu {
	width: auto;
	float: right;
	margin-top: 70px;
}
#masthead .main-navigation ul.nav-menu li {
	background: transparent url(images/divider.png) no-repeat 0% 50%;
	padding: 0px 15px 0px 20px;
	margin: 0px;
}
#masthead .main-navigation ul.nav-menu li:first-child {
	background: 0px;
}



/* =Sub Nav
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.sub-nav {
	border-top: 1px solid #DDDCDD;
	border-bottom: 1px solid #DDDCDD;
	background: #E8E6E9;
	padding: 10px 0;
	margin: -41px 0 0;
}
.sub-nav ul {
	max-width: 850px;
	padding: 0 110px 0 0;
	margin: 0 auto;
	text-align: right;
}
.sub-nav ul li {
	display: inline-block;
	white-space: nowrap;
	margin: 0 0 0 15px;
}
.sub-nav a {
	font-size: 14px;
	color: #767478;
	display: inline-block;
	padding: 0 0 0 10px;
}
.sub-nav a:hover,
.sub-nav .active a {
	color: #333;
	text-decoration: none;
	background: transparent url(images/rarr-g.png) no-repeat left center;
}



/* =Main
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.callout-top {
	border-bottom: 1px solid #DDDCDD;
	padding: 20px 0;
	margin-bottom: 20px;
	margin-top: -40px;
}
.callout-top h1 {
	max-width: 800px;
	margin: 0 auto;
	font-family: 'dinlight', Helvetica, Arial, sans-serif;
	font-size: 38px;
	text-align: center;
	color: #333;
}
.callout-top h2 {
	line-height: 1.5;
	border-top: 1px solid #DDDCDD;
	text-align: center;
	padding: 18px 0 0;
	margin: 20px auto 0;
	max-width: 600px;
}
.callout-link {
	border-top: 1px solid #DDDCDD;
	border-bottom: 1px solid #DDDCDD;
	background: #E8E6E9;
	padding: 20px 0;
	margin: -33px 0 -1px;
}
.callout-link:hover {
	background: #FFC040;
}
.callout-link h1 {
	max-width: 960px;
	margin: 0 auto;
	font-family: 'dinlight', Helvetica, Arial, sans-serif;
	font-size: 38px;
	text-align: center;
	color: #fff;
}
.callout-link h1 a {
	color: #fff;
	padding: 0 30px 0 0;
	background: transparent url(images/rarr-w.png) no-repeat right center;
}
.callout-link h1 a:hover {
	color: #fff;
	text-decoration: none;
}



/* =Intro Slider
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.intro-slider,
.home-slider {
	margin-top: 30px;
}
.intro-slider .slider-content,
.home-slider .slider-content {
	border-right: 1px solid #DDDCDD;
}
.intro-slider .fgrid-3,
.home-slider .fgrid-3 {
	margin: 0;
}
.intro-slider .block-head,
.home-slider .block-head {
	padding: 30px 0 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
}
.intro-slider .block-head h3,
.home-slider .block-head h3 {
	font-size: 18px;
	color: #111;
}
.intro-slider .block-body,
.home-slider .block-body {
	padding: 0 0 0 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
	line-height: 1.4;
}
.intro-slider .block-foot,
.home-slider .block-foot {
	padding: 0 0 0 30px;
}

.intro-slider .video-item,
.home-slider .video-item {
	height: 400px;
	background: #000;
}



/* =News Articles
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.news-article .article-pic {
	border-right: 1px solid #DDDCDD;
}
.news-article .fgrid-3 {
	margin: 0;
}
.news-article .block-head {
	padding: 30px 0 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
}
.news-article .block-head h3 {
	font-size: 18px;
	color: #111;
}
.news-article .block-body {
	padding: 0 0 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
	line-height: 1.4;
}
.news-article .block-foot {
	padding: 0 0 0 30px;
}



/* =News Article Single
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.news-article-single {
    margin-top: 30px;
}
.news-article-single .article-pic {
	border-left: 1px solid #DDDCDD;
	overflow: hidden;
}
.news-article-single .article-pic img,
.news-article-single .article-pic iframe {
	display: block;
	clear: both;
	float: right;
}
.news-article-single .article-content {
	border-left: 1px solid #DDDCDD;
	padding: 30px 0 0 30px;
	line-height: 1.5;
}
.news-article-single .fgrid-3 {
	margin: 0 -20px 0 0;
	width: 240px;
}
.news-article-single .block-head {
	padding: 30px 30px 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
}
.news-article-single .block-head h3 {
	font-size: 18px;
	color: #111;
}
.news-article-single .block-body {
	padding: 0 30px 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
	line-height: 1.4;
}
.news-article-single .block-foot {
	padding: 0 30px 0 30px;
}
#comments {
    float: right;
    width: 710px;
}
#respond {
    margin-top: 0px;
}


/* =AJAX
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#loading_animation {
    background: url('images/ajax-loader.gif') no-repeat center center;
}



/* =Media Slider
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.media-slider {
    overflow: visible;
}
.media-slider .slider-content {
	border-right: 1px solid #DDDCDD;
	position: relative;
}
.media-slider .slider-content #loading_animation,
.media-slider .slider-content #overlay,
.media-slider .slider-content img {
    width: 670px;
    height: 400px;
}
.media-slider .slider-content #overlay {
    position: absolute;
    top: 0px;
    left: 0px;
    display: none;
    background: rgba(51,51,51,0.7) url('images/slider-overlay.png') no-repeat center center;
}
.media-slider .slider-content:hover #overlay {
    display: block;
    -o-transition: .350s;
    -ms-transition: .350s;
    -moz-transition: .350s;
    -webkit-transition: .350s;
    transition: .350s;
}
.media-slider .fgrid-3 {
	margin: 26px 0 0;
}
.media-slider .block-thumbs {
	padding: 0 0 0 30px;
	width: 200px;
	position: relative;
	height: 405px;
}
.media-slider .block-thumbs .thumbs-container {
    height: 405px;
}
.media-slider .block-thumbs ul {
	margin: 0px;
	padding: 0px;
	display: block;
}
.media-slider .block-thumbs li {
	display: block;
	margin: 19px 0 0;
}
.media-slider .block-thumbs li:first-child {
	margin: 0;
}


/* =Image List
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.store-links {
    overflow: hidden;
    text-align: center;
    list-style: none;
    padding: 0;
    margin: 25px 0 0;
    width: 670px;
    
}
.store-links li {
    display: inline-block;
    margin: 0 15px;
}



/* =Image List
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.image-list {
	margin-top: 30px;
}
.image-list ul {
    list-style: none;
    margin-left: 0px;
}
.image-list .list-content {
	border-right: 1px solid #DDDCDD;
	overflow: hidden;
}
.image-list .list-content ul {
    margin-left: 0px;
}
.image-list .list-content li,
.image-list .list-content li img {
	display: block;
}
.image-list .list-content li {
	padding: 0 0 5px;
}
.image-list .fgrid-3 {
	margin: 0;
}
.image-list .block-head {
	padding: 30px 0 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
}
.image-list .block-head h3 {
	font-size: 18px;
	color: #111;
}
.image-list .block-body {
	padding: 0 0 20px 30px;
	margin: 0 0 20px;
	border-bottom: 1px solid #DDDCDD;
	line-height: 1.4;
}
.image-list .block-foot {
	padding: 0 0 0 30px;
}
.social a {
	margin-right: 10px;
}
.social .facebook {
	background: transparent url(images/ico-facebook.png) no-repeat;
	width: 40px;
	height: 40px;
	display: inline-block;
	text-indent: -9999px;
}
.social .twitter {
	background: transparent url(images/ico-twitter.png) no-repeat;
	width: 40px;
	height: 40px;
	display: inline-block;
	text-indent: -9999px;
}




/* =Blocks
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block-container {
    margin-bottom: 15px;
}
.block-link {
	color: #888888;
	font-size: 18px;
	padding: 0 0 8px;
}
.block-link span {
	display: inline-block;
	padding: 0 12px 0 0;
	margin: 0 5px 0 0;
	background: transparent url(images/divider.png) no-repeat right center;
}
.block-link a {
	color: #333;
}
.block-link a:hover {
	color: #FFBF2D;
	text-decoration: none;
}

.block-links {
	padding: 0 0 20px 30px;
	margin: 0 0 20px -30px;
	line-height: 1.4;
}
.block-links ul {
	list-style: none;
}
.block-links li {
	padding: 15px 0 15px 30px;
	border-bottom: 1px solid #DDDCDD;
}
.block-links li:first-child {
	padding: 0 0 15px 30px;
}



/* =Sticky
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.sticky-element {
    width: 240px;
    float: right;
}
.sticky-element .fixxer {
  width: 220px;
}



/* =Footer (colophon)
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#colophon {
	border-top: 1px solid #DDDCDD;
	border-bottom: 1px solid #DDDCDD;
	padding-top: 40px;
	padding-bottom: 30px;
}
h3.widget-title {
	font-size: 14px;
	font-weight: normal;
	border-bottom: 1px solid #DDDCDD;
	padding: 0 0 3px;
	margin: 0 0 5px;
	text-transform: none;
}



/* =Credit
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
#credit {
	margin: 20px auto;
}
#credit .spyglass {
	display: block;
	width: 56px;
	height: 56px;
	background: transparent url(images/spyglass-glyph.png) no-repeat center top;
	margin: 0 auto;
}
#credit .col-1 {
	text-align: right;
	margin-left: 60px;
	padding-top: 20px;
}
#credit .col-2 {
	margin-left: -20px;
}
#credit .col-3 {
	margin-left: -20px;
	padding-top: 20px;
}



/* =Responsiveness
----------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 320px) and (max-width: 480px) {
	.c-logo,
	.c-navigation,
	.c-spyglass {
		display: block;
		width: auto !important;
		float: none !important;
	}
	
	.c-spyglass {
		display: none;
	}
	
	.c-logo {
		width: 110px !important;
		margin: auto !important;
	}
	
	.c-navigation {
		margin-bottom: 10px !important;
	}
	
	.main-navigation ul.nav-menu.toggled-on, .menu-toggle {
		display: block;
	}
	
	#masthead .main-navigation ul.nav-menu {
		margin-top: 0px;
		float: none;
		padding-left: 0px;
		margin-left: 0px;
		list-style: none;
	}
	
	#masthead .main-navigation ul.nav-menu li {
		background: none transparent;
	}
	
	.intro-slider,
	.home-slider {
		margin-top: 0px;
	}
	
	.intro-slider .slide-container,
	.home-slider .slide-container {
		float: none;
		width: 100% !important;
	}
	
	.intro-slider .slider-content img,
	.home-slider .slider-content img {
		width: 100%;
		height: auto;
	}
	
	.intro-slider .block-container,
	.home-slider .block-container {
		float: none !important;
		width: 100% !important;
	}
	
	.intro-slider .block-head,
	.home-slider .block-head {
		float: none;
	}
	
	.media-slider img {
		width: 100%;
		height: auto;
	}
	
	.blocks .fgrid-4 {
		float: none !important;
		width: 100%;
	}
	
	.block-pic {
		text-align: center;
	}
	
	.block-link {
		text-align: center;
		margin-bottom: 10px;
	}
	
	.callout-top h1 {
		padding: 0px 5px;
	}
	
	.news-article-single .fgrid-3,
	.news-article-single .fgrid-9 {
		width: 100%;
		margin: auto 5px;
	}
	
	.news-article-single .article-pic {
		border-left: none;
	}
	
	.news-article-single .article-pic img {
		width: 100%;
		height: auto;
	}
	
	.footer-wrapper .fgrids > div,
	#credit .fgrids > div {
		width: 100% !important;
		float: none !important;
	}
	
	#credit .fgrids .col-1 {
		margin-left: 0px;
		text-align: center;
		margin-bottom: 20px;
	}
	
	#credit .fgrids .col-2,
	#credit .fgrids .col-3 {
		margin-left: 0px;
		text-align: center;
	}
}