body{
	font-family: 'ButlerRegular';
	font-size:16px;
	margin:0px;
	padding:0px;
}
*{
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;
}

.changeImageSrcLeft{
	background: url(/img/iconmonstr-arrow-left-thin.svg);
	background-repeat : no-repeat;
	background-size: 40px 40px;
	width: 50px;
	height: 40px;
	border: 0;
	border-style:none;
}

.changeImageSrcRight{
	background: url(/img/iconmonstr-arrow-right-thin.svg);
	background-repeat : no-repeat;
	background-size: 40px 40px;
	width: 50px;
	height: 40px;
	border: 0;
	border-style:none;
}

.windowPercentige{
	width:75%;
	margin: 0 auto;
}
.right{
	text-align:right;
}
.left{
	text-align:left;
}
.center{
	text-align:center;
}
.bold{
	font-weight:bold;
}
.font30{
	font-size:30px;
}
.font15{
	font-size:15px;
}
.marginMiddle{
	margin:0 auto;
}
.windowPercentage{
	width:75%;
	margin: 0 auto;
}
.textNoDecoration{
	text-decoration:none;
}
input{
	font-family:'ButlerRegular';
}
.background-BG{
	background-image :url('../img/BG.png');
	background-repeat: no-repeat;
	background-size: cover;
	min-height:100vh;
	height:100%;
	min-width: 100%;
}
.backgroundHistorikuBG{
	background-image :url('../img/BG.png');
	background-repeat: no-repeat;
	background-size: cover;
	min-height:100vh;
	min-width: 100%;
}
.gallery{
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	grid-template-rows: repeat(14, 5vw);
	grid-gap: 0px;
}
.ButlerRegular{
	font-family: 'ButlerRegular';
}
/*------- Grid--------*/
.gallery > figure {
	margin: 0;
}
.gallery__img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.gallery__item--1{
	background-color: black;
	grid-column-start: 1;
	grid-column-end: 3;
	grid-row-start: 1;
	grid-row-end: 4;
}
.gallery__item--1t{
	padding: 3% 2%;
	grid-column-start: 1;
	grid-column-end: 3;
	grid-row-start: 4;
	grid-row-end: 7;
}
.gallery__item--2{
	grid-column-start: 3;
	grid-column-end: 5;
	grid-row-start: 1;
	grid-row-end: 7;
}
.gallery__item--3{
	padding:7% 6%;
	grid-column-start: 5;
	grid-column-end: 7;
	grid-row-start: 1;
	grid-row-end: 7;
}
.gallery__item--4{
	padding:4% 3%;
	grid-column-start: 1;
	grid-column-end: 5;
	grid-row-start: 7;
	grid-row-end: 15;
}
.gallery__item--5{
	background: black;
	overflow: hidden;
	padding: 15%;
	grid-column-start: 7;
	grid-column-end: 9;
	grid-row-start: 1;
	grid-row-end: 7;
}
.gallery__item--6{
	grid-column-start: 5;
	grid-column-end: 7;
	grid-row-start: 7;
	grid-row-end: 11;
}
.gallery__item--7{
	grid-column-start: 7;
	grid-column-end: 9;
	grid-row-start: 7;
	grid-row-end: 11;
}
.gallery__item--8{
	grid-column-start: 5;
	grid-column-end: 9;
	grid-row-start: 11;
	grid-row-end: 15;
}
.galleryGrid{
	display: grid;
	grid-template-columns: repeat(8, 1fr);
	grid-template-rows: repeat(8, 5vw);
}
.galleryImageFirst{
	grid-column-start: 1;
	grid-column-end: 9;
	grid-row-start: 1;
	grid-row-end: 9;
}
.galleryImgContainer{
	position: relative;
	width:100%;
	height:100%;
}
.galleryOverlay{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: white;
	overflow: hidden;
	width: 100%;
	height:100%;
	transition: .5s ease;
	opacity: 0;
	display: table;
}
.galleryImgContainer:hover .galleryOverlay{
	border:1px solid black;
	transform: scale(0.96);
	box-shadow: 7px 7px black;
	opacity: 1;
}
.transformImg{
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
}
.photoText{
	/* padding-top: 10%; */
	text-align:center;
	display: table-cell;
	vertical-align: middle;
	font-family: 'ButlerRegular';
}
.vitiText{
	font-size: 1.5vw;
	word-wrap: break-word; 
	color: black;
	overflow: hidden;
	width:100%;
}
.nameText{
	width:100%;
	color: black;
	font-size: 1.5vw;
	white-space: initial;
}
.quoteText{
	width:100%;
	font-family: 'Roboto Condensed', sans-serif;
	word-wrap: break-word; 
	font-size: 1vw;
	padding:5px;
	padding-top: 10px;
	color: #000000;
	overflow:hidden;
}
/*-------- -------*/
#MainNavBarBox{
  top: 20px;
  width:100%;
  position: absolute;
}
.topnav a ,.topnavMenu a {
	display: none;
}
.mainNavBar{
	width:75%;
	margin: 0 auto;
	border-spacing: 0px;
	box-shadow: 7px 7px black;		
	color:black;
	border-collapse: separate;
}
.mainNavBar thead td{
    color: black;
    background: white;
}
.mainNavBar .c1{ width:8%;}
.mainNavBar .c2{ width:2%;}
.mainNavBar .c3{ width:2%;}
.mainNavBar thead .c1{
    border: 1px solid black;
    font-family: 'ButlerRegular';
    font-size: 50px;
    padding-left:20px;
    text-align:left;
}	
.mainNavBar thead .c3{
    font-size: 17px;
    border: 1px solid black;
    text-align:center;
    font-weight:bold;
    vertical-align: middle;
}
.mainNavBar thead .c3 a{
	display: flex;
	justify-content: center;
	align-items: center;
    width:100%;
	height: 100%;
}
.mainNavBar .c3:hover{
    background-color:black;
	color:white;
}
.mainNavBar .c3:hover a{
    background-color:black;
	text-decoration: none;
	color:white;
}
.mainNavBar .c1:hover a{
	text-decoration: underline;
	color: black;
	cursor: pointer;
}
.mainNavBarActive {
  box-shadow: 0 0 #666;
  transform: translateY(6px);
}
.logoAlb{
	position: absolute;
	top: 5px;
	right: 25px;
	font-size: 16px;
	color: #000000;
	font-family: 'Roboto Condensed', sans-serif;
	
}
.logoAlb a{
	color: #000000;
	display: block;
}
.logoAlb a:hover{
	color: #0645ad;
	text-decoration: none;
}
/*------------Footer--------------------*/
#homeFooter{
	height: 250px;
	clear: both;
	left: 0;
	padding: 20px;
	padding-bottom:0px;
	background: #000000;
	color:#ffffff;
}		
.fixed{
	bottom: 0;
}
#homeFooterTitle{
	font-family: 'ButlerRegular';
	font-size:41px;
	padding-left:10%;
}
#homeFooterTagline {
	font-size:18px;
	display:inline;
	color:white;		
	padding-right:1%;
}
.footerArkiviLogo{
	float:left;
	opacity:0.8;
	margin:40px;
	margin-bottom:0px;
	margin-top:10px;
	height: 85px;
}
.footerSponsorsImg{
	float:right;
	vertical-align:bottom;
	width:300px;
}
#homeFooterTagline a{
	font-family: 'CondensedRoboto';
	font-size:16px;
	display:inline;
	color: white;
	opacity:0.5;
	padding-right:1%;
}
/*------------authorsSlide---------------*/
.container {
      margin: 0 auto
}
/* Prevent the slideshow from flashing on load */
#slides {
  display: none;
}
@media (max-width: 767px) {
  .container {
	width: auto
  }
}
/* For smaller displays like laptops */
@media (min-width: 768px) and (max-width: 979px) {
  .container {
	width: 724px
  }
}
/* For larger displays */
@media (min-width: 1200px) {
  .container {
	width: 1170px
  }
}
#divForMobile{
	display: none;
}
#divForPc{
	display: block;
}
/*-------bottom Nav Bar-------------*/
.windowPercentage{
	width:75%;
	margin: 0 auto;
}
.authorFixedMenuBox {
	margin: 0 auto;
	position: fixed; 
	bottom: 5%; 
	width: 75%;
}
.authorsFixedMenu {
	font-family: 'ButlerRegular';
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: white;
	border: .5px solid black;
	box-shadow: 7px 7px black;
}
.authorsFixedMenu li {
	float: right;
}
.authorsFixedMenu li a {
	font-family: 'Roboto Condensed', sans-serif;
	display: block;
	color: black;
	padding: 9px 30px;
	text-decoration: none;
	font-size:14px;
	vertical-align: middle;
}
.authorsFixedMenu li:first-child {
	float: left;
	pointer-events: none; 
	cursor: default;
	padding-left: 10px;
}
.authorsFixedMenu li:last-child {
	border-right: none;
}
.authorsFixedMenu li a:hover:not(.active) {
	background-color: black;
	color:white;
}
.mainAuthorDateHolder{
	position: absolute;
	bottom: 5%;
	width: 75%;
}
/*-------homepage-------------*/
#homepage{
	width: 100%;
	position: relative;
}
#homepage img{
	width: 100%;
	height: 100%;
}
#homepageMainViti{
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#homepageMainVitiBox{
	width: 100%;
	height: 100px;
}
#homepageMainVitiText{
	font-family: 'ButlerRegular';
	text-align: center;
	font-size: 105px;
	color: black;
	white-space: nowrap;
}
#homepageMainQuote{
	position: absolute;
	top: 75%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#homepageMainQuoteBox{
	width: 550px;
	overflow: auto;
	background:white;
	border:1px solid black;
	box-shadow: 7px 7px black;
}
#homepageMainQuoteText{
	font-family: 'Roboto', sans-serif;
	text-align: center;
	font-size: 16px;
	padding: 10px;
	color: #000000;
	opacity: 1;
	font-weight: bold;
}
#homepageArrow{
	position: absolute;
	top: 93%;
	left: 50%;
	transform: translate(-50%, -50%);
}
#homepageArrow img{
	width: 40px;
	height: 50px;
}
/*-------VIDEOTEKA-------*/
.itemsAuthorContainer{
	position:relative;
	min-height: 100vh;
}
.itemsAuthorContainerIn{
	width: 75%; 
	margin: 0 auto;
	/*8vh nav height*/
	padding-top: 100px;
	font-family: 'ButlerRegular';
	color: black;
}
.itemsAuthorContainerIn p{
	font-family: 'ButlerRegular'; 
	font-size: 30px; 
	padding:5px;
	margin-top:1%;
}
/*-------contact form -------*/
.kontaktoMainBox{
	padding-top:130px;
}
.title{
	padding-left:5px;
	font-size:30px;
	font-family: 'ButlerRegular';
	padding-bottom:2vh;
}
.row{
	background-color:#FFFFFF;
	margin:0 auto;
	display:inline-flex;
	min-width:40vw;
	margin:10px;
	margin-left:0px;
	border:1px solid black;
}
.rowButton{
	margin:0 auto;
	display:inline-flex;
	min-width:40vw;
	min-height:100%;
}
.rowButton div{
	width:100%;
	min-height: 40px;
}
.rowButtonPorosieRe{
	text-decoration: none;
	display:inline-flex;
	justify-content: flex-end;
	min-width:40vw;
	margin-top: 20px;
	font-family: 'CondensedRoboto';
}

.required{
	font-family: 'ButlerRegular';
	font-size:22px;
	width:30%;
	border-right:1px solid black;
	height: 50px;
	display: flex;
	justify-content:left;
	align-items: center;
	padding-left: 10px;
}
.inputField{
	padding-bottom:0px;
	border: 0;
	width:70%;
	padding-left:20px;
	font-size: 22px;
	font-family: 'Roboto Condensed';
}
.inputFieldPorosija{
	font-family: 'Roboto Condensed';
	font-size:22px;
	padding: 10px;
	border: 0;
	width:100%;
	padding-left:10px;
	overflow: auto;
	height:30vh;
}
.postButton{
	font-family: 'Roboto Condensed';
	font-size: 14px;
	min-width:20%;
	height:100%;
	float:right;
	font-weight:bold;
	box-shadow: 7px 7px black;
	background-color:#FFFFFF;
	color:#000000;
	border:1px solid black;
	cursor: pointer;
	-webkit-appearance: none;
	height: 40px;
}
.postButton:hover{
	background-color: black;
	color: white;
}
.mesazhiuDergua{
	font-family:'ButlerRegular';
	padding-left: 20px; 
	display:flex; 
	align-items: center; 
	background: white; 
	height: 60px; 
	border:1px solid black;
	width:40vw;
	
}
.mesazhiuDerguaText{
	font-family: 'ButlerRegular'; 
	font-weight: bold; 
	font-size: 3vh;
}
.mesazhiuDerguaBtnBox{
	font-family: 'Roboto Condensed';
	height:50px; 
	background-color :white;
	border:1px solid black; 
	padding:15px;
	box-shadow:5px 5px black;
	font-size: 14px; 
	font-weight: bold; 
	color:black;
	display: inline-block;
}
.mesazhiuDerguaBtnBox:hover{
	background-color: black; 
}
.mesazhiuDerguaBtnBox:hover a{
	text-decoration: none;
	background-color: black; 
	color: white;
}
/*------- loadaudio--------*/
.authorAudioView{
	width: 75%;
	margin: 0 auto;
	padding-top:120px;
	min-height: 100vh;
}
.authorAudioViewTitle{
	font-size:24px;
	font-weight:normal;
	color:#000000;
	text-decoration:none;
}
.authorAudioViewIframe{
	width:100%;
	margin: 0 auto;
	padding:30px;
}
.authorAudioViewIframe iframe{
	width:100%;
	height:30vh;
}
/*------- loadphoto--------*/
.loadPhotoMainBox{
	width: 75%;
	margin: 0 auto;
	padding-top:120px;
	min-height:80vh;
}
.loadPhotoMainBox p{
	font-family: 'ButlerRegular', sans-serif;
	font-size:24px;
	font-weight:normal;
	color:#000000;
	text-decoration:none;
}
.getIncludedPhotoBox { 
	width:70%;
	margin: 0 auto;
	padding: 5px 15px 5px 15px;
}
.getIncludedPhotoBox img { 
	width:100%;
	opacity: 1;
	filter: alpha(opacity=100);
}
.getIncludedPhotoBoxDisplay {
	position: relative;
	width: 100%;
	padding-bottom: 56.65%;
	overflow:hidden;
}
.getIncludedPhotoBoxDisplay .ratioChildDis { 
	position:absolute;
	height:100%;
	width:100%;
}
/*------- HISTORIKU--------*/
.historikuBoxName{
	width:75%; 
	margin: 0 auto; 
	padding-top: 110px;
}
.historikuTextBox{
	padding-left:5px;
	overflow: auto;
}
.historikuTextBox div{
	font-family: 'ButlerRegular'; 
	font-size:20px; 
	padding: 5px; 
	color: #000000;
}
/*------- HISTORIKU--------*/
.aboutUsContainer{
	padding-top:110px;
	min-height:100%;
	font-family:ButlerRegular
}
.aboutUsBox{
	width:60%;
	border:1px solid black;
	margin:50px auto;
	box-shadow: 5px 7px black;
	padding:30px;
	padding-right:50px;
	font-size:30px;
	color:black;
	font-family:'CondensedRoboto',sans-serif;
}
.aboutUsSponsored{
	font-family: 'CondensedRoboto', sans-serif;
	text-align:center;
	font-size:22px;
	font-weight: bold;
	color:black;
}
.aboutUsImg{
	width:60%;
	margin: 0 auto;
	padding:40px;
}
.aboutUsImg img{
	float:left;
	padding:10px;
}
.aboutUsImg h1{
	margin-top: 10px;
	margin-left: 120px;
	text-align: center;
	font-size:16px;
	font-family: 'ButlerRegular', sans-serif;
}
.aboutUsImg p{
	margin-left: 120px;
	text-align: center;
	padding:0px;
	padding-top: 10px;
	font-size:14px;
	font-family: 'ButlerRegular', sans-serif;
}
/*------- kerko search--------*/
.kerkoBox{
	padding-top: 130px; 
	padding-bottom: 15px;
}
.kerkoBoxRelative {
	position: relative;
}
.kerkoBox p{
	font-family: 'ButlerRegular'; 
	font-size:30px;
	padding-left:5px;
}
.kerkoBox i {
	position: absolute;
	top: 35%;
	right: 10px;
	color: black;
}
.kerkoTableBox{
	font-family: 'ButlerRegular'; 
	font-size:20px; 
	font-weight:nromal; 
	padding-left:5px;
	color: black;
}
.kerkoBoxTable{
	height: 100vh;
	padding-bottom: 10px;
	font-family:"Regular 30px/36px Butler";
}
.kerkoSearchBox {
	width: 100%;
	height: 45px;
	font-size:15px;
	border: none;
	padding: 4px 8px;
	border:1px solid black;
	box-shadow: 7px 7px black;
	padding-left: 15px;
}
.kerkoSearchBox:focus{
	outline: none;
}
/*----------dokumente------------------*/
.dokumenteContainerView{
	position:relative;
	height: 100vh;
}
.authorBox{
	width:75%;
	margin: 0 auto;
	padding-top: 130px;
	height: 100%;
	min-height:100vh;
}
.authorBox h2{
	font-family: 'ButlerRegular';
	padding: 5px;
	color: #000000;
	font-size:30px;
}
.authorBox p{
	color: #000000;
	font-size:15px;
	font-weight:bold;
	padding-left:5px;
}
/* -------------LISTA E  AUTOREVE-------------*/
.authorListText{
	color: black;
	padding-bottom: 20px;
	padding-left: 5px;
	font-family: 'ButlerRegular';
	font-size: 30px;
}
/*=============Data holder *********************/

.mainAuthorBio{
	min-height: 350px;
	height:100%;
	padding-top: 50px;
}
.mainAuthorBioContainer{
	height:100%;
	float:left;
	padding: 80px 4% 0 0;
}
.mainAuthorBioNr{
	font-family:'ButlerRegular';
	font-size: 150px;
}
.mainAuthorBioText{
	padding-top:30px;
	padding-bottom: 30px;
}
.mainAuthorBioTitle{
	font-family: 'ButlerRegular';
	font-size:40px;
	padding-bottom:20px;
}
.textContainer{
	overflow:auto;
}
.mainAuthorText{
	width: 80%;
	font-family: 'CondensedRoboto', sans-serif;
	color:black;
}
.mainAuthorQuote{
	padding-right: 30px;
	padding:40px;
	overflow:auto;
	background:white;
	border: 1px solid black;
	box-shadow:7px 7px black;
}
.mainAuthorQuoteText{
	text-align:center;
	font-family: 'ButlerRegular';
	font-size:28px;
	font-weight: bold;
}
.authorContainerAllBoxData {
	width:100%; 
	overflow: auto; 
	border:1px solid black; 
	box-shadow:5px 5px black;
}
.authorsMenu {
	font-family: 'ButlerRegular';
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: white;
	border-bottom: 1px solid black;
	box-shadow: 7px 7px black;
}

.authorsMenu li {
	float: right;
}

.authorsMenu li a {
	font-family: 'Roboto Condensed', sans-serif;
	display: block;
	padding: 9px 30px;
	text-decoration: none;
	font-size:14px;
	vertical-align: middle;
}

.authorsMenu li:first-child {
	float: left;
	pointer-events: none; 
	cursor: default;
	padding-left: 10px;
}

.authorsMenu li:last-child {
	border-right: none;
}

.authorsMenu li a:hover:not(.active) {
	background-color: black;
	color:white;
}

.activeAuthorsMenu {
	background-color: black;
	color:white;
}
.authorDataContainerBox {
	font-family: 'Roboto Condensed', sans-serif;
	width: 100%; 
	float:left; 
	font-size:14px; 
	padding:15px; 
	background:white;
	color: black;
}
.authorDataContainerBox P{
	font-family: 'Roboto Condensed', sans-serif;
	font-size:16px; 
	margin: 0;
}
.authorDataContainerBox .textContainerBox{
	font-size:16px; 
	display:block;
	width: 100%;
}
.authorDataContainerBox a{
	color: #0645ad;
}
.authorBackgroung{
	background-image: url('/img/BG.png');
	height:100vh;
}
.authorBackgroungHistoriku{
	background-image: url('/img/BG.png');
	background-repeat: no-repeat;
	background-size: cover;
	height:100vh;
}
.authorTimeLineButton{
	padding-top: 90px;
}
.historyBox{
	position:relative;
	max-width: 150px;
	box-shadow:5px 5px black;
	border: 1px solid black;
	overflow: auto;
	margin-top: 20px;
}
.historyBoxText{
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;
	padding: 5px;
	font-weight: bold;
	font-size: 14px;
	background-color: white;
	color: black;
}
.historyBoxText:hover{
	background-color: black;
	color: white;
}
.slideContainerAuthor{
	width:100%;
	padding-top:8vh;
	display:flex;
	justify-content: center;
	align-items: center;
}
.card__content-paragraph{
	font-family: 'CondensedRoboto';
	font-weight: bold;
}
.radiusPoint{
	width:13px;
	height:13px;
	background-color:black;
	border-radius: 50%;
	position:absolute;
	top: calc(8vh + 40px + 50px);
	left:50%;
}
.lineRight{
	width:50%;
	background-color:black;
	height:1px;
	position:absolute;
	top: calc(8vh + 40px + 50px + 6.5px);
	left:50%;
}
.lineLeft{
	display: none;
	width:50%;
	background-color:black;
	height:1px;
	position:absolute;
	top: calc(8vh + 40px + 50px + 6.5px);
	left:0;
}

/*Photos shown */
.photoFitSlide {
	position: relative;
	display: flex;
	justify-content: center;
	align-items:center;
	width: 100%;
	height: 100%;
}
.photoFit {
	max-width: 60vw;
	width: auto;
	height:auto;
	max-height: 55vh;
	display: flex;
	background-color: #fff;
	overflow: hidden;
}
.photoFitInside img{
	overflow:hidden;
}
.photoFitInside .portraitImg {
	max-height:55vh;
	width:auto;
	max-width: 100%;
	height:auto;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
@media screen and (max-width: 540px) {
	.photoFit {
		max-width: 90vw;
	}
	.photoFitInside .portrait {
		max-height:350px;
	}
}
/* Video place*/
.videoMiddle{
	width: 50vw;
	height: 25vw;
}

.textInfo p{
	margin: 0;
}
.videoHomePage{
	width: 100%;
    /* Could also use width: 100%; */
    height: 700px;
	position: relative;
}
.videoHomePage img {
	width:100%;
	height: 100%;
	object-fit: fill;
    z-index: -1;
}
.videoHomePage .overLayViti{
	font-family: 'ButlerRegular';
	font-size: 105px;
	position: absolute; 
	top: 50%;
	left: 50%;
	color: #FFFFFF;
	z-index: 10;
	transform: translate(-50%, -50%);
	white-space: nowrap;
}
.videoHomePage .overLayArrow{
	position: absolute; 
	top: 90%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.videoHomePage .overLayArrow img{
	width: 40px;
	height: 50px;
}