/*
Theme Name: 	Starkers
Theme URI: 		http://viewportindustries.com/products/starkers
Description: 	The totally nude Wordpress theme!
Version: 		4.0
Author: 		Elliot Jay Stocks & Keir Whitaker
Author URI: 	http://viewportindustries.com
Tags: 			starkers, naked, clean, basic
*/

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Media queries 
===========================
*/

/* ---------------------------------------------------------------------------------------------------------- 
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@import "css/reset.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
.group:after 		{ display:block; height:0; clear:both; content:"."; visibility:hidden; /* For clearing */ }
body 				{ background:#fff; /* Don't forget to style your body to avoid user overrides */ }
::-moz-selection 	{ background:#ff0; color:#333; }
::selection 		{ background:#ff0; color:#333; }

/* ---------------------------------------------------------------------------------------------------------- 
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/

body,
input,
textarea 			{ /* We strongly recommend you declare font-weight using numerical values, but check to see which weights you're exporting first */ }


body {
	font-family:Arial, Helvetica, sans-serif; 
	color:#FFFFFF;	
	background:#29A1D1;
}

/* STRUCTURE */

#main {
	padding:2em 0;
}

header {
	overflow:hidden;
	padding:3em 0 0;
	background:#F6F7EF;
	color:#333333;
}
	

/* TYPOGRAPHY */

a, a:focus, a:link {
	color:#29A1D1;
	text-decoration:none;
}

a.button, input.button {
	color:#FFFFFF;
	font-family:"futura-pt", Arial, Helvetica, sans-serif;
	font-size-adjust:0.5; 
	font-weight:bold; 
	font-style:normal;
	text-transform:uppercase;
}

a.button.medium, input.button.medium {
	padding:8px 16px !important;
	font-size:1.2em;	
}


a.button:hover, input[type="submit"]:hover {
	background:#DC4439 !important;	
	border-color:#C2382E !important;
}

h1, h2, h3, h4 {
	font-family:"futura-pt", Arial, Helvetica, sans-serif;
	font-size-adjust:0.5; 
	font-weight:bold; 
	font-style:normal;
}

h2 {
	text-transform:uppercase;
	color:#BBBBBB;
}

p {
	margin-bottom:1em;
}

p.summary {
	font-size:1.4em;
}

/* FOOTER TRAUMA */

#ftr1, .trauma {
}

.trauma h1 {
	font-family:"futura-pt", Arial, Helvetica, sans-serif;
	color:#29A1D1;
	font-size: 2em;
    line-height: 0.9;
    text-transform: uppercase;
}

.trauma h1 a {
	text-decoration:none;
}

.trauma h1 span {
	font-size:0.5em;
}

.trauma .button {
	background:#29A1D1;
	border-color:#19789D;
	color:#FFFFFF;
}

.trauma .button:hover {
	background:#29A1D1;
}

.trauma a {
	color:#FFFFFF;
	text-decoration:underline;
}

.trauma header a {
	color:#29A1D1;
}

.trauma img {
	margin:0 auto; 
	width:192px;
}


.soon {
	font-family:"futura-pt", Arial, Helvetica, sans-serif;
	font-size-adjust:0.5; 
	font-weight:bold; 
	font-style:normal;
	text-transform:uppercase;
	color:#444444;		
}

.desc {
	font-family:"proxima-nova", Arial, Helvetica, sans-serif;	
	font-size: 1.2em;
    line-height: 1.4;
    margin-bottom:1em;
}

.wufoo .info h2 {display:none !important;}

h1, 
h2, 
h3, 
h4, 
h5, 
h6 					{ font-weight:bold; /* This helps to identify headings at the initial build stage, but you should write something more precise later on */ }

/* ---------------------------------------------------------------------------------------------------------- 
03 Media queries (using a mobile-first approach) ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@media screen and (max-width:768px) and (min-width:480px) {
}

/* 768 and down */
@media screen and (max-width:768px) {
	header {
		text-align: center;
	}
	header, #main {
		padding-left:25px;
		padding-right:25px;
	}
}

/* 480 and down */
@media screen and (max-width:480px) {
}


/* 320 and down */
@media screen and (max-width:320px) {
}

/* Retina Display */
@media screen and (-webkit-min-device-pixel-ratio:2) {
}