@charset "utf-8";

/* FONTS */

/****
font-family: 'Lobster', cursive;
font-family: 'Lobster Two', cursive, Arial, Helvetica, sans-serif;
font-family:'Droid Sans W01 Bold', Arial, Helvetica, sans-serif;
font-family:'Droid Sans W01 Regular', Arial, Helvetica, sans-serif;
****/

html, body {
margin: 0; padding: 0; height: 100%;
font-family:'Droid Sans W01 Regular', Arial, Helvetica, sans-serif;
font-size: 14px; color: #262626; }

a { color: #fff; transition: all 0.15s ease-in-out; }
a:hover { color: #999; }
p { margin: 0; padding: 10px 0; line-height: 18px; }
div { margin: 0; padding: 0; height: auto; }

.wrap {	position: relative; margin: 0 auto; }
.clearit { clear: both; }

#pagewrap,#headwrap,#navwrap,#slidewrap,#basewrap,#cntwrap,#footwrap,#credwrap 
{ position: relative; width: 100%; z-index:1; }

#pagewrap h1, #pagewrap h2, #pagewrap h3 {
color: #333; margin: 5px 0; letter-spacing: -0.5px;
font-family: 'Lobster', cursive, Arial, Helvetica, sans-serif;
text-shadow: #fff 2px 1px 0px; }
#pagewrap h1 { font-size: 400%; }
#pagewrap h2 { font-size: 300%; }
#pagewrap h3 { font-size: 300%; }

body { background: #fff; background-size: cover; }

#pagewrap { }

#headwrap { }
#header { height: auto; }

	#logo {
	position: relative; margin: 0 auto; z-index: 5; 
	background: url(images/jneal_logo.png) center center no-repeat;
	background-size: contain; }

#navwrap { }

.cntwrap { position: relative; background: #fff; text-align: center; }
.cntwrap img { max-width: 100%; height: auto; padding: 10px; }
		
	.cntwrap.white { color: #777; text-shadow: #efefef 1px 1px 0px; }
	
		#pagewrap .cntwrap.white h1, 
		#pagewrap .cntwrap.white h2, 
		#pagewrap .cntwrap.white h3 { color: #333; text-shadow: #efefef 2px 1px 0px; }
		
	.cntwrap.ltgray { text-shadow: #d2d2d2 1px 1px 0px; background: rgba(0,0,0,0.05); }
	.cntwrap.ltgray .wallpaper { background: rgba(0,0,0,0.05); }
		
	.cntwrap.gray { text-shadow: #d2d2d2 1px 1px 0px; }
	.cntwrap.gray .wallpaper { background: rgba(0,0,0,0.15); }
	
	.cntwrap.dkgray { color: #efefef; text-shadow: #444 1px 1px 0px; }
	.cntwrap.dkgray .wallpaper { background: rgba(0,0,0,0.80); }
	
		#pagewrap .cntwrap.dkgray h1, 
		#pagewrap .cntwrap.dkgray h2, 
		#pagewrap .cntwrap.dkgray h3 { color: #fff; text-shadow: #111 2px 1px 0px; }

	/* custom wallpapers */
	
	.cntwrap.intro,
	#headwrap { background: url(images/wallpaper_intro.jpg) center center no-repeat; }
	#headwrap .wallpaper { background: rgba(255,255,255,0.90); } 
	.cntwrap.intro .wallpaper { background: rgba(50,139,180,0.90); } 
	.cntwrap.intro { color: #efefef; text-shadow: #333 1px 1px 0px; }
	
		#pagewrap .cntwrap.intro h1, 
		#pagewrap .cntwrap.intro h2, 
		#pagewrap .cntwrap.intro h3 { color: #fff; text-shadow: #222 2px 1px 0px; }
		
	.cntwrap.internet { 
	color: #efefef; text-shadow: #333 1px 1px 0px;
	background: url(images/wallpaper_internet.jpg) center center no-repeat; }
	.cntwrap.internet .wallpaper { background: rgba(0,0,0,0.85); } 
		
		#pagewrap .cntwrap.gray h1, 
		#pagewrap .cntwrap.gray h2, 
		#pagewrap .cntwrap.gray h3 { color: #fff; text-shadow: #000 2px 1px 0px; }
	
	.cntwrap.merch { background: url(images/wallpaper_merch.png) center center; }
	.cntwrap.merch .wallpaper { background: rgba(255,255,255,0.95); } 
	.cntwrap.merch a { color: #000; }
	
	.cntwrap.coffee { background: url(images/wallpaper_coffee.jpg) center center no-repeat; }
	.cntwrap.coffee .wallpaper { background: rgba(0,0,0,0.60); } 
		
		.gnc-product { padding-top: 10px; background: #fff; display: inline-block; vertical-align: top; }
 
.content { padding: 75px 0; }
	
	#article,#articlefull,#aside 
	{ position: relative; float: left; }
	
	#article { 		width: 650px; }
	#articlefull { 	width: 1140px; }
	#aside { 		width: 220px; }

#footwrap { }
#footer { background: rgba(0,0,0,1); }

#credwrap { }
#credits { }

/* ///////////////////////////////////////////////////////////// */
/* //////////////MAKE/IT/RESPONSIVE/THEY/SAID/////////////////// */
/* ////////////////////////////.../SO/I/DID///////////////////// */
/* ///////////////////////////////////////////////////////////// */

@media screen and (min-width: 300px)
{ 
.cntwrap { width: 100%; }
iframe { max-width: 90%; height: 900px; }
.wrap { width: 80%; }

#logo {
position: relative; width: 90%; height: 200px; max-width: 300px;
padding: 10px 0; margin: 0 auto; }

.gnc-product { width: auto; margin: 10px auto; min-height: inherit; }

#headwrap, .cntwrap.intro, .cntwrap.merch, .cntwrap.internet, .cntwrap.coffee
{ background-size: cover; background-attachment: scroll; }
}
@media screen and (min-width: 500px)
{ 
#logo {
position: relative; width: 60%; height: 200px; 
padding: 20px 0; margin: 0 auto; }
.wrap { width: 90%; }
iframe { max-width: 85%; max-height: 460px; }
.gnc-product { width: 24%; min-height: 375px; }
}
@media screen and (min-width: 800px)
{ 

}
@media screen and (min-width: 1140px)
{
.wrap { width: 1140px; }
.content { padding: 75px 0; }
iframe { max-width: 100%; max-height: none; }
#logo { width: 300px; height: 200px; padding: 50px 0; max-width: 300px; }
#logo a { display: block; width: 400px; height: 200px; }

.gnc-product { width: 20%; min-height: 415px; }

#headwrap, .cntwrap.intro, .cntwrap.merch, .cntwrap.internet, .cntwrap.coffee
{ background-size: cover; background-attachment: fixed; }	
}

@media screen and (max-width: 400px) {
.ccm-layout-col {float: none !important; width: 100% !important;}
.ccm-layout-col-spacing {margin: 0 !important;}
}

/* ///////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////// */