/* General */
body {
    margin: 0;
    background: #fff;
}


.row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}


#divider {
    height: 200px;
    background-color: white;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}


/* Typography */

body { 
  font-family: "Open Sans", sans-serif;
  color: #808080; 
  margin: 0; 
  font-size: 1em; 
  font-weight: 300;
}

h1 { 
  font-family: "Oxygen", "Open Sans", sans-serif;
  color: #21252b;
  font-weight: 500;
    font-size: 4em; 
    margin-bottom: 1em;

} 


p { 
  font-family: "Open Sans", sans-serif; 
  font-size: 1.2em; 
  font-weight: 300;
  color: #808080;
}



/* Nav */
.navbar {
  background-color: #fffffb;
  min-width: 100%; 
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
  margin-bottom: 2em;
  opacity: 0.96;
  z-index: 9999;
}

.logo {
  display: inline-block;
  height: 50px;
}

.wrapper {
  margin: 0 auto;
  max-width: 100%;
  padding: 0 2%;
}

nav ul{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
    
nav a {
      color: #21252b;
      text-decoration: none;
}

nav a:hover {
    color: #e63347;
    text-decoration: none;        
}

  
nav li  {
    display: inline-block;
    width: 120px;
    text-align: center;
  }

nav a:hover [class^="fa"] { 
    color: #e63347;
    -webkit-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out; 
}
  
#menu-toggle {display: none;}
  
.label-toggle {display: none;}
  
.wrapper {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }


.to-top {
    text-align: right;
}
  
  @media screen and (max-width: 768px) {
    nav ul {
      background-color: #fffffb;
      display: block;
      height: 0;
      list-style-type: none;
      opacity: 0;
      text-align: left;
      -webkit-transition: all 1s ease;
      transition: all 1s ease;
      width: 100%;
      visibility: hidden;
      -webkit-box-pack: end;
      -ms-flex-pack: end;
      justify-content: flex-end;
      padding: 0;
    }
    
    nav li {
      border-bottom: 1px solid #efefef;
      color: #21252b;
      display: block;
      font-size: 1em;
      width: 100%;
      padding-top: 1em;
      padding-bottom: 1em;
    }
      
    nav li:hover {
        color: #e63347;
        -webkit-transition: all 0.5s ease-out;
      transition: all 0.5s ease-out;
    }
      
    nav span {
      padding-left: 1em;
    }
      
    .to-top {
      text-align: center;
    }
      
    .logo {
      margin-left: 0.6em;
    }     
    
  
    #menu-toggle:checked ~ ul {
      opacity: 1;
      height: 100%;
      visibility: visible;
    }
    
    .label-toggle {
      background: -webkit-linear-gradient(top, #21252b 0%, #21252b 20%, transparent 20%, transparent 40%, #21252b 40%, #21252b 60%, transparent 60%, transparent 80%, #21252b 80%, #21252b 100%);
      background: linear-gradient(to bottom, #21252b 0%, #21252b 20%, transparent 20%, transparent 40%, #21252b 40%, #21252b 60%, transparent 60%, transparent 80%, #21252b 80%, #21252b 100%);
      cursor: pointer;
      display: block;
      float: right;
      height: 20px;
      margin-top: 1.3em;
      margin-right: 1em;
      width: 20px;
    }
    
    .wrapper {display: block;}

}

/* Services */

#services {
    height: 800px;
    padding-bottom: 80px;
}

.centered {
    margin: 0 auto;
    padding: 0 1em;
}

/* About */

#about {
    height: 800px;
    padding-bottom: 80px;
}



/*Testimonials*/

#testimonials {
    height: 800px;
    padding-bottom: 80px;
}


/* Contact */

#contact {
    height: 1000px;
    padding-bottom: 80px;
}


/* Fixes */

.padd {
    padding-top: 160px;
}

.expand {
    padding-top: 380px;
}

.accordion-group li:nth-child(4) .accordion-overlay {
  background-color: #333;
  opacity: 0.8;
}
.accordion-group li:nth-child(4).out .accordion-overlay {
  background-color: #333;
  opacity: 0;
}
.accordion-group li:nth-child(3) .accordion-overlay {
  background-color: #9d9d9d;
  opacity: 0.8;
}
.accordion-group li:nth-child(3).out .accordion-overlay {
  background-color: #9d9d9d;
  opacity: 0;
}
.accordion-group li:nth-child(2) .accordion-overlay {
  background-color: #ca9964;
  opacity: 0.8;
}
.accordion-group li:nth-child(2).out .accordion-overlay {
  background-color: #ca9964;
  opacity: 0;
}
.accordion-group li:nth-child(1) .accordion-overlay {
  background-color: #a87339;
  opacity: 0.8;
}
.accordion-group li:nth-child(1).out .accordion-overlay {
  background-color: #a87339;
  opacity: 0;
}
a {
  color: inherit;
}
a.active,
a:active,
a:focus,
a:hover {
  color: inherit;
  text-decoration: none;
}
.red {
  color: #ca9964;
}
.orange {
  color: #e06014;
}
.blue {
  color: #5aaed6;
}
.beige {
  color: #d6ccad;
}

.mg {
  margin: 7rem 0 4rem 0;
}
.big {
  color: #333;
  font-size: 4.5rem;
  font-weight: 700;
  margin: 1rem;
}
.head {
  color: #ca9964;
  font-size: 4.8rem;
  font-weight: 200;
  margin: 1rem;
}
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}
.site-outer {
  overflow: hidden;
}
.site-outer .navbar {
  background-color: #fff;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}
.site-outer .navbar.slide-right {
  -webkit-transform: translate3d(250px, 0, 0);
  -moz-transform: translate3d(250px, 0, 0);
  transform: translate3d(250px, 0, 0);
}
.site-outer .site-inner {
  position: relative;
  margin: 0;
  padding: 0;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.site-outer .site-inner.slide-right {
  -webkit-transform: translate3d(250px, 0, 0);
  -moz-transform: translate3d(250px, 0, 0);
  transform: translate3d(250px, 0, 0);
}
.container-menu {
  margin: 0 auto;
}
.container-menu:before,
.container-menu:after {
  content: "";
  display: block;
  zoom: 1;
}
.container-menu:after {
  clear: both;
}
.container-menu .menu {
  float: left;
  padding: 3rem 1.5rem;
  cursor: pointer;
  position: relative;
  display: inline-block;
  width: 8rem;
}
.container-menu .menu div {
  width: 5rem;
  height: 0.4rem;
  background-color: #333;
  margin-bottom: 0.4rem;
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  transition: all 500ms ease;
  position: absolute;
}
.container-menu .menu div:nth-child(1) {
  left: 1.5rem;
  top: 2rem;
}
.container-menu .menu div:nth-child(2) {
  left: 1.5rem;
  top: 2.8rem;
}
.container-menu .menu div:nth-child(2):after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 5rem;
  height: 0.4rem;
  background-color: #333;
  -webkit-transition: all 350ms ease;
  -moz-transition: all 350ms ease;
  transition: all 350ms ease;
}
.container-menu .menu div:nth-child(3) {
  right: 1.5rem;
  top: 3.6rem;
}
.container-menu .menu.active div:nth-child(1),
.container-menu .menu.active div:nth-child(3) {
  width: 0;
}
.container-menu .menu.active div:nth-child(2) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.container-menu .menu.active div:nth-child(2):after {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transform: rotate(90deg);
}
.container-menu .logotype {
  cursor: pointer;
  float: left;
}
.container-menu .logotype div {
  margin: 0;
}
.container-menu .checkout {
  float: right;
  padding: 0.8rem 1.2rem 0;
}
.container-menu .checkout h3 {
  font-size: 1.8rem;
  font-weight: 300;
  text-transform: uppercase;
}
.accordion-group {
  overflow: hidden;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  width: 100%;
  height: 700px;
  display: flex;
  align-items: center;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  transition: all 300ms ease;
}
.accordion-group li {
  cursor: pointer;
  position: relative;
  display: flex;
  overflow: hidden;
  margin: 0;
  padding: 1.6em;
  list-style: none;
  width: 16.66666667%;
  height: inherit;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}
.accordion-group li h3 {
  position: relative;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.15rem;
  padding: 0;
  font-weight: 300;
  margin: 6.5rem 0 0;
}
.accordion-group li .accordion-overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}
.accordion-group li section {
  display: flex;
  align-items: center;
  width: 75%;
  height: 100%;
}
.accordion-group li section.big-section {
  width: 100%;
}
.accordion-group li section article {
  display: table-cell;
  vertical-align: middle;
  padding: 4rem;
  position: relative;
  right: -200%;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}
.accordion-group li section article p {
  background-color: rgba(255, 255, 255, 0.8);
  padding: 1.6rem;
  color: #333;
  font-size: 1.6rem;
  letter-spacing: 0.15rem;
}
.accordion-group li section article p:before,
.accordion-group li section article p:after {
  content: "";
  display: block;
  height: 1px;
}
.accordion-group li.out {
  width: 50%;
}
.accordion-group li.out section article {
  right: 0;
}
.navigation {
  background-color: #fff;
  overflow: auto;
  margin: 0;
  padding: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 250px;
  height: 100%;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  -webkit-transform: translate3d(-250px, 0, 0);
  -moz-transform: translate3d(-250px, 0, 0);
  transform: translate3d(-250px, 0, 0);
}
.navigation:before,
.navigation:after {
  content: "";
  display: block;
  zoom: 1;
}
.navigation:after {
  clear: both;
}
.navigation.slide-right {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.navigation-login {
  padding: 2rem;
  line-height: 2;
  border: none;
  width: 100%;
  border-radius: 0;
  font-size: 1.8rem;
  background-color: #ca9964;
  font-weight: 100;
  color: #fff;
  text-transform: uppercase;
}
.navigation-search {
  padding: 2rem 2rem 0;
}
.navigation-content {
  padding: 0 2rem;
}
.navigation-content h3 {
  color: #ca9964;
  text-transform: uppercase;
  letter-spacing: 0.15rem;
  padding: 0;
  font-weight: 300;
}
.navigation-content .navigation-menu {
  list-style: none;
  padding: 0;
}
.navigation-content .navigation-menu li {
  display: block;
  padding: 0.8rem 0;
  margin: 1rem 0;
}
.navigation-content .navigation-menu li a {
  color: #333;
  text-transform: uppercase;
  font-size: 1.3rem;
}
.navigation-content .navigation-menu li a.active,
.navigation-content .navigation-menu li a:active,
.navigation-content .navigation-menu li a:hover,
.navigation-content .navigation-menu li a:focus {
  color: #ca9964;
  text-decoration: none;
}
.to-checkout {
  position: fixed;
  top: 0;
  right: 0;
  width: 450px;
  height: 100%;
  background-color: #ca9964;
  z-index: 10001;
  -webkit-transform: translate3d(450px, 0, 0);
  -moz-transform: translate3d(450px, 0, 0);
  transform: translate3d(450px, 0, 0);
}
.to-checkout-inner {
  padding: 2.5rem;
  color: #fff;
}
.to-checkout-list {
  padding: 0;
  margin: 0;
  display: block;
  list-style: none;
}
.to-checkout-list li a {
  color: #5aaed6;
}
#search {
  height: 35px;
  width: 100%;
  position: relative;
}
@media (max-width: 767px) {
  #search {
    width: auto;
  }
}
#search input {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 35px;
  height: 35px;
  border: 1px solid #333;
  border-radius: 100%;
  background: transparent;
  color: #ca9964;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  -webkit-transition: width 100ms ease-in-out;
  -moz-transition: width 100ms ease-in-out;
  transition: width 100ms ease-in-out;
}
#search input::-webkit-input-placeholder {
  color: transparent;
}
#search input:-moz-placeholder {
  color: transparent;
}
#search input::-moz-placeholder {
  color: transparent;
}
#search input:-ms-input-placeholder {
  color: transparent;
}
#search .search {
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  height: 35px;
  width: 35px;
  padding: 0;
  border-radius: 100%;
  outline: none;
  border: 0;
  color: #333;
  cursor: pointer;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
#search .search:before,
#search .search:after {
  content: "";
  position: absolute;
  width: 1rem;
  height: 0.1rem;
  background-color: #333;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 3.3rem;
  left: 3rem;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
#search .close {
  -webkit-transition: all 400ms ease-in-out;
  -moz-transition: all 400ms ease-in-out;
  transition: all 400ms ease-in-out;
  right: 0;
  left: inherit;
}
#search .close:before {
  content: "";
  position: absolute;
  top: 1.7rem;
  left: 1.5rem;
  width: 27px;
  height: 4px;
  margin-top: -1px;
  margin-left: -13px;
  background-color: #ca9964;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
#search .close:after {
  content: "";
  position: absolute;
  top: 1.7rem;
  left: 1.5rem;
  width: 27px;
  height: 4px;
  margin-top: -1px;
  margin-left: -13px;
  background-color: #ca9964;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}
#search .square {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0 4rem 0 1rem;
  width: 100%;
  height: 35px;
  border: 1px solid #333;
  border-radius: 0;
  color: #333;
  background-color: transparent;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
#search .square::-webkit-input-placeholder {
  color: #ca9964;
}
#search .square:-moz-placeholder {
  color: #ca9964;
}
#search .square::-moz-placeholder {
  color: #ca9964;
}
#search .square:-ms-input-placeholder {
  color: #ca9964;
}
#search .square.active #search .square:hover,
#search .square:focus,
#search .square:active {
  border-color: #ca9964;
}
.sm-box {
  padding: 1.5rem;
  height: 18rem;
  color: #fff;
  background-color: #fff;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  position: relative;
  overflow: hidden;
  display: table;
  box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.35);
}
.sm-box-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: none;
  z-index: 998;
  -webkit-transition: all 250ms cubic-bezier(0.17, 0.67, 0.83, 0.67);
  -moz-transition: all 250ms cubic-bezier(0.17, 0.67, 0.83, 0.67);
  transition: all 250ms cubic-bezier(0.17, 0.67, 0.83, 0.67);
}
.sm-box-basket {
  display: table-cell;
  position: relative;
  margin: 0 auto;
  vertical-align: middle;
  line-height: 135px;
  z-index: 999;
  -webkit-transition: all 250ms ease-in-out;
  -moz-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
  -webkit-transform: translate3d(0, -100%, 0);
  -moz-transform: translate3d(0, -100%, 0);
  transform: translate3d(0, -100%, 0);
}
.sm-box-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4rem;
  width: 100%;
  color: #ca9964;
  z-index: 999;
  padding: 1rem 2rem;
  background-color: #fff;
  line-height: 1.5;
  -webkit-transition: all 250ms cubic-bezier(0.17, 0.67, 0.83, 0.67);
  -moz-transition: all 250ms cubic-bezier(0.17, 0.67, 0.83, 0.67);
  transition: all 250ms cubic-bezier(0.17, 0.67, 0.83, 0.67);
  -webkit-transform: translate3d(0, 100%, 0);
  -moz-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}
.sm-box.active,
.sm-box:hover {
  box-shadow: 0 0 6px 4px rgba(0, 0, 0, 0.35);
}
.sm-box.active .sm-box-content,
.sm-box:hover .sm-box-content {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.sm-box.active .sm-box-content > i,
.sm-box:hover .sm-box-content > i {
  -webkit-animation: rotate 500ms ease;
  -moz-animation: rotate 500ms ease;
  animation: rotate 500ms ease;
}
.sm-box.active .sm-box-basket,
.sm-box:hover .sm-box-basket {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.sm-box.active .sm-box-overlay,
.sm-box:hover .sm-box-overlay {
  background-color: rgba(0, 0, 0, 0.6);
}
.product-box h2 {
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  transition: all 250ms ease;
}
.product-box:hover h2 {
  color: #ca9964;
}
.button {
  outline: none;
  border: 2px solid #fff;
  padding: 1.2rem 2rem;
  margin-bottom: 1rem;
  width: 100%;
  white-space: nowrap;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 400;
  vertical-align: middle;
  line-height: 18px;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  text-decoration: none;
  color: #ca9964;
  background-color: #fff;
  border-radius: 2rem;
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  transition: all 250ms ease;
  display: inline-block;
}
.button.active,
.button:active,
.button:focus,
.button:hover {
  text-decoration: none;
  color: #fff;
  outline: none;
}
.button-red {
  background-color: #ca9964;
  color: #fff;
  border-color: #ca9964;
}
.button-red.active,
.button-red:active,
.button-red:focus,
.button-red:hover {
  background-color: #d0a677;
  border-color: #d0a677;
}
.button-transparent {
  background-color: #fff;
  color: #ca9964;
  border-color: #ca9964;
}
.button-transparent.active,
.button-transparent:active,
.button-transparent:focus,
.button-transparent:hover {
  background-color: #fff;
  color: #ca9964;
  border-color: #ca9964;
}
.modal-content {
  border-radius: 0px;
}
.modal-header {
  background-color: #ca9964;
  color: #fff;
}
.badge-red {
  background-color: #ca9964;
  color: #fff;
}
.badge-white {
  background-color: #fff;
  color: #ca9964;
}
.input-group-addon-holder {
  position: relative;
}
.input-group-addon-holder .number-icon {
  position: absolute;
  top: 16px;
  right: 15px;
}
.input-group-addon-holder .number-icon > i {
  display: none;
  color: #5aaed6;
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  transition: all 250ms ease;
}
.input-group-addon-holder .cvv-icon {
  position: absolute;
  top: 66px;
  right: 15px;
}
.input-group-addon-holder .cvv-icon > i {
  display: none;
  color: #5aaed6;
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  transition: all 250ms ease;
}
.input-group-addon {
  color: #333;
  border-color: #333;
  background-color: #fff;
  border-radius: 0;
}
.select-hidden {
  display: none;
  visibility: hidden;
  padding-right: 1rem;
}
.select {
  cursor: pointer;
  display: inline-block;
  position: relative;
  font-size: 16px;
  color: #333;
  width: 100%;
  height: 50px;
}
.form-control {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  border: 1px solid #333;
  border-radius: 0;
  background: transparent;
  color: #333;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.form-control::-webkit-input-placeholder {
  color: #333;
}
.form-control:-moz-placeholder {
  color: #333;
}
.form-control::-moz-placeholder {
  color: #333;
}
.form-control:-ms-input-placeholder {
  color: #333;
}
.form-control-sibling {
  border-top: 1px solid transparent;
}
.form-control.active .form-control:hover,
.form-control:focus,
.form-control:active {
  border-color: #ca9964;
}
.select-styled {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  border: 1px solid #333;
  border-radius: 0;
  background: transparent;
  padding: 1.3rem;
  color: #333;
  font-size: 16px;
  font-weight: 400;
  outline: none;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}
.select-styled:hover,
.select-styled.active {
  border-color: #ca9964;
}
.select-options {
  list-style: none;
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 9999;
  margin: 0;
  padding: 0;
  background-color: #fff;
  border-left: 1px solid #ca9964;
  border-right: 1px solid #ca9964;
  border-bottom: 1px solid #ca9964;
}
.select-options li {
  margin: 0;
  height: 50px;
  padding: 1.3rem;
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  transition: all 250ms ease;
}
.select-options li:first-child {
  display: none;
}
.select-options li:hover {
  background-color: #d7b28a;
  color: #fff;
}
.footer {
  background-color: #333;
  padding: 2rem 0;
}
.footer-inner h3 {
  color: #595959;
}
.footer-inner .footer-list {
  padding: 0;
  margin: 0;
  display: block;
}
.footer-inner .footer-list li {
  display: block;
  color: #fff;
  margin-bottom: 0.8rem;
}
.footer-inner .footer-list li a:hover {
  text-decoration: underline;
}
.footer-inner .footer-list-inline {
  display: block;
}
.footer-inner .footer-list-inline li {
  display: inline-block;
  margin-right: 1.8rem;
}
@media (max-width: 767px) {
  .accordion-group {
    height: 360px;
  }
  .accordion-group li {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .accordion-group li.out h3 {
    opacity: 0;
  }
  .accordion-group li h3 {
    opacity: 1;
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg);
    width: 2.5rem;
    padding: 0;
    margin: 10rem 0;
  }
}
@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


.deneme  {
  font-weight: 500;
}

.deneme {
  box-sizing: border-box;
}

.deneme img {
  max-width: 100%;
}

.deneme a {
  text-decoration: none;
}

.deneme .icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
}

.deneme .wrapper {
  width: 100%;
  height: 100px;
  min-height: 750px;
  background-color: white;
  background-size: cover;
  position: relative;
  overflow: hidden;
  display: flex;
}
@media screen and (max-width: 992px) {
  .deneme .wrapper {
    height: auto;
    min-height: 100vh;
  }
}

.deneme .content {
  height: 600px;
  margin: auto;
  width: 100%;
  max-width: 1050px;
  display: flex;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 1200px) {
  .deneme .content {
    max-width: 920px;
  }
}
@media screen and (max-width: 992px) {
  .deneme .content {
    max-width: 920px;
    margin-top: 100px;
    height: auto;
    min-height: 100vh;
  }
}
@media screen and (max-width: 767px) {
  .deneme .content {
    margin-top: 20px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .content {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}

.deneme .bg-shape {
  height: 100%;
  background-image: linear-gradient(-45deg, #cc3843 0%, #cb193f 100%);
  box-shadow: 0px 30px 139px 0px rgba(10, 22, 31, 0.26);
  border-radius: 30px;
  padding: 45px 40px;
  width: 50%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 1200px) {
  .deneme .bg-shape {
    width: 45%;
  }
}
@media screen and (max-width: 992px) {
  .deneme .bg-shape {
    width: 90%;
    height: 290px;
    align-items: flex-start;
    padding: 50px;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 767px) {
  .deneme .bg-shape {
    padding: 30px;
    width: 95%;
    border-radius: 20px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .bg-shape {
    height: 200px;
    padding: 30px;
  }
}
.deneme .bg-shape img {
  object-fit: contain;
  width: 510px;
  display: block;
  object-position: left center;
  opacity: 0.2;
  transform: rotate(-90deg) translateY(-50%);
  max-width: inherit;
  left: 10px;
  position: absolute;
}
@media screen and (max-width: 1200px) {
  .deneme .bg-shape img {
    width: 430px;
    left: 10px;
  }
}
@media screen and (max-width: 992px) {
  .deneme .bg-shape img {
    transform: none;
    width: 100%;
    position: relative;
    left: auto;
    margin-left: auto;
    margin-right: auto;
    object-fit: contain;
    height: 100%;
    object-position: top center;
  }
}

.deneme .next, .prev {
  z-index: 22;
  display: inline-flex;
  border: none;
  width: 61px;
  height: 61px;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  font-size: 25px;
  position: absolute;
  top: 50%;
  outline: none;
  cursor: pointer;
}
.deneme .next.disabled, .prev.disabled {
  cursor: not-allowed;
}
.deneme .next:focus, .prev:focus {
  outline: none;
}
@media screen and (max-width: 992px) {
  .deneme .next, .prev {
    top: 170px;
  }
}

.deneme .prev {
  left: -30%;
  transform: translate(-100%, -50%);
}
@media screen and (max-width: 1200px) {
  .deneme .prev {
    left: -21%;
  }
}
@media screen and (max-width: 992px) {
  .deneme .prev {
    left: 0;
    transform: translate(-50%, -50%);
  }
}
@media screen and (max-width: 576px) {
  .deneme .prev {
    transform: translate(20%, -50%);
  }
}

.deneme .next {
  right: 0;
  transform: translate(50%, -50%);
}
@media screen and (max-width: 576px) {
  .deneme .next {
    transform: translate(-20%, -50%);
  }
}

.deneme .product-slider {
  width: 75%;
  height: 85%;
  border-radius: 30px;
  box-shadow: 0 28px 79px 0 rgba(10, 22, 31, 0.35);
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
@media screen and (max-width: 1200px) {
  .deneme .product-slider {
    width: 80%;
  }
}
@media screen and (max-width: 992px) {
  .deneme .product-slider {
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
    height: auto;
    position: relative;
    top: 0;
    margin-top: 170px;
    margin-bottom: 100px;
  }
  .deneme .product-slider br {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .deneme .product-slider {
    border-radius: 20px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .product-slider {
    width: 85%;
    margin-top: 130px;
  }
}
.deneme .product-slider__wrp {
  height: 100%;
}
.deneme .product-slider__item {
  position: relative;
  height: 100%;
  width: 100%;
}
@media screen and (max-width: 992px) {
  .deneme .product-slider__item {
    height: auto;
  }
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > * {
  opacity: 1;
  transform: none;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(1) {
  transition-delay: 0s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(2) {
  transition-delay: 0.2s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(3) {
  transition-delay: 0.4s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(4) {
  transition-delay: 0.6s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(5) {
  transition-delay: 0.8s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(6) {
  transition-delay: 1s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(7) {
  transition-delay: 1.2s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(8) {
  transition-delay: 1.4s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(9) {
  transition-delay: 1.6s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(10) {
  transition-delay: 1.8s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(11) {
  transition-delay: 2s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(12) {
  transition-delay: 2.2s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(13) {
  transition-delay: 2.4s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(14) {
  transition-delay: 2.6s;
}
.deneme .product-slider__item.swiper-slide-active .product-slider__content > *:nth-child(15) {
  transition-delay: 2.8s;
}
.deneme .product-slider__item.swiper-slide-active circle {
  animation: progress 1s ease-out forwards;
  animation-delay: 0.5s;
  opacity: 0.75;
}
.deneme .product-slider__card {
  height: 100%;
  display: flex;
  align-items: center;
  width: 100%;
  transition: all 0.5s;
  overflow: hidden;
  position: relative;
  border-radius: 30px;
}
@media screen and (max-width: 992px) {
  .deneme .product-slider__card {
    align-items: flex-start;
  }
}
@media screen and (max-width: 767px) {
  .deneme .product-slider__card {
    border-radius: 20px;
  }
}
.deneme .product-slider__cover {
  border-radius: 30px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
@media screen and (max-width: 767px) {
  .deneme .product-slider__cover {
    border-radius: 20px;
  }
}
.deneme .product-slider__content {
  color: #fff;
  padding-top: 1px;
  position: relative;
  z-index: 2;
  width: 100%;
  padding-left: 250px;
  padding-right: 80px;
}
@media screen and (max-width: 1200px) {
  .deneme .product-slider__content {
    padding-left: 220px;
  }
}
@media screen and (max-width: 992px) {
  .deneme .product-slider__content {
    padding: 20px 60px 100px;
    padding-top: 280px;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .deneme .product-slider__content {
    padding: 20px 30px 50px;
    padding-top: 300px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .product-slider__content {
    padding-top: 220px;
    padding-left: 15px;
    padding-right: 15px;
  }
}
.deneme .product-slider__title {
  margin: 0;
  margin-bottom: 10px;
  font-weight: 900;
  font-size: 41px;
  line-height: 1.2em;
  letter-spacing: 2px;
  opacity: 0;
  transform: translateY(55px);
  transition: all 0.5s;
}
@media screen and (max-width: 1200px) {
  .deneme .product-slider__title {
    font-size: 34px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .product-slider__title {
    font-size: 24px;
  }
}
.deneme .product-slider__price {
  display: block;
  font-size: 42px;
  opacity: 0;
  transform: translateY(55px);
  transition: all 0.5s;
}
@media screen and (max-width: 1200px) {
  .deneme .product-slider__price {
    font-size: 36px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .product-slider__price {
    font-size: 30px;
  }
}
.deneme .product-slider__price sup {
  top: -20px;
  font-size: 65%;
}
.deneme .product-slider__cart {
  box-shadow: 0 7px 99px 0 rgba(204, 51, 66, 0.6);
  background-image: linear-gradient(-45deg, #cc3843 0%, #cb193f 100%);
  border: none;
  color: #fff;
  padding: 10px 30px;
  border-radius: 50px;
  min-height: 50px;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 2px;
  margin-right: 40px;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .deneme .product-slider__cart {
    margin-right: 30px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .product-slider__cart {
    width: 100%;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 50px;
  }
}
.deneme .product-slider__fav {
  color: #888e94;
  background: none;
  border: none;
  position: relative;
  padding-left: 25px;
  outline: none;
  cursor: pointer;
}
.deneme .product-slider__fav:focus {
  outline: none;
}
.deneme .product-slider__fav .heart {
  display: block;
  position: absolute;
  left: 0;
  transform: translate(-50%, -50%) scale(0.7);
  top: 50%;
  pointer-events: none;
  width: 100px;
  height: 100px;
  background: url("https://res.cloudinary.com/muhammederdem/image/upload/v1536405215/starwars/heart.png") no-repeat;
  background-position: 0 0;
  cursor: pointer;
  transition: background-position 1s steps(28);
  transition-duration: 0s;
}
.deneme .product-slider__fav .heart.is-active {
  transition-duration: 1s;
  background-position: -2800px 0;
}
.deneme .product-slider__bottom {
  margin-top: 20px;
  opacity: 0;
  transform: translateY(55px);
  transition: all 0.5s;
}
.deneme .product-ctr {
  display: flex;
  align-items: center;
  min-height: 150px;
  margin-top: 40px;
  opacity: 0;
  transform: translateY(55px);
  transition: all 0.5s;
}
@media screen and (max-width: 992px) {
  .deneme .product-ctr {
    justify-content: center;
  }
}
.deneme .product-ctr .hr-vertical {
  width: 1px;
  background: #9fa3a7;
  align-self: stretch;
  margin: 0 35px;
  flex-shrink: 0;
  opacity: 0.5;
}
@media screen and (max-width: 767px) {
  .deneme .product-ctr {
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 40px;
  }
  .deneme .product-ctr .hr-vertical {
    width: 100%;
    margin: 35px 0;
    height: 1px;
  }
}
@media screen and (max-width: 767px) {
  .deneme .product-labels {
    width: 100%;
  }
}
.deneme .product-labels__checkbox {
  display: none;
}
.deneme .product-labels__checkbox:checked + .product-labels__txt {
  border-color: #cc3743;
  padding: 10px 13px;
}
.deneme .product-labels__title {
  font-weight: 700;
  letter-spacing: 3px;
  font-size: 16px;
  margin-bottom: 10px;
}
.deneme .product-labels__group {
  display: flex;
  margin-bottom: 15px;
}
@media screen and (max-width: 992px) {
  .deneme .product-labels__group {
    justify-content: center;
  }
}
.deneme .product-labels__group:last-child {
  margin-bottom: 0;
}
.deneme .product-labels__item {
  margin: 5px;
  cursor: pointer;
}
.deneme .product-labels__item:first-child {
  margin-left: 0;
}
.deneme .product-labels__txt {
  display: block;
  border: 2px solid transparent;
  font-size: 14px;
  padding: 10px 20px;
  padding-left: 0;
  border-radius: 50px;
  transition: all 0.3s;
  letter-spacing: 2px;
}
@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}
.deneme .product-inf {
  text-align: center;
}
@media screen and (max-width: 767px) {
  .deneme .product-inf {
    width: 100%;
  }
}
.deneme .product-inf__percent {
  font-weight: 700;
  font-size: 22px;
  letter-spacing: 1px;
  margin-bottom: 12px;
  position: relative;
}
.deneme .product-inf__percent circle {
  transform: rotate(180deg) scaleY(-1);
  transform-origin: 50%;
}
.deneme .product-inf__percent-txt {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.deneme .product-inf__title {
  font-weight: 700;
  letter-spacing: 2px;
  font-size: 18px;
}
.deneme .product-img {
  position: absolute;
  z-index: 2;
  width: 500px;
  left: 25%;
  transform: translateX(-45%);
  max-height: 500px;
  height: 100%;
  pointer-events: none;
}
@media screen and (max-width: 1200px) {
  .deneme .product-img {
    width: 430px;
    left: 20%;
  }
}
@media screen and (max-width: 992px) {
  .deneme .product-img {
    width: 430px;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    height: 350px;
  }
}
@media screen and (max-width: 767px) {
  .deneme .product-img {
    width: 100%;
    max-width: 400px;
    top: 30px;
    height: 390px;
  }
}
@media screen and (max-width: 576px) {
  .deneme .product-img {
    max-width: 300px;
    height: 300px;
  }
}
.deneme .product-img__item {
  display: flex;
  align-items: center;
  position: absolute;
  pointer-events: none;
  user-select: none;
  top: 50%;
  right: 0;
  transform: translateY(-50%) translateX(-130px);
  opacity: 0;
  transition: all 0.3s;
}
.deneme .product-img__item.active {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
  transition-delay: 0.3s;
}
.deneme .product-img__item img {
  object-fit: contain;
  object-position: center right;
}

.deneme .social {
  position: absolute;
  bottom: 10px;
  right: 0;
  width: 100%;
  display: flex;
  padding: 20px 55px;
  justify-content: space-between;
}
@media screen and (max-width: 576px) {
  .deneme .social {
    flex-direction: column;
    bottom: 0;
  }
}
.deneme .social__item {
  color: rgba(255, 255, 255, 0.75);
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1em;
  display: flex;
  align-items: center;
  transition: all 0.3s;
}
.deneme .social__item:hover {
  color: #fff;
}
@media screen and (max-width: 576px) {
  .deneme .social__item {
    margin-bottom: 10px;
  }
}
.deneme .social__img {
  width: 24px;
  margin-right: 15px;
}

#changeinput {
  position: absolute;
  bottom: 10px;
  left: 50%;
  width: 8em;
  max-width: 80%;
  background: none;
  border: none;
  outline: none;
  border-bottom: 2px solid #fff;
  color: #fff;
  font-size: 3em;
  text-align: center;
  z-index: 999;
  opacity: 0.25;
  transform: translateX(-50%);
  transition: opacity 0.3s;
}
#changeinput:hover, #changeinput:focus {
  opacity: 1;
}

.klips {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}


.holderaa {
  position: relative;
  background-color: red !important;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
}
.new-year {
  color: #fff;
  background: #1a2a6c;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to left, #fdbb2d, #b21f1f, #1a2a6c);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to left, #fdbb2d, #b21f1f, #1a2a6c); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  font-size: 20px;

  width: 100%;
  
  text-align: center;
}
.year {
  position: relative;
  left: 50%;
  display: table;
  font-size: 6em;
  transform: translateX(-50%);
}
.year2 {
  transform: translateX(-50%) rotateX(180deg);
  opacity: 0.2;
}
.digit {
  display: inline-block;
  margin: 0px;
  padding: 0px;
  position: relative;
  opacity: 0;
}
.controls {
  margin-top: 30px;
}
.control {
  display: inline-block;
  padding-left: 20px;
  padding-right: 20px;
  font-size: 0.8em;
  border-left: 1px solid #fff;
  opacity: 0;
  position: relative;
  top: 100px;
}
.control:first-child {
  border-left: none;
}
.triangles {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.triangle {
  width: 0; 
  height: 0; 
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #fff;
  position: absolute;
  opacity: 0;
}

.sasa {
  width: 100%;
  height: 100%;
  background: #000;
  overflow: hidden;
}

.fade {
  position: relative;
  width: 100%;
  min-height: 20vh;
  top: -25px;
  background-image: linear-gradient(0deg, transparent, black 75%);
  z-index: 1;
}

.star-wars {
  display: flex;
  justify-content: center;
  position: relative;
  height: 150px;
  color: #feda4a;
  font-size: 500%;
  font-weight: 600;
  letter-spacing: 6px;
  line-height: 150%;
  perspective: 400px;
  text-align: justify;
}

.crawl {
  position: relative;
  top: 99999px;
  transform-origin: 50% 100%;
  animation: crawl 60s linear;
}

.crawl > .title {
  font-size: 90%;
  text-align: center;
}

.crawl > .title h1 {
  margin: 0 0 100px;
  text-transform: uppercase;
}

@keyframes crawl {
  0% {
    top: -100px;
    transform: rotateX(20deg)  translateZ(0);
  }
  100% { 
    top: -6000px;
    transform: rotateX(25deg) translateZ(-2500px);
  }
}
.divider {
  display: flex;
}
.divider:before, .divider:after {
  content: "";
  flex: 1;
}

.line {
  align-items: center;
  margin: 1em -1em;
}
.line:before, .line:after {
  height: 1px;
  margin: 0 1em;
}

.one-line:before, .one-line:after {
  background: black;
}

.razor:before, .razor:after {
  box-shadow: 0 0.5px 0 black;
}

.double-razor:before, .double-razor:after {
  height: 3px;
  box-shadow: 0 -0.5px 0 black, 0 0.5px 0 black;
  border-width: 0;
}

.glow:before, .glow:after {
  height: 6px;
  -webkit-filter: blur(5px);
  border-radius: 5px;
}
.glow:before {
  background: linear-gradient(to right, blue, hotpink);
}
.glow:after {
  background: linear-gradient(to left, blue, hotpink);
}

.gradient {
  align-items: stretch;
  margin: 1em 0;
  height: 2em;
  line-height: 2em;
  color: white;
  background: black;
}
.gradient:before {
  background: linear-gradient(to right, white, black);
}
.gradient:after {
  background: linear-gradient(to left, white, black);
}

.donotcross {
  overflow: hidden;
  align-items: center;
  background: #ffd500;
  color: black;
  height: 2em;
  line-height: 2em;
}
.donotcross:before, .donotcross:after {
  background: white;
  padding: 50px 0;
  height: 0;
  transform: rotate(45deg);
}

/*#kayanresim{
  height: 50vh;
  display: block;
  overflow-x: hidden;
  overflow-y: hidden;
  white-space: nowrap;
}
#kayanresim .scroll-animations-example > .scrollsection {

  min-width: 550vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item {
  display: inline-block;
  position: relative;
  margin: 0 -30vh 0 3vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item::before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-big {
  height: 40vh;
  width: 60vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-big.-horizontal {
  height: 30vh;
  width: 80vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-normal {
  height: 30vh;
  width: 45vh;
  z-index: 1;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-normal.-horizontal {
  height: 23vh;
  width: 60vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-normal:nth-of-type(3n) {
  bottom: 5vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-normal:nth-of-type(4n) {
  bottom: -5vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-small {
  height: 40vh;
  width: 30vh;
  z-index: 2;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-small.-horizontal {
  height: 30vh;
  width: 40vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-small:nth-of-type(3n) {
  bottom: 13vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item.-small:nth-of-type(4n) {
  bottom: -13vh;
}
#kayanresim .scroll-animations-example > .scrollsection > .item > .image {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  filter: grayscale(1);
  opacity: 0;
  pointer-events: none;
  transform: translateX(0) translateY(0) scale(1);
  transition: filter 0.3s ease, opacity 1s ease, transform 1s ease;
}
#kayanresim .scroll-animations-example > .scrollsection > .item:nth-of-type(4n) > .image {
  transform: translateX(-30vh) translateY(-30vh) scale(0.8);
  transition-delay: 0;
}
#kayanresim .scroll-animations-example > .scrollsection > .item:nth-of-type(4n - 1) > .image {
  transform: translateX(30vh) translateY(30vh) scale(0.8);
  transition-delay: 0.05s;
}
#kayanresim .scroll-animations-example > .scrollsection > .item:nth-of-type(4n - 2) > .image {
  transform: translateX(-30vh) translateY(30vh) scale(0.8);
  transition-delay: 0.1s;
}
#kayanresim .scroll-animations-example > .scrollsection > .item:nth-of-type(4n - 3) > .image {
  transform: translateX(-30vh) translateY(-30vh) scale(0.8);
  transition-delay: 0.15s;
}
#kayanresim .scroll-animations-example > .scrollsection > .item > .image.-active {
  transform: translateX(0) translateY(0) scale(1);
  opacity: 0.8;
  pointer-events: auto;
  transition: filter 0.3s ease, opacity 1s ease, transform 1s ease;
}
#kayanresim .scroll-animations-example > .scrollsection > .item > .image.-clicked {
  transform: translateX(0) translateY(0) scale(5);
  opacity: 0;
  pointer-events: auto;
  transition: filter 0.3s ease, opacity 1s ease, transform 1s ease;
}
#kayanresim .scroll-animations-example > .scrollsection > .item > .image.-active:hover {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  filter: grayscale(0);
  opacity: 1;
  cursor: pointer;
}*/


#kayanresim {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  position: relative;
}

#kayanresim {
  width: 100%;
  height: 70vh;
  display: flex;
  justify-content: center;
  background: #bd979f;
}

#kayanresim .scene {
  width: 75%;
  position: relative;
  height: 100%;
  background: #daacae;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  perspective: 500px;
}

#kayanresim .item {
  position: absolute;
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: left top;
  pointer-events: none;
}

#kayanresim #plant {
  background-image: url(https://ouch-cdn2.icons8.com/CZaKIJ63jjlgvDcdjcjUnlfpffRScIiXzi4HMrpLAsM/rs:fit:728:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvNjM2/L2RkMzRmMzVhLWVk/YmMtNDRlZi1hOGNm/LTZlZjJlMTBlMzU2/My5wbmc.png);
  width: 500px;
  height: 620px;
  bottom: -26px;
  margin-right: 400px;
}

#kayanresim #plant-2 {
  background-image: url(https://ouch-cdn2.icons8.com/E47kcuNp_3-4IrDybcMwr6zMELcbhBQLKzImj-ot8E4/rs:fit:855:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvMzE5/LzljNjEwNjJhLTk4/YmMtNDViMS1iZGVm/LTMwNzVjMTMxYjQ1/OC5wbmc.png);
  width: 300px;
  height: 320px;
  bottom: -50px;
  margin-right: 300px;
}

#kayanresim #plant-3 {
  background-image: url(https://ouch-cdn2.icons8.com/oo4nsgAN74wL_FDHCUIwOdB3rPN6SGavRjxiz-1ds4s/rs:fit:1201:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvMTk0/LzVlMGQ1NjhlLWNh/NTEtNGJlNC1iNWEz/LTQyYTcwNDlmZGMy/My5wbmc.png);
  width: 160px;
  height: 125px;
  bottom: -50px;
  margin-left: 380px;
}

#kayanresim #books {
  background-image: url(https://ouch-cdn2.icons8.com/AUAdQ5eK8APXniP0hwVusHWtZRMk9FA2Jm9FSza1StY/rs:fit:850:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvNy9j/NTcxMWIzNC1mMTYy/LTQ3MTAtOGExYi1l/YzY1M2FlN2IwYWYu/cG5n.png);
  width: 200px;
  height: 220px;
  bottom: -40px;
  margin-left: 620px;
}

#kayanresim #apple {
  background-image: url(https://ouch-cdn2.icons8.com/-O2SifADepTOg7bXJ5whR6wB0iMfq5y7vrIaJdmKp20/rs:fit:851:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvODYy/L2M3MjBkM2Q3LWMw/NTgtNDJkOC04ZGEw/LTc2MTM1N2YwMmNh/OC5wbmc.png);
  width: 64px;
  height: 70px;
  top: -64px;
  left: 30px;
}

#kayanresim #clock {
  background-image: url(https://ouch-cdn2.icons8.com/ggxsAQVGAa4GMIlNl6vMuk0ANcEK07E5woeRpplKofI/rs:fit:945:912/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9wbmcvMzI0/L2RmMDQzMzc4LTcy/NTUtNDA5My04ZDQy/LTgxOTJjNmE2ZmQx/ZC5wbmc.png);
  width: 170px;
  height: 170px;
  background-size: 100% auto;
  background-position: left top;
  bottom: 520px;
  margin-left: 440px;
}

#kayanresim #mirror {
  width: 280px;
  height: 580px;
  position: relative;
  box-shadow: 16px 2px 10px rgba(0, 0, 0, 0.4);
  perspective: 500px;
  border-top-left-radius: 300px;
  border-top-right-radius: 300px;
  transform-origin: top center;
  transform: rotateX(3deg);
  cursor: pointer;
}

#kayanresim #mirror-content {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(image/2020_new_31.jfif);
  background-position: center center;
  background-size: auto 100%;
  background-repeat: no-repeat;
  box-shadow: inset 6px 3px 10px rgba(0, 0, 0, 0.4);
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
  border: 6px solid #e7e4df;
  z-index: 0;
  display: flex;
  justify-content: center;
}

#kayanresim #mirror-content:before {
  position: absolute;
  content: "「 ｃｌｉｃｋ ｍｅ 」";
  font-family: sans-serif;
  text-transform: uppercase;
  color: #e7e4df;
  font-weight: bold;
  letter-spacing: 4px;
  font-size: 10px;
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
  text-align: center;
  bottom: 0;
  z-index: 100;
  opacity: 0.6;
  transition: all 0.5s ease;
  padding: 18px 0;
}

#kayanresim #mirror:hover #mirror-content:before {
  opacity: 0.4;
  transform: translateY(4px);
}


.first-card {
    box-sizing: border-box;
}
.first-card {
    display: flex;
    justify-content: center;
    align-items: center;
}
.first-card  .wrapper{
    width:100%;
    height:200px;
    min-height: 50vh;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    background-color: white;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover; 
}
.first-card  .wrapper .box{
    position: relative;
    background-image: url("image/glow8.jpg");
    width:280px;
    height:400px;
    box-shadow: 20px 20px 50px rgba(0,0,0,0.5);
    border-radius:15px;
    margin:30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-top:1px solid rgba(255,255,255,0.5);
    border-left:1px solid rgba(255,255,255,0.5);
    backdrop-filter: blur(5px);
    transform-style: preserve-3d;
    transform: perspective(800px) 
}
.first-card  h2{
    color:#fff;
    font-size:2.5rem;
    text-align: center;
}
.first-card  p{
    color:#ccc;
    margin:20px 10px;
}
.first-card  ul{
    list-style: none;
    width:100%;
    display: flex;
    justify-content: space-evenly;
    margin:30px 0;
    padding:10px;
}

.first-card  li{
    cursor: pointer;
    width:30px;
    height:30px;
}
.first-card  i{
    color:#ccc;
    font-size: 1.5rem;
    transition: all 0.3s ease;
}
.first-card  li:hover .fa-twitter{
    transform:translate3d(0,-10px,20px);
    color:#00acee;
}
.first-card  li:hover .fa-github{
    transform:translate3d(0,-10px,20px);
    color:gray;
}
.first-card  li:hover .fa-linkedin-in{
    transform:translate3d(0,-10px,20px);
    color:#077099;
}

.footerson {
  background: url(/images/backgraund/footer.png);
  background-position: center;
    height: 900px;
    overflow: hidden;

}

.canlıdestekfotter {
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.canlıdestekfotter img {
  width: 60px;
  margin-right: 10px;
}
.canlıdestekfotter h2 {
  text-align: center;
  color: white;
  font-size: 20px;
}

.footerbialt h4 {
  color: white;
}
.footerbialt hr {
  background: #495e7b;
  height: 2px;
  width: calc(53% - 70px);
  margin-left: 38%;
}
.footerbialt .sosyalmedyahr {
  background: #495e7b;
  height: 2px;
  width: calc(40% - 50px);
  margin-left: 35%;
}
.footerhrkısa {
  color: white;
  height: 3px;
  z-index: 50000;
  width: 100%;
}
.footerbialta1 {
  margin-top: 50px;
  display: flex;
  justify-content: space-between;
  text-align: center;
}
.footerbialt h5 {
  color: white;
  font-size: 15px;
  text-align: justify;
  margin-left: 30%;
}
.sosyalmedyalarfotter {
  display: flex;
  justify-content: center;
  margin: 0px auto;
}
.sosyalmedyalarfotter a i {
  color: white;
  font-size: 30px;
  margin-left: 10px;
}
.footerbialta2hr {
  margin-top: 30px;
  height: 2px;
  background: #3a99b4;
}
.fottoercardsvg {
  margin-top: 20px;
}
.fottoercardsvg img {
  display: flex;
  margin: 0 auto;
}
.fottoercardsvg h6 {
  text-align: center;
  color: white;
  margin-top: 10px;
  font-family: 600;
}
.thefabrikalogo {
  margin-top: 20px;
  width: 200px;
  opacity: 0.5;
  transition: 0.5s;
}
.thefabrikalogo:hover {
  width: 200px;
  opacity: 1;
}


.kartanesi{
  max-height: 400px;
  overflow: hidden;
}


.snow {
  position: absolute;
  width: 10px;
  height: 10px;
  background: white;
  border-radius: 50%;
  max-height: 600px;
}
.snow:nth-child(1) {
  opacity: 0.0244;
  transform: translate(35.1829vw, -10px) scale(0.7213);
  animation: fall-1 22s -4s linear infinite;
}
@keyframes fall-1 {
  38.875% {
    transform: translate(39.945vw, 38.875vh) scale(0.7213);
  }
  to {
    transform: translate(37.56395vw,70vh) scale(0.7213);
  }
}
.snow:nth-child(2) {
  opacity: 0.4909;
  transform: translate(37.601vw, -10px) scale(0.8876);
  animation: fall-2 12s -26s linear infinite;
}
@keyframes fall-2 {
  43.156% {
    transform: translate(44.0648vw, 43.156vh) scale(0.8876);
  }
  to {
    transform: translate(40.8329vw, 70vh) scale(0.8876);
  }
}
.snow:nth-child(3) {
  opacity: 0.5156;
  transform: translate(86.2947vw, -10px) scale(0.758);
  animation: fall-3 13s -12s linear infinite;
}
@keyframes fall-3 {
  79.894% {
    transform: translate(87.1111vw, 79.894vh) scale(0.758);
  }
  to {
    transform: translate(86.7029vw, 70vh) scale(0.758);
  }
}
.snow:nth-child(4) {
  opacity: 0.7285;
  transform: translate(33.1vw, -10px) scale(0.0333);
  animation: fall-4 16s -16s linear infinite;
}
@keyframes fall-4 {
  48.506% {
    transform: translate(27.3653vw, 48.506vh) scale(0.0333);
  }
  to {
    transform: translate(30.23265vw, 70vh) scale(0.0333);
  }
}
.snow:nth-child(5) {
  opacity: 0.8602;
  transform: translate(70.5791vw, -10px) scale(0.3036);
  animation: fall-5 18s -11s linear infinite;
}
@keyframes fall-5 {
  34.079% {
    transform: translate(67.3073vw, 34.079vh) scale(0.3036);
  }
  to {
    transform: translate(68.9432vw, 70vh) scale(0.3036);
  }
}
.snow:nth-child(6) {
  opacity: 0.1609;
  transform: translate(2.5249vw, -10px) scale(0.785);
  animation: fall-6 29s -24s linear infinite;
}
@keyframes fall-6 {
  44.409% {
    transform: translate(-2.4515vw, 44.409vh) scale(0.785);
  }
  to {
    transform: translate(0.0367vw, 70vh) scale(0.785);
  }
}
.snow:nth-child(7) {
  opacity: 0.5455;
  transform: translate(30.8476vw, -10px) scale(0.315);
  animation: fall-7 23s -28s linear infinite;
}
@keyframes fall-7 {
  66.916% {
    transform: translate(25.8908vw, 66.916vh) scale(0.315);
  }
  to {
    transform: translate(28.3692vw, 70vh) scale(0.315);
  }
}
.snow:nth-child(8) {
  opacity: 0.2841;
  transform: translate(41.79vw, -10px) scale(0.6994);
  animation: fall-8 24s -21s linear infinite;
}
@keyframes fall-8 {
  46.631% {
    transform: translate(38.7348vw, 46.631vh) scale(0.6994);
  }
  to {
    transform: translate(40.2624vw, 70vh) scale(0.6994);
  }
}
.snow:nth-child(9) {
  opacity: 0.6074;
  transform: translate(16.5417vw, -10px) scale(0.5052);
  animation: fall-9 27s -3s linear infinite;
}
@keyframes fall-9 {
  51.653% {
    transform: translate(10.8957vw, 51.653vh) scale(0.5052);
  }
  to {
    transform: translate(13.7187vw, 70vh) scale(0.5052);
  }
}
.snow:nth-child(10) {
  opacity: 0.1401;
  transform: translate(99.5964vw, -10px) scale(0.6979);
  animation: fall-10 22s -6s linear infinite;
}
@keyframes fall-10 {
  75.094% {
    transform: translate(96.3747vw, 75.094vh) scale(0.6979);
  }
  to {
    transform: translate(97.98555vw, 70vh) scale(0.6979);
  }
}
.snow:nth-child(11) {
  opacity: 0.0066;
  transform: translate(6.3271vw, -10px) scale(0.2586);
  animation: fall-11 17s -2s linear infinite;
}
@keyframes fall-11 {
  40.813% {
    transform: translate(0.7519vw, 40.813vh) scale(0.2586);
  }
  to {
    transform: translate(3.5395vw, 70vh) scale(0.2586);
  }
}
.snow:nth-child(12) {
  opacity: 0.5977;
  transform: translate(95.6142vw, -10px) scale(0.987);
  animation: fall-12 23s -26s linear infinite;
}
@keyframes fall-12 {
  77.825% {
    transform: translate(97.6238vw, 77.825vh) scale(0.987);
  }
  to {
    transform: translate(96.619vw, 70vh) scale(0.987);
  }
}
.snow:nth-child(13) {
  opacity: 0.1216;
  transform: translate(82.799vw, -10px) scale(0.6889);
  animation: fall-13 27s -16s linear infinite;
}
@keyframes fall-13 {
  34.546% {
    transform: translate(75.509vw, 34.546vh) scale(0.6889);
  }
  to {
    transform: translate(79.154vw, 70vh) scale(0.6889);
  }
}
.snow:nth-child(14) {
  opacity: 0.2494;
  transform: translate(6.0115vw, -10px) scale(0.8442);
  animation: fall-14 23s -23s linear infinite;
}
@keyframes fall-14 {
  61.931% {
    transform: translate(1.1901vw, 61.931vh) scale(0.8442);
  }
  to {
    transform: translate(3.6008vw, 70vh) scale(0.8442);
  }
}
.snow:nth-child(15) {
  opacity: 0.4737;
  transform: translate(92.9649vw, -10px) scale(0.6251);
  animation: fall-15 21s -10s linear infinite;
}
@keyframes fall-15 {
  58.385% {
    transform: translate(97.9339vw, 58.385vh) scale(0.6251);
  }
  to {
    transform: translate(95.4494vw, 70vh) scale(0.6251);
  }
}
.snow:nth-child(16) {
  opacity: 0.5738;
  transform: translate(83.6723vw, -10px) scale(0.5998);
  animation: fall-16 20s -16s linear infinite;
}
@keyframes fall-16 {
  54.088% {
    transform: translate(91.9957vw, 54.088vh) scale(0.5998);
  }
  to {
    transform: translate(87.834vw, 70vh) scale(0.5998);
  }
}
.snow:nth-child(17) {
  opacity: 0.4776;
  transform: translate(77.4035vw, -10px) scale(0.7058);
  animation: fall-17 20s -30s linear infinite;
}
@keyframes fall-17 {
  48.918% {
    transform: translate(81.358vw, 48.918vh) scale(0.7058);
  }
  to {
    transform: translate(79.38075vw, 70vh) scale(0.7058);
  }
}
.snow:nth-child(18) {
  opacity: 0.669;
  transform: translate(57.2788vw, -10px) scale(0.0205);
  animation: fall-18 15s -22s linear infinite;
}
@keyframes fall-18 {
  44.148% {
    transform: translate(56.3544vw, 44.148vh) scale(0.0205);
  }
  to {
    transform: translate(56.8166vw, 70vh) scale(0.0205);
  }
}
.snow:nth-child(19) {
  opacity: 0.7338;
  transform: translate(77.7058vw, -10px) scale(0.0419);
  animation: fall-19 26s -23s linear infinite;
}
@keyframes fall-19 {
  76.523% {
    transform: translate(81.3365vw, 76.523vh) scale(0.0419);
  }
  to {
    transform: translate(79.52115vw, 70vh) scale(0.0419);
  }
}
.snow:nth-child(20) {
  opacity: 0.8032;
  transform: translate(41.1429vw, -10px) scale(0.3362);
  animation: fall-20 20s -30s linear infinite;
}
@keyframes fall-20 {
  78.352% {
    transform: translate(49.6398vw, 78.352vh) scale(0.3362);
  }
  to {
    transform: translate(45.39135vw, 70vh) scale(0.3362);
  }
}
.snow:nth-child(21) {
  opacity: 0.9867;
  transform: translate(44.221vw, -10px) scale(0.5623);
  animation: fall-21 28s -11s linear infinite;
}
@keyframes fall-21 {
  65.793% {
    transform: translate(43.4193vw, 65.793vh) scale(0.5623);
  }
  to {
    transform: translate(43.82015vw, 70vh) scale(0.5623);
  }
}
.snow:nth-child(22) {
  opacity: 0.5178;
  transform: translate(43.3101vw, -10px) scale(0.2925);
  animation: fall-22 10s -19s linear infinite;
}
@keyframes fall-22 {
  58.817% {
    transform: translate(39.2968vw, 58.817vh) scale(0.2925);
  }
  to {
    transform: translate(41.30345vw, 70vh) scale(0.2925);
  }
}
.snow:nth-child(23) {
  opacity: 0.2234;
  transform: translate(80.7767vw, -10px) scale(0.9726);
  animation: fall-23 20s -5s linear infinite;
}
@keyframes fall-23 {
  72.172% {
    transform: translate(86.6998vw, 72.172vh) scale(0.9726);
  }
  to {
    transform: translate(83.73825vw, 70vh) scale(0.9726);
  }
}
.snow:nth-child(24) {
  opacity: 0.2069;
  transform: translate(63.5978vw, -10px) scale(0.6323);
  animation: fall-24 29s -12s linear infinite;
}
@keyframes fall-24 {
  31.752% {
    transform: translate(73.3732vw, 31.752vh) scale(0.6323);
  }
  to {
    transform: translate(68.4855vw, 70vh) scale(0.6323);
  }
}
.snow:nth-child(25) {
  opacity: 0.2952;
  transform: translate(3.8826vw, -10px) scale(0.1743);
  animation: fall-25 13s -8s linear infinite;
}
@keyframes fall-25 {
  50.596% {
    transform: translate(-4.9687vw, 50.596vh) scale(0.1743);
  }
  to {
    transform: translate(-0.54305vw, 70vh) scale(0.1743);
  }
}
.snow:nth-child(26) {
  opacity: 0.8116;
  transform: translate(24.2004vw, -10px) scale(0.6752);
  animation: fall-26 16s -4s linear infinite;
}
@keyframes fall-26 {
  43.602% {
    transform: translate(23.0915vw, 43.602vh) scale(0.6752);
  }
  to {
    transform: translate(23.64595vw, 70vh) scale(0.6752);
  }
}
.snow:nth-child(27) {
  opacity: 0.4798;
  transform: translate(46.6936vw, -10px) scale(0.7434);
  animation: fall-27 30s -14s linear infinite;
}
@keyframes fall-27 {
  75.038% {
    transform: translate(37.5387vw, 75.038vh) scale(0.7434);
  }
  to {
    transform: translate(42.11615vw, 70vh) scale(0.7434);
  }
}
.snow:nth-child(28) {
  opacity: 0.0922;
  transform: translate(27.0324vw, -10px) scale(0.3242);
  animation: fall-28 15s -30s linear infinite;
}
@keyframes fall-28 {
  32.57% {
    transform: translate(27.0051vw, 32.57vh) scale(0.3242);
  }
  to {
    transform: translate(27.01875vw, 70vh) scale(0.3242);
  }
}
.snow:nth-child(29) {
  opacity: 0.2556;
  transform: translate(41.4456vw, -10px) scale(0.591);
  animation: fall-29 22s -4s linear infinite;
}
@keyframes fall-29 {
  75.263% {
    transform: translate(42.7686vw, 75.263vh) scale(0.591);
  }
  to {
    transform: translate(42.1071vw, 70vh) scale(0.591);
  }
}
.snow:nth-child(30) {
  opacity: 0.3973;
  transform: translate(19.5019vw, -10px) scale(0.7262);
  animation: fall-30 30s -8s linear infinite;
}
@keyframes fall-30 {
  77.251% {
    transform: translate(13.3138vw, 77.251vh) scale(0.7262);
  }
  to {
    transform: translate(16.40785vw, 70vh) scale(0.7262);
  }
}
.snow:nth-child(31) {
  opacity: 0.8122;
  transform: translate(92.1003vw, -10px) scale(0.6737);
  animation: fall-31 19s -22s linear infinite;
}
@keyframes fall-31 {
  32.755% {
    transform: translate(82.5253vw, 32.755vh) scale(0.6737);
  }
  to {
    transform: translate(87.3128vw, 70vh) scale(0.6737);
  }
}
.snow:nth-child(32) {
  opacity: 0.1346;
  transform: translate(12.2072vw, -10px) scale(0.2907);
  animation: fall-32 18s -30s linear infinite;
}
@keyframes fall-32 {
  66.444% {
    transform: translate(20.5914vw, 66.444vh) scale(0.2907);
  }
  to {
    transform: translate(16.3993vw, 70vh) scale(0.2907);
  }
}
.snow:nth-child(33) {
  opacity: 0.7476;
  transform: translate(31.1865vw, -10px) scale(0.8905);
  animation: fall-33 16s -18s linear infinite;
}
@keyframes fall-33 {
  57.034% {
    transform: translate(35.7732vw, 57.034vh) scale(0.8905);
  }
  to {
    transform: translate(33.47985vw, 70vh) scale(0.8905);
  }
}
.snow:nth-child(34) {
  opacity: 0.7488;
  transform: translate(54.5642vw, -10px) scale(0.8447);
  animation: fall-34 12s -20s linear infinite;
}
@keyframes fall-34 {
  36.55% {
    transform: translate(55.5535vw, 36.55vh) scale(0.8447);
  }
  to {
    transform: translate(55.05885vw, 70vh) scale(0.8447);
  }
}
.snow:nth-child(35) {
  opacity: 0.3221;
  transform: translate(96.274vw, -10px) scale(0.6261);
  animation: fall-35 18s -8s linear infinite;
}
@keyframes fall-35 {
  42.901% {
    transform: translate(103.2786vw, 42.901vh) scale(0.6261);
  }
  to {
    transform: translate(99.7763vw, 70vh) scale(0.6261);
  }
}
.snow:nth-child(36) {
  opacity: 0.2787;
  transform: translate(62.0213vw, -10px) scale(0.3218);
  animation: fall-36 27s -2s linear infinite;
}
@keyframes fall-36 {
  58.322% {
    transform: translate(63.8907vw, 58.322vh) scale(0.3218);
  }
  to {
    transform: translate(62.956vw, 70vh) scale(0.3218);
  }
}
.snow:nth-child(37) {
  opacity: 0.5093;
  transform: translate(18.6543vw, -10px) scale(0.0713);
  animation: fall-37 22s -28s linear infinite;
}
@keyframes fall-37 {
  73.375% {
    transform: translate(12.9366vw, 73.375vh) scale(0.0713);
  }
  to {
    transform: translate(15.79545vw, 70vh) scale(0.0713);
  }
}
.snow:nth-child(38) {
  opacity: 0.5436;
  transform: translate(57.2089vw, -10px) scale(0.2385);
  animation: fall-38 25s -16s linear infinite;
}
@keyframes fall-38 {
  56.881% {
    transform: translate(51.0373vw, 56.881vh) scale(0.2385);
  }
  to {
    transform: translate(54.1231vw, 70vh) scale(0.2385);
  }
}
.snow:nth-child(39) {
  opacity: 0.5484;
  transform: translate(23.9242vw, -10px) scale(0.9038);
  animation: fall-39 30s -30s linear infinite;
}
@keyframes fall-39 {
  72.189% {
    transform: translate(26.92vw, 72.189vh) scale(0.9038);
  }
  to {
    transform: translate(25.4221vw, 70vh) scale(0.9038);
  }
}
.snow:nth-child(40) {
  opacity: 0.6903;
  transform: translate(35.7006vw, -10px) scale(0.9594);
  animation: fall-40 25s -14s linear infinite;
}
@keyframes fall-40 {
  58.668% {
    transform: translate(30.9635vw, 58.668vh) scale(0.9594);
  }
  to {
    transform: translate(33.33205vw, 70vh) scale(0.9594);
  }
}
.snow:nth-child(41) {
  opacity: 0.0102;
  transform: translate(15.9449vw, -10px) scale(0.1627);
  animation: fall-41 19s -5s linear infinite;
}
@keyframes fall-41 {
  45.513% {
    transform: translate(6.3644vw, 45.513vh) scale(0.1627);
  }
  to {
    transform: translate(11.15465vw, 70vh) scale(0.1627);
  }
}
.snow:nth-child(42) {
  opacity: 0.1961;
  transform: translate(55.7239vw, -10px) scale(0.8226);
  animation: fall-42 18s -29s linear infinite;
}
@keyframes fall-42 {
  30.345% {
    transform: translate(54.3454vw, 30.345vh) scale(0.8226);
  }
  to {
    transform: translate(55.03465vw, 70vh) scale(0.8226);
  }
}
.snow:nth-child(43) {
  opacity: 0.9248;
  transform: translate(40.3459vw, -10px) scale(0.6732);
  animation: fall-43 28s -7s linear infinite;
}
@keyframes fall-43 {
  75.231% {
    transform: translate(46.1563vw, 75.231vh) scale(0.6732);
  }
  to {
    transform: translate(43.2511vw, 70vh) scale(0.6732);
  }
}
.snow:nth-child(44) {
  opacity: 0.1271;
  transform: translate(56.0583vw, -10px) scale(0.0366);
  animation: fall-44 12s -1s linear infinite;
}
@keyframes fall-44 {
  78.557% {
    transform: translate(55.8122vw, 78.557vh) scale(0.0366);
  }
  to {
    transform: translate(55.93525vw, 70vh) scale(0.0366);
  }
}
.snow:nth-child(45) {
  opacity: 0.5661;
  transform: translate(37.3785vw, -10px) scale(0.1502);
  animation: fall-45 29s -20s linear infinite;
}
@keyframes fall-45 {
  32.999% {
    transform: translate(35.1913vw, 32.999vh) scale(0.1502);
  }
  to {
    transform: translate(36.2849vw, 70vh) scale(0.1502);
  }
}
.snow:nth-child(46) {
  opacity: 0.0757;
  transform: translate(34.7971vw, -10px) scale(0.8298);
  animation: fall-46 22s -20s linear infinite;
}
@keyframes fall-46 {
  55.644% {
    transform: translate(44.4332vw, 55.644vh) scale(0.8298);
  }
  to {
    transform: translate(39.61515vw, 70vh) scale(0.8298);
  }
}
.snow:nth-child(47) {
  opacity: 0.9452;
  transform: translate(95.7367vw, -10px) scale(0.4671);
  animation: fall-47 19s -15s linear infinite;
}
@keyframes fall-47 {
  74.169% {
    transform: translate(103.237vw, 74.169vh) scale(0.4671);
  }
  to {
    transform: translate(99.48685vw, 70vh) scale(0.4671);
  }
}
.snow:nth-child(48) {
  opacity: 0.3458;
  transform: translate(89.6911vw, -10px) scale(0.4874);
  animation: fall-48 30s -15s linear infinite;
}
@keyframes fall-48 {
  63.945% {
    transform: translate(97.6495vw, 63.945vh) scale(0.4874);
  }
  to {
    transform: translate(93.6703vw, 70vh) scale(0.4874);
  }
}
.snow:nth-child(49) {
  opacity: 0.806;
  transform: translate(78.5878vw, -10px) scale(0.6755);
  animation: fall-49 19s -11s linear infinite;
}
@keyframes fall-49 {
  59.07% {
    transform: translate(86.0995vw, 59.07vh) scale(0.6755);
  }
  to {
    transform: translate(82.34365vw, 70vh) scale(0.6755);
  }
}
.snow:nth-child(50) {
  opacity: 0.5729;
  transform: translate(27.8954vw, -10px) scale(0.7915);
  animation: fall-50 13s -9s linear infinite;
}
@keyframes fall-50 {
  62.778% {
    transform: translate(37.0868vw, 62.778vh) scale(0.7915);
  }
  to {
    transform: translate(32.4911vw, 70vh) scale(0.7915);
  }
}
.snow:nth-child(51) {
  opacity: 0.6942;
  transform: translate(78.7233vw, -10px) scale(0.264);
  animation: fall-51 19s -21s linear infinite;
}
@keyframes fall-51 {
  43.935% {
    transform: translate(70.9529vw, 43.935vh) scale(0.264);
  }
  to {
    transform: translate(74.8381vw, 70vh) scale(0.264);
  }
}
.snow:nth-child(52) {
  opacity: 0.7223;
  transform: translate(62.6512vw, -10px) scale(0.5822);
  animation: fall-52 18s -9s linear infinite;
}
@keyframes fall-52 {
  72.239% {
    transform: translate(66.7186vw, 72.239vh) scale(0.5822);
  }
  to {
    transform: translate(64.6849vw, 70vh) scale(0.5822);
  }
}
.snow:nth-child(53) {
  opacity: 0.9904;
  transform: translate(92.4356vw, -10px) scale(0.8606);
  animation: fall-53 17s -23s linear infinite;
}
@keyframes fall-53 {
  61.399% {
    transform: translate(87.5437vw, 61.399vh) scale(0.8606);
  }
  to {
    transform: translate(89.98965vw, 70vh) scale(0.8606);
  }
}
.snow:nth-child(54) {
  opacity: 0.7693;
  transform: translate(87.0665vw, -10px) scale(0.6847);
  animation: fall-54 17s -25s linear infinite;
}
@keyframes fall-54 {
  38.346% {
    transform: translate(88.5657vw, 38.346vh) scale(0.6847);
  }
  to {
    transform: translate(87.8161vw, 70vh) scale(0.6847);
  }
}
.snow:nth-child(55) {
  opacity: 0.1858;
  transform: translate(4.1281vw, -10px) scale(0.8371);
  animation: fall-55 12s -1s linear infinite;
}
@keyframes fall-55 {
  56.344% {
    transform: translate(13.2553vw, 56.344vh) scale(0.8371);
  }
  to {
    transform: translate(8.6917vw, 70vh) scale(0.8371);
  }
}
.snow:nth-child(56) {
  opacity: 0.1528;
  transform: translate(55.9582vw, -10px) scale(0.5004);
  animation: fall-56 26s -8s linear infinite;
}
@keyframes fall-56 {
  65.612% {
    transform: translate(47.2607vw, 65.612vh) scale(0.5004);
  }
  to {
    transform: translate(51.60945vw, 70vh) scale(0.5004);
  }
}
.snow:nth-child(57) {
  opacity: 0.603;
  transform: translate(88.6748vw, -10px) scale(0.7465);
  animation: fall-57 19s -3s linear infinite;
}
@keyframes fall-57 {
  54.732% {
    transform: translate(81.1488vw, 54.732vh) scale(0.7465);
  }
  to {
    transform: translate(84.9118vw, 70vh) scale(0.7465);
  }
}
.snow:nth-child(58) {
  opacity: 0.5207;
  transform: translate(52.6055vw, -10px) scale(0.9885);
  animation: fall-58 15s -26s linear infinite;
}
@keyframes fall-58 {
  39.17% {
    transform: translate(55.6611vw, 39.17vh) scale(0.9885);
  }
  to {
    transform: translate(54.1333vw, 70vh) scale(0.9885);
  }
}
.snow:nth-child(59) {
  opacity: 0.1119;
  transform: translate(16.7966vw, -10px) scale(0.4234);
  animation: fall-59 27s -30s linear infinite;
}
@keyframes fall-59 {
  66.917% {
    transform: translate(7.76vw, 66.917vh) scale(0.4234);
  }
  to {
    transform: translate(12.2783vw, 70vh) scale(0.4234);
  }
}
.snow:nth-child(60) {
  opacity: 0.7231;
  transform: translate(24.4341vw, -10px) scale(0.8853);
  animation: fall-60 23s -26s linear infinite;
}
@keyframes fall-60 {
  58.202% {
    transform: translate(30.7529vw, 58.202vh) scale(0.8853);
  }
  to {
    transform: translate(27.5935vw, 70vh) scale(0.8853);
  }
}
.snow:nth-child(61) {
  opacity: 0.6369;
  transform: translate(45.797vw, -10px) scale(0.0903);
  animation: fall-61 28s -7s linear infinite;
}
@keyframes fall-61 {
  53.475% {
    transform: translate(37.6295vw, 53.475vh) scale(0.0903);
  }
  to {
    transform: translate(41.71325vw, 70vh) scale(0.0903);
  }
}
.snow:nth-child(62) {
  opacity: 0.045;
  transform: translate(31.2385vw, -10px) scale(0.5607);
  animation: fall-62 11s -7s linear infinite;
}
@keyframes fall-62 {
  57.535% {
    transform: translate(28.6075vw, 57.535vh) scale(0.5607);
  }
  to {
    transform: translate(29.923vw, 70vh) scale(0.5607);
  }
}
.snow:nth-child(63) {
  opacity: 0.2551;
  transform: translate(66.3698vw, -10px) scale(0.0367);
  animation: fall-63 23s -27s linear infinite;
}
@keyframes fall-63 {
  33.623% {
    transform: translate(62.3963vw, 33.623vh) scale(0.0367);
  }
  to {
    transform: translate(64.38305vw, 70vh) scale(0.0367);
  }
}
.snow:nth-child(64) {
  opacity: 0.054;
  transform: translate(17.2146vw, -10px) scale(0.0119);
  animation: fall-64 28s -4s linear infinite;
}
@keyframes fall-64 {
  56.515% {
    transform: translate(27.0316vw, 56.515vh) scale(0.0119);
  }
  to {
    transform: translate(22.1231vw, 70vh) scale(0.0119);
  }
}
.snow:nth-child(65) {
  opacity: 0.2989;
  transform: translate(89.7837vw, -10px) scale(0.0471);
  animation: fall-65 16s -20s linear infinite;
}
@keyframes fall-65 {
  33.592% {
    transform: translate(83.2339vw, 33.592vh) scale(0.0471);
  }
  to {
    transform: translate(86.5088vw, 70vh) scale(0.0471);
  }
}
.snow:nth-child(66) {
  opacity: 0.0294;
  transform: translate(45.4425vw, -10px) scale(0.5613);
  animation: fall-66 21s -20s linear infinite;
}
@keyframes fall-66 {
  54.26% {
    transform: translate(50.1963vw, 54.26vh) scale(0.5613);
  }
  to {
    transform: translate(47.8194vw, 70vh) scale(0.5613);
  }
}
.snow:nth-child(67) {
  opacity: 0.4284;
  transform: translate(88.7861vw, -10px) scale(0.8161);
  animation: fall-67 25s -13s linear infinite;
}
@keyframes fall-67 {
  71.966% {
    transform: translate(93.8946vw, 71.966vh) scale(0.8161);
  }
  to {
    transform: translate(91.34035vw, 70vh) scale(0.8161);
  }
}
.snow:nth-child(68) {
  opacity: 0.4465;
  transform: translate(20.8372vw, -10px) scale(0.637);
  animation: fall-68 29s -28s linear infinite;
}
@keyframes fall-68 {
  55.247% {
    transform: translate(26.4224vw, 55.247vh) scale(0.637);
  }
  to {
    transform: translate(23.6298vw, 70vh) scale(0.637);
  }
}
.snow:nth-child(69) {
  opacity: 0.5214;
  transform: translate(33.564vw, -10px) scale(0.2617);
  animation: fall-69 21s -1s linear infinite;
}
@keyframes fall-69 {
  52.565% {
    transform: translate(31.8467vw, 52.565vh) scale(0.2617);
  }
  to {
    transform: translate(32.70535vw, 70vh) scale(0.2617);
  }
}
.snow:nth-child(70) {
  opacity: 0.2603;
  transform: translate(42.043vw, -10px) scale(0.3958);
  animation: fall-70 19s -22s linear infinite;
}
@keyframes fall-70 {
  38.63% {
    transform: translate(35.6381vw, 38.63vh) scale(0.3958);
  }
  to {
    transform: translate(38.84055vw, 70vh) scale(0.3958);
  }
}
.snow:nth-child(71) {
  opacity: 0.6233;
  transform: translate(58.8687vw, -10px) scale(0.0156);
  animation: fall-71 11s -30s linear infinite;
}
@keyframes fall-71 {
  51.492% {
    transform: translate(58.3224vw, 51.492vh) scale(0.0156);
  }
  to {
    transform: translate(58.59555vw, 70vh) scale(0.0156);
  }
}
.snow:nth-child(72) {
  opacity: 0.4173;
  transform: translate(12.536vw, -10px) scale(0.7637);
  animation: fall-72 12s -22s linear infinite;
}
@keyframes fall-72 {
  38.254% {
    transform: translate(10.921vw, 38.254vh) scale(0.7637);
  }
  to {
    transform: translate(11.7285vw, 70vh) scale(0.7637);
  }
}
.snow:nth-child(73) {
  opacity: 0.3362;
  transform: translate(97.9273vw, -10px) scale(0.5629);
  animation: fall-73 21s -24s linear infinite;
}
@keyframes fall-73 {
  77.295% {
    transform: translate(100.1671vw, 77.295vh) scale(0.5629);
  }
  to {
    transform: translate(99.0472vw, 70vh) scale(0.5629);
  }
}
.snow:nth-child(74) {
  opacity: 0.9871;
  transform: translate(1.5932vw, -10px) scale(0.4925);
  animation: fall-74 23s -1s linear infinite;
}
@keyframes fall-74 {
  49.4% {
    transform: translate(1.6883vw, 49.4vh) scale(0.4925);
  }
  to {
    transform: translate(1.64075vw, 70vh) scale(0.4925);
  }
}
.snow:nth-child(75) {
  opacity: 0.8457;
  transform: translate(91.746vw, -10px) scale(0.3404);
  animation: fall-75 18s -19s linear infinite;
}
@keyframes fall-75 {
  50.97% {
    transform: translate(82.1506vw, 50.97vh) scale(0.3404);
  }
  to {
    transform: translate(86.9483vw, 70vh) scale(0.3404);
  }
}
.snow:nth-child(76) {
  opacity: 0.7198;
  transform: translate(29.1172vw, -10px) scale(0.0069);
  animation: fall-76 14s -28s linear infinite;
}
@keyframes fall-76 {
  42.399% {
    transform: translate(21.0783vw, 42.399vh) scale(0.0069);
  }
  to {
    transform: translate(25.09775vw, 70vh) scale(0.0069);
  }
}
.snow:nth-child(77) {
  opacity: 0.7038;
  transform: translate(58.3082vw, -10px) scale(0.0418);
  animation: fall-77 12s -28s linear infinite;
}
@keyframes fall-77 {
  48.906% {
    transform: translate(56.3854vw, 48.906vh) scale(0.0418);
  }
  to {
    transform: translate(57.3468vw, 70vh) scale(0.0418);
  }
}
.snow:nth-child(78) {
  opacity: 0.5703;
  transform: translate(86.711vw, -10px) scale(0.2456);
  animation: fall-78 21s -29s linear infinite;
}
@keyframes fall-78 {
  52.513% {
    transform: translate(84.0869vw, 52.513vh) scale(0.2456);
  }
  to {
    transform: translate(85.39895vw, 70vh) scale(0.2456);
  }
}
.snow:nth-child(79) {
  opacity: 0.3105;
  transform: translate(12.6323vw, -10px) scale(0.5926);
  animation: fall-79 14s -20s linear infinite;
}
@keyframes fall-79 {
  51.611% {
    transform: translate(15.8803vw, 51.611vh) scale(0.5926);
  }
  to {
    transform: translate(14.2563vw, 70vh) scale(0.5926);
  }
}
.snow:nth-child(80) {
  opacity: 0.1582;
  transform: translate(0.3084vw, -10px) scale(0.2873);
  animation: fall-80 22s -12s linear infinite;
}
@keyframes fall-80 {
  43.268% {
    transform: translate(2.5316vw, 43.268vh) scale(0.2873);
  }
  to {
    transform: translate(1.42vw, 70vh) scale(0.2873);
  }
}
.snow:nth-child(81) {
  opacity: 0.4028;
  transform: translate(44.8046vw, -10px) scale(0.6633);
  animation: fall-81 28s -30s linear infinite;
}
@keyframes fall-81 {
  50.701% {
    transform: translate(52.2131vw, 50.701vh) scale(0.6633);
  }
  to {
    transform: translate(48.50885vw, 70vh) scale(0.6633);
  }
}
.snow:nth-child(82) {
  opacity: 0.0967;
  transform: translate(6.5258vw, -10px) scale(0.4427);
  animation: fall-82 23s -8s linear infinite;
}
@keyframes fall-82 {
  40.014% {
    transform: translate(-0.5365vw, 40.014vh) scale(0.4427);
  }
  to {
    transform: translate(2.99465vw, 70vh) scale(0.4427);
  }
}
.snow:nth-child(83) {
  opacity: 0.8468;
  transform: translate(32.4076vw, -10px) scale(0.7595);
  animation: fall-83 10s -7s linear infinite;
}
@keyframes fall-83 {
  30.343% {
    transform: translate(36.9313vw, 30.343vh) scale(0.7595);
  }
  to {
    transform: translate(34.66945vw, 70vh) scale(0.7595);
  }
}
.snow:nth-child(84) {
  opacity: 0.3571;
  transform: translate(54.5501vw, -10px) scale(0.5265);
  animation: fall-84 20s -9s linear infinite;
}
@keyframes fall-84 {
  42.749% {
    transform: translate(60.5959vw, 42.749vh) scale(0.5265);
  }
  to {
    transform: translate(57.573vw, 70vh) scale(0.5265);
  }
}
.snow:nth-child(85) {
  opacity: 0.4844;
  transform: translate(69.9518vw, -10px) scale(0.4234);
  animation: fall-85 12s -25s linear infinite;
}
@keyframes fall-85 {
  51.162% {
    transform: translate(76.1935vw, 51.162vh) scale(0.4234);
  }
  to {
    transform: translate(73.07265vw, 70vh) scale(0.4234);
  }
}
.snow:nth-child(86) {
  opacity: 0.8851;
  transform: translate(86.9398vw, -10px) scale(0.0917);
  animation: fall-86 17s -11s linear infinite;
}
@keyframes fall-86 {
  63.49% {
    transform: translate(91.458vw, 63.49vh) scale(0.0917);
  }
  to {
    transform: translate(89.1989vw, 70vh) scale(0.0917);
  }
}
.snow:nth-child(87) {
  opacity: 0.0578;
  transform: translate(36.7005vw, -10px) scale(0.8983);
  animation: fall-87 15s -19s linear infinite;
}
@keyframes fall-87 {
  56.517% {
    transform: translate(38.274vw, 56.517vh) scale(0.8983);
  }
  to {
    transform: translate(37.48725vw, 70vh) scale(0.8983);
  }
}
.snow:nth-child(88) {
  opacity: 0.6642;
  transform: translate(71.313vw, -10px) scale(0.5732);
  animation: fall-88 12s -15s linear infinite;
}
@keyframes fall-88 {
  73.46% {
    transform: translate(79.138vw, 73.46vh) scale(0.5732);
  }
  to {
    transform: translate(75.2255vw, 70vh) scale(0.5732);
  }
}
.snow:nth-child(89) {
  opacity: 0.9699;
  transform: translate(68.6072vw, -10px) scale(0.1527);
  animation: fall-89 30s -24s linear infinite;
}
@keyframes fall-89 {
  75.183% {
    transform: translate(73.0941vw, 75.183vh) scale(0.1527);
  }
  to {
    transform: translate(70.85065vw, 70vh) scale(0.1527);
  }
}
.snow:nth-child(90) {
  opacity: 0.6744;
  transform: translate(61.7261vw, -10px) scale(0.3023);
  animation: fall-90 14s -26s linear infinite;
}
@keyframes fall-90 {
  58.958% {
    transform: translate(60.6741vw, 58.958vh) scale(0.3023);
  }
  to {
    transform: translate(61.2001vw, 70vh) scale(0.3023);
  }
}
.snow:nth-child(91) {
  opacity: 0.2369;
  transform: translate(80.9249vw, -10px) scale(0.7668);
  animation: fall-91 25s -25s linear infinite;
}
@keyframes fall-91 {
  77.617% {
    transform: translate(74.1663vw, 77.617vh) scale(0.7668);
  }
  to {
    transform: translate(77.5456vw, 70vh) scale(0.7668);
  }
}
.snow:nth-child(92) {
  opacity: 0.6989;
  transform: translate(84.3021vw, -10px) scale(0.7468);
  animation: fall-92 18s -28s linear infinite;
}
@keyframes fall-92 {
  55.042% {
    transform: translate(76.5409vw, 55.042vh) scale(0.7468);
  }
  to {
    transform: translate(80.4215vw, 70vh) scale(0.7468);
  }
}
.snow:nth-child(93) {
  opacity: 0.2464;
  transform: translate(53.8233vw, -10px) scale(0.4686);
  animation: fall-93 21s -2s linear infinite;
}
@keyframes fall-93 {
  52.099% {
    transform: translate(50.5677vw, 52.099vh) scale(0.4686);
  }
  to {
    transform: translate(52.1955vw, 70vh) scale(0.4686);
  }
}
.snow:nth-child(94) {
  opacity: 0.1885;
  transform: translate(51.2818vw, -10px) scale(0.1592);
  animation: fall-94 11s -1s linear infinite;
}
@keyframes fall-94 {
  46.917% {
    transform: translate(53.945vw, 46.917vh) scale(0.1592);
  }
  to {
    transform: translate(52.6134vw, 70vh) scale(0.1592);
  }
}
.snow:nth-child(95) {
  opacity: 0.6897;
  transform: translate(1.112vw, -10px) scale(0.0345);
  animation: fall-95 20s -15s linear infinite;
}
@keyframes fall-95 {
  71.783% {
    transform: translate(-0.1694vw, 71.783vh) scale(0.0345);
  }
  to {
    transform: translate(0.4713vw, 70vh) scale(0.0345);
  }
}
.snow:nth-child(96) {
  opacity: 0.1084;
  transform: translate(84.5065vw, -10px) scale(0.6764);
  animation: fall-96 27s -7s linear infinite;
}
@keyframes fall-96 {
  78.397% {
    transform: translate(79.9411vw, 78.397vh) scale(0.6764);
  }
  to {
    transform: translate(82.2238vw, 70vh) scale(0.6764);
  }
}
.snow:nth-child(97) {
  opacity: 0.4278;
  transform: translate(82.6217vw, -10px) scale(0.9538);
  animation: fall-97 25s -11s linear infinite;
}
@keyframes fall-97 {
  56.064% {
    transform: translate(83.6235vw, 56.064vh) scale(0.9538);
  }
  to {
    transform: translate(83.1226vw, 70vh) scale(0.9538);
  }
}
.snow:nth-child(98) {
  opacity: 0.3788;
  transform: translate(2.5699vw, -10px) scale(0.6051);
  animation: fall-98 18s -5s linear infinite;
}
@keyframes fall-98 {
  32.78% {
    transform: translate(7.4327vw, 32.78vh) scale(0.6051);
  }
  to {
    transform: translate(5.0013vw, 70vh) scale(0.6051);
  }
}
.snow:nth-child(99) {
  opacity: 0.9728;
  transform: translate(38.3313vw, -10px) scale(0.9836);
  animation: fall-99 14s -10s linear infinite;
}
@keyframes fall-99 {
  67.581% {
    transform: translate(37.0121vw, 67.581vh) scale(0.9836);
  }
  to {
    transform: translate(37.6717vw, 70vh) scale(0.9836);
  }
}
.snow:nth-child(100) {
  opacity: 0.0032;
  transform: translate(92.7286vw, -10px) scale(0.9419);
  animation: fall-100 30s -24s linear infinite;
}
@keyframes fall-100 {
  76.613% {
    transform: translate(85.8047vw, 76.613vh) scale(0.9419);
  }
  to {
    transform: translate(89.26665vw, 70vh) scale(0.9419);
  }
}
.snow:nth-child(101) {
  opacity: 0.7491;
  transform: translate(46.4733vw, -10px) scale(0.1963);
  animation: fall-101 14s -21s linear infinite;
}
@keyframes fall-101 {
  72.727% {
    transform: translate(44.8495vw, 72.727vh) scale(0.1963);
  }
  to {
    transform: translate(45.6614vw, 70vh) scale(0.1963);
  }
}
.snow:nth-child(102) {
  opacity: 0.6167;
  transform: translate(74.9554vw, -10px) scale(0.5497);
  animation: fall-102 21s -26s linear infinite;
}
@keyframes fall-102 {
  54.356% {
    transform: translate(65.7745vw, 54.356vh) scale(0.5497);
  }
  to {
    transform: translate(70.36495vw, 70vh) scale(0.5497);
  }
}
.snow:nth-child(103) {
  opacity: 0.2291;
  transform: translate(46.1438vw, -10px) scale(0.9976);
  animation: fall-103 30s -16s linear infinite;
}
@keyframes fall-103 {
  59.756% {
    transform: translate(47.5004vw, 59.756vh) scale(0.9976);
  }
  to {
    transform: translate(46.8221vw, 70vh) scale(0.9976);
  }
}
.snow:nth-child(104) {
  opacity: 0.7357;
  transform: translate(22.5564vw, -10px) scale(0.3178);
  animation: fall-104 22s -8s linear infinite;
}
@keyframes fall-104 {
  56.664% {
    transform: translate(23.0933vw, 56.664vh) scale(0.3178);
  }
  to {
    transform: translate(22.82485vw, 70vh) scale(0.3178);
  }
}
.snow:nth-child(105) {
  opacity: 0.8405;
  transform: translate(44.6776vw, -10px) scale(0.5625);
  animation: fall-105 14s -30s linear infinite;
}
@keyframes fall-105 {
  68.549% {
    transform: translate(50.992vw, 68.549vh) scale(0.5625);
  }
  to {
    transform: translate(47.8348vw, 70vh) scale(0.5625);
  }
}
.snow:nth-child(106) {
  opacity: 0.4317;
  transform: translate(77.1537vw, -10px) scale(0.1413);
  animation: fall-106 10s -13s linear infinite;
}
@keyframes fall-106 {
  74.895% {
    transform: translate(69.001vw, 74.895vh) scale(0.1413);
  }
  to {
    transform: translate(73.07735vw, 70vh) scale(0.1413);
  }
}
.snow:nth-child(107) {
  opacity: 0.5452;
  transform: translate(26.1648vw, -10px) scale(0.1833);
  animation: fall-107 25s -11s linear infinite;
}
@keyframes fall-107 {
  62.985% {
    transform: translate(28.2241vw, 62.985vh) scale(0.1833);
  }
  to {
    transform: translate(27.19445vw, 70vh) scale(0.1833);
  }
}
.snow:nth-child(108) {
  opacity: 0.2335;
  transform: translate(39.8312vw, -10px) scale(0.8224);
  animation: fall-108 29s -28s linear infinite;
}
@keyframes fall-108 {
  52.156% {
    transform: translate(42.654vw, 52.156vh) scale(0.8224);
  }
  to {
    transform: translate(41.2426vw, 70vh) scale(0.8224);
  }
}
.snow:nth-child(109) {
  opacity: 0.6637;
  transform: translate(26.2077vw, -10px) scale(0.1416);
  animation: fall-109 13s -22s linear infinite;
}
@keyframes fall-109 {
  75.268% {
    transform: translate(31.4766vw, 75.268vh) scale(0.1416);
  }
  to {
    transform: translate(28.84215vw, 70vh) scale(0.1416);
  }
}
.snow:nth-child(110) {
  opacity: 0.8282;
  transform: translate(33.5107vw, -10px) scale(0.025);
  animation: fall-110 10s -10s linear infinite;
}
@keyframes fall-110 {
  51.264% {
    transform: translate(40.1092vw, 51.264vh) scale(0.025);
  }
  to {
    transform: translate(36.80995vw, 70vh) scale(0.025);
  }
}
.snow:nth-child(111) {
  opacity: 0.4106;
  transform: translate(63.4715vw, -10px) scale(0.8617);
  animation: fall-111 19s -28s linear infinite;
}
@keyframes fall-111 {
  48.414% {
    transform: translate(67.2389vw, 48.414vh) scale(0.8617);
  }
  to {
    transform: translate(65.3552vw, 70vh) scale(0.8617);
  }
}
.snow:nth-child(112) {
  opacity: 0.4157;
  transform: translate(14.3909vw, -10px) scale(0.015);
  animation: fall-112 20s -5s linear infinite;
}
@keyframes fall-112 {
  44.713% {
    transform: translate(24.2753vw, 44.713vh) scale(0.015);
  }
  to {
    transform: translate(19.3331vw, 70vh) scale(0.015);
  }
}
.snow:nth-child(113) {
  opacity: 0.0694;
  transform: translate(29.8026vw, -10px) scale(0.5674);
  animation: fall-113 13s -2s linear infinite;
}
@keyframes fall-113 {
  77.655% {
    transform: translate(25.4536vw, 77.655vh) scale(0.5674);
  }
  to {
    transform: translate(27.6281vw, 70vh) scale(0.5674);
  }
}
.snow:nth-child(114) {
  opacity: 0.9044;
  transform: translate(6.1314vw, -10px) scale(0.581);
  animation: fall-114 11s -8s linear infinite;
}
@keyframes fall-114 {
  79.18% {
    transform: translate(-1.4478vw, 79.18vh) scale(0.581);
  }
  to {
    transform: translate(2.3418vw, 70vh) scale(0.581);
  }
}
.snow:nth-child(115) {
  opacity: 0.451;
  transform: translate(43.7548vw, -10px) scale(0.3003);
  animation: fall-115 28s -29s linear infinite;
}
@keyframes fall-115 {
  68.437% {
    transform: translate(50.6866vw, 68.437vh) scale(0.3003);
  }
  to {
    transform: translate(47.2207vw, 70vh) scale(0.3003);
  }
}
.snow:nth-child(116) {
  opacity: 0.8075;
  transform: translate(53.5116vw, -10px) scale(0.6077);
  animation: fall-116 16s -3s linear infinite;
}
@keyframes fall-116 {
  42.395% {
    transform: translate(50.0271vw, 42.395vh) scale(0.6077);
  }
  to {
    transform: translate(51.76935vw, 70vh) scale(0.6077);
  }
}
.snow:nth-child(117) {
  opacity: 0.2474;
  transform: translate(59.8924vw, -10px) scale(0.5277);
  animation: fall-117 29s -4s linear infinite;
}
@keyframes fall-117 {
  70.899% {
    transform: translate(60.3676vw, 70.899vh) scale(0.5277);
  }
  to {
    transform: translate(60.13vw, 70vh) scale(0.5277);
  }
}
.snow:nth-child(118) {
  opacity: 0.9751;
  transform: translate(35.8286vw, -10px) scale(0.3071);
  animation: fall-118 17s -24s linear infinite;
}
@keyframes fall-118 {
  64.946% {
    transform: translate(43.1602vw, 64.946vh) scale(0.3071);
  }
  to {
    transform: translate(39.4944vw, 70vh) scale(0.3071);
  }
}
.snow:nth-child(119) {
  opacity: 0.2852;
  transform: translate(74.3941vw, -10px) scale(0.246);
  animation: fall-119 11s -25s linear infinite;
}
@keyframes fall-119 {
  70.49% {
    transform: translate(72.3452vw, 70.49vh) scale(0.246);
  }
  to {
    transform: translate(73.36965vw, 70vh) scale(0.246);
  }
}
.snow:nth-child(120) {
  opacity: 0.4061;
  transform: translate(17.9469vw, -10px) scale(0.6662);
  animation: fall-120 24s -13s linear infinite;
}
@keyframes fall-120 {
  49.455% {
    transform: translate(14.5789vw, 49.455vh) scale(0.6662);
  }
  to {
    transform: translate(16.2629vw, 70vh) scale(0.6662);
  }
}
.snow:nth-child(121) {
  opacity: 0.6509;
  transform: translate(69.0405vw, -10px) scale(0.4692);
  animation: fall-121 15s -25s linear infinite;
}
@keyframes fall-121 {
  70.553% {
    transform: translate(77.886vw, 70.553vh) scale(0.4692);
  }
  to {
    transform: translate(73.46325vw, 70vh) scale(0.4692);
  }
}
.snow:nth-child(122) {
  opacity: 0.7785;
  transform: translate(49.7467vw, -10px) scale(0.8303);
  animation: fall-122 13s -22s linear infinite;
}
@keyframes fall-122 {
  57.055% {
    transform: translate(56.9621vw, 57.055vh) scale(0.8303);
  }
  to {
    transform: translate(53.3544vw, 70vh) scale(0.8303);
  }
}
.snow:nth-child(123) {
  opacity: 0.5359;
  transform: translate(6.8012vw, -10px) scale(0.7648);
  animation: fall-123 30s -27s linear infinite;
}
@keyframes fall-123 {
  76.539% {
    transform: translate(3.751vw, 76.539vh) scale(0.7648);
  }
  to {
    transform: translate(5.2761vw, 70vh) scale(0.7648);
  }
}
.snow:nth-child(124) {
  opacity: 0.5137;
  transform: translate(5.1029vw, -10px) scale(0.408);
  animation: fall-124 28s -17s linear infinite;
}
@keyframes fall-124 {
  77.493% {
    transform: translate(10.609vw, 77.493vh) scale(0.408);
  }
  to {
    transform: translate(7.85595vw, 70vh) scale(0.408);
  }
}
.snow:nth-child(125) {
  opacity: 0.2422;
  transform: translate(25.0067vw, -10px) scale(0.1531);
  animation: fall-125 24s -6s linear infinite;
}
@keyframes fall-125 {
  70.453% {
    transform: translate(26.6371vw, 70.453vh) scale(0.1531);
  }
  to {
    transform: translate(25.8219vw, 70vh) scale(0.1531);
  }
}
.snow:nth-child(126) {
  opacity: 0.8841;
  transform: translate(2.2837vw, -10px) scale(0.5128);
  animation: fall-126 27s -20s linear infinite;
}
@keyframes fall-126 {
  79.499% {
    transform: translate(-0.8506vw, 79.499vh) scale(0.5128);
  }
  to {
    transform: translate(0.71655vw, 70vh) scale(0.5128);
  }
}
.snow:nth-child(127) {
  opacity: 0.622;
  transform: translate(23.0276vw, -10px) scale(0.3178);
  animation: fall-127 21s -22s linear infinite;
}
@keyframes fall-127 {
  52.454% {
    transform: translate(28.9813vw, 52.454vh) scale(0.3178);
  }
  to {
    transform: translate(26.00445vw, 70vh) scale(0.3178);
  }
}
.snow:nth-child(128) {
  opacity: 0.1152;
  transform: translate(55.2643vw, -10px) scale(0.7315);
  animation: fall-128 29s -21s linear infinite;
}
@keyframes fall-128 {
  42.497% {
    transform: translate(55.3711vw, 42.497vh) scale(0.7315);
  }
  to {
    transform: translate(55.3177vw, 70vh) scale(0.7315);
  }
}
.snow:nth-child(129) {
  opacity: 0.0241;
  transform: translate(11.3815vw, -10px) scale(0.0915);
  animation: fall-129 10s -26s linear infinite;
}
@keyframes fall-129 {
  46.276% {
    transform: translate(5.4434vw, 46.276vh) scale(0.0915);
  }
  to {
    transform: translate(8.41245vw, 70vh) scale(0.0915);
  }
}
.snow:nth-child(130) {
  opacity: 0.4203;
  transform: translate(78.6192vw, -10px) scale(0.6426);
  animation: fall-130 30s -11s linear infinite;
}
@keyframes fall-130 {
  41.471% {
    transform: translate(85.3813vw, 41.471vh) scale(0.6426);
  }
  to {
    transform: translate(82.00025vw, 70vh) scale(0.6426);
  }
}
.snow:nth-child(131) {
  opacity: 0.5541;
  transform: translate(56.0467vw, -10px) scale(0.8415);
  animation: fall-131 26s -19s linear infinite;
}
@keyframes fall-131 {
  53.762% {
    transform: translate(51.0467vw, 53.762vh) scale(0.8415);
  }
  to {
    transform: translate(53.5467vw, 70vh) scale(0.8415);
  }
}
.snow:nth-child(132) {
  opacity: 0.0901;
  transform: translate(93.8155vw, -10px) scale(0.9014);
  animation: fall-132 24s -14s linear infinite;
}
@keyframes fall-132 {
  66.118% {
    transform: translate(94.1314vw, 66.118vh) scale(0.9014);
  }
  to {
    transform: translate(93.97345vw, 70vh) scale(0.9014);
  }
}
.snow:nth-child(133) {
  opacity: 0.6575;
  transform: translate(42.776vw, -10px) scale(0.6848);
  animation: fall-133 16s -10s linear infinite;
}
@keyframes fall-133 {
  70.252% {
    transform: translate(43.4529vw, 70.252vh) scale(0.6848);
  }
  to {
    transform: translate(43.11445vw, 70vh) scale(0.6848);
  }
}
.snow:nth-child(134) {
  opacity: 0.7552;
  transform: translate(79.5383vw, -10px) scale(0.2269);
  animation: fall-134 18s -21s linear infinite;
}
@keyframes fall-134 {
  55.205% {
    transform: translate(81.1619vw, 55.205vh) scale(0.2269);
  }
  to {
    transform: translate(80.3501vw, 70vh) scale(0.2269);
  }
}
.snow:nth-child(135) {
  opacity: 0.1853;
  transform: translate(50.7862vw, -10px) scale(0.1392);
  animation: fall-135 17s -14s linear infinite;
}
@keyframes fall-135 {
  36.447% {
    transform: translate(41.6156vw, 36.447vh) scale(0.1392);
  }
  to {
    transform: translate(46.2009vw, 70vh) scale(0.1392);
  }
}
.snow:nth-child(136) {
  opacity: 0.6879;
  transform: translate(74.9035vw, -10px) scale(0.0661);
  animation: fall-136 29s -30s linear infinite;
}
@keyframes fall-136 {
  45.822% {
    transform: translate(82.5344vw, 45.822vh) scale(0.0661);
  }
  to {
    transform: translate(78.71895vw, 70vh) scale(0.0661);
  }
}
.snow:nth-child(137) {
  opacity: 0.7894;
  transform: translate(29.3049vw, -10px) scale(0.0843);
  animation: fall-137 28s -14s linear infinite;
}
@keyframes fall-137 {
  30.776% {
    transform: translate(28.1vw, 30.776vh) scale(0.0843);
  }
  to {
    transform: translate(28.70245vw, 70vh) scale(0.0843);
  }
}
.snow:nth-child(138) {
  opacity: 0.3809;
  transform: translate(47.4244vw, -10px) scale(0.1983);
  animation: fall-138 24s -14s linear infinite;
}
@keyframes fall-138 {
  36.118% {
    transform: translate(41.9888vw, 36.118vh) scale(0.1983);
  }
  to {
    transform: translate(44.7066vw, 70vh) scale(0.1983);
  }
}
.snow:nth-child(139) {
  opacity: 0.0226;
  transform: translate(60.8839vw, -10px) scale(0.9959);
  animation: fall-139 21s -21s linear infinite;
}
@keyframes fall-139 {
  63.795% {
    transform: translate(66.6766vw, 63.795vh) scale(0.9959);
  }
  to {
    transform: translate(63.78025vw, 70vh) scale(0.9959);
  }
}
.snow:nth-child(140) {
  opacity: 0.2435;
  transform: translate(14.03vw, -10px) scale(0.53);
  animation: fall-140 17s -2s linear infinite;
}
@keyframes fall-140 {
  41.267% {
    transform: translate(20.4461vw, 41.267vh) scale(0.53);
  }
  to {
    transform: translate(17.23805vw, 70vh) scale(0.53);
  }
}
.snow:nth-child(141) {
  opacity: 0.6379;
  transform: translate(93.2582vw, -10px) scale(0.8666);
  animation: fall-141 11s -7s linear infinite;
}
@keyframes fall-141 {
  59.464% {
    transform: translate(91.9825vw, 59.464vh) scale(0.8666);
  }
  to {
    transform: translate(92.62035vw, 70vh) scale(0.8666);
  }
}
.snow:nth-child(142) {
  opacity: 0.419;
  transform: translate(80.6137vw, -10px) scale(0.5301);
  animation: fall-142 10s -27s linear infinite;
}
@keyframes fall-142 {
  37.176% {
    transform: translate(70.7735vw, 37.176vh) scale(0.5301);
  }
  to {
    transform: translate(75.6936vw, 70vh) scale(0.5301);
  }
}
.snow:nth-child(143) {
  opacity: 0.7608;
  transform: translate(46.9766vw, -10px) scale(0.9246);
  animation: fall-143 25s -15s linear infinite;
}
@keyframes fall-143 {
  41.369% {
    transform: translate(45.2277vw, 41.369vh) scale(0.9246);
  }
  to {
    transform: translate(46.10215vw, 70vh) scale(0.9246);
  }
}
.snow:nth-child(144) {
  opacity: 0.9991;
  transform: translate(66.0675vw, -10px) scale(0.4611);
  animation: fall-144 28s -19s linear infinite;
}
@keyframes fall-144 {
  38.906% {
    transform: translate(56.9005vw, 38.906vh) scale(0.4611);
  }
  to {
    transform: translate(61.484vw, 70vh) scale(0.4611);
  }
}
.snow:nth-child(145) {
  opacity: 0.5619;
  transform: translate(63.2965vw, -10px) scale(0.6774);
  animation: fall-145 15s -17s linear infinite;
}
@keyframes fall-145 {
  61.773% {
    transform: translate(63.1976vw, 61.773vh) scale(0.6774);
  }
  to {
    transform: translate(63.24705vw, 70vh) scale(0.6774);
  }
}
.snow:nth-child(146) {
  opacity: 0.4483;
  transform: translate(45.2761vw, -10px) scale(0.733);
  animation: fall-146 16s -1s linear infinite;
}
@keyframes fall-146 {
  74.603% {
    transform: translate(44.7929vw, 74.603vh) scale(0.733);
  }
  to {
    transform: translate(45.0345vw, 70vh) scale(0.733);
  }
}
.snow:nth-child(147) {
  opacity: 0.028;
  transform: translate(97.6932vw, -10px) scale(0.273);
  animation: fall-147 23s -28s linear infinite;
}
@keyframes fall-147 {
  64.719% {
    transform: translate(90.4796vw, 64.719vh) scale(0.273);
  }
  to {
    transform: translate(94.0864vw, 70vh) scale(0.273);
  }
}
.snow:nth-child(148) {
  opacity: 0.1344;
  transform: translate(32.9805vw, -10px) scale(0.031);
  animation: fall-148 30s -27s linear infinite;
}
@keyframes fall-148 {
  58.469% {
    transform: translate(36.2137vw, 58.469vh) scale(0.031);
  }
  to {
    transform: translate(34.5971vw, 70vh) scale(0.031);
  }
}
.snow:nth-child(149) {
  opacity: 0.9279;
  transform: translate(56.515vw, -10px) scale(0.613);
  animation: fall-149 24s -24s linear infinite;
}
@keyframes fall-149 {
  41.075% {
    transform: translate(54.175vw, 41.075vh) scale(0.613);
  }
  to {
    transform: translate(55.345vw, 70vh) scale(0.613);
  }
}
.snow:nth-child(150) {
  opacity: 0.6229;
  transform: translate(46.4494vw, -10px) scale(0.5325);
  animation: fall-150 17s -16s linear infinite;
}
@keyframes fall-150 {
  42.546% {
    transform: translate(55.4237vw, 42.546vh) scale(0.5325);
  }
  to {
    transform: translate(50.93655vw, 70vh) scale(0.5325);
  }
}
.snow:nth-child(151) {
  opacity: 0.9469;
  transform: translate(5.0126vw, -10px) scale(0.2385);
  animation: fall-151 27s -7s linear infinite;
}
@keyframes fall-151 {
  76.757% {
    transform: translate(10.3826vw, 76.757vh) scale(0.2385);
  }
  to {
    transform: translate(7.6976vw, 70vh) scale(0.2385);
  }
}
.snow:nth-child(152) {
  opacity: 0.1342;
  transform: translate(80.362vw, -10px) scale(0.1199);
  animation: fall-152 19s -5s linear infinite;
}
@keyframes fall-152 {
  74.892% {
    transform: translate(73.9577vw, 74.892vh) scale(0.1199);
  }
  to {
    transform: translate(77.15985vw, 70vh) scale(0.1199);
  }
}
.snow:nth-child(153) {
  opacity: 0.3483;
  transform: translate(22.5343vw, -10px) scale(0.8441);
  animation: fall-153 28s -25s linear infinite;
}
@keyframes fall-153 {
  50.786% {
    transform: translate(17.4097vw, 50.786vh) scale(0.8441);
  }
  to {
    transform: translate(19.972vw, 70vh) scale(0.8441);
  }
}
.snow:nth-child(154) {
  opacity: 0.0621;
  transform: translate(86.9919vw, -10px) scale(0.5524);
  animation: fall-154 29s -6s linear infinite;
}
@keyframes fall-154 {
  59.929% {
    transform: translate(85.3049vw, 59.929vh) scale(0.5524);
  }
  to {
    transform: translate(86.1484vw, 70vh) scale(0.5524);
  }
}
.snow:nth-child(155) {
  opacity: 0.215;
  transform: translate(36.5571vw, -10px) scale(0.5042);
  animation: fall-155 20s -24s linear infinite;
}
@keyframes fall-155 {
  39.872% {
    transform: translate(42.6403vw, 39.872vh) scale(0.5042);
  }
  to {
    transform: translate(39.5987vw, 70vh) scale(0.5042);
  }
}
.snow:nth-child(156) {
  opacity: 0.9771;
  transform: translate(11.1737vw, -10px) scale(0.1291);
  animation: fall-156 22s -13s linear infinite;
}
@keyframes fall-156 {
  62.529% {
    transform: translate(14.8174vw, 62.529vh) scale(0.1291);
  }
  to {
    transform: translate(12.99555vw, 70vh) scale(0.1291);
  }
}
.snow:nth-child(157) {
  opacity: 0.9069;
  transform: translate(57.8528vw, -10px) scale(0.6553);
  animation: fall-157 10s -20s linear infinite;
}
@keyframes fall-157 {
  44.523% {
    transform: translate(47.8656vw, 44.523vh) scale(0.6553);
  }
  to {
    transform: translate(52.8592vw, 70vh) scale(0.6553);
  }
}
.snow:nth-child(158) {
  opacity: 0.0708;
  transform: translate(82.7838vw, -10px) scale(0.8207);
  animation: fall-158 29s -16s linear infinite;
}
@keyframes fall-158 {
  30.67% {
    transform: translate(84.4849vw, 30.67vh) scale(0.8207);
  }
  to {
    transform: translate(83.63435vw, 70vh) scale(0.8207);
  }
}
.snow:nth-child(159) {
  opacity: 0.0879;
  transform: translate(16.6306vw, -10px) scale(0.5631);
  animation: fall-159 28s -3s linear infinite;
}
@keyframes fall-159 {
  56.825% {
    transform: translate(21.44vw, 56.825vh) scale(0.5631);
  }
  to {
    transform: translate(19.0353vw, 70vh) scale(0.5631);
  }
}
.snow:nth-child(160) {
  opacity: 0.4964;
  transform: translate(14.0197vw, -10px) scale(0.3599);
  animation: fall-160 19s -9s linear infinite;
}
@keyframes fall-160 {
  52.563% {
    transform: translate(12.2148vw, 52.563vh) scale(0.3599);
  }
  to {
    transform: translate(13.11725vw, 70vh) scale(0.3599);
  }
}
.snow:nth-child(161) {
  opacity: 0.247;
  transform: translate(69.0224vw, -10px) scale(0.1842);
  animation: fall-161 11s -26s linear infinite;
}
@keyframes fall-161 {
  65.963% {
    transform: translate(73.5275vw, 65.963vh) scale(0.1842);
  }
  to {
    transform: translate(71.27495vw, 70vh) scale(0.1842);
  }
}
.snow:nth-child(162) {
  opacity: 0.8163;
  transform: translate(64.9367vw, -10px) scale(0.074);
  animation: fall-162 27s -4s linear infinite;
}
@keyframes fall-162 {
  56.31% {
    transform: translate(61.698vw, 56.31vh) scale(0.074);
  }
  to {
    transform: translate(63.31735vw, 70vh) scale(0.074);
  }
}
.snow:nth-child(163) {
  opacity: 0.6109;
  transform: translate(67.4904vw, -10px) scale(0.8934);
  animation: fall-163 16s -27s linear infinite;
}
@keyframes fall-163 {
  60.098% {
    transform: translate(62.4365vw, 60.098vh) scale(0.8934);
  }
  to {
    transform: translate(64.96345vw, 70vh) scale(0.8934);
  }
}
.snow:nth-child(164) {
  opacity: 0.2711;
  transform: translate(17.0852vw, -10px) scale(0.6097);
  animation: fall-164 14s -20s linear infinite;
}
@keyframes fall-164 {
  46.513% {
    transform: translate(15.154vw, 46.513vh) scale(0.6097);
  }
  to {
    transform: translate(16.1196vw, 70vh) scale(0.6097);
  }
}
.snow:nth-child(165) {
  opacity: 0.7872;
  transform: translate(70.289vw, -10px) scale(0.6286);
  animation: fall-165 25s -12s linear infinite;
}
@keyframes fall-165 {
  61.663% {
    transform: translate(77.6052vw, 61.663vh) scale(0.6286);
  }
  to {
    transform: translate(73.9471vw, 70vh) scale(0.6286);
  }
}
.snow:nth-child(166) {
  opacity: 0.658;
  transform: translate(98.7755vw, -10px) scale(0.7437);
  animation: fall-166 19s -1s linear infinite;
}
@keyframes fall-166 {
  33.629% {
    transform: translate(89.1757vw, 33.629vh) scale(0.7437);
  }
  to {
    transform: translate(93.9756vw, 70vh) scale(0.7437);
  }
}
.snow:nth-child(167) {
  opacity: 0.3573;
  transform: translate(52.5019vw, -10px) scale(0.7348);
  animation: fall-167 20s -27s linear infinite;
}
@keyframes fall-167 {
  40.64% {
    transform: translate(56.641vw, 40.64vh) scale(0.7348);
  }
  to {
    transform: translate(54.57145vw, 70vh) scale(0.7348);
  }
}
.snow:nth-child(168) {
  opacity: 0.2345;
  transform: translate(10.0527vw, -10px) scale(0.4347);
  animation: fall-168 16s -19s linear infinite;
}
@keyframes fall-168 {
  53.992% {
    transform: translate(9.0397vw, 53.992vh) scale(0.4347);
  }
  to {
    transform: translate(9.5462vw, 70vh) scale(0.4347);
  }
}
.snow:nth-child(169) {
  opacity: 0.0236;
  transform: translate(94.7791vw, -10px) scale(0.0033);
  animation: fall-169 24s -2s linear infinite;
}
@keyframes fall-169 {
  70.763% {
    transform: translate(87.3934vw, 70.763vh) scale(0.0033);
  }
  to {
    transform: translate(91.08625vw, 70vh) scale(0.0033);
  }
}
.snow:nth-child(170) {
  opacity: 0.8119;
  transform: translate(67.1522vw, -10px) scale(0.9546);
  animation: fall-170 15s -6s linear infinite;
}
@keyframes fall-170 {
  74.696% {
    transform: translate(64.545vw, 74.696vh) scale(0.9546);
  }
  to {
    transform: translate(65.8486vw, 70vh) scale(0.9546);
  }
}
.snow:nth-child(171) {
  opacity: 0.0378;
  transform: translate(28.8249vw, -10px) scale(0.7192);
  animation: fall-171 18s -8s linear infinite;
}
@keyframes fall-171 {
  30.887% {
    transform: translate(35.171vw, 30.887vh) scale(0.7192);
  }
  to {
    transform: translate(31.99795vw, 70vh) scale(0.7192);
  }
}
.snow:nth-child(172) {
  opacity: 0.0704;
  transform: translate(47.7009vw, -10px) scale(0.1334);
  animation: fall-172 26s -9s linear infinite;
}
@keyframes fall-172 {
  78.266% {
    transform: translate(50.5498vw, 78.266vh) scale(0.1334);
  }
  to {
    transform: translate(49.12535vw, 70vh) scale(0.1334);
  }
}
.snow:nth-child(173) {
  opacity: 0.8717;
  transform: translate(4.9834vw, -10px) scale(0.3526);
  animation: fall-173 30s -8s linear infinite;
}
@keyframes fall-173 {
  41.14% {
    transform: translate(14.9014vw, 41.14vh) scale(0.3526);
  }
  to {
    transform: translate(9.9424vw, 70vh) scale(0.3526);
  }
}
.snow:nth-child(174) {
  opacity: 0.0709;
  transform: translate(19.6762vw, -10px) scale(0.0231);
  animation: fall-174 16s -11s linear infinite;
}
@keyframes fall-174 {
  73.153% {
    transform: translate(27.9043vw, 73.153vh) scale(0.0231);
  }
  to {
    transform: translate(23.79025vw, 70vh) scale(0.0231);
  }
}
.snow:nth-child(175) {
  opacity: 0.994;
  transform: translate(84.2702vw, -10px) scale(0.7007);
  animation: fall-175 30s -4s linear infinite;
}
@keyframes fall-175 {
  39.762% {
    transform: translate(79.4087vw, 39.762vh) scale(0.7007);
  }
  to {
    transform: translate(81.83945vw, 70vh) scale(0.7007);
  }
}
.snow:nth-child(176) {
  opacity: 0.5497;
  transform: translate(65.701vw, -10px) scale(0.3664);
  animation: fall-176 12s -4s linear infinite;
}
@keyframes fall-176 {
  49.27% {
    transform: translate(73.1944vw, 49.27vh) scale(0.3664);
  }
  to {
    transform: translate(69.4477vw, 70vh) scale(0.3664);
  }
}
.snow:nth-child(177) {
  opacity: 0.8407;
  transform: translate(0.7801vw, -10px) scale(0.7659);
  animation: fall-177 29s -1s linear infinite;
}
@keyframes fall-177 {
  58.871% {
    transform: translate(-5.0646vw, 58.871vh) scale(0.7659);
  }
  to {
    transform: translate(-2.14225vw, 70vh) scale(0.7659);
  }
}
.snow:nth-child(178) {
  opacity: 0.8597;
  transform: translate(24.413vw, -10px) scale(0.6525);
  animation: fall-178 15s -28s linear infinite;
}
@keyframes fall-178 {
  51.808% {
    transform: translate(31.8668vw, 51.808vh) scale(0.6525);
  }
  to {
    transform: translate(28.1399vw, 70vh) scale(0.6525);
  }
}
.snow:nth-child(179) {
  opacity: 0.6718;
  transform: translate(2.3735vw, -10px) scale(0.8424);
  animation: fall-179 30s -14s linear infinite;
}
@keyframes fall-179 {
  79.692% {
    transform: translate(-4.3351vw, 79.692vh) scale(0.8424);
  }
  to {
    transform: translate(-0.9808vw, 70vh) scale(0.8424);
  }
}
.snow:nth-child(180) {
  opacity: 0.003;
  transform: translate(37.3801vw, -10px) scale(0.4447);
  animation: fall-180 17s -18s linear infinite;
}
@keyframes fall-180 {
  54.866% {
    transform: translate(40.809vw, 54.866vh) scale(0.4447);
  }
  to {
    transform: translate(39.09455vw, 70vh) scale(0.4447);
  }
}
.snow:nth-child(181) {
  opacity: 0.9058;
  transform: translate(95.34vw, -10px) scale(0.957);
  animation: fall-181 21s -11s linear infinite;
}
@keyframes fall-181 {
  62.794% {
    transform: translate(89.3923vw, 62.794vh) scale(0.957);
  }
  to {
    transform: translate(92.36615vw, 70vh) scale(0.957);
  }
}
.snow:nth-child(182) {
  opacity: 0.0819;
  transform: translate(52.4301vw, -10px) scale(0.4474);
  animation: fall-182 20s -12s linear infinite;
}
@keyframes fall-182 {
  69.559% {
    transform: translate(47.4427vw, 69.559vh) scale(0.4474);
  }
  to {
    transform: translate(49.9364vw, 70vh) scale(0.4474);
  }
}
.snow:nth-child(183) {
  opacity: 0.2213;
  transform: translate(46.9037vw, -10px) scale(0.8341);
  animation: fall-183 15s -22s linear infinite;
}
@keyframes fall-183 {
  70.134% {
    transform: translate(47.4063vw, 70.134vh) scale(0.8341);
  }
  to {
    transform: translate(47.155vw, 70vh) scale(0.8341);
  }
}
.snow:nth-child(184) {
  opacity: 0.6058;
  transform: translate(89.9042vw, -10px) scale(0.048);
  animation: fall-184 16s -3s linear infinite;
}
@keyframes fall-184 {
  70.423% {
    transform: translate(93.4768vw, 70.423vh) scale(0.048);
  }
  to {
    transform: translate(91.6905vw, 70vh) scale(0.048);
  }
}
.snow:nth-child(185) {
  opacity: 0.564;
  transform: translate(83.8636vw, -10px) scale(0.9131);
  animation: fall-185 10s -3s linear infinite;
}
@keyframes fall-185 {
  60.141% {
    transform: translate(85.4377vw, 60.141vh) scale(0.9131);
  }
  to {
    transform: translate(84.65065vw, 70vh) scale(0.9131);
  }
}
.snow:nth-child(186) {
  opacity: 0.7571;
  transform: translate(68.4284vw, -10px) scale(0.0426);
  animation: fall-186 22s -18s linear infinite;
}
@keyframes fall-186 {
  42.447% {
    transform: translate(77.6616vw, 42.447vh) scale(0.0426);
  }
  to {
    transform: translate(73.045vw, 70vh) scale(0.0426);
  }
}
.snow:nth-child(187) {
  opacity: 0.3969;
  transform: translate(42.1433vw, -10px) scale(0.7352);
  animation: fall-187 25s -5s linear infinite;
}
@keyframes fall-187 {
  62.244% {
    transform: translate(51.6373vw, 62.244vh) scale(0.7352);
  }
  to {
    transform: translate(46.8903vw, 70vh) scale(0.7352);
  }
}
.snow:nth-child(188) {
  opacity: 0.2006;
  transform: translate(46.5903vw, -10px) scale(0.8787);
  animation: fall-188 29s -20s linear infinite;
}
@keyframes fall-188 {
  72.001% {
    transform: translate(55.3782vw, 72.001vh) scale(0.8787);
  }
  to {
    transform: translate(50.98425vw, 70vh) scale(0.8787);
  }
}
.snow:nth-child(189) {
  opacity: 0.3029;
  transform: translate(52.5405vw, -10px) scale(0.4121);
  animation: fall-189 26s -4s linear infinite;
}
@keyframes fall-189 {
  33.78% {
    transform: translate(60.8805vw, 33.78vh) scale(0.4121);
  }
  to {
    transform: translate(56.7105vw, 70vh) scale(0.4121);
  }
}
.snow:nth-child(190) {
  opacity: 0.2139;
  transform: translate(95.3597vw, -10px) scale(0.027);
  animation: fall-190 22s -21s linear infinite;
}
@keyframes fall-190 {
  71.508% {
    transform: translate(103.8881vw, 71.508vh) scale(0.027);
  }
  to {
    transform: translate(99.6239vw, 70vh) scale(0.027);
  }
}
.snow:nth-child(191) {
  opacity: 0.7373;
  transform: translate(49.2942vw, -10px) scale(0.1135);
  animation: fall-191 24s -20s linear infinite;
}
@keyframes fall-191 {
  64.32% {
    transform: translate(41.7115vw, 64.32vh) scale(0.1135);
  }
  to {
    transform: translate(45.50285vw, 70vh) scale(0.1135);
  }
}
.snow:nth-child(192) {
  opacity: 0.2919;
  transform: translate(36.1182vw, -10px) scale(0.3659);
  animation: fall-192 21s -21s linear infinite;
}
@keyframes fall-192 {
  74.267% {
    transform: translate(30.5903vw, 74.267vh) scale(0.3659);
  }
  to {
    transform: translate(33.35425vw, 70vh) scale(0.3659);
  }
}
.snow:nth-child(193) {
  opacity: 0.6778;
  transform: translate(22.9394vw, -10px) scale(0.102);
  animation: fall-193 22s -18s linear infinite;
}
@keyframes fall-193 {
  43.957% {
    transform: translate(24.8707vw, 43.957vh) scale(0.102);
  }
  to {
    transform: translate(23.90505vw, 70vh) scale(0.102);
  }
}
.snow:nth-child(194) {
  opacity: 0.9476;
  transform: translate(61.5159vw, -10px) scale(0.1901);
  animation: fall-194 16s -16s linear infinite;
}
@keyframes fall-194 {
  68.514% {
    transform: translate(58.2127vw, 68.514vh) scale(0.1901);
  }
  to {
    transform: translate(59.8643vw, 70vh) scale(0.1901);
  }
}
.snow:nth-child(195) {
  opacity: 0.5806;
  transform: translate(36.5151vw, -10px) scale(0.5347);
  animation: fall-195 30s -5s linear infinite;
}
@keyframes fall-195 {
  77.146% {
    transform: translate(32.6765vw, 77.146vh) scale(0.5347);
  }
  to {
    transform: translate(34.5958vw, 70vh) scale(0.5347);
  }
}
.snow:nth-child(196) {
  opacity: 0.1775;
  transform: translate(65.4176vw, -10px) scale(0.1901);
  animation: fall-196 26s -29s linear infinite;
}
@keyframes fall-196 {
  45.065% {
    transform: translate(62.9751vw, 45.065vh) scale(0.1901);
  }
  to {
    transform: translate(64.19635vw, 70vh) scale(0.1901);
  }
}
.snow:nth-child(197) {
  opacity: 0.1644;
  transform: translate(89.3391vw, -10px) scale(0.0267);
  animation: fall-197 20s -10s linear infinite;
}
@keyframes fall-197 {
  48.711% {
    transform: translate(98.5268vw, 48.711vh) scale(0.0267);
  }
  to {
    transform: translate(93.93295vw, 70vh) scale(0.0267);
  }
}
.snow:nth-child(198) {
  opacity: 0.9161;
  transform: translate(68.9469vw, -10px) scale(0.369);
  animation: fall-198 17s -17s linear infinite;
}
@keyframes fall-198 {
  41.891% {
    transform: translate(65.8644vw, 41.891vh) scale(0.369);
  }
  to {
    transform: translate(67.40565vw, 70vh) scale(0.369);
  }
}
.snow:nth-child(199) {
  opacity: 0.5649;
  transform: translate(17.0877vw, -10px) scale(0.3745);
  animation: fall-199 25s -6s linear infinite;
}
@keyframes fall-199 {
  71.664% {
    transform: translate(10.9769vw, 71.664vh) scale(0.3745);
  }
  to {
    transform: translate(14.0323vw, 70vh) scale(0.3745);
  }
}
.snow:nth-child(200) {
  opacity: 0.7252;
  transform: translate(42.4862vw, -10px) scale(0.5863);
  animation: fall-200 12s -17s linear infinite;
}
@keyframes fall-200 {
  69.127% {
    transform: translate(39.96vw, 69.127vh) scale(0.5863);
  }
  to {
    transform: translate(41.2231vw, 70vh) scale(0.5863);
  }
}


.enlergecesi {
  margin: 0;
  overflow: hidden;
  background: url(image/spot.jpg);
  background-color:#000 ;
  background-repeat: no-repeat;
  background-position: 100%;
}

.enlergecesi .overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
}


.mainnav {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.mainnav {
  font-family: "ROBOTO", sans-serif;
}

.mainnav .nav,
.mainnav .slider {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  position: relative;
  background-color: #1e1f26;
  text-align: center;
  padding: 0 2em;
}

.mainnav .nav h1,
.mainnav .slider h1 {
  font-family: "Josefin Sans", sans-serif;
  font-size: 5vw;
  margin: 0;
  padding-bottom: 0.5rem;
  letter-spacing: 0.5rem;
  color: #03dac6;
  transition: all 0.3s ease;
  z-index: 3;
}
.mainnav h1:hover {
  transform: translate3d(0, -10px, 22px);
  color: #ff0266;
}
.mainnav .nav h2,
.mainnav .slider h2 {
  font-size: 2vw;
  letter-spacing: 0.5rem;
  font-family: "ROBOTO", sans-serif;
  font-weight: 300;
  color: #faebd7;
  z-index: 4;
}

.mainnav a {
  text-decoration: none;
}

.mainnav .nav-container {
  display: flex;
  flex-direction: row;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 75px;
  box-shadow: 20px 20px 50px rgba(0, 0, 0, 0.5);
  background: #1e1f26;
  z-index: 10;
  transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

.mainnav .nav-container--top-first {
  position: fixed;
  top: 75px;
  transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
}

.mainnav .nav-container--top-second {
  position: fixed;
  top: 0;
}
.mainnav .nav-container--top-second {
  position: fixed;
  top: 0;
}

.mainnav .nav-tab {
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  color: #03dac6;
  letter-spacing: 0.1rem;
  transition: all 0.5s ease;
  font-size: 2vw;
}

.mainnav .nav-tab:hover {
  color: #1e1f26;
  background: #03dac6;
  transition: all 0.5s ease;
}

.mainnav .nav-tab-slider {
  position: absolute;
  bottom: 0;
  width: 0;
  height: 5px;
  background: #03dac6;
  transition: left 0.3s ease;
}
.mainnav .background {
  position: absolute;
  height: 100vh;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: auto;
}
@media (min-width: 800px) {
  .mainnav .nav h1,
  .mainnav .slider h1 {
    font-size: 5vw;
  }

  .mainnav .nav h2,
  .mainnav .slider h2 {
    font-size: 3vw;
  }

  .mainnav .nav-tab {
    font-size: 3vw;
  }
}

@media screen only (min-width: 360px) {
  .mainnav .nav h1,
  .mainnav .slider h1 {
    font-size: 8vw;
  }

  .mainnav .nav h2,
  .mainnav .slider h2 {
    font-size: 2vw;
    letter-spacing: 0.2vw;
  }

  .mainnav .nav-tab {
    font-size: 1.2vw;
  }
}
.mainnav .background {
  position: absolute;
  height: 100vh;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 0;
}

#kayancocuklar {
    width: 100%;
    height: 100%;
    min-height: 430px;
    max-height: 430px;
    width: 100% !important;
    background-color: #b7989f;
    padding-top: 50px;
  }