html .text-color-sky,
html .text-sky {
    color: #00aeef !important;
}

html .text-color-sky-primary:hover,
html .text-hover-sky:hover {
    color: #0081b1 !important;
}

.mainLogo {
    width: 40%;
    position: absolute;
    left: 30%;
    top: calc(50vh - 20px);
    animation: fadeInDown; /* referring directly to the animation's @keyframe declaration */
		animation-duration: 2s;
}

.mainLogo img {
    width: 100%;
    display: block;
}

#hiddenCopy {
    display: none;
}

#header .header-nav.header-nav-line nav>ul>li>a.highlightBtn {
    background-color: #f72a32 !important;
    color: #ffffff;
}

#header .header-nav.header-nav-line nav>ul>li>a.highlightBtn:hover {
    background-color: #f72a32;
    color: #ffffff;
}
.logoBlock{
	display: none;
}
.flip-card .flip-front{
	background-color: #8EC5FC;
    background: linear-gradient(135deg, #ef4444 0%, #8b5cf6 50%, #0ea5e9 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3a3a', endColorstr='#00aeef', GradientType=1);
}
.flip-card .flip-front::before{
		content: '';
    position: absolute;
    top: 8px;
    right: 8px;
    bottom: 8px;
    left: 8px;
    background: #FFF;
}
.boxContent1 p.text-color-dark div{
    transition: all .3s;
}
.boxContent1 p.text-color-dark a{
    display: block;
    color: #0284c7;
    text-transform: capitalize;
    margin-top: 10px;
    cursor: pointer;
}
.boxContent1 p.text-color-dark a::after{
    content: " +";
    font-family: "Font Awesome 6 Free";
}
.messageOuter{
    width: 100%;
    max-width: 600px;
    border: 1px solid #ddd;
    margin: 0px auto;
}
.msgIcon{
    width: 100%;
    background-color: #22c55e;
    text-align: center;
    padding: 40px 40px;
}
.msgIcon.failedIcon{
    background-color: #ef4444;
}
.msgIcon i{
    color: #ffffff;
    font-size: 52px;
}
.messageOuter h2{
    width: 100%;
    text-align: center;
    padding: 15px;
    font-weight: 600;
    color: #22c55e;
    margin: 0px;
}
.messageOuter h2.failedMsg{
    color: #ef4444;
}
.messageOuter p{
    text-align: center;
    padding: 15px;
    padding-top: 0px;
}
@media only screen and (max-width: 600px) {
    .mainLogo {
        width: 80%;
        left: 10%;
    }

    .customNumberList {
        text-align: left;
    }

    .mobileHidden {
        display: none !important;
    }
    .logoBlock{
    	width: 100vw;
    	height: 100vh;
    	display: flex;
    	flex-direction: column;
    	justify-content: center;
    	align-items: center;
    	position: relative;
    	color: #fff;
    }
    .bannerTxtTop{
    	display: block;
    	opacity: 1;
    	font-size: 18px;
    	padding-bottom: 15px;
    	text-align: center;
    	animation: tada; /* referring directly to the animation's @keyframe declaration */
  		animation-duration: 2s;
    }
    .bannerTxtBottom{
    	display: block;
    	opacity: 1;
    	font-size: 18px;
    	padding-top: 15px;
    	text-align: center;
    	animation: flipInX; /* referring directly to the animation's @keyframe declaration */
  		animation-duration: 2s;
    }
    .bannerLogoCenter{
    	display: block;
    	width: 70%;
    	animation: jello; /* referring directly to the animation's @keyframe declaration */
  		animation-duration: 2s;
    }
    .bannerLogoCenter img{
    	width: 100%;
    }
}