/* copyright © 2012 tyler finck and justin muir */


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, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus {/* remember to define focus styles! */
	outline: 0;
}
body {
	line-height: 1;
	overflow-x: hidden;
	position: relative;
	top: 0;
	text-rendering: optimizelegibility;
	
}

#mininav {
display: none;
}

ol, ul {
	list-style: none;
}

a img {
	border: 0;
}

a {
color: white;
}




#navigation a {
color: #67e0e1;
}

a#buybutton, a#closebutton {
z-index: 10;
position: absolute;
top: 30px;
right: 30px;
border-radius: 120px;
padding: 30px 18px 0px 13px;
text-align: center;
background: #67e0e1;
color: #0c0c0c;
font-size: 49px;
text-decoration: none;
letter-spacing: -2px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
font-family: "Cardo", "Times New Roman", Georgia, serif;
font-style: italic;
font-weight: 400;
height: 120px;
width: 120px;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
opacity: 0;
box-shadow: 0 0 5px rgba(0,0,0,0.25);
}

#buybutton:hover, a#closebutton:hover {
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
background: rgba(255,255,255,1.0);
box-shadow: 0 0 0px black;


}

a#buybutton span, a#closebutton span {
display: block;
font-size: 11px;
letter-spacing: 0px;
text-transform: uppercase;
line-height: 1.35;
}

#navigation {
position: absolute;
top: 30px;
left: 0;
background: #0c0c0c;
z-index: 7;
box-shadow: 0 0 5px rgba(0,0,0,0.25);
opacity: 0;
}

#navigation a  {
font-family: "Neuton", "Times New Roman", Georgia, serif;
display: block;
font-weight: 200;
padding: 8px 25px;
text-decoration: none;
font-size: 13px;
line-height: .75;
border-right: 3px solid #0c0c0c;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
text-shadow: 0 0 3px black;
width: 100px;
}


#navigation ul li:nth-child(1) a {
padding: 11px 25px 9px;
font-family: 'Cardo', "Times New Roman", Georgia, serif;
    font-size: 13px;
    font-weight: 400;
    font-style: italic;
}

#navigation ul li:nth-child(6) a {
padding: 9px 25px 12px;
}

#navigation li a.selected {
color: white;
border-right: 3px solid white;
}

#navigation li a:hover {
background: #67e0e1;
color: #0c0c0c;
text-shadow: 0 0 3px #67e0e1;
border-right: 3px solid #67e0e1;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;

}

#navigation li:nth-child(1) a:hover {

}

#navigation li:nth-child(6) a:hover  {

}

#navigation li a.selected:hover {
background: white;
color: #0c0c0c;
border-right: 3px solid #fff;
text-shadow: 0 0 3px #fff;

}

body {
margin: 0;
padding: 0;
position: relative;
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
overflow-x: hidden;
background: #010101;
}

#background {
background-color: #010101;
background-image: url("images/backgrounds/rotate.php");
background-repeat: no-repeat;
background-size: cover;
background-position: 50% 0;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-indent: -9999em;
-webkit-transition: all .35s ease;
-moz-transition: all .35s ease;
transition: all .35s ease;
}

#background.home {
background-position: 50% 0;
opacity: 0;
}

#background.time {
background-position: 50% -40px;
opacity: 0.3;
}

#background.peek {
background-position: 50% -80px;
opacity: 0.3;
}

#background.nonprofit {
background-position: 50% -120px;
opacity: 0.3;

}

#background.stories {
background-position: 50% -160px;
opacity: 0.3;
}

#background.buy {
background-position: 50% -200px;
opacity: 1.0;
}

.trio {
text-align: center;
width: 100% !important;
}

#slideshow {
margin-top: 35px;
height: 335px;
}

#prev {
position: absolute;
left: -15px;
top: 50%;
}

#next {
position: absolute;
right: -15px;
top: 50%;
}

#slideshow img {
margin: 10px 15px;
box-shadow: 0 0 15px rgba(0,0,0,0.5);
}

.page {
position: fixed;
z-index: 5;
width: 800px;
left: 50%;
margin-left: -400px;
top: 250px;
display: none;
height: 400px;
margin-top: -200px;
top: 50%;
color: #fff;
opacity: 0;
text-shadow: 0 0 6px #444;
}

#peek.page {
width: 900px;
margin-left: -450px;
}

.page.active {
display: block;
z-index: 6;
}

h1 {
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
font-style: normal;
font-weight: 400;
font-size: 156px;
text-align: center;
color: white;
text-shadow: 0 0 15px black;
font-weight: normal;
}

#home h1 {
position: relative;
top: 120px;
}

#home h1 span {
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
font-style: italic;
font-weight: 400;
text-shadow: 0 0 7px black, 0 0 10px #555;
}

#home h1 .super {
position: absolute;
top: 1mapx;
line-height: 1;
left: 186px;
font-size: 31px;
top: -14px;
}

#home h1 .sub {
position: absolute;
right: 77px;
bottom: 1px;
font-size: 18px;
}


/* ---typography
-----------------------*/



h2 {
	font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
	font-style: italic;
	font-weight: 400;
	font-size: 64px;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 10px;
		letter-spacing: -1px;

}

h5 {
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
font-style: italic;
font-weight: 400;
	 font-size: 16px;
	 text-align: center;
	 margin-bottom: 18px;

}

.page p {
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
font-weight: 400;
    font-size: 18px;
    font-style: italic;
    line-height: 1.35;
	margin-bottom: 25px;

}


#nonprofit.page p {
clear: both;
font-style: normal;
text-align: center;
}

#time h2 {
margin-top: -70px;
}

#nonprofit h2 {
font-size: 49px;
margin-top: 25px;
}

#nonprofit h3, #stories h3, #event h3 {
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
font-style: italic;
font-weight: 400;
	font-size: 36px;
	float: left;
	margin: 20px 3% 40px 2%;
	width: 45%;
	line-height: 1.25;
	font-style: italic;
}

#stories h3 {
margin-top: 0;
margin-bottom: 90px;
}

#pager {
position: absolute;
top: 77px;
left: 50%;
margin-left: -68px;
z-index:  6;
}

.pager {
text-align: center;
}


#pager li, .pager li {
list-style-type: none;
display: inline-block ;
}

#pager li a, .pager li a {
text-decoration: none;
text-indent: -999em;
display: block;
margin: 0 10px;
width: 10px;
height: 10px;
border-radius: 30px;
background: white;
border: 4px solid transparent;
   
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}

#pager li.activeSlide a, .pager li.activeSlide a {
background: rgba(103,224,225,1.0);
  }

#pager li a:hover, .pager li a:hover {
background: rgba(103,224,225,1.0);
border: 4px solid rgba(103,224,225,1.0);
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;

}

#stories h2 {
margin-bottom: 50px;
}

#stories h2 span.subtitle, #event h2 span {
font-size: 18px;
display: block;
text-align: center;
}



#stories #mike h2 {
position: relative;
top: -20px;
margin-bottom: 32px;
}

#stories p {
font-family: 'Neuton', "Times New Roman", Georgia, serif;
font-weight: 200;
font-style: normal;
	margin: 20px 7%;
}

#stories #justin p {
float: left;
margin: 2px 13px 20px;
font-size: 16px;
width: 45%;
}

h3 strong, p strong {
color: #67E0E1;
}

#time p {
max-width: 450px;
margin: 0 auto;
padding: 0 20px 25px;
font-family: 'Cardo', "Times New Roman", Georgia, serif;
font-weight: 400;
font-style: italic;
}

::selection {
background: rgba(0,0,0,0);
color: #67E0E1;
        }
::-moz-selection {
background: rgba(0,0,0,0);
color: #67E0E1;
}

.fancybox-prev {
left: -100px;
}

.fancybox-next {
right: -100px;
}

#buy .container {
margin-top: 50px;
background: #0d0d0d;
padding: 30px 25px;
min-height: 140px;
position: relative;
}

#buy #buynowbutton, #buy #buynowinput {
background: #67E0E1;
display: block;
width: 230px;
padding: 25px 15px;
text-align: center;
color: #0d0d0d;
text-decoration: none;
text-shadow: none;
font-size: 33px;
float: left;
letter-spacing: -1px;
border: 0px;
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
position: relative;
}

#buynowinput:after {
position: absolute;
top: -10px;
text-align: center;
content: "(and $5 for shipping)";
font-size: 14px;
font-style: italic;
}

#buy #buynowbutton:hover {
background: white;
color: #0c0c0c;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
}

.fb_edge_widget_with_comment  {
margin: 15px 0 0;
}

#buy #buynowbutton small{
display: block;
text-align: center;
font-size: 12px;
padding-top: 5px;
font-style: italic;
letter-spacing: 0px;
}

#social {
float: right;
width: 230px;
}

#buy img.thumb {
position: absolute;
left: 50%;
margin-left: -120px;
top: -20px;
box-shadow: 0 0 15px rgba(0,0,0,0.5);

}

#social p {
font-style: normal;
font-size: 14px;
font-family: 'Neuton', "Times New Roman", Georgia, serif;
font-weight: 200;
}

#buy copyright {
clear: both;
text-align: center;
font-style: italic;
font-family: "ltc-bodoni-175", "Times New Roman", Georgia, serif;
display: block;
margin: 65px auto;
color: #aaa;
text-shadow: 0 0 5px black;
}

copyright a {
text-decoration: none;
color: #aaa;
}







#share {
position: fixed;
bottom: 15px;
left: 15px;
width: 220px;
opacity: 0;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
}

#share.hover {
opacity: 1.0 !important;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
}


#share a#justin {
font-size: 10px;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 1px;
display: block;
padding: 15px 10px 0 0;
text-shadow: 0 0 3px black;
}

#buystuff {
float: left;
width: 230px;
text-align: center;
}

#paymethod {
margin: 7px 0 2px;
}

#prints {
font-family: "Cardo", Times, serif;
display: block;
text-align: center;
}

#prints:hover {
text-decoration: none;
color: #67E0E1;
}



#event {
opacity: 1;
}

a#closebutton {
display: none;
opacity: 1;
}

#event h3 span {
font-size: 20px;
}

#event a:hover {
text-decoration: none;
color: #67E0E1;
}

#event p {
clear: both;
text-align: center;
display: block;
}



invisible {
width: 320px;
opacity: 0;
}

.fb_edge_widget_with_comment span.fb_send_button_form_widget {
top: -260px !important;
}

.fb_edge_widget_with_comment span.fb_edge_comment_widget {
top: -212px !important;
}

.mobiletrio {
display: none;
}

/* -----ipad styles -----*/
@media (max-width: 1024px) {

#navigation {
top: 0;
right: 0;
left: 0;
}

#navigation li {
display: inline;
}

#navigation a {
width: auto;
}

#navigation li a, #navigation ul li:nth-child(1) a, #navigation ul li:nth-child(6) a {
display: inline-block;
padding: 15px;
border: 0px;
border-right: 0;

}

#navigation li a.selected{
border-right: 0;
}

#navigation li a:hover, #navigation ul li:nth-child(1) a:hover, #navigation ul li:nth-child(6) a:hover  {
padding: 15px;
border: 0px;
border-right: 0;

}

a#buybutton, a#closebutton {
font-size: 33px;
height: 85px;
width: 85px;
padding: 18px 9px 0 9px;
top: 45px;
right: 45px;

}

#background {
background-size: auto 150%;
}


a#closebutton {
display: none;
}

a#buybutton span.supplement strong, a#closebutton span.supplement{
display: none;
}

}
/* -----ipad styles -----*/
@media (max-width: 810px) {

#slideshow {
display: none;
}

.mobiletrio {
display: block;
}

#buystuff {
float: none;
width: auto;
padding-bottom: 15px; 
}

a#buybutton, a#closebutton {
display: none;
}

#peek.page, #time.page, #nonprofit.page, #stories.page, #buy.page, #home.page {
position: static;
margin: 50px auto 100px;
display: block;
opacity: 1;
width: auto;
max-width: auto;
clear: both;
height: auto;
min-height: auto;
}

.page h2 {
margin: 20px auto !important;
padding: 0 20px;
}

#home h1 {
font-size: 70px;
height: 700px;
}

#pager {
display: none;
}

#storyslide div, .trio {
display: block !important;
opacity: 1 !important;
position: static !important;
}

#home h1 span, #home h1 .super, #home h1 .sub {
display: block;
position: static;
text-align: center;
}

 

a#buybutton, a#closebutton {
top: 10px;
right: 10px;
}

#stories {
position: relative;
}



body {
background-image: url("images/backgrounds/rotate.php");
background-repeat: no-repeat;
background-position: 50% -50px;
}

#mininav {
display: block;
position: relative;
z-index: 5;
padding: 10px;
background: #010101;
position: fixed;
z-index: 99;
top: 0;
left: 0;
right: 0;
box-shadow: 0 0 10px #010101;
-moz-box-shadow: 0 0 10px #010101;
-webkit-box-shadow: 0 0 10px #010101;
}

#mininav form, #mininav select {
width: 100%;

}

#peek img {
display: block;
text-align: center;
margin: 15px auto;
}

#nonprofit h3, #stories h3 {
float: none;
width: auto;
margin: 20px auto 10px;
padding: 0 73px;
}

.page p {
padding: 0 20px 30px;
margin: 0 auto 25px;
}

#time p {
padding: 0 50px 25px;
}

#stories #justin p {
width: auto;
}

.fb_iframe_widget, .fb_edge_widget_with_comment, .fb-like    {
display: block !important;
}

copyright {
font-family: "Cardo", times, serif;
margin: 20px auto 100px;
}

copyright a {
text-decoration: underline;
}

#buy img.thumb, .pager, #background, #navigation, #share   {
display: none !important;
opacity: 0;
}

#buy #buynowbutton {
float: none;
width: auto;
}


#social {
float: none;
width: auto;
}

#social p {
padding: 0;
}

}