/*
Theme Name: _scm
Theme URI: http://childrensmuseum.org
Author: FourTen Creative
Author URI: http://fourtencreative.com
Description: This is a custom theme for Seattle Children's Museum based on _tk from Theme Kraft which is a bootstrap version of _s from Automattic.  
Version: 1.0
License: GNU General Public License
License URI: see license.txt
Tags: children, seattle

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

This theme is the most seamless and minimalistic integration of Twitter Bootstrap Framework into 
the _s starter theme from Automattic, the guys behind WordPress.

_s (or Underscores) http://underscores.me/, (C) 2012-2013 Automattic, Inc. 

Twitter Bootstrap 


*/

/* Import the necessary TK Bootstrap WP CSS additions */
@import url( includes/css/bootstrap-wp.css );



/* My Minimal WordPress Styling comes here */

/* This is a small security for too long strings titles */
body {
    word-wrap: break-word;
    font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #555555;
}

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}


/* Images and wp-captions should always fit and be responsive */
img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}
img[class*="wp-image-"] {
	margin-top: 10px;
	margin-bottom: 10px;
}
.wp-caption {
	border: 1px solid #ccc;
	margin-bottom: 10px;
	max-width: 100%;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 10px;
}
.wp-caption.aligncenter {
	margin-bottom: 10px;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
}
.wp-caption .wp-caption-text {
	text-align: center;
	margin-top: 10px;
}

/* WP Gallery */
.gallery {
	margin-bottom: 1.5em;
}
.gallery a img {
	border: none;
	height: auto;
	max-width: 90%;
}
.gallery dd {
	margin: 0;
}


/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}


/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}


/* Content */
.main-content-inner {
	padding-bottom: 1.5em;
}
.hentry {
	margin: 0 0 1.5em;
}

/* Headings */

h1, h1 a, h1 a:visited {
	color: #ed3743 ;
}
h2, h2 a, h2 a:visited {
	color: #844e8c ;
} 
h3, h3 a, h3 a:visited {
	color: #69a533 ;
} 
h4, h4 a, h4 a:visited, h5, h5 a, h5 a:visited, h6, h6 a, h6 a:visited {
	color: #555555;
}
h1.page-title {
	margin-bottom: 0pc;
}

/* Clearing */
.clear {
	clear: both;
}


/* Here some needed widget styles 
 * Most widgets are adapted in the file bootstrap-wp.js - and REALLY easy to modify! ;) */
.widget { margin-bottom: 2em; }
.widget_nav_menu ul.sub-menu li, .widget_pages ul.children li { padding-left: 15px; }

/* Hiding the search widget's button in widgets. thats just too old-skool. :) but if you want it back, just delete the next line. 
 * Note: you can change the whole appearance of the search_form() function in our searchform.php */
.widget_search .search-form input[type="submit"] { display: none; }

/* Make sure select elements fit in widgets */
.widget select {
	max-width: 100%;
}

/* Nested comments? They are threaded and nested already, you just need to add your own styling to finalize!  
 * For example with some margin, like the line below ;) Delete, modify, change classes in HTML if you desire another style */
 .comment .children { margin-left: 1.5em; } 


.infinite-scroll .page-links, 
.infinite-scroll.neverending .site-footer { 
	display: none;
}

.infinity-end.neverending .site-footer {
	display: block;
} 

/* Custom styles for SCM */
.private-page form#loginform {
	margin:20px 10px;
}
.private-page form#loginform input {
	border:1px solid #ccc;
	border-radius:6px;
	padding:6px;
}
.private-page form#loginform input#wp-submit {
	padding:10px 50px;
}
.logo {
	position: relative;
	float: left;
	max-width: 100%;
	width: 537px;
	height: 100px;
}
#features {
	margin-bottom: 15px;
	padding: 0px;
}
#feature1, #feature2, #feature3 {
	text-align: center;
}
.page-template-page-home .metaslider {
	margin:0px 15px;
}
.main-content-inner.col-md-9 {
	float: right;
}
section#hero-image {
	margin-bottom: 15px;
}
.widget_submenu {
	padding: 15px;
	margin-bottom: 15px;
	color: #ffffff;
}
.widget_submenu h3 {
	color: #ffffff;
	margin-top: 0px;
}
.widget_submenu a {
	color: #ffffff;
	font-weight: 500;
}
.widget_submenu a:hover {
	color:#cccccc;
	text-decoration: none;
}
.widget_submenu ul {
	list-style: none;
	padding-left: 0px;
}
.widget_submenu ul ul.children {
	list-style: none;
	padding-left: 10px;
}
#scm_social {
	position: relative;
	float:right;
	padding:7px 28px 2px 0px;
	text-align: right;
	margin-top: 10px;
}
#scm_social ul li {
	display:inline;
	width: 40px;
	height: 40px;
	padding:2px;
}
#scm_social ul {
	margin: 0px;
	padding: 0px;
	width: auto;
}
#scm_social ul li a img {
	max-width: 40px;
	max-height: 40px;
}
.site-header-inner {
	margin-top: 15px;
}
ul#main-menu {
	width: 100%;
}
ul#main-menu li {
	margin-right: .8%;
	width: 16%;
	text-align: center;
	background: #999999;
}
ul#main-menu li ul {
	margin: 0px;
	width: 250px;
	text-align: left;
	padding-left: 0px;
}
ul#main-menu li ul li {
	width: 100%;
	text-align: left;
}

ul#main-menu li.last {
	margin-right: 0px;
}
ul#main-menu li a {
	font-family: 'Bitter', Rockwell, serif;
	font-weight: 700;
	font-size: 1.4em;
	color: #ffffff;
}
ul#main-menu li ul li a {    
	font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 1.1em;
	padding-top: 6px;
	padding-bottom: 6px;
}
ul#main-menu li ul li ul {
	padding-left: 10px;
}
ul#main-menu li.red, ul#main-menu li.red.active {
	background-color: #ed3743;
}
ul#main-menu li.purple {
	background-color: #844e8c;
}
ul#main-menu li.blue {
	background-color: #7eb0d1;
}
ul#main-menu li.green {
	background-color: #69a533;
}
ul#main-menu li.yellow {
	background-color: #feeb00;
}
ul#main-menu li.gray {
	background-color: #999999;
}
.site-info {
	text-align: center;
	margin-top: 15px;
	padding-top:15px;
	border-top:2px solid #999;
}
.footer-lower {
	text-align: center;
}
.footer-lower aside {
	display: inline;
	text-align: center;
}
.blog article, .single article, .archive article {
	background-color: #fcfcfc;
	padding: 0px 15px 15px;
	border: 1px solid #f5f5f5;
}
.post-thumbnail  {
	width:100%;
}
.nav-previous {
	background-color: #fcfcfc;
	padding: 5px;
	border: 1px solid #f5f5f5;
	position: relative;
	float: left;
}
.nav-next {
	background-color: #fcfcfc;
	padding: 5px;
	border: 1px solid #f5f5f5;
	position: relative;
	float: right;
}

.givenow {
background-color: #69a533;
position:relative;
float:right;
padding:7px 10px;
color:#fff;
font-family:'Bitter', Rockwell, serif;
margin:10px 31px 0 0;
font-size:1.4em;
font-weight:700;
}
.givenow:hover {
text-decoration:none;
color:#fff;
}
/* 200-480 Phones */

@media only screen and (min-width: 200px) and (max-width: 480px) {
	.navbar-responsive-collapse ul.navbar-nav {
		margin: 0px;
	}
	ul#main-menu li {
	margin: 0px auto;
	width: 100%;
	text-align: center;
	background-color: #ed3743;
	}
	ul#main-menu li.purple, ul#main-menu li.blue, ul#main-menu li.green, ul#main-menu li.yellow {
		background-color: #ed3743;
	}
	ul.dropdown-menu > li > a {
		display: none;
	}
	ul.dropdown-menu ul {
		display: none;
	}
	.navbar-header {
		text-align: center;
	}
	.mobile-menu-title {
		font-family: 'Bitter', Rockwell, serif;
		font-size: 1.4em;
		text-align: center;
		position: relative;
		top: 10px;
		left:30px;
		color: #fff;
	}
	ul#main-menu li a {
		font-size: 1em;
		color: #fff;
	}
	ul#main-menu span.caret {
		display: none;
	}
	.site-footer {
		text-align: center;
	}
	#feature1, #feature2, #feature3 {
		margin-bottom: 30px;
	}
	#scm_social {
	  position: relative;
	  float: none;
	  padding: 7px;
	  text-align: center;
	  margin-top: 15px;
	  clear: both;
	}
	.site-navigation-inner .navbar-default {
		background-color: #ed3743;
	}
	.main-content-inner.col-md-9 {
		float: none;
	}
	.givenow {
		margin:20px auto 10px;
		float:none;
		font-size:1em;
		top:10px;
	}
	.site-header-inner{
		text-align:center;
	}
	.logo {
		float:none;
	}
}

/* 481-768 Tablets */

@media only screen and (min-width: 481px) and (max-width: 768px) {
	.navbar-responsive-collapse ul.navbar-nav {
		margin: 0px;
	}
	ul#main-menu li {
	margin: 0px auto;
	width: 100%;
	text-align: center;
	background-color: #ed3743;
	}
	ul#main-menu li.purple, ul#main-menu li.blue, ul#main-menu li.green, ul#main-menu li.yellow {
		background-color: #ed3743;
	}
	ul.dropdown-menu > li > a {
		display: none;
	}
	ul.dropdown-menu ul {
		display: none;
	}
	.navbar-header {
		text-align: center;
	}
	.mobile-menu-title {
		font-family: 'Bitter', Rockwell, serif;
		font-size: 1.4em;
		text-align: center;
		position: relative;
		top: 10px;
		left:30px;
		color: #fff;
	}
	ul#main-menu li a {
		font-size: 1em;
		color: #fff;
	}
	ul#main-menu span.caret {
		display: none;
	}
	.site-footer {
		text-align: center;
	}
	#feature1, #feature2, #feature3 {
		margin: 15px auto;
	}
	#scm_social {
	  position: relative;
	  float: none;
	  padding: 7px;
	  text-align: center;
	  margin-top: 15px;
	  clear: both;
	}
	.site-navigation-inner .navbar-default {
		background-color: #ed3743;
	}
	.main-content-inner.col-md-9 {
		float: none;
	}
	.givenow {
		margin:20px auto 10px;
		float:none;
		top:10px;
	}
	.site-header-inner{
		text-align:center;
	}
	.logo {
		float:none;
	}
}

/* 769-992 Landscape Tablet */

@media only screen and (min-width: 769px) and (max-width: 992px) {
	ul#main-menu li a {
		font-size: 1em;
	}
	#scm_social {
	  position: relative;
	  float: none;
	  padding: 7px;
	  text-align: center;
	  margin-top: 15px;
	  clear: both;
	}
	.mobile-menu-title {
		display: none;
	}
	.givenow {
		margin:10px auto;
		float:none;
	}
	.site-header-inner{
		text-align:center;
	}
	.logo {
		float:none;
	}
}

/* 993-1170 Desktop */

@media only screen and (min-width: 993px) and (max-width: 1200px) {
	.mobile-menu-title {
		display: none;
	}
	#scm_social {
        padding-right:15px;
	}
	.givenow {
		margin-right:17px;
	}	
}

/* 1201+ Large Desktop */

@media only screen and (min-width: 1201px) {
	ul#main-menu li a {
		font-size: 1.6em;
	}
	.mobile-menu-title {
		display: none;
	}
}