@charset "utf-8";
/*
 * ******************************************************************************
 *  Page slider css
 *  file: page-slider_v1.css
 *
 *  Copyright (c) 2023. 239BITS ;
 *  Broadband Intelligence Tech Solutions, Croatia - CRO
 *  email: office@239bits.com
 *  site: 	http://www.239bits.com
 *  other-blog:	http://www.dotsagencija.com
 *
 *  Licences: MIT, GPL
 *  http://www.opensource.org/licenses/mit-license.php
 *  http://www.gnu.org/licenses/gpl.html
 *
 *	Artwork inspired by:  /
 *  last modified: 02/11/2023 18.23
 *  *****************************************************************************
 */

/*******************************************************************************
 * 
 * 239BITS: dr.blast
 * version: 1.00
 * Author-of-the-file: dr.blast
 * Creation date: 02/11/2023 18.23
 * Licences: MIT, GPL
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl.html
 *
 ******************************************************************************/


 body{
    width:100%;
    height:100%;
}
*{
    margin:0;
    padding:0;
}
.fullscreen-container{
    overflow:hidden;
    width:100vw;
    height:100vh;
}
.all-pages{
    position:relative;
    top:0;
    transition:all 1s ease;
    /* height set by js */
}
  .page{
    height:100%;
    width:100%;
    opacity:0;
    transform: translateY(0%); /* Start position on top viewport */
    transition: transform 2s, opacity 2s; /* Animation duration and easing */
}
.page:first-child {
  transform: translateY(0);
  opacity: 1;
  transition: transform 0.5s, opacity 1s;
}
.page:has(+ .third.active),.page:has(+ * + .fourth.active) {
  transform: translateY(0);
  opacity: 1;
  transition: transform 0.5s, opacity 1s;
  }

.page.second {
  transform: translateY(100%) scale(0.5);
  opacity: 0.6;
  transition: transform 1.5s, opacity 1s;
}
.page.third, .page.fourth, .page.fifth, .page.sixth {
  transform: translateY(0%);
  opacity: 1;
  transition: transform 1.3s, opacity 0.5s;
}
.page.active {
 transform:translateY(0) scale(1); /* Slide in from the bottom */
 opacity:1;
}

.all-pages .page:nth-child(3){
    /* background:linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
               url(https://raw.githubusercontent.com/Juuggo/FELab/master/fullscreen-scroll/images/bg3.jpg) center / cover; */
              letter-spacing: normal;
}
.ps-text-container{
  color:white;
  text-align:center;
  position:relative;
  top:40%;
  margin:0 40px;
  opacity:1;
  visibility:visible;
  transform:translateY(-10%);
  /* transition:all 1s ease; */
}
.ps-text-container.in-sight{
  opacity:1;
  visibility:visible;
}
.ps-text-container h2{
  font-size:3.4rem;
  text-transform:uppercase;
  animation: 1s ease-out growOne;
  animation-iteration-count:1;
  letter-spacing: -0.05em;
  word-spacing: 0.1em;
  font-weight: 700;
}
.ps-text-container p{
    font-size:2vh;
    padding:1em 0;
}
.ps-link-container{
  position: relative;
  display: block;
  width: 100%;
  height: 30%;
  transition: all 1000ms ease;
  text-align: center;
  top: 56.9%;
  /* background: -moz-linear-gradient(180deg,rgb(0 0 0 / 2%) 0%, rgb(27 30 20 / 20%) 10%, rgb(19 21 19 / 2%) 50%);
  background: -webkit-linear-gradient(180deg,rgb(0 0 0 / 2%) 0%, rgb(27 30 20 / 20%) 10%, rgb(19 21 19 / 2%) 50%);
  background: linear-gradient(180deg,rgb(0 0 0 / 2%) 0%, rgb(27 30 20 / 20%) 10%, rgb(19 21 19 / 2%) 50%); */
}
.ps-link-container .animation-container1 {
  display: inline-block;
  width: 24%;
}
.ps-link-container a {
  position: relative;
  display: inline-block;
  color: #fff;
  text-decoration: none;
  font-size: 1.1rem;
  transition: all .5s ease-in;
}
.ps-link-container div:first-child {
  animation: 1s ease-out slideInBottom1 both;
  animation-iteration-count:1;
  animation-delay: 1s;
}
.ps-link-container div:nth-child(2) {
  animation: 1s ease-out slideInBottom1 both;
  animation-iteration-count:1;
  animation-delay: 1.5s;
}
.ps-link-container div:nth-child(3) {
  animation: 1s ease-out slideInBottom1 both;
  animation-iteration-count:1;
  animation-delay: 2s;
}
.ps-link-container a:after {
    content: "";
    width: calc(6rem);
    height:3px;
    background: #29e7ad;
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
}
.ps-link-container a:hover {
  transform: scale(1.06);
  color: #29e7ad;
}
.ps-nav-container{
    position:fixed;
    top:50%;
    right:20px;
    transform:translateY(-50%);
}
.ps-nav-square{
  width:20px;
  height:30px;
  padding:3px 0px;
  margin:auto;
  box-sizing: border-box;
}
.ps-nav-square span{
  display:block;
  width:20px;
  height:20px;
  border:1px solid #fff;
  /*     border-radius:50%; */
  box-sizing: border-box;
  background:#ffffff9c;
  opacity:0.61;
  transition:all 200ms ease;
  margin: auto;
}
.ps-nav-square span:hover{
  /*     border:1px solid #333; */
  opacity:0.8;
  cursor:pointer;
  box-sizing: border-box;
}
.ps-nav-square.square-active span{
  border:1px solid #fff;
  background:#ffffff;
  opacity:.9;
  box-sizing: border-box;
  cursor:none;
}
