/*
/* ------------------------------------------------------------------ */			
/* Style Sheet for responsive Home Page of www.VERONIKA-ZEMANOVA.info */
/* -------------------- Copyright 2022 ------------------------------ */
/* ------------------------------------------------------------------ */			
/*

/* Web fonts */

@font-face {
    font-family: 'Swiss911 XCm BT';
    src: url('../fonts/Swiss911BT-ExtraCompressed.eot');
    src: url('../fonts/Swiss911BT-ExtraCompressed.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Swiss911BT-ExtraCompressed.woff2') format('woff2'),
        url('../fonts/Swiss911BT-ExtraCompressed.woff') format('woff'),
        url('../fonts/Swiss911BT-ExtraCompressed.svg#Swiss911BT-ExtraCompressed') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Standard HTML element overrides */

h1, h2, h3{
    font-family: 'Swiss911 XCm BT';
    display: block;
    text-align: center;
}
    h1{
        font-size: 3.052rem
    }
    h2{
        font-size: 2rem;  
    }

body {
    background-color: #DCEDCD;
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    color:#444444;
}
a{
    color:#52603b;
}
header {
    border-top:10px solid rgb(0,0,0);
    background-color: #010101;
    height: 252px;
    background-image: url('../images/TopBanner.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    width:100%;
	background-size: contain;
}
section{
    padding-top:30px;
    padding-bottom:30px;
}
footer{
    height: 90px;
    color:#ffffff;
    padding-top:20px;
}

/* ###### NAVIGATION ###### */

#top-nav,footer {
    background-color: #010101!important;
}

.nav-link{
    min-width:120px;
    color:rgba(255,255,255,1)!important;
    text-align: center;
    font-weight: 600;
}
.nav-link:hover{
    background-color: #9bc16c;
    border-radius: 5px;
    color: rgba(0,0,0,0.7)!important;
}
.nav-item{
    padding-left:5px;
    padding-right:5px;
    border-right: 1px solid rgba(255,255,255,0.2);
    font-size: 16px;
}
.nav-item:last-child{
    border-right: 0px;
}

.dropdown-menu a:visited{
    color:#000!important;
}

.page-item a:visited{
    color:#ffffff!important;
}	

/* ###### Rotating GALLERY ###### */

/* Gallery wrapper */

#gal-preview{
    position: relative;
    height:310px;
}

/* Gallery images */

#gal-preview img{
    position: absolute;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto; 
    width: 200px;
}

/* ####### HOMEPAGE SECTIONS ###### */

/* Images to the left of each section */

.section-image{
    width:100%;
    margin-bottom: 40px;
}

/* Outer banner */

.banner-wrapper {
    padding-bottom:40px;      
}
    .banner-wrapper img{
        height:50px;
        vertical-align: middle;
    }
	
/* Inner banner */

.banner{
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #9bc16c;
    width: 100%;
    display: block;
    color: #010101!important;
    border-radius: 50px;
    z-index: 10;
    border:1px solid rgba(255,255,255,0.5);
	box-shadow: 0px -4px 5px #777777;
}
    .banner h2{
        padding-top:10px;
        letter-spacing: 0.5px;
        color:#444444;
    }

/* ###### SECTION Background Images ###### */

#intro{
    background-image: url('../images/Veronika-Main.png');
    background-repeat: no-repeat;
    background-position-x: 0px;
}
    .intro-padding{
        margin-top:65px;
    }

#wallpapers,#magazines,#photos,#blog,#updates{
    background-image: url('../images/extras_bg.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    max-width: 1110px;
    margin: auto;
}
    #magazines{
        background-image: url('../images/art_bg.png');
    }
    #photos{ 
        background-image: url('../images/videos_bg.png');
    }
    #blog{
        background-image: url('../images/forum_bg.png');
    }
    #updates{
        border-bottom:2px solid #c9d4bb;
        background-image: url('../images/updates-bg.png');
    }
    #intro{
        border-bottom:2px solid #c9d4bb;
    }

/* ###### RESPONSIVE OVERRIDES ###### */

@media screen and (max-width: 768px) {
    body{
        background-position-y: 90px;
        font-size: 18px;
    }
    header{
        height:130px;
    }   
    h0{
        font-size: 3.0rem;
    }

    h0w{
        font-size: 3.0rem;
		color: #ffffff;
    }
  
    h1{
        font-size: 2.75rem;
    }

    h2{
        font-size: 2.25rem;
    }
    h3{
        font-size: 1.3rem;
    }
    h4{
        font-size: 1.5rem;
    }

    .banner{
        width: 75%;
    }
    section{
        padding-top:50px;
        padding-bottom:50px;
        min-height: 470px;
    }
    #intro{
        background-position-x: 0px;
    }
    .section-image{
        width:85%;
        margin-bottom: 15px;
    }
    .intro-padding{
        margin-top:48px;
    }
}

@media screen and (min-width: 992px) {
        #gal-preview img{
        left: unset; 
        width: 240px;
    }
}

@media screen and (min-width: 1200px) {
    body{
        background-position-y: 90px;
    }
}

/* BackToTop button */

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 15px; /* Place the button at the bottom of the page */
  right: 15px; /* Place the button 30px from the right */
  width:35px;
  height:35px;
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #969696; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  border-radius: 30px; /* Rounded corners */
  font-size: 20px; /* Increase font size */
 }

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}