/*
Theme Name: responsive
Theme URI: http://cyberchimps.com/responsive-theme/
Description: Responsive Theme is a flexible foundation with fluid grid system that adapts your website to mobile devices and the desktop or any other viewing environment. Theme features 9 Page Templates, 11 Widget Areas, 6 Template Layouts, 4 Menu Positions and more. Powerful but simple Theme Options for full CMS control with easy Logo Upload and Social Networking. Responsive is WooCommerce Compatible, Multilingual Ready (WPML), RTL-Language Support, Retina-Ready, Search Engine Friendly, W3C Markup Validated and currently translated into over 45 languages. Cross-Browser compatible. <a href="http://cyberchimps.com/forum/free/responsive/">Official support forum</a> (http://cyberchimps.com/forum/free/responsive/)
Author: CyberChimps.com
Author URI: http://cyberchimps.com
Version: 3.4.3
Template: twentyten
Tags: white, black, gray, light, custom-menu, custom-header, custom-background, one-column, two-columns, left-sidebar, right-sidebar, theme-options, threaded-comments, full-width-template, sticky-post, translation-ready, rtl-language-support, responsive-layout, fluid-layout, featured-images
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: responsive

Responsive WordPress Theme, Copyright (C) 2003-2014 Emil Uzelac, CyberChimps Inc

--------------------------------------------------------------
WARNING: (BEFORE YOU MAKE ANY CHANGES)
--------------------------------------------------------------
Please do not edit style.css or any other Theme files or
Templates directly. If you do, your customizations will be lost
as soon as you update Responsive.

WordPress and CyberChimps highly recommends Child Theme.

Read More:

- http://codex.wordpress.org/Child_Themes
- http://cyberchimps.com/guide/child-theme-example/
- http://cyberchimps.com/guide-tags/child-theme-2/

*/



body {
	background-color: rgba(34, 83, 168, 1);
}

#branding {
	width: 600px;
	float: left;
}
#wrapper {
	margin: 0px auto;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
    background-color: rgba(249, 250, 252, 1);
}
#header {
	position: fixed;
	width: 940px;
	background: none repeat scroll 0% 0% rgba(249, 250, 252, 1);
	clear: both;
    padding: 5px 0px;
    -webkit-box-shadow: 0px 5px 5px -6px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 5px 5px -6px rgba(0,0,0,0.5);
    box-shadow: 0px 5px 5px -6px rgba(0,0,0,0.5);
    z-index: 1000;
}
#footer {
	margin-bottom: 0px;
}
#site-title {
	margin: 0px auto;
	clear: both;
	float: left;
	overflow: hidden;
	width: auto;
	height: 34px;
}
#site-description {
	margin: 0 0 5px 5px;
	clear: both;
	float: left;
	overflow: hidden;
	height: 17px;
	width: auto;
}
#header .header-search { 
	margin: 0px auto;
	display: block;
	float: right;
	width: 320px;
	max-height: 60px;
	overflow: hidden;
}
#header .header-search form {

}

li.related_searches { /*display: none;*/ list-style: none; margin: 0px auto; }
#searchform input[type="text"] { 
	width: 70%;
	height: 22px;
	margin: 0px;
	padding: 0px 0px 0px 4px;
}
#searchform input[type='submit'] { 
	background-color: #000;
	border: 0px;
	color: #fff;
	/*padding-top: 3px;*/
	width: 25%;
	display: inline-block;
	height: 24px;
}

#header .header-search li.related_searches {
	margin: 2px 5px;
	font-family: "Helvetica Neue",Arial,Helvetica,"Nimbus Sans L",sans-serif;
	line-height: 1em;
	max-height: 28px;
	overflow: hidden;
}
#header .header-search li.related_searches h3 { 
	display: none;
}

li.related_searches a { 
	font-size: 0.8em; 
	margin: 0px auto; 
	padding-right: 1em;
}
#header .header-search li.related_searches a, #header .header-search li.related_searches h3 { 
	display: inline-block;
	font-size: 1em;
	line-height: 1.2em;
	margin: 0px auto;
	padding-right: 0.4em;
}

#branding img {
	display: none;
}
#header #access {
	display: none;
	overflow: hidden;
	height: 2px;
}
#header #access .menu {
	display: none;
}

#main {
	margin-top: 40px;
}
#content {
    margin: 0px 220px 0px 0px;
}
#container {
	margin: 0px -200px 0px 0px;
}
#primary {
	width: 200px;
}
#main #primary ul {
	padding: 0px;
}
#content .hentry {
	margin: 0px 0px 25px;
	border-bottom: 1px solid;
	padding-bottom: 5px;
}
#content .entry-content img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}
#content .post-ratings {
	font-size: 10px;
	line-height: 10px;
	margin: 3px 0px;
}
#content .entry-meta {
	font-size: 10px;
	float: right;
	line-height: 10px;
	margin: 3px 0px;

	/* Theoretically for IE 8 & 9 (more valid) */
	/* ...but not required as filter works too */
	/* should come BEFORE filter */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";

	/* This works in IE 8 & 9 too */
	/* ... but also 5, 6, 7 */
	filter: alpha(opacity=40);

	/* Modern Browsers */
	opacity: 0.4;
}
#content .entry-meta:hover {
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
} 
#content .entry-content {
	padding: 0px;
}
#content .entry-content p {
	margin-bottom: 0px;
	line-height: 15px;
	font-size: 11px;
}
#content .entry-content p.description {
	width: 700px;
	margin: auto;
}
#content .format-quote .entry-content h2 {
	display: none;
}
#content .format-quote .entry-content p:not(.description) {
	margin-bottom: 0px;
	line-height: 24px;
	font-size: 15px;
	width: 700px;
	margin: auto;
	
	overflow-wrap: break-word;
	word-wrap: break-word;
	-ms-word-break: break-all;
	word-break: break-word;
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}
#content .format-gallery .entry-content .more-link {
	font-size: 30px;
	line-height: 60px;
	float: right;
	margin-bottom: 10px;
}
body.single #nav-above {
	display: none;
}
#content .entry-utility {
	margin-top: 5px;
	min-height: 25px;

	/* Theoretically for IE 8 & 9 (more valid) */
	/* ...but not required as filter works too */
	/* should come BEFORE filter */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";

	/* This works in IE 8 & 9 too */
	/* ... but also 5, 6, 7 */
	filter: alpha(opacity=40);

	/* Modern Browsers */
	opacity: 0.4;
}
#content .entry-utility:hover {
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
} 
#content .entry-utility .tag-links a, .entry-utility a[rel='tag'] {
	color: #fff;
	background-color: rgba(83, 100, 137, 1);
	padding: 0px 4px 0px 4px;
	text-decoration: none;
	display: inline-block;
	margin: 1px 0px;
}
#content .entry-utility .comments-link {
	/*display: block;
	margin-left: 40px;*/
	float: right;
}
#content .entry-utility .comments-link a {
	color: #FFF;
	background-color: rgba(16, 51, 122, 1);
	padding: 3px 11px 5px 11px;
	text-decoration: none;
	font-size: 17px;
	/*line-height: 33px;*/
}
#content .entry-utility .cat-links a, .entry-utility a[rel='category tag'] {
	color: #fff;
	background-color: rgba(83, 100, 137, 1);
	padding: 0px 4px 0px 4px;
	text-decoration: none;
	display: inline-block;
	margin: 1px 0px;
}
.edit-link a {
	color: #fff !important;
	background-color: rgba(122, 42, 16, 1);
	padding: 0px 4px 0px 4px;
	text-decoration: none;
	display: inline-block;
	margin: 1px 0px;
}
#main #content .post #respond {
	display: none;
	margin: 5px 0px 0px 0px;
}


#wrapper,
#access,
#access .menu-header,
div.menu,
#colophon,
/*#branding,*/
#main,
#footer {
  width: 940px;
}

#access {
  max-width: 940px;
}

#main {
    float:left;
}

h1.page-title a, h1.page-title div[itemprop="child"] {
	display: inline-block;
}

/*
LAYOUT: Pre and Code
DESCRIPTION: Fixing these so when scaled down they won't create a scroll bar and break the responsiveness.
NOTE: Do not use these two together... ie. <pre><code>Something</code></pre>
*/

#content pre {
	font-size: 80%;
	overflow: hidden;
	padding: 1em;
}

#content code {
	font-size: 70%;
	margin-bottom: 24px;
}

/*
LAYOUT: Responsive Images & Video
DESCRIPTION: Responsive.
*/

#branding img, #content img {
	margin: auto;
}
.mejs-poster img {
	width: 100% !important;
	height: auto;
}

iframe, object, embed, video{
	max-width: 100%;
}

#content .wp-caption{
	padding: 0px;
	width: auto !important;
}

#content .wp-caption.alignnone{
	clear: both;
}

.wp-video { 
	margin: auto;
}
video {
	display: block;
	margin: 0px auto;
}
body.custom-background {
	background-size: 100%;
	background-attachment: fixed;
}

a:link{color:#3B5998;}
a:visited{color:#3B5998;}
a:active, a:hover{color:#3B5998;}


div.post div.embed-responsive-4by3 {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden;
    padding-bottom: 75%;
}
div.post div.embed-responsive-4by3 iframe {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	height: 100%;
	width: 100%;
	border: 0;
}

/*
Notes: You shouldn't really have to mess with anything down here. Unless you are drastically chaning the Twenty Ten theme.
	
/* --------------------------------------------------------*/
/*-----------------MMMMM----------MMMMM----E---------------*/
/*-----------------MMMMMM--------MMMMMM------D-------------*/
/*-----------------MMMMMMM------MMMMMMM----Q---I-----------*/
/*-----------------MMMMMMMM----MMMMMMMM------U---A---------*/
/*-----------------MMMMMMMMM--MMMMMMMMM--------E-----------*/
/*-----------------MMMM-MMMMMMMMMM-MMMM----------R---------*/
/*-----------------MMMM--MMMMMMMM--MMMM------------I-------*/
/*-----------------MMMM---MMMMMM---MMMM--------------E-----*/
/*-----------------MMMM----MMMM----MMMM----------------S---*/
/*-----------------MMMM------------MMMM--------------------*/
/*-----------------MMMM------------MMMM--------------------*/
/*-----------------MMMM------------MMMM--------------------*/
/*-----------------MMMM------------MMMM--------------------*/
/*-----------------MMMM------------MMMM--------------------*/
/* --------------------------------------------------------*/

@media only screen and (min-width: 481px) and (max-width: 1024px){
	#wrapper,
	#header {
		/*margin: 20px auto;*/
		width: 90%;
	}
	  
	#access,
	#access .menu-header,
	div.menu,
	#colophon,
	#main,
	#footer,
	#site-title, 
	#site-info,
	#site-description {
	    margin: 0 auto;
	    width: 100%;
	}

	#access {
		max-width: 100%;
	}
	  
	#branding{
		overflow: hidden;
	}
	
	/*
	LAYOUT: Responsive Images & Video
	DESCRIPTION: Responsive.
	*/
	#content img {
		margin: auto;
	}
	
	img, object, embed, iframe, #content .wp-caption {
		max-width: 100%;
	}
	
	#content .wp-caption img{
		max-width: 95%;
	}
	  
	/*
	LAYOUT: Two columns
	DESCRIPTION: Responsive.
	940 = 720 + 220
	100% = 76.5957447% + 23.40425535% 
	*/
	
	#container {
		float: left;
		margin: 0 -25.5319149% 0 0;
		width: 99%;
	}
	#content {
		width: 74.5957447%;
		/*margin: 0 29.787234% 0 20px;*/
		margin: 0 29.787234% 0 0px;
	}
	#primary,
	#secondary {
		overflow: hidden;
		width: 23.40425535% /* 200px / 940px */ 
	}
	
	#branding  {
		width:67.4680851% /* 700px / 940px */
	}
	
	#footer-widget-area .widget-area,
	#site-generator  {
		width: 23.40425535% /* 200px / 940px */ 
	}

	#header .header-search  {
		width: 30.40425535% /* 200px / 940px */ 
	}

	#main {
		margin-top: 40px;
	}

} /* This belongs here. It goes to @media only screen and (min-width: 481px) and (max-width: 1024px) */

@media screen and (max-width: 660px) {
	#wrapper {
		margin: 5px auto;
		width: 90%;
		padding: 0 3%;
	}
	
	#access,
	#access .menu-header,
	div.menu,
	#colophon,
	#branding,
	#main,
	#header,
	#footer,
	#header .header-search {
		margin: 0 auto;
		width: 100%;
	}
	
	#branding  {
		overflow:hidden;
	}
	
	#site-title {
		width: 100%;
	}
	
	#container {
		float: left;
		width: 100%;
		overflow: auto;
	}
	
	#content {
		width: 99%;
		margin: 0 0px 0 0px;
	}
	
	#primary,
	#secondary {
		float: left;
		overflow: hidden;
		width: 99%; 
	}
	#secondary {
		clear: left;
	}
	
	#site-generator, #site-description, #site-info, #site-title {
		clear: left;
		float: left;
		width: 95%;
		padding: 0;
		margin: 0;
	}
	
	/*
	LAYOUT: Responsive Images
	DESCRIPTION: Responsive.
	*/
	  
	#content img {
		margin: auto;
	}
	
	img, object, embed, #content .wp-caption {
		max-width: 100%;
	}
	
	#content .wp-caption{
		width: 100%;
	}
	
	#content .wp-caption img{
		max-width: 90%;
	}
	
	#content .wp-caption.alignleft{
		float: left;
	}
	#content .wp-caption.alignright{
		float: right;
	}
	#content .alignleft,
	#content img.alignleft {
		display: block;
		float: none;
		margin: 0px auto;
		padding: 0px 0px 5px 0px;
	}
	#content .alignright,
	#content img.alignright {
		display: block;
		float: none;
		margin: 0px auto;
		padding: 0px 0px 5px 0px;
	}

} /* @media screen and (max-width: 660px) */


/*
/* We left these here for you incase you needed them. You do not need to add anything for the Videos or Images.
/*
/*
/* Media = iPad orientation: landscape */

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
	
}/* This belongs here. It goes to @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) */

/*--------------------------------------------------------------------------------*/

/* Media = iPad orientation: portrait */

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {

}/* This belongs here. It goes to @media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) */

/*--------------------------------------------------------------------------------*/

/* Media = Mobile - iPhone */

@media handheld, only screen and (max-device-width: 480px) {
	iframe, object, embed, video{
		width: 100%;
		height: auto;
	}
	#content pre {
		font-size: 60%;
		overflow: hidden;
		padding: 1em;
	}
	
	#content code {
		font-size: 50%;
		margin-bottom: 24px;
	}
	
	#main {
		padding-top: 0px;
		margin-top: 10px;
	}
	div.post:not(.format-standard):not(.format-quote) div.entry-content p ~ p, div.post:not(.format-standard):not(.format-quote) .entry-title, #content .entry-content p.description, #main #content .post #respond, #content .post-ratings, div.post.format-quote .entry-content > h2, body.single #nav-above {
		display: none;
	}
	#content .format-quote .entry-content p:not(.description) {
		width: 100%;
	}
	#access, #content .entry-utility, #content .entry-meta, .widget-area {
		display: none;
	}
	#header {
		position: relative;
		padding: 5px 0 0 0;
	}
	#site-title {
		width: 100%;
		padding-bottom: 5px;
	}
	#site-description {
		display: none;
	}
	.widget-area {
		padding-top: 20px;
	}

	.header-search li.related_searches { /*display: none;*/ list-style: none; margin: 0px auto; }
	#header .header-search li.related_searches {
	    max-height: 14px;
	}

	.cycle-carousel-wrap li a img {
		margin: 0px auto !important; 
		display: block;
	}

}/* This belongs here. It goes to @media handheld, only screen and (max-device-width: 480px) */
	
/* Media = Mobile - All Others - orientation:portrait */

@media handheld, only screen and (max-device-width: 480px) and (orientation:portrait) {
	iframe, object, embed, video{
		width: 100%;
		height: auto;
	}
	
	#content pre {
		font-size: 80%;
		overflow: hidden;
		padding: 1em;
	}

	#content code {
		font-size: 50%;
		margin-bottom: 24px;
	}

	#main {
		margin-top: 10px;
		padding-top: 0px;
	}	

	div.post:not(.format-standard):not(.format-quote) div.entry-content p ~ p, div.post:not(.format-standard):not(.format-quote) .entry-title, #content .entry-content p.description, #main #content .post #respond, #content .post-ratings, div.post.format-quote .entry-content > h2, body.single #nav-above {
		display: none;
	}
	#content .format-quote .entry-content p:not(.description) {
		width: 100%;
	}
	#access, #content .entry-utility, #content .entry-meta, .widget-area {
		display: none;
	}
	#header {
		position: relative;
		padding: 5px 0 0 0;
	}
	#site-title {
		width: 100%;
		padding-bottom: 5px;
	}
	#site-description {
		display: none;
	}
	.widget-area {
		padding-top: 20px;
	}


	.header-search li.related_searches { /*display: none;*/ list-style: none; margin: 0px auto; }
	#header .header-search li.related_searches {
	    max-height: 14px;
	}

	.cycle-carousel-wrap li a img {
		margin: 0px auto !important;
		display: block;
	}

}/* @media handheld, only screen and (max-device-width: 480px) and (orientation:portrait) */

/* Media = Mobile - All Others - orientation:landscape */

@media handheld, only screen and (max-device-width: 767px) and (orientation:landscape) {
	iframe, object, embed, video{
		width: 100%;
		height: auto;
	}

	#main {
		padding-top: 0px;
		margin-top: 10px;
	}
	div.post:not(.format-standard):not(.format-quote) div.entry-content p ~ p, div.post:not(.format-standard):not(.format-quote) .entry-title, #content .entry-content p.description, #main #content .post #respond, #content .post-ratings, div.post.format-quote .entry-content > h2, body.single #nav-above {
		display: none;
	}
	#content .format-quote .entry-content p:not(.description) {
		width: 100%;
	}
	#access, #content .entry-utility, #content .entry-meta, .widget-area {
		display: none;
	}
	#header {
		position: relative;
		padding: 5px 0 0 0;
	}
	#site-title {
		width: 100%;
		padding-bottom: 5px;
	}
	#site-description {
		display: none;
	}
	.widget-area {
		padding-top: 20px;
	}

	.header-search li.related_searches { /*display: none;*/ list-style: none; margin: 0px auto; }
	#header .header-search li.related_searches {
	    max-height: 14px;
	}
	.cycle-carousel-wrap li a img {
		margin: 0px auto !important;
		display: block;
	}

}/* This belongs here. It goes to @media handheld, only screen and (max-device-width: 767px) and (orientation:landscape) */

#wrapper:after {
  content: "";
  display: table;
  clear: both;
}