
/*
Theme Name: uzis magic forest
Theme URI: https://very.badf00d.de
Author: uzi
Author URI: https://very.badf00d.de
Description: Fullscreen theme demo
Version: 1.0.0
License: ot defined yet
License URI: n/a
Tags: Fullscreen
Text Domain: uzimagicforest
*/

/*
global definitions
*/


body, html{
  height: 100%;
  margin: 0;
  font-size: 18px;
  font-family: Handlee, OpenSans;
  font-weight: 400;
  line-height: 1.8em;
  color: #666;
  background-color: green;
}


.oi {
  color: white;
  font-family: Handlee, OpenSans, Icons;
  font-size: 16px;
}


/*
background stuff
*/

.bg-std {
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  background-color:transparent;
}

.bg-forest, .bg-field, .bg-beach {
  position: relative;
  background-attachment:fixed;
  min-height: 100%;
  z-index: 1;
}

.bg-forest {
  background-image: url('images/bg-forest.png');
}

.bg-beach {
  background-image: url('images/bg-beach.png');
}

.bg-field {
  background-image: url('images/bg-field.png');
}

.bg-ceilinglayer {
  top: 0;
  left: 0;
}

.bg-floorlayer {
  left: 0;
  bottom: 0;
}

.bg-layer {
  min-width:100%;
  position: absolute;
  width: auto; /* to keep proportions */
  height: auto; /* to keep proportions */
  max-width: 100%; /* not to stand out from div */
  max-height: 100%; /* not to stand out from div */
  margin: auto auto 0; /* position to bottom and center */
}

.bg-green{
  background-color:#003200;
  color:#fff;
}

.bg-black {
  background-color:#000;
  color:#fff;
}

.sidelogo {
  margin-left: 10%;
}


/*
text design
*/

.centertextblock {
  position:absolute;
  top:50%;
  width:100%;
  text-align:center;
  color:#000;
  font-size:27px;
  letter-spacing:8px;
  text-transform:uppercase;
  text-align: center;
  vertical-align: middle;
}

.centertextblock .border{
  border-radius: 40px;
  background-color:#343a40;
  color:#fff;
  padding:20px;
}

.centertextblock .border.trans{
  background-color:transparent;
}

.wp-block-columns {
    display: flex;
    flex-wrap: nowrap;
}
.wp-block-column {
    flex: 1 1 0;
}   

.aligncenter {
    text-align: center;
}

/*
menus
*/
.navbar {
  padding: 8px;
  text-align: center;
  font-size: 16px;
}


.navbar:hover {
  background-color: rgba(0, 0, 0, 1);
}


.navbar-dark .navbar-nav .nav-link {
  padding-left: 10px;
  padding-right: 10px;
}

.navsearchbox {
  right: 20px;
}

.footer-menu {
  background-color: rgba(0, 0, 0, 0.4);
  width: 50%;
  text-align: center;
  margin: auto;
  font-size: 14px;
  border-radius: 75px 75px 0px 0px;
}

.header-menu {
  background-color: rgba(0, 0, 0, 0.9);
  width: 70%;
  text-align: center;
  margin: auto;
  border-radius: 0px 0px 75px 75px;
}


/*
content container
*/
#blogtext > div > div.col-lg-8 > div > center > h2 > a {
  color: #90ef90;
}

.textentry {
  text-align: left;
  padding-left: 5%;
  padding-right: 5%;
  padding-top:9%;
  padding-bottom: 7%;
}

.blogsection {
  background-image: url('images/article-wood-big.png');
  background-repeat: repeat-y;
  background-size: contain;
  background-position:center;
  color: #fff;
  min-height: 100%x;
}

.livebox {
  padding-left: 5%;
  padding-right: 5%;
  padding-top: 6%;
  padding-bottom: 8%;
  text-align:center;
}

.liveboxcontent {
  padding: 50px;
  border-radius: 40px;
  margin: 10px;
  background-color: rgba(0, 0, 0, 0.5);
}

.liveboxframe {
  width: 56vw;
  height: 56vh;
  position: relative;
}


/*
gallery
*/

.slider {
  height: 40%;
}

.carousel-indicators
 {
   width: 10%;
   top: 3%;
   left: 80%;
   white-space: nowrap;
   color: black;
 }


/*
misc
*/

.navbar-toggler {
  text-align: center;
  margin: auto;
}

#particles-js {
  width: 100%;
  height: 100%;
}

#particles-js canvas {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
}


/*
media queries
*/
/* Very small devices (tablets 768px and down) */
@media (max-width: 768px) {
  .navbar-dark .navbar-nav .nav-link {
    padding-left: 3px;
    padding-right: 3px;
  }

  .navisearchbox {
      right: 0px;
      margin-left:10px;
    }

    .header-menu {
      width: 90%;
      text-align: center;
      margin: auto;
    }

    .centertextblock {
        font-size: 10px;
        letter-spacing: 3px;
    }

    .blogsection {
      background-image: url('images/article-wood-small.png');
    }
 }


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .navbar-dark .navbar-nav .nav-link {
    padding-left: 3px;
    padding-right: 3px;
  }

  .navisearchbox {
      right: 0px;
      margin-left:10px;
    }

    .header-menu {
      width: 90%;
      text-align: center;
      margin: auto;
    }

    .centertextblock {
        font-size: 14px;
        letter-spacing: 3px;
    }

    .blogsection {
      background-image: url('images/article-wood-small.png');
    }

 }


/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .navbar-dark .navbar-nav .nav-link {
    padding-left: 10px;
    padding-right: 10px;
  }

  .navisearchbox {
      right: 0px;
      margin-left: 30px;
    }

    .header-menu {
      width: 85%;
      text-align: center;
      margin: auto;
    }

    .centertextblock {
        font-size: 20px;
    }

    .blogsection {
      background-image: url('images/article-wood-big.png');
    }
 }

/* Large devices (large desktops, 1200px and up) */
@media (min-width:1200px) {
  .navbar-dark .navbar-nav .nav-link {
    padding-left: 25px;
    padding-right:25px;
  }

  .navisearchbox {
    margin-left: 20px;
  }

  .header-menu {
    width: 70%;
    text-align: center;
    margin: auto;
  }

  .centertextblock {
      font-size: 22px;
  }

  .blogsection {
    background-image: url('images/article-wood-big.png');
  }
 }
