/* ---[ MAGAZINE SPECIFIC ]------------------------------------------------- */


body{
background: url(/template/img/bg.jpg) top left fixed;
}

.title-bar{

}

.title-bar .logo{ 
max-width:542px; /* logo image natural width */
}

.title-bar .button-bar .btn{
background: #00d557;
color: #fff;
}
.title-bar .button-bar .btn:hover{
background-color: #4EA349;
color: #fff;
}

.pure-menu-center{
margin-bottom:8px;
}
.pure-button{
background:#53cef1;
color: #fff;
text-shadow: 1px 1px rgba(0,0,0,.1);
}

.gallery-wrap{
background: #222;
}
.gallery{
background: #222;
}

.gallery .gallery-item .caption{
background: #222;
}

.gallery .caption .page-name{
color: #eee;
}

.gallery .caption .page-desc{
color: #999;
}

.buy-now-button{
background: #53cef1;
}

.buy-now-button:hover{
background: #32a5d7;
}




/* ========================================== */
/* Structure */
/* ========================================== */

.title-bar{
padding:2em 1em;
}

.title-bar .logo{ 
width:85%;
margin:0 auto;
}

.title-bar .logo img{
width:100%;
display: block;
}

.title-bar .button-bar{
text-align: center;
margin:.5em 0 0 0;
}

.title-bar .button-bar .btn{
padding:.2em .5em;
font-size:150%;
text-decoration: none;
display: inline-block;
line-height: 1.5;
margin:0 0 .2em 0;
-webkit-box-shadow: 0px 3px 14px -7px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 3px 14px -7px rgba(0,0,0,0.75);
box-shadow: 0px 3px 14px -7px rgba(0,0,0,0.75);
}

.title-bar .button-bar .btn:hover{
-webkit-box-shadow: none;
-moz-box-shadow:none;
box-shadow: none;
}


.sm{
text-align:center;
margin:.5em 0 0 0;
}
.sm > div{
display: inline-block;
margin:0 .5em 0 0;
}

.sm .fb_iframe_widget{
position: relative;
top:-4px;
}

.sm div.twit-share iframe{
width:89px !important;
}

.sm > div:last-of-type{
margin:0;
}

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

.page-block{

margin:0 auto;
width:80%;
max-width:930px;

padding:1em;
color:#ccc;
background: #222;
}

.page-block h1{
font-weight: 300;
text-transform: uppercase;
margin-top:0;
}

.page-block a{
color:#0cf;
}

.backissue{

-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
padding:0 1em;
float:left;
}

/* --------------------------------------------------------- */
.correction{
text-decoration: underline;
color:#f00;
}
.correction-thumb.active{
background-color:#00d557;
}
.correction-thumb img{
width:80px;
}
.correction-thumb.active img{
width:70px;
border:5px solid #00d557;

}

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

.gallery-wrap{
width:100%;
overflow-x:scroll;
border-bottom:1px solid #ccc;
}

.gallery{
}

.gallery .gallery-item{
display: inline-block;
margin:0;
padding: 0;
float:left;
width:300px;
border-left:2px solid #222;
border-right:2px solid #222;
}

.gallery .gallery-item img.gallery-image{
display: block;
width:100%;
}

.gallery .gallery-item .caption{
padding:.2em .5em .2em;
}


.gallery .gallery-item .caption .page-name{
font-size:115%;
text-align: center;
font-weight: bold;
}

.gallery .gallery-item .caption .page-desc{
font-size:85%;
text-align: center;
}


.buy-now-button{
padding:.2em .5em;
margin:.5em 0;
color:#fff;
font-weight: bold;
text-decoration: none;
font-size: .8em;
text-align: center;
display: block;
}

/* --------------------------------------------------------- */
#footer{
margin:3em 0 0 0;
padding:2em 0;
}

#footer .social-buttons {
text-align: center;
}

#footer .social-buttons > div{
display: inline-block;
}

#footer .footer-msg a{
color:#0cf;
}

#footer .footer-msg{
margin:0 0 0 ;
text-align: center;
font-size:80%;
}


/* --------------------------------------------------------- */
.cf:before,.cf:after{content:" ";display:table}.cf:after{clear:both}.cf{*zoom:1}
.talign-center{text-align: center;}
.pad-bottom{margin-bottom:.5em;}
/* ---[ pure mods ]------------------------------------------------- */

.pure-menu{
background: #222 !important;
}

.pure-menu-center{
text-align: center;
}

.pure-menu .pure-menu-selected{
background: #eee;
}

.pure-menu ul{
height:auto !important;
}

.pure-menu ul li a{
color: #0cf;
}

.pure-button{
-webkit-box-shadow: 0px 3px 14px -7px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 3px 14px -7px rgba(0,0,0,0.75);
box-shadow: 0px 3px 14px -7px rgba(0,0,0,0.75);
}

.pure-button:hover{
-webkit-box-shadow: none;
-moz-box-shadow:none;
box-shadow: none;
}

.pure-button.active{
background:#ccc;
}

/* ---[ modal setup ]------------------------------------------------- */

#modal-box{
height:75%;
-webkit-box-shadow: 0px 10px 46px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 10px 46px 0px rgba(0,0,0,0.75);
box-shadow: 0px 10px 46px 0px rgba(0,0,0,0.75);
padding:.5em;
background: #fff;
}

#modal-box img{
height:100%;
display: block;
}

#lean_overlay {
    position: fixed;
    z-index:100;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
}


/* ---[ giveaway ]------------------------------------------------- */

.hp{display: none !important;}


/* ========================================== */
/* RESPONSIVE */
/* ========================================== */


/* ---[ iphone 2-4, and 5 ]------------------------------------------------- */

@media only screen and (min-width : 320px) and (max-width : 480px),
only screen and (min-width : 320px) and (max-width : 568px) { 

.title-bar{
padding:2em 1em;
}

.title-bar .logo{ 
width:100%;
}

.title-bar .button-bar .btn{
font-size: 87%;
}

.page-block{
}

.gallery .gallery-item{
width:200px;
}

.backissue{
width:33.333333%;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
padding:0 .25em;
}




}

/* ---[ ipad ]------------------------------------------------- */

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait),
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape)  { 

.gallery .gallery-item{
width:400px;
}

}