div,span.body,input,li,ul,textarea,a {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box}

html { height: 100%; min-height:100%;  font-family: 'Oswald', sans-serif; background: #DCA247;
}
body {min-height:100%;
    margin: 0;
    background-size: cover;
    background-attachment: fixed;
}

h1,h2,h3{font-family: 'Vesper Libre', serif;}
h2{font-size: 30pt;}

.content{    margin: 0 auto 20px auto;max-width: 1000px;padding: 20px;color:#2d2d2d;}


.footer{text-align: center; font-size: 8pt; opacity: .4;}
.footer a{color:black;}


.topvideo {margin: 0; position: relative;}
.topvideo video{width: 100%; display: block;}
.topvideo .videocoversvg {position: absolute; top: 0; height: 100%; width: 100%; overflow: hidden;}
.topvideo .videocoversvg img{width: 120%; height: 120%; display: block; margin: -10%;}
.topvideo .videocover {position: absolute; top: 50%;text-align: center; width: 100%; }
.topvideo .videocover h1{color:white; margin: -100px 0 0 0; font-size: 60pt; opacity: 1; transition: opacity 1s ease-in-out;}
.topvideo .videocover.hide h1{opacity: 0;}

.fxtop{position: fixed; top: 0; width: 100%; padding: 40px; text-align: right; z-index: 9999;}
.fxtop a{font-family: 'Oswald', sans-serif; color:white; text-decoration: none; display: inline-block; padding: 0 20px; position: relative;}
.fxtop a:hover:before{font-family: 'Vesper Libre', serif;content: ".";display: block;width: 100%;margin: -20px;font-size: 40pt;text-align: center;height: 40px;position: absolute;top: 0;}

.maininfo{padding: 50px 0;}
.maininfo h2{ text-align: center;}
.maininfo p{ text-align: center; max-width: 600px; margin: 0 auto; font-size: 12pt;}
.maininfo table{ text-align: center; max-width: 600px; margin: 0 auto; font-size: 12pt; width: 100%;}

.contacts{padding: 50px 0;}
.contacts h2{ text-align: center;}
.contacts .mailbox{padding: 60px 40px 40px 40px; text-align: center; max-width: 600px; margin: 0 auto; font-size: 12pt; color:white; background-image: url(/img/tah3.png); background-position: center top;  background-repeat:no-repeat; background-size: 100% auto; }
.contacts a{color:white;font-size: 14pt;}

.gallery .content{background-image: url(/img/tah2.png); background-position: center top;  background-repeat:no-repeat; background-size: 60% auto; padding: 100px 0 0 0; }
.gallery h2{color:white; text-align: center;}

.gal{}
.gal .item  {display:block; width: 20%;  padding: 10px;float:left;}
.gal .item  a{display:block; width: 100%; background-size:cover; background-position: center; }
.gal  .item  a img{display:block; width: 100%; }

@media screen and (max-width: 940px) {

    .articles .row {display: flex;flex-wrap: wrap}
    .articles .row .col {flex: 0 0 100%;}
}
@media screen and (max-width: 600px) {



    .fxtop{position: static; top: 0; width: 100%; padding: 20px 0; text-align: center; z-index: 9999;}
    .fxtop a{font-family: 'Oswald', sans-serif; color:white; text-decoration: none; display: inline-block; padding: 0 10px; position: relative;}
    .fxtop a:hover:before{font-family: 'Vesper Libre', serif;content: ".";display: block;width: 100%;margin: -20px;font-size: 40pt;text-align: center;height: 40px;position: absolute;top: 0;}


    .topvideo .videocover h1 {
        font-size: 30pt;
        margin: -40px 0 0 0;

    }

    .gal{padding: 0 10px;}
    .gallery .content{   background-size: 100% auto; padding: 50px 0 0 0; }
    .gal .item  { width: 50%;  padding: 10px;float:left;}


    .contacts .mailbox{ background-size: 150% auto; margin: -20px; }


}

.clear{clear:both;}


.foot:before{content: " "; display:block; position: absolute; top: 0; left: 0;background-size:cover; background-image: url(/img/footer-top.png); background-position: center; width: 100%; height: 60px;}
.foot{position: relative; text-align: center; width: 100%; opacity: .9; font-size: 9pt; margin-top: 120px; padding: 300px 0 50px 0; color:white; background-size:cover; background-image: url(/img/footer.jpg); background-position: center;}
.foot a{color:black;}