/* @override http://lostworldsfairs.com/css/style.css */


/*
  style.css contains a reset, font normalization and some base styles.

  credit is left where credit is due.
  additionally, much inspiration was taken from these projects:
    yui.yahooapis.com/2.8.1/build/base/base.css
    camendesign.com/design/
    praegnanz.de/weblog/htmlcssjs-kickstart
*/

/*
  html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
  v1.4 2009-07-27 | Authors: Eric Meyer & Richard Clark
  html5doctor.com/html-5-reset-stylesheet/
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
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;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display:block;
}

nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
/* tables still need cellspacing="0" in the markup */
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }
.clear {clear: both;display: block;overflow: hidden;visibility: hidden;width: 0;height: 0;}

.clearfix:after {clear: both;content: ' ';display: block;font-size: 0;line-height: 0;visibility: hidden;width: 0;height: 0;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}.clearfix {display: block;}
/* END RESET CSS */
/* These selection declarations have to be separate.
   No text-shadow: twitter.com/miketaylr/status/12228805301
   Also: hot pink. */
::-moz-selection{ background: #3b96a7; color:#fff; text-shadow: none; }
::selection { background: #3b96a7; color:#fff; text-shadow: none; }
.ie7 img { -ms-interpolation-mode: bicubic; }

/*Structure
----------------------------------------*/

.container {
	margin-left: auto;
	margin-right: auto;
	width: 990px;
}

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 15px;
	margin-right: 15px;
}


.alpha {margin-left: 0;}
.omega {margin-right: 0;}
.container .grid_1 {width:130px;}
.container .grid_2 {width:290px;}
.container .grid_3 {width:450px;}
.container .grid_4 {width:610px;}
.container .grid_5 {width:770px;}
.container .grid_6 {width:930px; margin: 0 30px;}

.container .prefix_1 {padding-left:160px;}
.container .prefix_2 {padding-left:320px;}
.container .prefix_3 {padding-left:480px;}
.container .prefix_4 {padding-left:640px;}
.container .prefix_5 {padding-left:800px;}
.container .suffix_1 {padding-right:160px;}
.container .suffix_2 {padding-right:320px;}
.container .suffix_3 {padding-right:480px;}
.container .suffix_4 {padding-right:640px;}
.container .suffix_5 {padding-right:800px;}

/*Page Style*/


body{
	background-color: #776a43;
	font: 14px/20px "ff-meta-serif-web-pro", Georgia, "Times New Roman", Times, serif;
}

h1{
	font: 152px "league-gothic";
	color: #fff;
	text-transform: uppercase;
	float: left;
}

h2{
	font: 72px/1.1 "league-gothic";
	text-transform: uppercase;
	padding-top: 10px;
}

.city{
	border-bottom: 1px dashed #ab905b;
	border-top: 1px dashed #ab905b;
	padding-top: 11px;
	display: block;
}

h3{
	font: 24px/1 "league-gothic";
	text-transform: uppercase;
	margin-bottom: 1px;
	color: #a58751;
	letter-spacing: 1px;
}

.title{
	padding-top: 47px;
	margin-bottom: 0px;

}

#header h1{
	position: relative;
	z-index: 100;
}

#header h1:after{
	content: "Lost World’s Fairs";
	position: absolute;
	left: -5px;
	top: 5px;
	color: #296a77;
	z-index: -1;
}

a{color: #685c39;}
a:hover{color: #e1002c;}

#button{
	color: #fff;
	width: 113px;
	height: 90px;
	text-align: center;
    padding-top: 31px;
    margin-top: 23px;
	float: right;
	background:url(../img/button.png) no-repeat center center;
}

#button span{
	display: block;
}

#txt_nowwith{
	font: 20px/.6 "ff-market-web-";
	margin-top:6px;
	margin-left: -2px;
	text-transform: capitalize;
}

#txt_woff{
	font: 40px/1 "league-gothic";
}


#banner{
	height: 42px;
	width: 350px;
	text-align: center;
	background:url(../img/banner.png) no-repeat center center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 13px;
	padding-top: 18px;
	z-index: 16;
	position: relative;
}
#txt_beauty{
	font: 26px/1 "league-gothic";
	text-transform: uppercase;
	letter-spacing: 4px;
	position: relative;
}

#txt_beauty:after{
	content: "Beauty Of The Web";
	position: absolute;
	display: block;
	top: 2px;
	left: 69px;
	color: #776a43;
	z-index: -1;
}

#header{
	color: #fff;
	height: 275px;
	background-color: #3b96a7;
}

#mtn{
	badckground: url(../img/mountains.png) repeat-x center top;
	background: url(../img/mountainsfront.png) repeat-x 33% top, url(../img/mountains.png) repeat-x center top;
}

#main{
	padding-top: 55px;
	color: #776a43;
	padding-bottom: 180px;
	background: #f8efe1 url(../img/trees.png) repeat-x center bottom;
    -webkit-box-shadow: 0px -2px 7px rgba(0,0,0,.1); /* Saf3.0+, Chrome */
    box-shadow: 0px -2px 7px rgba(0,0,0,.1);

}

.intro{
	font-size: 30px;
	line-height: 35px;
	text-align: center;
	margin-bottom: 55px;
	color: #5f5536;
}

.info{text-align: center;}
.info a{text-decoration: none;}

#explain{
	margin-bottom: 75px;
	float: left;
}

#main p{text-align: center;}

.visit{
	background:url(../img/visitbg.png) no-repeat center center;
	color: #fff;
	font-style: italic;
	line-height: 1.5;
	display: block;
	height: 23px;
	font-size: 17px;
	font-family: "ff-meta-serif-web-pro";
	margin-bottom: -12px;
	z-index: 10;
	position: relative;
	text-transform: lowercase;
}

.visit a{color: #fff;text-decoration: none;}

.year{
	font: italic 14px/20px "ff-meta-serif-web-pro", Georgia, "Times New Roman", Times, serif;
	display: block;
	margin-top: -10px;
	margin-bottom: 8px;
	color: #aa9474;
	letter-spacing: 4px;
	text-transform: lowercase;
}

.author{
	font: 24px/1 "league-gothic";
	text-transform: uppercase;
	margin-top: 15px;
	margin-bottom: 7px;
	letter-spacing: 1px;
}

.by{
	font: italic 18px "ff-meta-serif-web-pro";
	text-transform: lowercase;
	margin-right: 5px;
	bottom: 2px;
	position: relative;
}


.info p a, .footer_tk_link{
	background:url(../img/typekit-mark-16x16.png) no-repeat left 4px;
	padding-left: 22px;
	text-decoration: underline;
}


#footer .container{
	color: #444444;
	margin-top: -12px;
	padding-bottom: 20px;
	background-color: #fff;
	position: relative;
}

footer{
	background-color:#776a43;
	padding-bottom: 60px;
}

.mighty_box{
	padding-top: 80px;
	background: #fff url(../img/igotstripes.jpg) repeat-x left 30px;
}

.bio_row2{
	padding-bottom: 40px;
	margin-bottom: 20px;
	background: #fff url(../img/igotstripes.jpg) repeat-x left bottom;
}

.bio_row{
	margin-bottom: 40px;
}

.fom{
	height: 160px;
	width: 171px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	position: absolute;
	z-index: 3;
	top:-80px;
	left: 410px;
}

.biopic{
	float: left;
	margin-right: 15px;
}

.poster{
	background-color: #fff;
	padding: 5px;
	-moz-box-shadow: -2px 2px 3px rgba(0,0,0,.1); /* FF3.5+ */
    -webkit-box-shadow: -2px 2px 3px rgba(0,0,0,.1); /* Saf3.0+, Chrome */
    box-shadow: -2px 2px 3px rgba(0,0,0,.1);
	width: 225px;
	margin: 0 auto 10px;
}

.info a:hover img{
	-moz-box-shadow: -2px 2px 4px rgba(0,0,0,.2); /* FF3.5+ */
    -webkit-box-shadow: -2px 2px 4px rgba(0,0,0,.2); /* Saf3.0+, Chrome */
    box-shadow: -2px 2px 4px rgba(0,0,0,.2);
}

.local{text-align: center;}
#copyright{
	color: #fff;
	margin-top: 20px;
	text-align: center;
}
#copyright a{color:#fff;}
#copyright a:hover{color: #e1002c;}

@media only screen and (max-device-width: 480px) {
h1{font-size: 151px;}
#txt_beauty:after{display: none;}
body{-webkit-text-size-adjust: none;}
#banner{margin-top: 0px;}
}


/* Inactive Type Styles
----------------------------------------*/
.wf-inactive h1{font: 85px sans-serif;letter-spacing: -3px;	top: 30px;}
.wf-inactive #txt_beauty{font: 26px sans-serif; letter-spacing: -3px;}
.wf-inactive h2{font: 46px sans-serif; letter-spacing: -3px;}
.wf-inactive #txt_woff{font: 28px sans-serif;letter-spacing: -3px;}