html,body {
    height: 100%;
}


body {
    font-family: 'Fira Sans', sans-serif;
    margin: 0px;
    padding: 0px;
    color:#113372;
    background-color: #ebebeb;
    font-size: 18px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    padding: 0px;
    margin: 0px;
}

#page {
    vertical-align: top;
    min-height: 100%;
    padding-bottom: 100px;
    position: relative;
}

.navbar {
    width: 20%;
    padding: 0 0 0 10%;
}

.wrapper {
    width: 40%;
    padding: 0;
    line-height: 150%;
}

.navbar, .wrapper {
    vertical-align: top;
    display: inline-block;
    padding-top: 60px;
}

.navbar ul {
    padding: 0px;
    margin: 0px;
    list-style: none;
    list-style-type: none;
}

.navbar ul li {
    padding: 0px;
    margin: 0px;
    margin-bottom: 2px;
    list-style: none;
    list-style-type: none;
}

.navbar ul li a, .submitbtn a, .booklist, .link  {
    text-decoration: none;
    color:#113372;
    border: 2px rgba(235, 235, 235, 0) solid;
    display: inline-block;
    padding: 10px;
    border-radius: 3px;
}

/*.navbar ul li a:hover, .submitbtn a:hover  {
    -webkit-filter: url("#filter_water");
    filter: url("#filter_water");
}*/


.navbar ul li.activetab a, .submitbtn a.activetab {
    border-color: #113372;
}

.navbar .logo {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    padding: 25px 0 65px 10px;
    font-size: 30px;
}

.wrapper h1 {
    font-size: 68px;
    padding-bottom: 58px;
    padding-top: 10px;
    line-height: 1;
}

/*.filter.water {
    -webkit-filter: url("#filter_water");
    filter: url("#filter_water");
}*/

.svg-filters {
    position: absolute;
    pointer-events: none;
    height: 0px;
}

.submitbtn {
    width: 200px;
    position: absolute;
    right: 10%;
    text-align: right;
    top: 80px;
}

.wrapper.books {
    width: 60%;
    padding-right: 0;
    position: relative;
}

.wrapper.books .books {
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    justify-content: space-around;
    align-content: flex-start;
}

.wrapper.books .submitbtn {
    position: absolute;
    top:0px;
    right:0px;
    width: 200px;
}


.services {
    padding: 30px 0px 30px 0;
}

.services div {
    display: inline-block;
    border: 2px #113372 solid;
    font-family: 'Fira Mono', monospace;
    padding: 12px;
    margin: 0px 4px 9px 0px;
    font-size: 16px;
    border-radius: 3px;
}


ol {
    list-style: none;
    counter-reset: item;
    padding: 0px;
    margin: 0px;
}

ol li {
    counter-increment: item;
    margin: 0px;
    margin-bottom: 44px;
    position: relative;
    padding: 0px 0px 0px 72px;
}

ol li:before {
    content: counter(item);
    display: inline-block;
    padding: 16px;
    border: 2px #113372 solid;
    width: 20px;
    height: 20px;
    text-align: center;
    line-height: 20px;
    margin: 0px;
    margin-right: 12px;
    border-radius: 3px;
    position: absolute;
    left: 0px;
    top: -16px;
}


h2 {
    padding-bottom: 30px;
}

.footer {
    padding: 0 0 0 10%;
    height: 100px;
    margin-top: -100px;
    font-size: 13px;
}



.row {
    font-size: 0px;
    margin: 0 0 10px 0;
}

.row.header {
    font-family: 'Fira Mono', monospace;
}

.row .cell {
    display: inline-block;
    font-size: 18px;
}

.row.line {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border: 0px #113372 solid;
    border-bottom-width: 2px;
}

.row.line:last-child {
    border-bottom-width: 0px !important;
}

.row .cell.padding {
    padding-right: 2%;
}

.row .cell, .row .cell * {
    vertical-align: top;
}

.row .btn div {
    width: 76%;
    float: right;
}

#loggedin {
    position: absolute;
    top: 130px;
    left: 10%;
    text-indent: 12px;
    z-index: +100000;
}

#loggedin .btn div {
    position: relative;
    top: -2px;
    text-indent: 0px;
}



.inputfield {
    margin: 0 0 20px 0;
    display: inline-block;
    font-family: 'Fira Mono', monospace;  
}

.inputfield.sm {
    margin-bottom: 12px;
}

.inputfield.half {
    width: 49%;
    margin-right: 2%;
}

.inputfield.full {
    width: 100%;
}


.inputfield.half.end {
    margin-left: -5px;
    margin-right: 0;
}

input.text, .inputfield input, .inputfield select, .inputfield textarea {
    display: block;
    font-family: 'Fira Sans', sans-serif;
    font-size: 17px;
    margin: 0px;
    padding: 6px;
    color:#113372;
    background-color: #ebebeb;
    border: 2px #113372 solid;
    outline: none;
    border-radius: 3px;
}

.inputfield input, .inputfield select, .inputfield textarea {
    width: 100%;
}

.inputfield textarea {
    min-height: 220px;
}

.inputfield.sm textarea {
    min-height: 100px;
}

input.margin {
    width: 95%;
    box-sizing: border-box;
    margin: 0 5% 0 0;
}


.bookholder {
    border: 2px #113372 solid;
    padding: 20px;
    box-sizing: border-box;
    width: 48.6%;
    margin-bottom: 1.4%;
    border-radius: 3px;
    display: inline-block;
    position: relative;
}

.bookholder .cover {
    width: 40%;
    max-height: 400px;
    display: inline-block;
    vertical-align: top;
    margin: 0 -5px 0 0;
}

.bookholder .cover img {
    width: 100%;
}

.bookdetails {
    display: inline-block;
    vertical-align: top;
    width: 60%;
    padding: 0 0 90px 20px;
    box-sizing: border-box;
    min-height: 200px;
}


.textbox {
    top: 0px;
    left: 0px;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #ebebeb;
    padding: 20px;
    box-sizing: border-box;
    opacity: 0.0;
    display: none;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.bookholder.textopen .textbox {
    display: block;
    opacity:1.0;
    animation-name: fadein;
    animation-duration: 0.2s;
    z-index: +10;
}

@keyframes fadein {
    0%   {opacity: 0.0;}
    100% {opacity: 1.0}
}

.textbox.opacityfade {
    opacity: 0.0 !important;
}

.bookholder .publisher {
    margin-top: 10px;
}

.viewmore, .bookholder .close {
    padding: 12px;
    border: 2px #113372 solid;
    cursor: pointer;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border-radius: 3px; 
    text-align: center;
}

.viewmore {
    margin: 12px 0; 
}

.bookholder .close {
    width: 70px;
    margin-bottom: 20px;
}

.bookholder.full {
    width: 100%;
}


.viewmore:hover, .bookholder .close:hover {
    background-color: #113372;
    color:#ebebeb;
}


.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #113372 !important; }
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #d9d9d9; } 


.buy .price {
    padding: 20px 12px 20px 0;
    display: inline-block;
}


.buy {
    text-align: right;
    margin:40px 0 0 0;
    position: absolute;
    bottom: 20px;
    right: 22px;
}

.sureholder {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    background-color: #ebebeb;
    z-index: +100;
    text-align: center;
    display: none;
}

.sureholder .sure {
    padding-top: 80%;
}



.cover.edit {
    position: relative;
}

.uploadbg input {
    position: absolute;
    opacity: 0.0;
    font-size: 0px !important;
    padding: 0 !important;
    border: 0 !important;
    margin: 0 !important;
}

.uploadbg label {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    cursor: pointer;
    background-image: url('/images/upload.png');
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-appearance:none;
}

.booklink {
    position: absolute;
    transform: translateY(20px);
    z-index: +1;
    width: 100%;
}

.orderbook {
    position: absolute;
    top: 16px;
    right: 20px;
    cursor: pointer;
}


.bookholder.submit .btn div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.bookholder.blank {
    border-color: #ebebeb;
}

.bookholder.submit {
    min-height: 320px;
}

.books .bookholder.edit:last-child {
    margin-right: auto;
    position: relative;
}


.booklist {
    margin: 0;
    margin-top: 120px;
    padding: 0;
    border: 0;
}

.addbook {
    padding: 120px;
}

.addbook .btn div {
    width: 300px;
    margin: 0 auto;
    display: block;
}

#extrasubbtn {
    display: none;
}

.bold {
    font-weight: bold;
}


@media (max-width:1300px) {
    .bookholder {
        margin: 0 0 2% 0;
        width: 100%;
    }
}

@media (max-width:1300px) {
    .navbar {
        padding-left: 5%;
    }
    
    .wrapper, .wrapper.books {
        width: 68%;
        padding-right: 0;
        padding-left: 2%;
    }
    
    #extrasubbtn {
        display: inline-block;
    }
    
    .submitbtn {
        display: none;
    }
        
    .footer {
        padding-left: 5%;
    }
}

@media (max-width:800px) {
    .navbar, .wrapper, .wrapper.books {
        padding: 0 5%;
        width: 90%;
    }
    
    .navbar {
        padding-bottom: 50px;
    }
    
    .submitbtn {
        top: 190px;
        right: auto;
        left: 22px;
    }
    
    .navbar ul li {
        display: inline-block;
    }
    
    .footer {
        text-align: center;
        padding: 0;
        margin: 0;
        width: 100%;
    }
    
    h1 {
        font-size: 50px !important;
    }
}

*::-moz-selection {color: #ebebeb;background-color: #113372;}
*::selection {color: #ebebeb;background-color: #113372;}