@import url('bookblock.css');


*{
    margin:0;
    padding:0;
}
/*body{
    background-color:#222;
    font-family:Verdana;
    font-family: 'Roboto', Arial, Verdana, sans-serif;
    /*text-transform:uppercase;*/
    color:#fff;
    font-size:14px;
    overflow:hidden;
}
*/
/*.gray {
    color: rgba(139, 152, 167, 1);
}
*/


.flex-container {
    display: -webkit-flex; 
    display: flex;
}



.center {
    display: -webkit-box;   
    -webkit-align-items: flex-start;
    justify-content: center;
    -webkit-justify-content: center;
}

/* ---------- Google Font ---------- */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,700,800);

/* RESET STYLES */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
q:before, q:after { content:''}
strong { font-weight: bold }
em { font-style: italic }
.italic { font-style: italic }
.aligncenter { display:block; margin:0 auto; }
.alignleft { float:left; margin:10px; }
.alignright { float:right;margin:10px; }
.no-margin{margin:0px;}
.no-bottom{margin-bottom:0px;}
.no-padding{padding:0px;}
.margin-t{margin-top:22px;}
div { position:relative } 
a{text-decoration:none;}
a:hover{text-decoration:underline;}
a:active,a:focus{outline: none;}

img.alignleft, img.alignright, img.aligncenter {
    margin-bottom: 11px;
}

.alignleft, img.alignleft{
display: inline;
    float: left;
    margin-right: 22px;
}

.alignright, img.alignright {
    display: inline;
    float: right;
    margin-left: 22px;
}

.aligncenter, img.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

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


*{ 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}



html{-webkit-font-smoothing:antialiased;}

a{color:#BA0707;}
a:hover{color:#BA0707;text-decoration:underline;}
/*
body{background:#ffffff url("images/bkg.jpg") no-repeat 0 0;
color:#3E4156;
font: 14px "Open Sans", Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
line-height:1;
width:100%;}*/




nav{
    display:block;

}

.menu{
    display:block;
}

.menu li{
    display: inline-block;
    position: relative;
    /*z-index:100;*/
}

.menu li:first-child {
    margin-left:1rem;
}

.menu li a { 
    display:block;
    padding: .75rem .5rem;
    font-weight:500;
    text-decoration:none;
   
    color: rgba(255,255,255,.5);

    -webkit-transition: all 0.2s ease-in-out 0s;
   -moz-transition: all 0.2s ease-in-out 0s;
   -o-transition: all 0.2s ease-in-out 0s;
   -ms-transition: all 0.2s ease-in-out 0s;
   transition: all 0.2s ease-in-out 0s;
}

.menu li a:hover, .menu li:hover > a{
    color: rgba(255,255,255,1);
}


.mobile-menu {
    display:none;
    width:100%;
    padding:11px;
    background:transparent;
    color:#ffffff;
    text-transform: uppercase;
    font-weight:500;
    font-size: 1rem;
}
.mobile-menu:hover {
    background:#transparent;
    color:#ffffff;
    text-decoration:none;
}


@media (min-width: 768px) and (max-width: 979px) {

    .menu li a{
        font-size:.875rem;
        padding: .875rem .5rem;
    }
}

@media (max-width: 767px) {

    .menu {
        display:none;
    }

    .mobile-menu{
        display:block;
        position: fixed;
        right: 0;
        width: 100%;
        text-align: right;
        margin-top:0;
        /*float: right;*/
    }

    nav{
        margin:0;
        /*padding-bottom: 1rem;*/
        width: 100%;
        margin-top: 3rem;
        background: #000;
        z-index: 1;
    }
    .menu {
        padding: 1rem 0;
    }
    .menu li{
        display:block;
        margin:0;
        z-index: 1;
    }
    .menu li:first-child {
        margin-left:0;
    }
    .menu li a {
        background:#000;
        color:rgba(255,255,255,.5);
        font-size: 1.5rem;
        padding: .75rem 2rem;
    }

    .menu li a:hover, 
    .menu li:hover > a {
        background:#000;
        color:rgba(255,255,255,1);
    }
}

@media (max-width: 480px) {

}


@media (max-width: 320px) {
}