/*------------------------------------*\
    RESET
\*------------------------------------*/
/* http://meyerweb.com/eric/tools/css/reset/ 
    v2.0b1 | 201101 
    NOTE:WORK IN PROGRESS
    USE WITH CAUTION AND TEST WITH ABANDON */

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary,
time,mark,audio,video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section{
    display:block;
}
body{
    line-height:1;
}

blockquote,q{
    quotes:none;
}
blockquote:before,blockquote:after,
q:before,q:after{
    content:’’;
    content:none;
}


/* remember to highlight inserts somehow! */
ins{
    text-decoration:none;
}
del{
    text-decoration:line-through;
}

table{
    border-collapse:collapse;
    border-spacing:0;
}

/* Making Images Responsive */

img,
img.size-auto,
img.size-full,
img.size-large,
img.size-medium,
.attachment img,
#sidebar img,
.wp-caption {
	max-width: 100%; /* When images are too wide for containing element, force them to fit. */
	height: auto; /* Override height to match resized width for correct aspect ratio. */
}



/*------------------------------------*\
    $MAIN
\*------------------------------------*/
/* GO! */

/* Body & Defaults */

body {
    background: #ffffff url(../images/barbarasmith-star.png) 50% 100% no-repeat;
	color: #284a8b;	
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	}	
	
h1 {
	font-size: 2.0em;
	margin-bottom: 20px;
	}
	
h2 {
	font-size: 1.8em;
	margin-bottom: 20px;
	}	
	
h3 {
	font-size: 1.6em;
	}		
	
p {
	font-size: 1.2em;
	margin-bottom: 10px;
	line-height: 1.5em;
	clear: left;
	}
	
ul {
	font-size: 1.2em;
	margin: 0 0 30px 20px;
	}

li {
	margin-bottom: 5px;
	line-height: 1.2em;
	}
	
a {
	color: #69c04a;
	}
	
a:hover {
	text-decoration: none;
	}
	
/* Wrapper */	

#wrapper {
	/*background: #ffffff url(../images/barbarasmith-star.png) center bottom no-repeat;*/
	max-width: 1090px;
	margin: 0 auto;
	padding: 30px 20px 10px 20px;	
	}
	
/* Header */

#header {
	border-bottom: 3px dotted #284a8b;
	margin-bottom: 30px;
	}

#header h1 {
	margin-bottom: 5px;	
	}

#header h2 {
	font-size: 2.5em;
	font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
	color: #69c04a;
	}
	
/* Content */	

#content h2 {
	color: #69c04a;
	}
	
.boxout {	
	/*width: 350px;*/
    width: 32%;
	float: left;
	/*margin-right: 20px;*/
    margin-right: 2%;
	}
	
.boxoutlast {
	margin-right: 0 !important;
	}	
	
/* Credit */

#credit {	
	margin-top: 30px;	
	text-align: right;
	font-size: 0.7em;
	}
	
#credit a {
	color: #284a8b;
	}
	
#credit a:hover {
	text-decoration: none;
	}	
	
/* ------------------------------------------------------*\
MEDIA QUERIES
\*------------------------------------------------------ */

/* General rules for mobile devices */

@media only screen
and (min-width : 0px ) and (max-width : 850px) {

    body {
    background: #ffffff url(../images/barbarasmith-star.png) 50% 50% no-repeat;
	}
    
    h1, h2, p {
    text-align: center;
    }

    #credit {	
	text-align: center;
	}

}

/* TABLET = 501px - 850px */

@media only screen
and (min-width : 501px ) and (max-width : 850px) {
	
    /* PHONE - Content */	

    .boxout {	
	width: 100%;
	float: none;
    margin: 0 2%;
	}

}	


/* PHONE = 0px - 500px */

@media only screen
and (min-width : 0px ) and (max-width : 500px) {

    /* PHONE - Content */	

    .boxout {	
	width: 100%;
	float: none;
    margin: 0 2%;
	}

}