/* Website template by freewebsitetemplates.com */

@font-face {
    font-family: 'PTSerifCaption-Italic';
    src: url('../fonts/PT_Serif-Caption-Web-Italic.eot');
    src: url('../fonts/PT_Serif-Caption-Web-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
body {
     background-color:rgb(0,0,0);
    background-image: url(../images/darkclouds.jpg);
    background-attachment:fixed;
    background-repeat:no-repeat;
    background-position: center center;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    font-family: 'PT Serif';
    font-size: 4.25vw;
    font-weight:normal;
    text-align:left;
    margin-top: 70px;
    margin-bottom:80px;
    overflow: scroll;
    hyphens: auto;
    
}
mainframe{
}
img {
    border: 0;
}
iframe {
    border:none;
}
.reverse {
    unicode-bidi: bidi-override;
    direction: rtl;
}

/*----------------------v------- NAVIGATION ------v-----------------------*/
.topbar {
    z-index: 3;
    background: url(../images/bg.png) repeat-x;
    height:60px;
    line-height:60px;
    width:100%;
    display: grid;
    align-items: center;
    justify-content:center;
    text-align: center;
    grid-template-columns: 1fr 70px 70px;
    grid-template-rows: none;
    padding:0px;
    position:fixed;
    top:0px;
    left:0px;
}

.logo {
    height:60px;
    text-align:left;
    font-family:'PTSerifCaption-Italic';
    font-style: normal;
    font-size: 20pt;
    color: rgb(76,76,75);
    padding-left:5vw;
    padding-right:0vw;
}
.igref, .fbref {width:auto; height:60px; line-height:60px; text-align:center; align-items:center;}
.fbref {padding-right:3vw;}
.igref img, .fbref img{
    text-align:center;
    height:30px;
}


/*------------------------^----- NAVIGATION -----^------------------------*/


/*----------------------v------- HYPERLINKS -------v----------------------*/
a {
    text-decoration:none;   
}
a{
  color: inherit;
}

a:visited{
  color:inherit;
}

a:hover{
  color:inherit;
}
/*------------------------^----- HYPERLINKS ----------^-------------------*/



/*----------------------------v- INDEX -v----------------------------*/
.nextdate, .newscontainer, .trailerhead{
    background-color:rgba(253,247,230,0.8);
    color:black;
    border-radius:6px;
    padding:2vw;
    margin-top:2vw;
}
.trailerhead{
    padding:1vw 1vw 0 1vw;
}
.trailerhead div{
    margin-bottom:1vw;
    text-align:left;
    font-weight:bold;
}
.trailerhead trailer {
    margin:0;
    padding:0;
    font-weight:bold;
    height:150px;
}
.index_icon{
    display:block;
    line-height:20px;
    font-weight:bold;
}
.index_icon img{
    width:20px;
}
.newscontainer{
    text-align: justify;
}
.newscontainer a{
    text-decoration:underline;
}
/*----------------------------^- INDEX -^----------------------------*/



/*----------------------------v- ABOUT UND CONTACT -v----------------------------*/
.about_container, .contact_container{display: grid;}
.about_container {
    grid-template-columns: 7fr 13fr;
    grid-template-rows: auto auto auto;
}
.contact_container {
    grid-template-columns: 13fr 7fr;
    grid-template-rows: auto auto;
}
.aboutitem_text, .aboutitem_text2, .aboutitem_delia, .contactitem_text, .contactitem_text2{
    background-color:rgba(253,247,230,0.8);
    color: black;
    text-align: justify;
    margin:2vw 0 auto 0;
    padding:2vw;
    border-radius:6px;
    display: block;
}
.aboutitem_photo, .contactitem_photo {
    grid-row: 1;
    grid-column: 1;
    padding:0;
    margin:0;
}
.aboutitem_photo img, .contactitem_photo img {
    width:100%;
    height:auto;
    border-radius:6px;
    display:block;
}
.aboutitem_text, .contactitem_text {
    grid-row: 1;
    grid-column: 2;
    margin-top:0;
    margin-left:2vw;
}
.aboutitem_text2, .contactitem_text2 {
    grid-row: 2;
    grid-column: 1 / span 2;
}
.aboutitem_delia {
    text-align: center;
    align-items:top;
    grid-row: 3;
    grid-column: 1 / span 2;
    background:none;
}
.aboutitem_delia a img{
    width:60%;
    height:auto;
    border-radius:6px; 
}
.contactitem_text {
    grid-column:1;
    margin-left:0;
}
.contactitem_photo {
    grid-column:2;
    margin-left:2vw;
}
.address {
    margin-left:auto;
    margin-right:auto;
    text-align: center;
    width:60vw;
    margin-bottom:4vw;
    border-radius:3px;
    padding-bottom:1vw;
    padding-top:1vw;
}
.sociallinks {
    margin-left:auto;
    margin-right:auto;
    text-align: center;
    background-color:white;
    width:60vw;
    margin-bottom:4vw;
    border-right-style:solid;
    border-right-color:black;
    border-right-width:1px;
    border-bottom-style:solid;
    border-bottom-color:black;
    border-bottom-width:1px;
    border-radius:3px;
    padding-bottom:1vw;
    padding-top:1vw;
}
.sociallinks a  {
    display:block;
}
/*----------------------------^- ABOUT UND CONTACT -^----------------------------*/


/*----------------------------v- BOOKS -v----------------------------*/
.bookframe{
    display: grid;
    grid-template-columns: 1fr 4fr 1fr;
    padding:2vw;
    background-color:rgba(253,247,230,0.8);
    color:black;
    border-radius:6px;
    margin-top:2vw;
}

.bookcover{
    display: block;
    height:24vw;
    line-height:24vw;
    margin-top:auto;
    margin-bottom:auto;
    padding-top:2vw;
    padding-bottom:2vw;
}
.bookcover img{
    width:100%;
    height:auto;
    border-radius:0;
    display:block;
}
.bookinfo{
    display: block;
    font-size: 5vw;
    text-align: left;
    margin-top:auto;
    margin-bottom:auto;
    padding-left:4vw;
    height:auto;
    max-height:auto;
}
.booklink{
    display:block;
    text-align:center;
    margin-top:auto;
    margin-bottom:auto;
}
.booklink img{height:5vw;}
.booktitle{
    font-weight: bold;
}
.booksubtitle{ }
/*----------------------------^- BOOKS -^----------------------------*/


/*----------------------------v- BOOKPAGE -v----------------------------*/
.bookpage_container {
    display: grid;
    grid-template-columns: 2fr 3fr;
    grid-template-rows: auto auto auto;
}
.bookpage_data, .bookpage_trailer, .bookpage_content{
    background-color:rgba(253,247,230,0.8); 
    color:black;
    text-align:justify;
    margin:2vw 0 auto 0;
    padding:2vw;
    border-radius:6px;
    display: block;
}
.bookpage_image {
    grid-row:1;
    grid-column:1;
    padding:0;
    margin:0;
}
.bookpage_image img {
    width:100%;
    height:auto;
    border-radius:0;
    display:block;
}
.bookpage_data {
    grid-row: 1;
    grid-column: 2;
    font-size: 3.5vw;
    text-align: left;
    margin-left:2vw;
    margin-top:0;
    margin-bottom:auto;
}
.bookdata_headline{
    font-weight:bold;
    margin-bottom:1vw;
}
.bookpage_trailer {
    grid-row: 2;
    grid-column: 1 / span 2;
    height:150px;
    padding:0;
}
.bookpage_trailer iframe {
    border-radius:6px;
    border:none;
    height:150px;
}
.bookpage_content {
    grid-row: 3;
    grid-column: 1 / span 2;
}
.bookpage_content div{
    font-weight:bold;
    margin-bottom:2vw;
    text-align:center;
}
/*----------------------------^- BOOKPAGE -^----------------------------*/


/*----------------------------v- SCHEDULE -v----------------------------*/
.dateframe{
    display: grid;
    grid-template-columns: 1fr 6fr;
    background-color:rgba(253,247,230,0.8);
    color:black;
    border-radius:6px;
    margin:2vw 0 auto 0;
    padding-left:1vw;
    padding-right:1vw;
}
.datetype{
    display:block;
    height:20vw;
    line-height:20vw;
    padding-top:3vw;
    padding-bottom:3vw;
    text-align:center;
}
.datetype img{
    width:100%;
    height:auto;
    border-radius:0;
    display:block;
}
.dateinfo{
    display: block;
    margin-top:auto;
    margin-bottom:auto;
    padding-left:2vw;
}
.dateheadline{
    font-weight:bold;
    margin-bottom:0.5vw;
    text-align:left;
}
.dateimportantdetails{
    font-weight:bold;
}
.dateimportantdetails, .datedetails{
    font-size:3.5vw;
    line-height:4.25vw;
}
.olddatecontainer{
    background-color:rgba(253,247,230,0.8);
    color:black;
    border-radius:6px;
    padding:2vw;
    margin-top:2vw;
    text-align: justify;
}
/*----------------------------^- SCHEDULE -^----------------------------*/



/*----------------------------v- BOTTOM MENU -v----------------------------*/
.bottommenu {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    width: 100%;
    background-color:rgb(76,76,75);
    position:fixed;
    text-align:center;
    height:60px;
    line-height:60px;
    padding:0;
    bottom:0;
    left:0;
    border-top-color:black;
    border-top-style:solid;
    border-top-width:2px;
}
a.button{
    display:block;
    text-align:center;
    background-position:center center;
    background-repeat:no-repeat;
    background-color:rgb(253,247,230);
}
a.button#home{
    background:url('../images/btnhome.png');
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#about{
    background:url('../images/btnabout.png');
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#books{
    background:url('../images/btnbooks.png');
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#dates{
    background:url('../images/btnschedule.png');
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#contact{
    background:url('../images/btncontact.png');
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#ahome{
    background:url('../images/abtnhome.png'), rgb(253,247,230);
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#aabout{
    background:url('../images/abtnabout.png'), rgb(253,247,230);
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#abooks{
    background:url('../images/abtnbooks.png'), rgb(253,247,230);
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#adates{
    background:url('../images/abtnschedule.png'), rgb(253,247,230);
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
a.button#acontact{
    background:url('../images/abtncontact.png'), rgb(253,247,230);
    background-size:45px 60px;
    background-position:center center;
    background-repeat:no-repeat;
}
/*----------------------------^- BOTTOM MENU -^----------------------------*/



/*----------------------------v- IMPRESSUM -v----------------------------*/
.imp_container {
    display: block;
    padding:4vw;
    background-color:rgb(240,240,240);
    text-align:justify;
    color: black;
    border-radius:6px;
}

.imp_container div{
    font-size: 5vw;
    font-weight:bold;
    margin-bottom:2vw;
    text-align:center;
}
/*----------------------------^- IMPRESSUM -^----------------------------*/


/*------------------------------ FOOTER ------------------------------*/
#footer {
        font-size:3.5vw;
        line-height:18px;
        width: 100%;
        margin: 4vw auto;
        text-align: center;
}
#footnote ul {
        display: inline-block;
        list-style: none;
        margin: 0;
        padding: 0;
        padding-bottom:2vw;
}
#footnote ul li {
        float: left;
        padding-right: 10px;
}
#footnote ul li a {
        color: white;
        border-left: 1px solid white;
        padding-left: 10px;
        text-decoration: none;
}
#footnote ul li a:hover, #footnote ul li.active a {
        color: white;
}
#footnote ul li:first-child a {
        border: 0;
        padding-left: 0;
}
#footnote span {
        display: block;
        color: white;
}



/*------------------------------ QUERIES -----------------------------*/
@media screen and (max-width: 373px) {
    .logo {
     font-size: 7.2vw;
    }
    .topbar {
        grid-template-columns: 1fr 18vw 18vw;
    }
}
@media screen and (min-width: 485px) {

    body {
        font-size: 16pt;
    }
    .bookinfo, .imp_container div{
        font-size: 20pt;
    }
        
    .bookpage_data, .dateimportantdetails, .datedetails, #footer {
        font-size: 12pt;
    }
}
@media screen and (min-width: 720px) {
    html {
        height:100%;
    }
    body {
        font-size: 16pt;
        min-height:100vh;
        width:720px;
        margin:70px auto 80px auto;
        overflow-x:hidden;
    }
    .mainframe {
        background-color:rgba(253,247,230,0.5);
        min-height:calc(100vh - 150px);
        margin-top:-70px;
        padding-top:70px;
        margin-bottom:-80px;
        padding-bottom:80px;
        padding-left:10px;
        padding-right:10px;
        overflow-y:auto;
        overflow-x:hidden;
    }
    .logo {
        padding-left:36px;
    }
    
    .nextdate, .newscontainer, .trailerhead, .olddatecontainer{
        padding:14px;
        margin-top:14px;
    }
    
    .bookinfo, .imp_container div{
        font-size: 20pt;
    }
        
    .bookpage_data, .dateimportantdetails, .datedetails, #footer {
        font-size: 12pt;
    }
    .topbar{
        width:720px;
        left:auto;
    }
    .bottommenu {
        width:720px;
        left:auto;
    }
    .datetype{
        height:144px;
        line-height:144px;
        padding-top:22px;
        padding-bottom:22px;
    }
    .dateheadline{
        margin-bottom:4px;
    }
    .datedetails, .dateimportantdetails{
        line-height:30px;
    }
    .aboutitem_text, .aboutitem_text2, .aboutitem_delia, .contactitem_text, .contactitem_text2, .bookpage_data, .bookpage_content{
        margin:14px 0 auto 0;
        padding:14px;
    }
    .aboutitem_text, .contactitem_text {
        margin-left:14px;
    }
    .contactitem_photo, .aboutitem_photo, .bookpage_image {
        margin:0;
        padding:0;
        padding-top:14px;
    }
    .bookpage_trailer {
        margin:0;
        padding:0;
        margin-top:14px;
    }
    
    .contactitem_photo {
        margin-left:14px;
    }
    .address {
        width:300px;
        margin-bottom:29px;
        padding-bottom:7px;
        padding-top:7px;
    }
    .sociallinks {
        width:300px;
        margin-bottom:29px;
        padding-bottom:7px;
        padding-top:7px;
    }
    .bookframe{
        padding:14px;
        margin-top:14px;
    }
    .bookcover{
        height:174px;
        line-height:174px;
        padding-top:14px;
        padding-bottom:14px;
    }
    .bookinfo{
        padding-left:14px;
    }
    .booklink img{height:36px;}
    .bookpage_data {
        margin-left:14px;
    }
    .bookdata_headline{
        margin-bottom:7px;
    }
    .bookpage_content div{
        margin-bottom:14px;
    }
    .dateframe{
        margin:14px 0 auto 0;
        padding-left:7px;
        padding-right:7px;
    }
    .dateinfo{
        padding-left:14px;
    }
    .dateheadline{
        margin-bottom:4px;
    }
    .imp_container {
        padding:29px;
    }

    .imp_container div{
        margin-bottom:14px;
    }
    #footer {
            margin: 29px auto;
    }
    #footnote ul {
            padding-bottom:14px;
    }    
}