@font-face {
    font-family: 'Calibri'; /*a name to be used later*/
    src: url('../fonts/CALIBRIB.TTF'); /*URL to font*/
}

.nextimg{
  display: none;
}
.previmg{
  display: none;
}

.slider_button{
  position: absolute;
  height: 110px;
  width: 100vw;
  bottom: 20px;
  display: flex;
  transition: 2s;
}
.slider_selectors{
  position: absolute;
  width: 100%;
  background: #0000009c;
}
.selector-item{
  height: auto;
  width: 5%;
  margin: 5px!important;
  border-radius: 20px;
  cursor: pointer;
  background-position: center;
  background-size: cover;
}


.selector-item-01{background-image: url("../img/360/01.jpg");}
.selector-item-02{background-image: url("../img/360/02.jpg");}
.selector-item-03{background-image: url("../img/360/03.jpg");}
.selector-item-04{background-image: url("../img/360/04.jpg");}
.selector-item-05{background-image: url("../img/360/05.jpg");}
.selector-item-06{background-image: url("../img/360/06.jpg");}
.selector-item-07{background-image: url("../img/360/07.jpg");}
.selector-item-08{background-image: url("../img/360/08.jpg");}
.selector-item-09{background-image: url("../img/360/09.jpg");}
.selector-item-10{background-image: url("../img/360/10.jpg");}
.selector-item-11{background-image: url("../img/360/11.jpg");}
.selector-item-12{background-image: url("../img/360/12.jpg");}
.selector-item-13{background-image: url("../img/360/13.jpg");}
.selector-item-14{background-image: url("../img/360/14.jpg");}
.selector-item-15{background-image: url("../img/360/15.jpg");}
.selector-item-16{background-image: url("../img/360/16.jpg");}
.selector-item-17{background-image: url("../img/360/17.jpg");}
.selector-item-18{background-image: url("../img/360/18.jpg");}
.selector-item-19{background-image: url("../img/360/19.jpg");}
.selector-item-20{background-image: url("../img/360/20.jpg");}


body{
  /* overflow: hidden!important; */
  background-image: url(../img/background_start.png);
  background-position: center;
  background-size: cover;
  margin: 0px!important;
  padding: 0px!important;
  font-family: 'Calibri';
}

/* Text */
p{
  text-align: justify;
  font-size: 210%;
  color: #4b4b4b!important;
  font-weight: bold;
}
/* Akapit */
p div{
  width: 100px;
  height: 20px;
}

/* index.html */
.wrap-menu{
  position: absolute;
  height: 50vh;
  width: 50vw;
}
.wrap-menu a{
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
  position: absolute;
  font-size: 25px;
  text-decoration: none;
  color: black;
  font-weight: bold;
  width: 780px;
}
.wrap-menu p{
  position: absolute;
  font-size: 60px;
  text-decoration: none;
  font-weight: bold;
}
/* Block Left-Top PL */
.left-top{top: 0;  left: 0;  text-align: right;}
.left-top a:hover {
  background: url(../img/left-top-block.png);
  background-position: right;
  background-size: cover;
  color: #382522;
  transition: 1.5s;
}
.left-top a{
  background: url(../img/left-top-block-open.png);
  background-position: right;
  background-size: cover;
  bottom: 0px;
  right: 0;
  width: 100%;
  height: 36vh;
  color: white;
  font-size: 60px;
  padding: 160px;
}
/* Block Right-Top PL */
.right-top{ right: 0;  top: 0;  text-align: left;}
.right-top a{
  background: url(../img/right-top-block-open.png);
  background-position: left;
  background-size: cover;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 36vh;
  color: white;
  font-size: 60px;
  padding: 160px;
}
.right-top a:hover{
  background: url(../img/right-top-block.png);
  background-position: left;
  background-size: cover;
  color: #382522;
  transition: 1.5s;
}
/* Block Left-Bottom PL */
.left-bottom{  left: 0;  bottom: 0;  text-align: right;}
.left-bottom a:hover{
  background: url(../img/left-bottom-block.png);
  background-position: right;
  background-size: cover;
  color: #382522;
  transition: 1.5s;
}
.left-bottom a{
  background: url(../img/left-bottom-block-open.png);
  background-position: right;
  background-size: cover;
  top: 0px;
  right: 0px;
  width: 100%;
  height: 37vh;
  color: white;
  font-size: 60px;
  padding: 160px;
}
/* Block Right-Bottom PL */
.right-bottom{  right: 0;  bottom: 0;  text-align: left;}
.right-bottom a:hover{
  background-image: url(../img/right-bottom-block.png);
  background-position: left;
  background-size: cover;
  color: #382522;
  transition: 1.5s;
}
.right-bottom a{
  background-image: url(../img/right-bottom-block-open.png);
  background-position: left;
  background-size: cover;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 37vh;
  color: white;
  font-size: 60px;
  padding: 160px 100px;
}

/* BTN Back in page */
.btn_back img{
  width: 70px;
  margin-top: -5px;
}
.btn_back{
  left: 40px;
  position: absolute;
  z-index: 999;
  top: 40px;
}
.btn_back a{
  color: #383838;
  text-decoration: none;
  font-weight: bold;
  text-transform: uppercase;
  padding-left: 20px;
  font-size: 35px;
}

/* Page Menu Block */
#containerEmpty{
  position: relative;
  height: 100vh;
  width: 100vw;
}
#containerMenu{
  height: 75vh;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* Menu audiodescription item */
.audiodescription{
    background-position: center;
    background-size: 161%;
    height: 100%;
    background-image: url(../img/audiodescription.jpg);

    filter: grayscale(100%);
   -webkit-filter: grayscale(100%);
   -moz-filter: grayscale(100%);
   -ms-filter: grayscale(100%);
   -o-filter: grayscale(100%);
   filter: url(desaturate.svg#greyscale);
   filter: gray;
   -webkit-filter: grayscale(1);
}
.audiodescription:hover{
  background-image: url(../img/audiodescription.jpg);
  background-size: 200%;
  transition: 1.9s;
  filter: none;
}
.audiodescription a:hover{
  padding-top: 150%;
  transition: 1.9s;
}
.audiodescription a {
  width: 100%;
  height: 100%;
  font-size: 2.5em;
  position: absolute;
  text-align: center;
  color: #ffffff;
  font-weight: bold;
  padding-top: 200%;
  text-decoration: none;
}
/* Menu item */
.menu-item{
  overflow: hidden;
  height: 25vh;
  background-position: center!important;
  background-size: 100%!important;
}
.menu-item a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    color: white;
    font-size: 1.9em;
    position: absolute;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: bold;
    z-index: 99;
}
.menu-item:hover{
  background-size: 130%!important;
  transition: 1.9s;
}
.menu-item a:hover{
  padding-top: 3%;
  transition: 1.2s;
  font-size: 1.7em;
}

.menu-item::before{
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: black;
  content: " ";
  opacity: 0.4;
}
.menu-item:hover::before{
    opacity: 0;
    transition: 1.5s;
}
.item01{  background: url("../img/menu-item-01.png");}
.item02{  background: url("../img/menu-item-02.png");}
.item03{  background: url("../img/menu-item-03.png");}
.item04{  background: url("../img/menu-item-04.png");}
.item05{  background: url("../img/menu-item-05.png");}
.item06{  background: url("../img/menu-item-06.png");}
.item07{  background: url("../img/menu-item-07.png");}
.item08{  background: url("../img/menu-item-08.png");}
.item09{  background: url("../img/menu-item-09.png");}

.sub-item{
  background: #15364c;
  width: 100%;
  height: 100%;
  position: absolute;
  line-height: 30px;
  z-index: 9999;
  top: -310px;
  transition: 1.9s;
}
.sub-item a{
  padding-top: 10%!important;
  height: 50%!important;
  position: relative!important;
  display: block;
}
.sub-item a:hover{
  font-size: 1.9em!important;
  padding-top: 10%!important;
}
.sub-item-last{
  background: #15364c;
  width: 100%;
  height: 100%;
  position: absolute;
  line-height: 30px;
  z-index: 9999;
  top: -260px;
  transition: 1.9s;
}
.sub-item-last a{
  padding-top: 4%!important;
  height: 30%!important;
  position: relative!important;
  display: block;
}
.sub-item-last a:hover{
  font-size: 1.9em!important;
  padding-top: 4%!important;
}














#start{
  background-image: url(../img/background_start.png)!important;
}



.desc{
    background-color: white;
    width: inherit;
    padding: 10px;
    font-size: 16px;
    max-height: 600;
    position: relative;
    margin: 0 auto;
    overflow-y: scroll;
}
.descVAL{
  display: none;
}


div{
  margin: 0px!important;
  padding: 0px!important;
}
.photo_page{
  width: 80%;
  margin-bottom: 20px;
  margin-top: 10px;
}
.photo_page_slide{
  width: 64%;
}
.photo_div{
  padding: 15px!important;
}

.gallery{
  width: auto!important;
  z-index: 0!important;
}

.gallery img{
  width: 17%!important;
  height: auto!important;
}




#container{
  position: relative;
  height: 100vh;
  width: 100vw;
  /* background-image: url(../img/background.png)!important; */
  background-size: cover;
  background-position: center;
}






/*  slideBlock  */
.slideBlock{
      position: absolute;
      background-image: url(../img/background_page_block.png);
      background-size: cover;
      background-position: center;
      height: 85%;
      top: 7%;
    overflow: scroll;
}
.slideBlock .photo_div{
    text-align: center;
}
.slideBlock .ak{
  height: 100px;
}
.slideBlock p{
    padding: 15px;
    height: 100%;
    font-size: 25px!important;
    opacity: 1;
    overflow-y: auto;
}
/* blackBlock */
.blackBlock{
  position: absolute;
background-image: url(../img/background_page_block.png)!important;
background-size: cover;
background-position: center;
margin-top: 6%!important;
height: auto;
padding: 50px!important;
width: 100vw;
top: 15%;
}
.blackBlock div{
  padding-top: 2%!important;
  padding-left: 3%!important;
  padding-right: 3%!important;
}
.blackBlock div li{
  margin-bottom: 15px;
  list-style: none;
}
.blackBlock div a{
  color: #383838;
  text-decoration: none!important;
  font-size: 25px;
  text-transform: uppercase;
  font-weight: bold;
}
.blackBlock div a:hover{
  color: #7f0304;
}




.closeBtn{
    position: absolute;
    top: 0;
    height: 62px;
    right: 0;
    margin: 37px 5% 43px 90px;
    display: none;
}


.slider{
  display: inline-block;
  position: absolute;
    bottom: 15px;
    width: 100vw;
    height: 110px;
    text-align: center;
    z-index: 99999;
}
.slider .thumbnail{
  width: auto;
  height: 100px;
  margin-right: 10px;
}











.timeline{
  top: 25%!important
}

.timeline div{
  text-align: center;
  margin-bottom: 250px!important;
  margin-top: 200px!important;
}
.line{
  border-bottom: solid 3px #7f0304;
}
.line ul{
  list-style: none;
  position: absolute;
}
.top{
  top: -38px;
}
.bottom{
  top: 24px;
}
.sub-line{
  left: -5px;
  top: 125px;
opacity: 0;
}
.sub-line li{
  width: 400%;
text-align: left;
}
.sub-line .hd{
  border-bottom: solid 1px #7f0304;
  z-index: 999;
}
.sub-line .hd img{
  top: 9px;
  position: relative;
}
.sub-line-link span{
font-size: 12px;
color: #808080;
}

.gallery-small img {
    width: 12%!important;
    height: auto!important;
}
.gallery-small{
  width: auto!important;
  z-index: 0!important;
}

.vertical img{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  margin-left: 16px;
  margin-right: 16px;
}


.datemenu{
  text-align: center;
  padding-top: 100px!important;
  padding-bottom: 120px!important;
}
.hd{
  padding: 20px;
}

.list{
  padding: 0!important;
overflow-x: hidden;
height: 100%;
}

.list-item{
  margin: 0!important;
  list-style: none;
      position: relative;

    padding-top: 30px;
}

.list-item img{
    width: 20%;
}

.list-banner{
  border-top: 1px solid rgba(123, 123, 123, 0.8);
  padding: 10px!important;
}

.list-desk{
  position: absolute;
  margin-left: 450px!important;
}
.list-desk h1{
  position: absolute;
  /* top: -8!important; */
  font-size: 22px!important;
  width: 800px;
  margin-top: 30px!important;
}
.list-desk audio{
  position: absolute;
  bottom: 25px;
  left: 0;
}
