/*
Theme Name:     main
Description:    TLC's main theme, a child theme of Primetime.
Author:         admin
Template:       primetime

This file adds to the file specified in the @import... line below.
*/

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

img#wpstats{width:0px;height:0px;overflow:hidden}  /* removed smiley generated by wpstats polugin */
#post-195 .entry-content td, .comment-content td {border-top:0;}  /* removed line at table top on "Supporters" page */

a.btn.btn-mini.pull-right.ai1ec-calendar-link {float:right;}

.slogan-text {		/* adjust size and placement of slogan on home page */
	font-size: 0.9em;
	padding-left: 25px;
}
.blog-header {
	background-color: #800000;
	color: white;
	width: 100%
}
#blog-header {
	background-color: #800000;
	background: url(wp-content/uploads/2012/02/BLOGheader2.jpg) no-repeat;
	color: white;
	width: 100%;
	text-align: right;
}
/*
<img src="wp-content/uploads/2012/02/BLOGheader2.jpg"></img>
*/


div#header_top {  /* make the white bar at the top blend in with the header  */
	border:0;
}
div#header_content {
	background: transparent;
}
.themeblvd-contact-bar {	/* social links: set background color, round edges  */
	background-color: transparent;
	-moz-border-radius: 12px;
	-khtml-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;	
}
#header_content .inner {
	margin-top: 0px;
}
/* Updated ON LIVE 9/5/16: Donate button was #menu-item-40, changed to #menu-item-13274 */
#menu-item-40 a {	/*  make donate button red, a gradient in newer browsers*/
	background-color: #a00;
	background: -moz-linear-gradient(#c66, #a00);
	background: -o-linear-gradient(#c66, #a00);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c66), to(#a00)); /* older webkit syntax */
	background: -webkit-linear-gradient(#c66, #a00);
}
/* Updated ON LIVE 9/5/16: Donate button was #menu-item-40, changed to #menu-item-13274 */
#access #menu-item-40 a:hover {  /* failed mouseover effect */
	background-color: #f00;
	background: -moz-linear-gradient(#f66, #800);
	background: -o-linear-gradient(#f66, #800);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f66), to(#800)); /* older webkit syntax */
	background: -webkit-linear-gradient(#f66, #800);
}
#access .container {  /* expand the menu bar 2px on either end to cover the grey bars  */
  border: 0;
  margin-left: -2px;
  margin-right: -2px;
}
.widget-title {
	font-size: 12pt;
}
.widget ul li {
	list-style: disc;
}
.widget ul {
	margin-left: 20px;
}
.tb-contact_widget ul.simple-contact li.phone  { list-style: none; }
.tb-contact_widget ul.simple-contact li.email  { list-style: none; }
.tb-contact_widget ul.simple-contact li.contact  { list-style: none; }
.tb-contact_widget ul.simple-contact li.link  { list-style: none; }


/* ----------------------------------- 
 * Overriding styles on staging -@ewee
 * ----------------------------------- */

	/* COLORS 
	red				#a00;
	orange			#f3901d;
	nav gray		#737271;
	email button	#f93;
	*/

/*
BASE (MOBILE) SIZE
This are the mobile styles. It's what people see on their phones. If
you set a great foundation, you won't need to add too many styles in
the other stylesheets. Remember, keep it light: Speed is Important.
*/

.small-scrn { /* small devices */
	display: block;
}
.medium-scrn { /* medium devices 481up */
	display: none; 	
}
.large-scrn { /* large devices 768up */
	display: none;
}
html, body, div, button, input, select, textarea, p, ul, ol, li { /* MOVED TO LIVE 8/8/16 -ewee */
	font-size: 14px; /* increases base font size - also updated in theme settings */ 
}
body {
	background: none;
	background-color: #fff;
	/* word-wrap: break-word; */
}
#wrapper {
	margin: 0 !important; /* overrides theme styles */
}
#container {
	max-width: 100% !important;
	width: 100% !important; /* overrides theme styles */
}
#branding.content {
	padding: 0 !important; /* overrides theme styles */
}
iframe {
	max-width: 100%; /* MOVED TO LIVE 8/8/16 -ewee */
}


/* Header */
#header_top, #header_content, #access #primary-menu, .footer_content, #footer_sub_content {
	margin: 0 auto;
}
#header_content, .footer_content, #footer_sub_content {
	max-width: 100%;
}
#header_content {
	/* padding-top: 2rem; */
}
#top #branding .header_logo { /* logo was centered */
  float: left;
  margin: 0;
  width: 100%;
}
.header_logo img {
	height: auto;
}
#header_top {
	display: none; /* aligns logo and custom social header items */
}

/* Social header */
.header-social { 
	display: inline-block;
	float: left;
	margin: 1rem auto;
}
.header-social a {
	display: inline-block;
	position: relative;
	/*top: 0.5rem;*/
	/*margin: 0.25rem 0.25rem 0 0;*/	
	z-index: 999;
}
.header-social .fa-3x {
	font-size: 2.75rem; /* fontawesome override */
}
.header-social .fa:before, .header-social .fa-3x:before, .header-social .tlc-logo-mobile img, .header-social .email-button, .header-social .donate-button, .footer-social .email-button {
	vertical-align: text-bottom;
}  
.header-social .tlc-logo-mobile img {
	height: 2.75rem;
	width: 2.75rem;
}
.header-social .email-button, .footer-social .email-button {
	background: #f93;
    /*border-radius: 0.5rem;*/
    color: #fff;
    /*margin-top: 0.5rem;*/
    padding: 0.5rem;
    position: relative;
    text-transform: uppercase;
    top: 0;
}
.header-social .email-button .fa, .footer-social .email-button .fa {
	margin: 0;
}
.header-social .email-button:hover, .header-social .email-button:active, 
.header-social .donate-button:hover, .header-social .donate-button:active, 
.footer-social .email-button:hover, .footer-social .email-button:active {
	background-color: #737271;
}

.header-social .donate-button {
	background: #b5121b;
    /*border-radius: 0.5rem;*/
    color: #fff;
    /*margin-top: 0.5rem;*/
    padding: 0.5rem;
    position: relative;
    text-transform: uppercase;
    top: 0;
}
.header-social .donate-button .fa {
	margin: 0;
}

.header-social .themeblvd-search, .footer-social .themeblvd-search {
	display: inline-block;
	/*margin-top: 0.5rem;*/
	vertical-align: top;
}
.header-social .themeblvd-search form, .footer-social .themeblvd-search form {
	-webkit-border-radius: 0.5rem;
	-moz-border-radius: 0.5rem;
	border-radius: 0.5rem;
	background: #fafafa;
	border: 1px solid #dadada;
	z-index: 998;
}
.header-social .themeblvd-search fieldset, .footer-social .themeblvd-search fieldset {
	border: 0; 
}
.header-social .themeblvd-search input.search-input, .footer-social .themeblvd-search input.search-input {
	font-size: 1rem;
	height: 1.5rem;
}
/* END Social header */


#main {
	margin: 0 auto;
	max-width: 960px;
}
.social-follow .fa {
	display: inline-block;
	height: 3rem;
	width: 3rem;
}
.column.grid_4 {
	border-bottom: 1px dotted #dadada;
	margin-bottom: 2rem;
}

/* fixes aspect ratio issues */
img.size-full { /* MOVED TO LIVE 9/5/16 -ewee */
	height: auto; 
	min-height: inherit;
}
.style2-grid figure img { /* MOVED TO LIVE 9/5/16 -ewee */
	min-height: inherit !important; /* fixes aspect ratio issues on iOS Safari */ 
}

.element-slogan .slogan.has_button { /* fixes alignment of slogan on home for small screens */
	margin: 0 auto;
	text-align: center;
}
.element-slogan .slogan.has_button .tb-button {
	display: block;
	float: none;
	margin: 1rem auto;
	max-width: 10rem;
}

/* Footer */

#container #bottom .footer_content {
	margin: 0 auto;
	padding: 1rem 0;
}
.footer-colophon {
	display: block;
	text-align: center;
}
.footer-social {
	display: block;
	margin: 1rem auto;
	text-align: center;
}
.footer-social .fa {
	margin-right: 0.25rem;
}
.footer-social .email-signup-form, .footer-social .email-signup-form form {
	display: inline-block;
	min-width: 12rem; /* prevents button and form field from breaking */
	padding-top: 0.25rem;
}
.footer-social .email-signup-form input {
	border-radius: 0.25rem;
	padding: 0.5rem;
}

.footer-social .email-signup-form input[type=submit] {
	background-color: #f93;
	border: 1px solid #d1d1d1;
	color: #fff;
	font-weight: normal;
	margin: 0;
	padding: 0.5rem;
	position: relative;
	left: -1rem;
}
.widget .footer-social a {
    font-family: inherit;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
}
#bottom #footer_sub_content {
	border: 0;
}

/* END BASE */

/*
LARGER MOBILE DEVICES
This is for devices like the Galaxy Note or something that's
larger than an iPhone but smaller than a tablet. Let's call them
tweeners.
*/
@media only screen and (min-width: 481px) {
	.small-scrn { /* small devices */
		display: none;
	}
	.medium-scrn { /* medium devices 481up */
		display: block; 	
	}
	.large-scrn { /* large devices 768up */
		display: none;
	}
} /* END 481up */


/*
TABLET & SMALLER LAPTOPS
This is the average viewing window. So Desktops, Laptops, and
in general anyone not viewing on a mobile device. Here's where
you can add resource intensive styles.
*/
@media only screen and (min-width: 768px) {
	.small-scrn { /* small devices */
		display: none;
	}
	.medium-scrn { /* medium devices 481up */
		display: none; 	
	}
	.large-scrn { /* large devices 768up */
		display: block;
	}

	/* Fixed primary menu on scroll */
	#wrapper #branding {
		background: #fff;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 100;
	}
	#wrapper #main, #wrapper #bottom {
		position: relative;
		top: 15rem; /* needed for "fixed" above */
	}

	/* Header */
	#header_top, #access #primary-menu {
		padding: 0;
	}
	#header_content, .footer_content, #footer_sub_content {
		max-width: 96%;
	}
	.footer_content .footer-full-width {
		text-align: center;
	}
	#top #branding .header_logo { /* logo was centered */
		margin: 1rem auto 1rem 0;
		max-width: 480px; 
	}
	.header_logo img {
		padding-bottom: 1rem; 
	}

	/* Social header */
	.header-social {
		display: inline-block;
		float: right;
		margin-right: 4%;
		position: relative;
	}
	/*.header-social .donate-button, */
	.header-social .tlc-logo-mobile {
		display: none; /* only display on smaller screens */
	}
	/* Main Nav */
	#access {
		background-color: #fff; /* was #737271 */
		border-top: 1px #dadada dotted;
		margin: 0 auto;
		max-width: 96%;
		position: relative;
	}
	#access #primary-menu {
		-webkit-box-shadow: 0; 
		-moz-box-shadow: 0; 
		box-shadow: 0; 
		border: none;
		display: block;	
		float: none;
		margin: 0 auto;
		max-width: 64rem; /* was 53rem */
	}
	#access #primary-menu .fa { /* social in nav */
		color: #b5121b;
		margin-top: 0.5rem;
	}
	#access #primary-menu .fa:focus, 
	#access #primary-menu .fa:hover, 
	#access #primary-menu .fa:active {
		color: #f93;
	}
	#access #primary-menu.sf-menu .menu-item-13426 a, /* facebook */ 
	#access #primary-menu.sf-menu .menu-item-13427 a, /* twitter */
	#access #primary-menu.sf-menu .menu-item-13428 a { /* youtube */
		padding: 0 0 0 1rem;
	}
	.header-social .fb-top, .header-social .tw-top, .header-social .yt-top, /* social in top social header for small screens only */
	#access:before { /* hide hamburger on bigger devices */
		display: none; 
	}

/*
	#access .menu-item .sub-menu,
	#access .sf-with-ul .sub-menu,
	#access .menu-item:focus .sub-menu, 
	#access .menu-item:hover .sub-menu, 
	#access .menu-item:active .sub-menu,
	#access .sf-with-ul:focus .sub-menu, 
	#access .sf-with-ul:hover .sub-menu, 
	#access .sf-with-ul:active .sub-menu {
		display: block !important;
		visibility: visible !important;
	}
*/	
	#access #primary-menu .menu-item a {
		color: #737271; /* was #fff */
	}
	#access #primary-menu .menu-item .sub-menu .menu-item a {
		color: #737271;
	}
	#access #primary-menu.sf-menu li a.sf-with-ul { /* overrides existing to use rems */
		/*padding-right: 2rem; */
	}
	#access #primary-menu.sf-menu li a.sf-with-ul:after {
	    content: ' \f0d7';
	    font-family: 'FontAwesome';
	    padding-right: 0.25rem;
	}
	#access #primary-menu.sf-menu li a { /* overrides existing to use rems */
		font-size: 0.9rem; /* Updated ON LIVE 2/15/17: was 1rem */
		font-weight: normal;
		line-height: 1.5rem;
		margin: 1rem 0;
		padding: 0 0.5rem;
	}
	#access .sf-menu .sub-menu {
		min-width: 20rem; /* overrides existing */
	}

	#access li a>.sf-sub-indicator {
		display: none; /* replaced with fontawesome icon */
	/*top: 1.125rem;
	display: inline-block;*/
	}
	/* Updated ON LIVE 9/5/16: Donate button was #menu-item-40, changed to #menu-item-13274 */
	#access #menu-item-40 { /* Donate button */
		display: block;
		margin: 0; 
	}
	#access #menu-item-13045 { /* Signup button */
		display: block;
		margin: 0;
	}
	/* Updated ON LIVE 9/5/16: Donate button was #menu-item-40, changed to #menu-item-13274 */
	#menu-item-40 a {	/*  make donate button red, a gradient in newer browsers*/
		background-color: #a00;
		background: -moz-linear-gradient(#c66, #a00);
		background: -o-linear-gradient(#c66, #a00);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c66), to(#a00)); /* older webkit syntax */
		background: -webkit-linear-gradient(#c66, #a00);
	}
	/* Updated ON LIVE 9/5/16: Donate button was #menu-item-40, changed to #menu-item-13274 */
	#access #menu-item-40 a:hover {  /* failed mouseover effect */
		background-color: #f00;
		background: -moz-linear-gradient(#f66, #800);
		background: -o-linear-gradient(#f66, #800);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f66), to(#800)); /* older webkit syntax */
		background: -webkit-linear-gradient(#f66, #800);
	}
	#access #menu-item-13045 a {
		background-color: #f3901d;     /*  make signup button orange, a gradient in newer browsers*/
		background: -moz-linear-gradient(#f93, #fa3);
		background: -o-linear-gradient(#f93, #fa3);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f93), to(#fa3)); /* older webkit syntax */
		background: -webkit-linear-gradient(#f93, #fa3);
	}
	#access #menu-item-13045 a:hover, #access #menu-item-13045 a:active {
		background-color: #f93;
		background: -moz-linear-gradient(#fc3, #f3901d);
		background: -o-linear-gradient(#fc3, #f3901d);
		background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fc3), to(#f3901d)); /* older webkit syntax */
		background: -webkit-linear-gradient(#fc3, #f3901d);
	}
	#access #menu-item-13045 a span.fa {
		padding-left: 0.5rem;
	}
	/* fixed smaller top nav on larger screens */
	.scrolled-nav {
		border-bottom: 1px #dadada dotted;
	}
	.scrolled-nav #header_content {
		float: left;
		margin-right: 1rem;
		max-width: 8rem;
	}
	#branding.scrolled-nav #header-content .container {
		padding: 1rem 0 0 0;
	}
	.scrolled-nav .header-social {
		margin-right: 2rem;
	}
	#top #branding.scrolled-nav .header_logo {
		margin: 0 0 0 2rem;
		max-width: 5rem;
	}
	#top #branding.scrolled-nav .header_logo img {
		display: none; 
	}
	.scrolled-nav .tb-image-logo {
		cursor: pointer; 
		display: block;
	}
	.scrolled-nav .tb-image-logo:before {
		cursor: pointer;
		display: block;
	    height: 4rem;
	    width: 4rem;
	    content: '\ ';
	    background: url('/wp-content/themes/main/images/tlclogo-avatar.jpg') transparent 0 0 / 4rem no-repeat;
	}
	.scrolled-nav #access {
		border: 0;
		clear: both;
		margin: 0 auto;
		top: 0;
		width: 96%;
	}

	.column.grid_4 {
		width: 30.66%; /* resets grid */
	}

	/* Content */
	iframe { /* MOVED TO LIVE 8/8/16 -ewee */
		max-width: none; /* reset for larger screens */ 
	}

	.element-slogan .slogan.has_button .tb-button {
		display: inherit;
		float: right;
		margin: auto;
		max-width: inherit;
	}

	/* Footer */
	#container #bottom .footer_content {
		padding: 2rem 4rem;
	}

} /* END 768up */
 

/* Nav fix for 800up */
@media only screen and (min-width: 800px) {
	#access #primary-menu.sf-menu li a {
		font-size: 1rem;
	}
}
/* END 800fix */

/*
DESKTOP
This is the average viewing window. So Desktops, Laptops, and
in general anyone not viewing on a mobile device. Here's where
you can add resource intensive styles.
*/
@media only screen and (min-width: 1030px) {
	#access #primary-menu {
		max-width: 74rem;
	}
	#access #primary-menu.sf-menu li a { 
		padding: 0 1rem;
	}
	.scrolled-nav #access #primary-menu.sf-menu li a {
		padding: 0 0.5rem;
	}
} /* END 1030up */

@media only screen and (min-width: 1110px) {
	.scrolled-nav #access { 
		background: transparent;
		clear: none;
		border: 0;
		margin: 0 8rem; /* need margin-left: 8rem; so small logo is clickable */
		position: relative;
		top: 1rem;
		width: auto;
	}
}

@media only screen and (min-width: 1150px) { /* nav breaks at 1150px */
	#header_top, #access #primary-menu {
		padding: 0 4rem;
	}
	#access #primary-menu {
		max-width: 74rem;
	}	
	#access #primary-menu.sf-menu li a.sf-with-ul {
		/*padding-right: 2rem; */
	}
	.scrolled-nav #access #primary-menu.sf-menu li a {
		padding: 0 0.5rem;
	}
} 

/*
LARGE VIEWING SIZE
This is for the larger monitors and possibly full screen viewers.
*/
@media only screen and (min-width: 1240px) {
	#top #branding .header_logo {
		margin: 1rem auto 1rem 6%;
	}
	.header-social {
		margin-right: 10%;
	}
} 

@media only screen and (min-width: 1520px) {
	#top #branding .header_logo {
		margin: 1rem auto 1rem 16%;
	}
	.header-social {
		margin-right: 20%;
	}
} 


/*
STYLE OVERRIDES for small screens.
*/

@media only screen and (max-width: 767px) {

	/* Nav */
	#top { /* fixed top nav/header for mobile */
		background: #fff;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 999; /* to overlay page content */
	}
	#main, #bottom { /* moves content down to accomodate fixed header */
		position: relative;
		top: 5rem;
	}
	#top #branding #header_content .header_logo {
		display: none; /* hide large logo */
	}
	#header_top, #header_content {
	display: none; /* aligns logo and custom social header items */
	}
	.header-social {
		margin-left: 4rem; /* left margin for hamburger icon */
	}
	#access {
		background-color: transparent;
		clear: both;
		cursor: pointer;
		display: block;
		position: absolute; /* Needs to be absolute positioning */
		left: 0;
		top: 1rem;
		z-index: 1001;
	}
	/* DEV ONLY Bumps the menu icon down when WP admin bar is in place */
	/*.logged-in #branding {
		position: relative;
		top: 4rem;  
	}*/
	#access:before {
		content: ' ';
		background: transparent;
	    border-bottom: 1.25rem double #737271;
	    border-top: .45rem solid #737271;
	    height: 2rem;
	    width: 2rem;
	    display: block;
	    clear: both;
	    float: left;
	    margin: 0.25rem;
	}
	.scrolled-nav #access {
		margin: 0.25rem; /* overwrites large screen positioning */
	}
	#access #primary-menu {
		-webkit-box-shadow: 4px 4px 8px #888;  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
		-moz-box-shadow: 4px 4px 8px #888;  /* Firefox 3.5 - 3.6 */
		box-shadow: 4px 4px 8px #888;  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
		clear: both;
		display: none;  /* hide menu initially on smaller screens */
		float: left;
		margin: 0;
		width: 100%;
		/*max-width: 8rem;*/
	}
	#access #primary-menu .menu-item {
		background: #f8f8f8;
		text-align: left;
		width: 100%;
	}
	#access #primary-menu .menu-item:focus,
	#access #primary-menu .menu-item:hover,  	
	#access #primary-menu .menu-item:active {
		background: #efefef;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* IE 8 */
		filter: alpha(opacity=98); /* IE 5-7 */
		-moz-opacity: 0.98; /* Netscape */
		-khtml-opacity: 0.98; /* Safari 1.x */
		opacity: 0.98;
	}
	#access #primary-menu .menu-item a {
		color: #737271; 
		font-size: 1rem;
		padding: 0 0.5rem;
	}
	#access li a>.sf-sub-indicator {
		display: none;
	}

	#access .menu-item .sub-menu,
	#access .sf-with-ul .sub-menu,
	#access .menu-item:focus .sub-menu, 
	#access .menu-item:hover .sub-menu, 
	#access .menu-item:active .sub-menu,
	#access .sf-with-ul:focus .sub-menu, 
	#access .sf-with-ul:hover .sub-menu, 
	#access .sf-with-ul:active .sub-menu {
		display: none !important;
		visibility: hidden !important;
	}
	/* Updated ON LIVE 9/5/16: Donate button was #menu-item-40, changed to #menu-item-13274 */
	#access #menu-item-40 { /* Donate button */
			display: none;
	}
	#access #menu-item-13045 { /* Signup button */
		display: none;
	}
	/* social in nav for large screens only */
	#access #primary-menu.sf-menu .menu-item-13426, /* facebook */ 
	#access #primary-menu.sf-menu .menu-item-13427, /* twitter */
	#access #primary-menu.sf-menu .menu-item-13428 { /* youtube */
		display: none;
	}

	/* Slides */
	.standard-slider .media-align-left .slide-title span, 
	.standard-slider .media-align-right .slide-title span {
		font-size: 1.5rem;
	}
	/* Slide grid rules */
	.slides .grid_fifth_2, .slides .grid_fifth_3 {	/* Consolidate with other grid styles? -ewee */
		width: 100%;
	}
}
/* END 767down */


@media only screen and (max-width: 479px) {

	/* Grid */
	.column.grid_3, 
	.column.grid_4, 
	.column.grid_5, 
	.column.grid_6, 
	.column.grid_7, 
	.column.grid_8,
	.column.grid_9 {
		width: 100%; /* overrides grid for small screens */
	}
}
/* END 479down */

/* Nav fixes for smaller screens */
@media only screen and (max-width: 406px) {
	.header-social {
		margin-left: 2.25rem;
	}
	.header-social .content {
		padding: 0 0.5rem;
	}
	.header-social a {
		font-size: 0.75rem;
	}
	.header-social .fa-3x {
		font-size: 2.5rem;
	}
	.header-social .tlc-logo-mobile img {
		height: 2.5rem;
		width: 2.5rem;
	}
	#access:before {
		margin: 0.25rem;
	}
}
/* END 406down*/

/* Nav fixes for smallest screens, i.e. iphone vertical */
@media only screen and (max-width: 341px) {
	.header-social .fa-3x {
		font-size: 2.25rem;
	}
	.header-social .tlc-logo-mobile img {
		height: 2.125rem;
		width: 2.125rem;
	}
	.header-social .donate-button, .header-social .email-button, .footer-social .email-button {
		padding: 0.5rem 0.3rem;
	}
}

/*
RETINA (2x RESOLUTION DEVICES)
This applies to the retina iPhone (4s) and iPad (2,3) along with
other displays with a 2x resolution. You can also create a media
query for retina AND a certain size if you want. Go Nuts.
*/
/*@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min--moz-device-pixel-ratio: 1.5),
       only screen and (min-device-pixel-ratio: 1.5) {

}*/

/*
iPHONE 5 MEDIA QUERY
Want to get fancy for no good reason? Knock yourself out.
*/
/*@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) {
    
}*/

/*
PRINT STYLESHEET
Feel free to customize this. Remember to add things that won't make
sense to print at the bottom. Things like nav, ads, and forms should
be set to display none.
*/
/*@media print {

}*/

/* TLC Map styles */

#mapContainer {
	position: relative;
}
#areaInfo {
    background: #fafafa; /* #ffe49d */
    border-left: 3px solid #ccc; /* #b5121b */
    margin-bottom: 2rem;
    padding: 1rem 5rem;
	position: relative;
    top: 0;
    width: 100%;
    z-index: 100;
}
#areaInfo h4 {
	color: #b5121b;
}
#map {
	border-left: 3px solid #ccc;
	height: 50rem;
	width: 100%;
	overflow: hidden;
	position: relative;
}