@charset "UTF-8";
/* CSS Document */

 @import url(https://fonts.googleapis.com/css?family=Bitter);
    body {
      margin: 0;
      font-family: 'Bitter', serif;
      text-align: center;
    }

.photo-show{
	display: block;
	max-width: 100%;
	height: 100%;
}


    .holder,
    .first,
    .second,
    .third {
      height: 100%;
      width: 100vw;
    }


    .first,
    .second,
    .third {
      position: absolute;
    }
    .second,
    .third {
      opacity: 0;
    }
    .holder {
      height: 100vh;
      position: relative;
      z-index: 1;
    }
    .first {
      animation: first 10s infinite;
      background: linear-gradient(#113487, #60e08c);
      z-index: 10;
    }
      @keyframes first {
        0% {opacity: 1.0;}
        10% {opacity: 0.3;}
        20% {opacity: 0.6;}
        30% {opacity: 0.4;}
        40% {opacity: 0.2;}
        50% {opacity: 0.1;}
        60% {opacity: 0.2;}
        70% {opacity: 0.4;}
        80% {opacity: 0.6;}
        90% {opacity: 0.8;}
        100% {opacity: 0.7;}
      }

    .second {
      animation: second 10s infinite; animation-delay: 2s;
      background: linear-gradient(-90deg, #DB74DC, #319B6F);
      z-index: 20;
    }
      @keyframes second {
        0% {opacity: 0;}
        10% {opacity: 0.2;}
        20% {opacity: 0.4;}
        30% {opacity: 0.6;}
        40% {opacity: 0.6;}
        50% {opacity: 0.7;}
        60% {opacity: 0.8;}
        70% {opacity: 0.6;}
        80% {opacity: 0.4;}
        90% {opacity: 0.2;}
        100% {opacity: 0;}
      }

    .third {
      animation: third 10s infinite;
      animation-delay: 8s;
      background: linear-gradient(#08155c, #ff75c6);
      z-index: 30;
    }
      @keyframes third {
        0% {opacity: 0;}
        10% {opacity: 0.2;}
        20% {opacity: 0.4;}
        30% {opacity: 0.6;}
        40% {opacity: 0.6;}
        50% {opacity: 0.5;}
        60% {opacity: 0.6;}
        70% {opacity: 0.6;}
        80% {opacity: 0.4;}
        90% {opacity: 0.2;}
        100% {opacity: 0;}
      }

 

.logo{
	animation: fadeIn 2s ease 0s 1 normal;
	 margin-top: 18%;
      position: absolute;
      width: 100%;
      z-index: 1000;
}
    h1 {
	  color: azure;
      font-size: 80px;
      font-weight: 400;
    }
    .modern {
	  margin-top: 5%;
	  color: azure;
      font-size: 25px;
    }
.logo-text{
	font-size: 3rem;
}