@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'Lato';
    src: local('Lato Italic'), local('Lato-Italic'), url('../fonts/lato/latoitalic.woff2') format('woff2'), url('../fonts/lato/latoitalic.woff') format('woff'), url('../fonts/lato/latoitalic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: 'Lato';
    src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/lato/latoregular.woff2') format('woff2'), url('../fonts/lato/latoregular.woff') format('woff'), url('../fonts/lato/latoregular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Lato';
    src: local('Lato Medium'), local('Lato-Medium'), url('../fonts/lato/latomedium.woff2') format('woff2'), url('../fonts/lato/latomedium.woff') format('woff'), url('../fonts/lato/latomedium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}
@font-face {
    font-family: 'Lato';
    src: local('Lato Semibold'), local('Lato-Semibold'), url('../fonts/lato/latosemibold.woff2') format('woff2'), url('../fonts/lato/latosemibold.woff') format('woff'), url('../fonts/lato/latosemibold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}
@font-face {
    font-family: 'Lato';
    src: local('Lato Bold'), local('Lato-Bold'), url('../fonts/lato/latobold.woff2') format('woff2'), url('../fonts/lato/latobold.woff') format('woff'), url('../fonts/lato/latobold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Lato';
    src: local('Lato Black'), local('Lato-Black'), url('../fonts/lato/latoblack.woff2') format('woff2'), url('../fonts/lato/latoblack.woff') format('woff'), url('../fonts/lato/latoblack.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'Lava';
    src: url('../fonts/Lava/Lava.eot');
    src: local('Lava'), url('../fonts/Lava/Lava.woff') format('woff'), url('../fonts/Lava/Lava.ttf') format('truetype'), url('../fonts/Lava/Lava.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
*{margin:0; padding:0;}
html,body{height: 100%; font-family: Lato, sans-serif;}
.wrapper{
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100%;
    display: flex;
    flex-direction: column;}
header{
    background: #222222;
    color: #dedede;
    height: 75px;
}
.wrapper>.content{width: 100%; min-height: calc(100vh - 75px); background: #ECEDE8 url("../img/Mountains_bg.png") no-repeat bottom center; background-size: contain;
    display: flex;
    flex-wrap: wrap;}
.wrapper>.content .container-fluid{height: 100%;overflow: hidden;}
footer{background: #0f0b0f; z-index: 1;}
footer *{color: #a8a8a8;}
.navbar {
    background: #1c1c1c;
}
.leftbar{
    height: calc(100vh - 75px);
    background: #f3f3f3;
    box-shadow: 0 0 4px #ACACAC;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    overflow-y: auto;
    overflow-x: hidden;
}
.leftbar a{
    color: #939393;
    font-size: 15px;
    font-weight: 500;
    /*width: 90px;*/
    /*height: 75px;*/
    display: flex;
    justify-content: center;
    /*flex-direction: column;*/
}
.leftbar a>*{
    margin: auto -1px;
}
.leftbar a:hover{
    text-decoration: none;
    background: rgba(236, 237, 232, 0.7);
    color: #313131;
}
.leftbar>a:hover svg path{
    fill: #313131;
}
.leftbar>a svg path{
    fill: #A4A4A4;
}
.leftbar>a.active{
    background: #ecede8;
    box-shadow: 0 0 2px #ACACAC;
    margin: 0 1px;
}
.leftbar>a.active div{
    display: none;
}
.leftbar>a.active svg path{
    fill: #313131;
}
.custom-select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.text-container{
    overflow-y: auto;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 20px 20px 50px;
}
#books > h4{
    color: #d18200;
    border-bottom: 1px solid;
    border-top: 1px solid;
}
@media (min-height: 700px) {
    .leftbar {
        display: flex;
    }
}


@media (max-height: 706px) {
    .leftbar{
        /*padding: 0 !important;*/
    }
    .leftbar a>.chapter-tile{
        padding: 0.2rem 0.5rem !important;
        /*height: 65px;*/
    }
}
@media (max-width: 767px) {
    header {
        height: 40px;
    }
    .navigation, .navbar-nav {
        height: calc(100% - 40px);
        top: 40px;
    }
    .navbar-nav:after{
        top: 0;
    }
    .for-hamburger{
        padding: 0 5px;
    }
    label.hamburger {
        height: 37px;
        width: 36px;
        margin-bottom: 0;
        margin-top: 0;
    }
    input.hamburger:not(:checked) ~ label > i:before {
        transform: translate(-50%, -9px);
    }
    input.hamburger:not(:checked) ~ label > i:after {
        transform: translate(-50%, 9px);
    }
    header>nav.navbar{
        padding: 0 .25rem!important;
    }
    header .navbar-brand>img{
        max-height: 40px;
    }
    .for-translate-input{
        border-bottom: 1px solid #dee2e6;
    }
    #text{
        margin-left: -1px !important;
    }
    .wrapper>.content{
        background-size: 350%;
        background-position: left bottom;
    }
    .wrapper>.content{
        min-height: calc(100vh - 40px);
    }
}
@media (orientation: landscape) and (max-width: 767px){
    .wrapper>.content{
        background-size: contain;
        background-position: center bottom;
    }
    #RV{
        max-width: 100%;
    }
    .rand_verse{
        top: 0!important;
        position: relative!important;
    }
    #mainPageForm, #forRandVerse{
        flex: 0 0 50%!important;
        max-width: 50%!important;
        margin-top: 0!important;
    }
    #mainPageForm{
        padding-top: 1rem !important;
    }
    #mainPageForm>div{
        padding-top: 0!important;
    }
    .navigation{
        overflow-y: auto;
    }
    .navbar-nav{
        min-height: fit-content;
        position: static;
    }
    .nav-link {
        padding: 1px;
    }
}
#support-telegram{
    position: fixed;
    bottom: 15px;
    right: 15px;
    width: 50px;
    height: 50px;
    display: block;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%2012C0%205.373%205.373%200%2012%200s12%205.373%2012%2012-5.373%2012-12%2012S0%2018.627%200%2012Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M24%2012c0%206.627-5.373%2012-12%2012S0%2018.627%200%2012%205.373%200%2012%200s12%205.373%2012%2012ZM12.43%208.859c-1.167.485-3.5%201.49-6.998%203.014-.568.226-.866.447-.893.663-.046.366.412.51%201.034.705.085.027.173.054.263.084.613.199%201.437.432%201.865.441.389.008.823-.152%201.302-.48%203.268-2.207%204.955-3.322%205.061-3.346.075-.017.179-.039.249.024.07.062.063.18.056.212-.046.193-1.84%201.862-2.77%202.726-.29.269-.495.46-.537.504-.094.097-.19.19-.282.279-.57.548-.996.96.024%201.632.49.323.882.59%201.273.856.427.291.853.581%201.405.943.14.092.274.187.405.28.497.355.944.673%201.496.623.32-.03.652-.331.82-1.23.397-2.126%201.179-6.73%201.36-8.628a2.112%202.112%200%200%200-.02-.472.506.506%200%200%200-.172-.325c-.143-.117-.365-.142-.465-.14-.451.008-1.143.249-4.476%201.635Z%22%20fill%3D%22%233D6E94%22%2F%3E%3C%2Fsvg%3E");
    background-size: contain;
    transition: all .3s;
    z-index: 99;
}
#support-telegram:hover{
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%2012C0%205.373%205.373%200%2012%200s12%205.373%2012%2012-5.373%2012-12%2012S0%2018.627%200%2012Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M24%2012c0%206.627-5.373%2012-12%2012S0%2018.627%200%2012%205.373%200%2012%200s12%205.373%2012%2012ZM12.43%208.859c-1.167.485-3.5%201.49-6.998%203.014-.568.226-.866.447-.893.663-.046.366.412.51%201.034.705.085.027.173.054.263.084.613.199%201.437.432%201.865.441.389.008.823-.152%201.302-.48%203.268-2.207%204.955-3.322%205.061-3.346.075-.017.179-.039.249.024.07.062.063.18.056.212-.046.193-1.84%201.862-2.77%202.726-.29.269-.495.46-.537.504-.094.097-.19.19-.282.279-.57.548-.996.96.024%201.632.49.323.882.59%201.273.856.427.291.853.581%201.405.943.14.092.274.187.405.28.497.355.944.673%201.496.623.32-.03.652-.331.82-1.23.397-2.126%201.179-6.73%201.36-8.628a2.112%202.112%200%200%200-.02-.472.506.506%200%200%200-.172-.325c-.143-.117-.365-.142-.465-.14-.451.008-1.143.249-4.476%201.635Z%22%20fill%3D%22%2354A6E4%22%2F%3E%3C%2Fsvg%3E");
}