/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, #switcher, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Global properties ======================================================== */
body { 
	font-family:Arial, Helvetica, sans-serif;
	font-size:100%; 
}
html, body { height:100%;}
	

/* #Basic Styles
================================================== */
html{
}
body {
	margin:0;
	padding:0;
	overflow-x:hidden;
	background:url(../images/body-bg.jpg) center 0 no-repeat #000;
}

.main{
	width:624px;
	margin:0 auto;
	text-align:center;
}
#viewport {
    overflow: hidden;
}

#magazine{
	width:1200px;
	height:700px;
	font-size:12px;
	line-height:18px;
	color:#5b5b5b;
}
#magazine .turn-page{
	width:700px;
	height:600px;
	
}
.turn-page{
	background:url(../images/page-bg.gif) 0 0 repeat;
}
.pages, #controllers {
    height: 700px;
    margin: auto;
    position: relative;
    width: 1200px;
}


/* #Typography
================================================== */

	h1, h2, h3, h4, h5, h6 {
		font-family:'Oswald';
		font-weight:300;
		line-height:1.2em;
		color:#636468;
	}
	
	p { margin: 0 0 18px 0; }
	
	
	h2{
		font-size:35px;
		margin-bottom:15px;
	}
	h5{
		font-size:15px;
		margin-bottom:8px;
		color:#000;
		font-weight:300;
	}
	h6{
		font-size:12px;
		margin-bottom:14px;
		text-transform:uppercase;
		font-weight:400;
		color:#636468;
	}
	
	h2.page-title{
		background:url(../images/page-title-bg.png) 0 0 no-repeat;
		width:222px;
		padding:14px 92px 15px 49px;
		color:#fff;
		font-family:'Italianno';
		margin-left:-32px;
	}
	h2.page-title.left{
		margin-left:-20px;	
	}
	.awards h2.page-title.left{
		margin-left:-38px;	
	}
	
	
	.page-logo{
		font-size:12px;
		line-height:18px;
		color:#fff;
		font-family:'Oswald';
		background:#14cccc;
		padding:41px 4px 3px 5px;
		margin-bottom:0;
	}

	.info{
		position:absolute;
		left:26px;
		z-index:9;
	}
	
	.info.right-pos{
		left:auto;
		right:22px;
	}
	
	
/* #Links
================================================== */
	a{ 
		color: #567387;
		text-decoration: none;
		outline: 0;
		
		-webkit-transition:all 0.5s;
		-moz-transition:all 0.5s;
		-o-transition:all 0.5s;
		-ms-transition:all 0.5s;	
		transition:all 0.5s;
	 }
	a:hover{ text-decoration:underline; }
	p a, p a:visited { line-height: inherit; }
	.text-color{color: #f5c9a9;}
	.text-color1{color: #5a6167;}
	
	.text-size{
		font-size:10px;
	}
/*   Logo    */
header{
	padding-bottom:21px;
}


.site-title{
	position:absolute;
	left:42px;
	top:7px;
}

.site-title a{
	display:block;
	width:545px;
	height:161px;
	text-indent:-999999px;
	text-decoration:none;
	background:url(../images/logo.png) 0 0 no-repeat;
}


	.site-title-back{
		display:block;
		width:143px;
		height:102px;
		text-decoration:none;
		text-indent:-9999px;
		background:url(../images/back-logo.png) 0 0 no-repeat;
		position:absolute;
		bottom:24px;
		left:50%;
		margin-left:-71px;
	}

.main-date{
	width:177px;
	height:145px;
	background:#fff;
	border:#858585 1px solid;
	color:#2f9eec;
	text-align:center;
	padding:32px 0 0 0;
	border-radius:50%;
	font-size:17px;
	text-transform:uppercase;
	position:absolute;
	top:209px;
	right:12px;
	line-height:1.2em;
	font-weight:700;
	font-family:'Oswald';
}
.main-date span{
	display:block;
	font-size:61px;
	text-shadow:#156ead 1px 1px 1px, #156ead -1px -1px 1px;
	line-height:1.2em;
	margin-bottom:10px;
	font-weight:normal;
}


.descr{
	display:block;
	text-shadow:1px 1px 1px #1b6ba3, -1px -1px 1px #1b6ba3;
	font-size:25px;
	color:#fff;
	line-height:1.2em;
	background:#2f9eec;
	padding:5px 22px 6px 20px;
	position:absolute;
	bottom:107px;
	right:11px;
}

.main-slogan{
	color:#fff;
	font-size:43px;
	line-height:1.2em;
	text-shadow:1px 1px 1px #535252, -1px -1px 1px #535252;
	position:absolute;
	width:230px;
	right:13px;
	bottom:180px;
}
.main-slogan span{
	display:block;
	margin-bottom:-10px;
}

.cover-bottom{
	width:537px;
	height:80px;
	position:absolute;
	display:block;
	bottom:0px;
	left:18px;
}

.back .site-title{
	position:absolute;
	top:267px;
	width:100%;
	text-align:center;
	margin:0;
}
.back  .site-title a{
	font-size:42px;
}
.back  .site-title span.part2{
	font-size:56px;
	margin-top:-10px;
	text-transform:uppercase;
}
.back span.tagline{
	margin:0;
	position:absolute;
	bottom:30px;
	width:100%;
	text-align:center;
	color:#a3a3a3;
	font-size:11px;
	text-transform:uppercase;
	
}

nav{
	overflow:hidden;	
	margin-top:21px;
}
nav ul{
}
nav li{
	float:left;
	font-size:29px;
	line-height:1.2em;
	font-family:'Italianno';
	padding-left:1px;
}

nav li:first-child{
	padding-left:0px;
}

nav a{
	display:block;
	padding:6px 0 2px 0;
	background:url(../images/nav-a-bg.gif) 0 0 repeat-x;
	text-decoration:none;
	color:#fff;
	text-shadow:0px 1px 1px #000;
	width:103px;
	
	-webkit-transition:all 0.5s;
	-moz-transition:all 0.5s;
	-o-transition:all 0.5s;
	-ms-transition:all 0.5s;	
	transition:all 0.5s;
}

nav a:hover, nav a.on{
	text-decoration:none;
	background:url(../images/nav-a-bg-hover.gif) 0 0 repeat-x;
	color:#000;
	text-shadow:none;
}

nav a:hover, nav a.off{
	text-decoration:none;
	background:url(../images/nav-a-bg.gif) 0 0 repeat-x;
	color:#ffffff;
	text-shadow:none;
}

.link{
	display:inline-block;
	text-decoration:none;
	font-family:'Oswald';
	text-transform:uppercase;
	color:#fefefe;
	padding:4px 13px 5px 13px;
	background:#000;	
}
.link:hover{
	
}


.wrapper{
	width:100%;
	overflow:hidden;
}
.extr{
	overflow:hidden;
}
.fleft{
	float:left;
}
.fright{
	float:right;
}

.alignright{
	text-align:right;
}
.alignleft{
	text-align:left;
}
.aligncenter{
	text-align:center;
}
/*--------Content--------*/

.page, .turn-page{
	position:relative;
	background:#edeefd;
}

.page:nth-child(odd){
	background:url(../images/page-bg.gif) 0 0 repeat-y;
}

.home{
	background:url(../images/front-cover.jpg) 0 0 no-repeat;
}

.about .inner{
	background:url(../images/about-bg.jpg);
	
}
.illustrator .inner{
	background:url(../images/about-bg.jpg);
	
}

.news .inner{
	background:url(../images/news.jpg) 0 0 no-repeat;
}

.journalism .inner{
	background:url(../images/journalism-bg.jpg) 0 0 no-repeat;
}

.contact .inner{
	background:url(../images/contact-bg.jpg) 0 0 no-repeat;
}
.back{
	background:url(../images/back-cover.jpg) 0 0 no-repeat;
}
.awards .inner, .awards-1 .inner{
	top:497px;
	padding-right:17px;
}
.awards-1 .inner{
	padding-top:98px;
}
.bg-1{
	position:absolute;
	top:11px;
	left:11px;
	width:588px;
	height:486px;
	background:url(../images/awards-bg1.jpg) 0 0 no-repeat;
}

.bg-2{
	position:absolute;
	top:11px;
	left:0px;
	width:588px;
	height:486px;
	background:url(../images/awards-bg2.jpg) 0 0 no-repeat;
}


.inner{
	position:absolute;
	background:#fff;
	top:11px;
	bottom:11px;
	left:11px;
	right:10px;
	padding:12px 40px 38px 39px;
}

.inner:nth-child(odd){
	padding:12px 23px 38px 20px;
}

.inner .content{
	position:relative;
	z-index:999;
}
.shadow-right{
	width:100%;
	height:100%;
	position:absolute;
	background:url(../images/shadow-left.png) 0 0 repeat-y;
	z-index:9;
}
.shadow-left{
	width:100%;
	height:100%;
	position:absolute;
	background:url(../images/shadow-right.png) right 0 repeat-y;
	z-index:9;
}


.ver-line{
	position:absolute;
	border-left:#e1e3f9 1px solid;
	width:1px;
	height:531px;
	top:118px;
	left:52px;
	z-index:87;
}

.img-container{
	display:inline-block;
	box-shadow: 0px 20px 10px -10px #c9cbdb;
	border:#a9cc31 1px solid;
}

.map{
	padding:1px;
	background:#eaecfa;
	border:#cfd3e3 1px solid;
	display:inline-block;
}

.map iframe{
	background:#ced2e2;
	border:#eaecfa 1px solid;
	padding:3px;
}

.img-indent{
	float:left;
	margin:0 34px 0 0;
}

.img-indent1{
	float:left;
	margin:0 14px 0 0;
}

.divider{
	margin:21px 0 26px;
	width:100%;
	border-bottom:#e6e9f8 1px solid;
	height:1px;
}

.font-size14{
	font-size:14px;
}

.upp{
	text-transform:uppercase;
}

.color-gray{
	color:#8d8d8d;
}
.black-title{
	display:block;
	color:#000;
	font-size:14px;
	margin-bottom:18px;
}
.marg-top5{
	margin-top:-5px;
}
/*--------Layouts--------*/
.col-1, .col-2, .col-3, .col-4,.col-5, .col-6{
	float:left;
}
.awards .col-1, .awards-1 .col-1{
	width:230px;
	padding-right:64px;
}
.awards .col-2, .awards-1 .col-2{
	width:228px;
}

#books-1 .col-1{
	width:258px;
	padding-right:40px;
}
#books-1 .col-2{
	width:224px;
}

.journalism-1 .col-1{
	width:238px;
	padding-right:38px;
}
.journalism-1 .col-2{
	width:238px;
}
.journey-1 .col-1{
	width:238px;
}
.journey-2 .col-2{
	width:238px;
}
.contact-1 .col-1{
	width:176px;
	padding-right:48px;
}
.contact-1 .col-2{
	width:195px;
}
/*-----------------------*/
.butt{
	display:inline-block;
	background:url(../images/butt-bg.gif) 0 0 repeat-x;
	font-size:13px;
	line-height:1.2em;
	font-family:'Oswald';
	border:#0995c2 1px solid;
	border:#28c9fd 1px solid;
	border-bottom:#3c89ae 1px solid;
	padding:7px 15px 8px 15px;
	text-decoration:none;
	color:#fff;
	text-shadow:0 1px 1px #08647f;
	border-radius:5px;
}
.butt:hover{
	background:url(../images/butt-bg-hover.gif) 0 0 repeat-x;
	text-decoration:none;
}
/*-----------------------*/

.articles-list{}
	.articles-list li{
		font-size:12px;
		line-height:18px;
	}
		.articles-list li a{
			text-decoration:none;
			color:#8bad15;
		}
		.articles-list li a:hover{
			text-decoration:underline;
		}

.date-list{}
	.date-list li{
		font-size:12px;
		line-height:21px;
		overflow:hidden;
	}
	.date-list li h6{
		color:#5b5b5b;
		margin:2px 14px -2px 0;
		display:inline-block;
	}

.social-list{}
	.social-list li{
		float:left;
		margin-left:8px;
	}
		.social-list li:first-child{
			margin-left:0px;
		}
/*------------------------------*/

/*------------------------------*/

.pad-right24{
	padding-right:24px;
}
/* Indents */

.top5{
	padding-top:5px;
}
.top8{
	padding-top:8px;
}
.top10{
	padding-top:10px;
}
.top15{
	padding-top:15px;
}
.top20{
	padding-top:20px;
}

.top25{
	padding-top:25px;
}

.top30{
	padding-top:30px;
}
.top35{
	padding-top:35px;
}
.top40{
	padding-top:40px;
}
.top45{
	padding-top:45px;
}

.left59{
	margin-left:59px;
}

.bottom15{margin-bottom:15px;}

.img-bottom-indent{
	margin-bottom:15px;
}
.img-container{
}

footer{
	padding:22px 0;
}
footer .main{
	color:#bfbfbf;
	font-size:11px;
}


/* #Forms
================================================== */

	form.contact{position:relative;overflow:hidden;display:block;}
	label{
		display:block;
		margin-bottom:7px;
		overflow:hidden;
	}
	form.contact strong{
		color:#5b5b5b;
		font-weight:normal;
		display:block;
		padding-bottom:4px;
	}
	
	
	form.contact input[type=text], input[type=password], input[type=email], form.contact textarea, select {
		
		border:#adadad 1px solid;
		border-right:0;
		border-bottom:0;
		position:relative;
		background:#fff;
		width:269px;
	  	padding:2px 5px 3px 5px;
		color:#5b5b5b;
		box-shadow:0px 0px 1px 1px #e3e3e3 inset, -1px -1px 1px 0px #f0f0f0;
		
	}
	
	input[type=submit], input[type=reset]{
		border:0;
		margin:0;
		background:0;
		display:block;
		width:64px;
		height:32px;
		background:url(../images/send-bt.gif) 0 0 no-repeat;
		cursor:pointer;
		float:left;
		margin-top:12px;
		
	}
	input[type=reset]{
		background:url(../images/clear-bt.gif) 0 0 no-repeat;	
		margin-right:23px;
	}
	form.contact textarea {
		min-height: 112px;
		width:336px;
	}
	

	
/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }