﻿@charset "utf-8";
/* CSS Document */
@font-face {
 font-family: Open Sans; /* Гарнитура шрифта */
 src: url(../fonts/2211.ttf); /* Путь к файлу со шрифтом */
 }
@font-face {
 font-family: Majestic; /* Гарнитура шрифта */
 src: url(../fonts/8581.ttf); /* Путь к файлу со шрифтом */
 }
*{margin:0; padding:0;}
html{ height:100%;}
body {font-family: Open Sans, Helvetica, sans-serif; background:#E4DFDA; min-width:180px; padding-bottom:47px; min-height: 100%; position:relative;}
h1, h2, h3 {margin: 20px 0 15px;}
.striped {background: #e4e2da; padding: 25px 0;}
table {font-family: Helvetica, sans-serif;}
img{margin: 0 auto; display: block;}
a{text-decoration:underline;}
a, a:hover{color:#440b0b; font-size:16px;}
a:hover{text-decoration:none;}
header{background:url(../../source/img/VGR_Head.png) no-repeat scroll center top #000000; background-position-x: 50%;}
::-webkit-input-placeholder {color:    #e6e1dc;}
:-moz-placeholder {color:    #e6e1dc;}
::-moz-placeholder {color:    #e6e1dc;}
:-ms-input-placeholder {color:    #e6e1dc;}
.clearfix:after {display: block; content: ""; clear: both;}
.header{ height: 260px;}
.name-site{text-align:center; color:#edca55; position:relative; height: 260px;}
.name-site a{color:#edca55;}
.Golos{font-family: Majestic; font-size: 80px; position: absolute; top: 50%; margin-top: -85px; left: 50%; margin-left: -70px;}
.Bozhij{font-family: Open Sans; font-size: 56px; position: absolute; top: 50%; margin-top: -10px; right: 0;}
.nav-bar{color:#faf5a2; font-size:16px; text-transform:uppercase; padding-left: 200px; margin-top: 6px;}
.nav-bar a{color:#faf5a2; font-size:16px; text-transform:uppercase; text-decoration: none;}
.nav-bar a.current{color:#fff; pointer-events: none;}
.nav-bar a.current-pt{color:#fff;}
.nav-bar a:hover{color:#fff;}
.navbar {width: 100%; padding: 0; align-items: flex-start;}
.navbar-toggler{position: absolute; top: 50%; margin-top: -20px; right: 2px; padding: 4px 5px;}
footer{/*position: absolute;*/ bottom: 0; width:100%; background:#0f0d0c; align-items: center; text-align:center; color:#69605a; font-size:18px; padding: 10px 0;}
/* content */
.content{margin: 25px auto;}
.who{overflow: hidden; position: relative;}
.who img{float:left; width:40%; max-width: 300px;}
.who h2{color: #1a110a; font-size: 25px; margin-top: 10px; margin-left: -50px; display: inline-block;}
.who p{color:#3f2d1e; font-size:17px; line-height: 20px; position: relative; left: -5px;}
.read-more{text-transform: uppercase; background: #999933; padding: 10px 12px; font-size: 16px; color: #fae7d8; text-decoration: none;}
.latest-updates {text-align: center;}
.latest-updates h2{font-size: 16px; text-transform: uppercase; text-align: center; color: #330000; border-bottom: 1px solid #362314; padding-bottom: 8px;}
.news-serm{text-align:left;}
.news-serm a{color:#362314; font-size:16px; line-height: 15px; text-decoration: none;}
.news-date {font-size: 12px; top: -5px; position: relative; color: #ac6127;}
.archive{ text-decoration: underline;}
.latest-updates{margin-bottom:20px;}
.quote .container{position:relative;}
.quote-block{ margin: 0;}
.quote-wr{ position: relative; min-height: 300px; display:flex; width:100%;}
.quote-block img { position: absolute; left:0; bottom: 50%;    margin-bottom: -150px; max-width: 300px; max-height: 300px; width: 100%;}
.quote{margin: auto; display: block; width:100%; background: rgba(29, 116, 29, 0.15); text-align:center;} 
.quote-text{padding: 20px 0 20px 350px; text-align:left;}
.quote-rm{margin-bottom: -22px;}
.quote h2{color:#1a110a; font-size:20px; text-transform:uppercase;}
.quote p {color:#3f2d1e;}
.bottom-block{margin: 60px 0 40px;}
.bible-quote p{text-align:left; margin-bottom:0; font-size:18px; color:#000000;}
.bottom-block h3 {font-size: 20px; color: #1a110a; border-bottom: 1px solid #362314; padding-bottom: 7px; margin-bottom: 12px;}
.bible-link {font-size: 20px; color: #000000;}
.bottom-block h4 {font-size: 20px; color: #b77948;}
.search-input{background: none; border: 2px solid #999933; border-radius: 3px; padding: 2px 5px; max-width: 350px; width: 75%;}	
.search-button{padding: 7px 8px; color: #e6e1dc; right: 4px; cursor: pointer;}
#param {display: block; background: white; padding: 0 6px;}
.bible-quote {margin-bottom: 15px;}
.foto-galery-wr{margin: 30px 0; position: relative;}
.foto-galery{position: absolute; color: #e6e1dc; font-size: 14px; background: rgba(0, 0, 0, 0.7); padding: 1px 6px; bottom: 5px; left: 0;}
.foto-galery-wr img{width:100%; max-width:200px;}
h1.pnf{font-size:100px; text-align:center;}
.table-brown {color: #E4DFDA; background-color: #5f4a3e;}
.table-brown a i{color: #E4DFDA; font-size:24px;}
.table-brown td{border-right:1px solid #4E443C; border-bottom: 1px solid #4E443C; padding: 0.4rem; vertical-align: middle;}
.table-brown thead td{color: #d7c667; background:#3c3128; border:none;}
.table-brown td:last-child{border-right:none;}
.table-brown.table-striped tbody tr:nth-of-type(odd) {background: #E4DFDA; color: #3c3128;}
.table-brown.table-striped tbody tr:nth-of-type(odd) a i{color: #3c3128;}
table.sort thead td {cursor: pointer; font-weight: bold; text-align: center; vertical-align: middle; white-space: nowrap;}
.sort-arrow{margin-right:5px;}
td.date {white-space: nowrap;}
.year{margin-bottom: 5px;}
.year .col{white-space: nowrap;}
.year input, .year select, .bss-search input{color:#e6e1dc; background:#7a6145; border:1px solid #baad9e; padding: 1px 5px;}
.serm-topline{padding:10px 0; background:#645b53; color:#e4dfda; display:flex;}
.serm-topline div {margin: auto;}
.serm-topline span{line-height:29px;}
.serm-topline i{font-size:29px;}
.serm-topline .fa-file-pdf-o{color:#f47c7c;}
.serm-topline a {margin-left: 5px;}
.serm-text{color:#262321;    padding: 0 15px;}
body.has-fixed-player{
    padding-bottom: 80px;
}
.player {
    background: #3A3027;
    height: 80px;
}
.fixed-player{position: fixed; bottom: 0; left: 0; right: 0; width: 100%; z-index: 5; border-top: 1px solid #bfbfbf;}
.thumbs {
    width: 100%;
    text-align: center;
}
.thumbs a {
	    width: 140px;
    height: 140px;
    display: inline-block;
    border: 2px solid #303030;
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    border-radius: 2px;
   margin: 0px 21px 30px;
    position: relative;
    text-decoration: none;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
}
#alt{background: #5f4a3e; margin: 1px auto 0; border: 1px solid #695f57; position: absolute; bottom: 0; width: 100%;}
#alt p{white-space: normal; line-height: normal; padding: 5px; margin: 0; color: #e4dfda;}
#gallerySlider .placeholder {vertical-align: top;}
.user-info input {
       width: 100%;
    max-width: 320px;
}
.user-info label {
    width: 120px;
}
#contact-form{color:#462f1f; max-width: 600px;
    margin: 15px auto;}
#contact-form input, #contact-form textarea{
    padding: 4px 15px;
    border: none;
    box-shadow: 3px 3px 7px 0 rgba(0, 0, 0, 0.3);
	    margin: 0 10px;
}
.write-us{color:#200201; font-size:18px; font-family: Helvetica, sans-serif;}
#contact-form textarea {
    height: 250px;
    padding: 20px;
    max-width: 600px;
    display: block;
}
#contact-form .buttons input{
        background: #999933;
    color: #ffffff;
    font-family: Helvetica, sans-serif;
    text-transform: uppercase;
        margin: 25px 0 0 5px;
}
.user-info {
    margin: 15px 0;
}
.message-lb {
    background: #87500f;
    padding: 10px 15px;
    color: #fff;
    position: relative;
    bottom: -10px;
    left: 15px;
}
.message {
position: relative;
    margin: 30px 0 20px;
    padding: 25px 0 10px;
    max-width: 600px;
}
.message-lb {
    background: #87500f;
    padding: 7px 15px;
    color: #fff;
    position: absolute;
    top: 5px;
    height: 38px;
    text-transform: uppercase;
}
.q-answer{max-width:230px; width:100%}
.buttons{width:50%;    text-align: right;}
.vlinks img{width:100%;}
.vlinks{padding:15px 0;}
.book {
    width: 178px;    padding: 25px  0;
}
.book img {
    height: 230px;
    width: 100%;
}
.book-name {
    display: flex;
    background: #ffffff;
    height: 50px;
    font-size: 14px;
    padding: 5px 0;
    text-align: center;
}
.book-name p {
    margin: auto;
    width: 100%;
}
.book-links {
    width: 100%;
    background: #999933;
    padding: 7px 10px;
}
.book-links a {
    color: #fae7d8;
    text-transform: uppercase;
    text-decoration: none;
}
.book-name-read{font-size: 19px;
    margin: 10px 0 20px; text-align:center;}
	.result{text-align:center; font-size:18px;}
	.result i{font-size:22px;}
	.bg-black-50 {
    background: rgba(0,0,0,0.5);
}
.progs a{text-decoration:none;}
.progs a:hover{text-decoration:underline;}
	
	/* Анимация */

.fa-shake {
	position:relative;
    -webkit-animation: fa-shake 1.3s infinite normal linear;
    animation: fa-shake 1.3s infinite normal linear;
	animation-fill-mode: forwards;
}
@keyframes fa-shake {
    25%, 80% {
        -moz-transform: rotate(-5deg);
        -webkit-transform: rotate(-5deg);
        -o-transform: rotate(-5deg);
        -ms-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }

    30%, 75% {
        -moz-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        -o-transform: rotate(10deg);
        -ms-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    35%, 55%, 70% {
        -moz-transform: rotate(-20deg);
        -webkit-transform: rotate(-20deg);
        -o-transform: rotate(-20deg);
        -ms-transform: rotate(-20deg);
        transform: rotate(-20deg);
    }

    45%, 65% {
        -moz-transform: rotate(20deg);
        -webkit-transform: rotate(20deg);
        -o-transform: rotate(20deg);
        -ms-transform: rotate(20deg);
        transform: rotate(20deg);
    }
}
@-webkit-keyframes fa-shake {
    25%, 80% {
        -moz-transform: rotate(-5deg);
        -webkit-transform: rotate(-5deg);
        -o-transform: rotate(-5deg);
        -ms-transform: rotate(-5deg);
        transform: rotate(-5deg);
    }

    30%, 75% {
        -moz-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        -o-transform: rotate(10deg);
        -ms-transform: rotate(10deg);
        transform: rotate(10deg);
    }

    35%, 55%, 70% {
        -moz-transform: rotate(-20deg);
        -webkit-transform: rotate(-20deg);
        -o-transform: rotate(-20deg);
        -ms-transform: rotate(-20deg);
        transform: rotate(-20deg);
    }

    45%, 65% {
        -moz-transform: rotate(20deg);
        -webkit-transform: rotate(20deg);
        -o-transform: rotate(20deg);
        -ms-transform: rotate(20deg);
        transform: rotate(20deg);
    }
}


@media (max-width: 1199px) {
    .Golos {
        left: 0;
        margin-left: 0;
    }

    .Bozhij {
        margin-left: 0;
        right: 4px;
    }

    .nav-bar {
        padding: 0px;
        padding-left: 60px;
    }

    .thumbs a {
        width: 120px;
        height: 120px;
        margin: 6px 18px 30px;
    }
}
@media (max-width: 991px) {
    header {
        background-image: none;
        margin-bottom: 90px;
    }

    .header {
        height: auto;
        position: static;
    }

    .name-site {
        height: 110px;
        width: 250px;
        top: 0;
        left: 5px;
        background: #130302;
        border-radius: 0 0 5px 25px;
        border: 3px solid;
        border-top: none;
        margin-bottom: -100px;
    }

    nav {
        margin-top: 0;
    }

    .Golos {
        margin-top: -52px;
        font-size: 55px;
    }

    .Bozhij {
        margin-left: 0;
        margin-top: 0px;
        font-size: 32px;
    }

    a.nav-item {
        font-size: 15px;
        padding: 8px;
    }

    .nav-bar {
        margin-top: 0;
        padding: 0;
    }

    .who {
        margin-bottom: 20px;
    }

    .thumbs a {
        width: 115px;
        height: 115px;
        margin: 6px 8px 10px;
    }

    .message {
        margin: 30px auto 20px;
    }
}
@media (max-width: 767px) {
    .name-site {
        height: 90px;
    }

    .container {
        max-width: 100%;
    }

    header .container .row div:nth-child(2) {
        padding-right: 0px;
    }

    a.nav-item {
        font-size: 14px;
        padding: 5px 3px;
    }

    .who p {
        font-size: 16px;
        line-height: 20px;
        left: 0;
        width: 100%;
        text-align: left;
        padding: 5px 10px;
    }

    .who h3 {
        margin-left: 0;
        width: 100%;
        text-align: center;
    }

    .who img {
        display: block;
        width: 100%;
        margin: 0 auto;
        float: none;
    }

    .quote-block img {
        position: static;
        margin: 10px auto 30px;
    }

    .quote-text {
        padding: 20px 0;
    }

    .table-brown td {
        font-size: 14px;
    }

    .serm-topline a {
        margin: 0;
    }

    .year a, .year form {
        font-size: 14px;
    }

    .year input, .year select {
        padding: 1px 2px;
        margin: 0 -1px;
    }
}
@media (max-width: 575px) {
    header {
        margin-bottom: 0;
    }

    .name-site {
        height: 90px;
        border-radius: 0;
        left: 0;
        border-left: 0;
        border-right: 0;
        margin-bottom: 0;
    }

    a.nav-item {
        width: 100%;
        text-align: center;
    }

    .Golos, .Bozhij {
        width: 100%;
        text-align: center;
    }

    header .container .row div:nth-child(2) {
        padding: 1px 0;
    }

    .nav-bar {
        border-bottom: 3px solid rgb(237, 202, 85);
    }

    .news-serm a {
        font-size: 15px;
    }

    .news-date {
        font-size: 12px;
    }

    .table-brown td {
        font-size: 11px;
    }

    table.sort thead td {
        white-space: normal;
    }

    .table-brown a i {
        font-size: 20px;
    }

    .serm-topline span {
        line-height: 20px;
        font-size: 14px;
    }

    .serm-text {
        font-size: 14px;
    }

    .serm-topline nobr {
        white-space: normal;
    }

    .serm-topline i {
        font-size: 25px;
    }

    #nextArrow {
        right: 0;
    }

    #prevArrow {
        left: 0;
    }

    .table-brown thead, .table-brown tbody {
        width: 100%;
    }

    .buttons {
        width: 100%;
    }

    #contact-form .buttons input {
        width: 100%;
    }

    #contact-form input, #contact-form textarea {
        margin-left: 0;
        margin-right: 0;
    }

    #contact-form .q-answer {
        margin-left: 10px;
    }
}
@media (max-width: 249px) {
    .Golos, .Bozhij {
        width: 100%;
        text-align: left;
    }

    .Bozhij {
        left: 30px;
    }

    .who h3 {
        font-size: 16px;
        font-weight: bold;
    }

    .who p {
        font-size: 14px;
    }

    .read-more {
        font-size: 12px;
    }

    .news-serm a {
        font-size: 13px;
    }

    .news-date {
        font-size: 11px;
    }

    .foto-galery {
        left: 0;
        margin-left: 0;
    }

    .serm-topline .col-1 {
        margin-left: -5px;
    }
}

