@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500&display=swap');

*{margin:0px; padding:0px; font-family: 'Quicksand', sans-serif;}

 body {
	 background-color: #bfd8d8;
}
body.no-scroll{overflow:hidden;}
.snow {
    position: fixed;
    top: 0;
    left: 0;
  right: 0;
  bottom:0;
    z-index: 2;
    pointer-events: none;
}
 #calendar {
	 position: absolute;
	 width: 53.9047619048vmax;
	 height: 90.4761904762vmax;
	 top: 12vmax;
	 left: calc(50% - 30.9523809524vmax);
	 
}
.topper-img{
    position: absolute;
    top: 0px;
    width: 100%;

}
.topper-img img{
    width: 100%;

}
.top-img{
	margin: auto;
    position: absolute;
    top: -5.5vmax;
	left:50%;
    margin-left: -9vmax;
	width: 26vmax;
}
.top-img img{width:100%;}
.bottom-img{
	 margin: auto;
    position: absolute;
    top: 100vmax;
    width: 100%;

}

.header{width:500px; margin:auto; padding:50px 0px;}
		.day .inner a, .day .inner p{display:none;}
		.day .inner img{width:100%; margin-top:40px;}
		.day.open.disable{opacity:0.6}
		.modal {
  visibility:hidden;
	opacity:0;
  position: fixed;
  z-index: 1; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.4); 
	transition-property: opacity;
  transition-duration: 500ms;
  transition-delay: 300ms;
	transition-timing-function: ease-in;
}


#ctaHome {
    text-decoration: none;
    background-image: none;
    background: #74c6c7;
    border: 1px solid #74c6c7;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: 'Quicksand','Helvetica Neue',Helvetica,sans-serif;
    font-weight: 700;
    padding: 8px 30px;
    font-size: 1.4rem;
    box-sizing: border-box;
    vertical-align: middle;
    text-transform: uppercase;
	margin: auto;
    position: absolute;
    top: 82.5vmax;
    left: 50%;
    margin-left: -2vmax;
	transition: all 0.3s ease-in;

}
#ctaHome:hover{
	background-color: #fff;
	color: #74c6c7;
}
#myModal.show{
	visibility:visible;
	opacity:1;
}

.modal-content {
  background-color: #fefefe;
  margin: 5% auto; 
  padding: 30px;
  border: 1px solid #888;
  width: 95%; 
	max-width:350px;
}
		.modal-content .modal-title{margin-bottom:30px; height: 20px;}
		.modal-content h5{float:left; color:#707070; font-size:20px; font-weight:400;}
		.modal-content img{
			width:100%;
			margin:auto;
		}
		.modal-content h4{margin:30px 0px; text-align: center; color: #707070; font-size:24px; line-height:30px; text-transform: uppercase;}
		.modal-content p{background-color: #74C6C7;
    padding: 20px 0px;
    text-align: center;
		}
		.modal-content a{width:100%; text-align:center; background-color:#74C6C7; text-transform: uppercase; padding:20px; color:#fff; text-decoration: none; margin-top:30px; font-weight:500;}

.close {
 color: #74C6C7;
    float: right;
    font-size: 60px;
    font-weight: normal;
    line-height: 20px;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}
		
.day {
	 position: absolute;
	 width: 9.5238095238vmax;
	 height: 9.5238095238vmax;
	 perspective: 800px;
	cursor:pointer;
}
.day.disable{cursor:default;}
 


.day .content_inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.day .content_inner img{
	width:100%;
}

.day.open .content_inner{
  transform: rotateY(180deg);
}

.cover, .inner {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the back side */
.inner {
  transform: rotateY(180deg);
}
.inner img{border-radius:50%;}

/*
 .day .cover div {
	 position: absolute;
	 width: 100%;
	 height: 100%;
	 backface-visibility: hidden;
	 background-color: #68B4B4;
}
 .day .cover .back {
	 transform: rotateY(180deg);
}
.day .cover div img{width:100%}
 .day.open .cover {
	 transform: rotateY(87deg);
}
 .day .inner {
	 position: absolute;
	 width: 100%;
	 height: 100%;
	 top: 0;
	 background-color: #fff;
}
*/

  #day0 {
	 left: 7.7619047619vmax;
	 top: 4.7619047619vmax;
}
 #day1 {
	 left: 20.0476190476vmax;
	 top: 4.7619047619vmax;
}
 #day2 {
	 left: 32.3333333333vmax;
	 top: 4.7619047619vmax;
}
 #day3 {
	 left: 44.619048vmax;
	 top: 4.7619047619vmax;
}
 #day4 {
	 left: 7.7619047619vmax;
	 top: 17.0476190476vmax;
}
 #day5 {
	 left: 20.0476190476vmax;
	 top: 17.0476190476vmax;
}
 #day6 {
	 left: 32.3333333333vmax;
	 top: 17.0476190476vmax;
}
 #day7 {
	 left: 44.619048vmax;
	 top: 17.0476190476vmax;
}
 #day8 {
	 left: 7.7619047619vmax;
	 top: 29.3333333333vmax;
}
 #day9 {
	 left: 20.0476190476vmax;
	 top: 29.3333333333vmax;
}
 #day10 {
	 left: 32.3333333333vmax;
	 top: 29.3333333333vmax;
}
 #day11 {
	 left: 44.619048vmax;
	 top: 29.3333333333vmax;
}
 #day12 {
	 left: 7.7619047619vmax;
	 top: 41.619047619vmax;
}
 #day13 {
	 left: 20.0476190476vmax;
	 top: 41.619047619vmax;
}
 #day14 {
	 left: 32.3333333333vmax;
	 top: 41.619047619vmax;
}
 #day15 {
	 left: 44.619048vmax;
	 top: 41.619047619vmax;
}
 #day16 {
	 left: 7.7619047619vmax;
	 top: 53.904762vmax;
}
 #day17 {
	 left: 20.0476190476vmax;
	 top: 53.904762vmax;
}
 #day18 {
	 left: 32.3333333333vmax;
	 top: 53.904762vmax;
}
 #day19 {
	 left: 44.619048vmax;
	 top: 53.904762vmax;
}
 #day20 {
	 left: 7.7619047619vmax;
	 top: 66.190476vmax;
}
 #day21 {
	 left: 20.0476190476vmax;
	 top: 66.190476vmax;
}
 #day22 {
	 left: 32.3333333333vmax;
	 top: 66.190476vmax;
}
 #day23 {
	 left: 44.619048vmax;
	 top: 66.190476vmax;
}

@media only screen and (max-width:1000px){
	.modal-content {
		max-width:800px;
	}
	.modal-content h5{font-size:40px;}
	.modal-content h4{font-size:30px; line-height:38px; margin: 50px 0px;}
	.close {font-size:100px;}
	.modal-content p{padding:30px 0px;}
	.modal-content a{font-size:40px;}
}