* {
        padding: 0;
        margin: 0;
        box-sizing: border-box;
        font-family: 'Poppins', sans-serif;
        font-style: normal;
        text-decoration: none;
	color: white;
	-webkit-user-drag: none;
        user-drag: none;
}

@keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(-10px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

.container {
        width: 100vw;
        min-height: 100dvh;
	background-image: 
		linear-gradient(90deg,rgba(56, 0, 25, 0.6) 15%, rgba(255, 249, 249, 0.6) 75%), 
		url("images/home-background.jpg");
	background-repeat: no-repeat;
  	background-position: center;
  	background-size: cover;
	display: flex;
	flex-direction: column;
}
.logo {
	position: absolute;
}
.info-container {
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1;
}
.info {
	opacity: 0;
        animation: fadeIn 0.8s ease-out forwards;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
}
.logo-text {
	object-fit: cover;
}
.date {
	font-weight: 800;
	color: white;
}
.social-icons {
	color: white;
	text-align: center;
	font-weight: 400;
}
.icons a:hover {
	filter: brightness(0.9);
}
.icons a {
	height: 100%;
	display: inline-block;
}
.count-num {
	aspect-ratio: 1 / 1;
}

/*-------------------------------------------------------*/
/* SCREEN SIZE EXTRA SMALL*/

@media screen and (max-width: 576px) {

/*------------------------------------------------------*/

.container {
}
.info {
	gap: 12px;	
}
.logo {
	width: 100%;
	height: 111px;
	display: flex;
	padding-left: 25px;
}
.logo img {
	height: 100%;
	padding: 26px 0px;
}
.info-container {
}

.logo-text {
	width: 359px;
	height: 51px;
}
.date {
	font-size: 25px;
}
.countdown {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 80px;
	gap: 13px;
	justify-content: center;
}
.count-num {
	background-color: #E60067;
	color: white;
	width: 75px;
	height: 75px;
	text-align: center;
	border: 1px solid white;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.count-num div {
	font-size: 25px;
}
.count-num p {
	font-size: 11px;
}
.social-icons p {
	margin-bottom: 8px;
	font-size: 18px;
}


}



/*-------------------------------------------------------*/
/* SCREEN SIZE SMALL*/

@media screen and (min-width: 576px) and (max-width: 767.99px){

/*------------------------------------------------------*/
.container {
}
.info {
	gap: 12px;	
}
.logo {
	width: 100%;
	height: 106px;
	display: flex;
	padding-left: 25px;
}
.logo img {
	height: 100%;
	padding: 22px 0px;
}
.info-container { 
	padding: 89px 0px;	
}

.logo-text {
	width: 359px;
	height: 44px;
}
.date {
        font-size: 25px;
}
.countdown {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 80px;
	gap: 13px;
	justify-content: center;
}
.count-num {
	background-color: #E60067;
	color: white;
	width: 80px;
	height: 80px;
	text-align: center;
	border: 1px solid white;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.count-num div {
	font-size: 25px;
}
.count-num p {
	font-size: 11px;
}
.social-icons p {
	margin-bottom: 8px;
	font-size: 18px;
}


}



/*-------------------------------------------------------*/
/* SCREEN SIZE MEDIUM*/

@media screen and (min-width: 768px) and (max-width: 991.99px){

/*------------------------------------------------------*/
.container {
}
.info {
	gap: 19px;	
}
.logo {
	width: 100%;
	height: 126px;
	display: flex;
	padding-left: 25px;
}
.logo img {
	height: 100%;
	padding: 30px 0px;
}
.info-container {
	padding: 101px 0px;
}

.logo-text {
	width: 507px;
	height: 62px;
}
.date {
	font-size: 34px;
}
.countdown {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: auto;
	gap: 25px;
	justify-content: center;
}
.count-num {
	background-color: #E60067;
	color: white;
	width: 120px;
	height: 120px;
	text-align: center;
	border: 1px solid white;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.count-num div {
	font-size: 37px;
}
.count-num p {
	font-size: 16px;
}
.social-icons p {
	margin-bottom: 8px;
	font-size: 26px;
}
.icons a > img {
	width: 50px;
	height: 50px;
}



}





/*-------------------------------------------------------*/
/* SCREEN SIZE LARGE*/

@media screen and (min-width: 992px) and (max-width: 1199.99px){

/*------------------------------------------------------*/
.container {
}
.info {
	gap: 19px;	
}
.logo {
	width: 100%;
	height: 134px;
	display: flex;
	padding-left: 28px;
}
.logo img {
	height: 100%;
	padding: 30px 0px;
}
.info-container {
}

.logo-text {
	width: 507px;
	height: 62px;
}
.date {
	font-size: 34px;
}
.countdown {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: auto;
	gap: 25px;
	justify-content: center;
}
.count-num {
	background-color: #E60067;
	color: white;
	width: 120px;
	height: 120px;
	text-align: center;
	border: 1px solid white;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.count-num div {
	font-size: 37px;
}
.count-num p {
	font-size: 16px;
}
.social-icons p {
	margin-bottom: 8px;
	font-size: 26px;
}
.icons a > img {
	width: 50px;
	height: 50px;
}



}



/*-------------------------------------------------------*/
/* SCREEN SIZE EXTRA LARGE*/

@media screen and (min-width: 1200px) {

/*------------------------------------------------------*/
.container {
}
.info {
	gap: 19px;	
}
.logo {
	width: 100%;
	height: 126px;
	display: flex;
	padding-left: 28px;
}
.logo img {
	height: 113%;
	padding: 30px 0px;
}
.info-container {
}

.logo-text {
	width: 507px;
	height: 62px;
}
.date {
	font-size: 34px;
}
.countdown {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: auto;
	gap: 25px;
	justify-content: center;
}
.count-num {
	background-color: #E60067;
	color: white;
	width: 120px;
	height: 120px;
	text-align: center;
	border: 1px solid white;
	border-radius: 15px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.count-num div {
	font-size: 37px;
}
.count-num p {
	font-size: 16px;
}
.social-icons p {
	margin-bottom: 8px;
	font-size: 26px;
}
.icons a > img {
	width: 50px;
	height: 50px;
}



}