:root{
    --primary-color:#155FAD;
    --medium-blue:#00A6EE;
    --black:#010101;
    --light-black:#242424;
    --white:#fff;
    --light-blue:#E8FAFF;
    --primary-font:"Lexend", sans-serif;
    --secondary-font:"Teko", system-ui;
}
 
/*.main-btn{
    padding: 12px 29px 14px 29px;
    background: rgb(0,171,241);
    background: linear-gradient(180deg, rgba(0,171,241,1) 0%, rgba(2,107,199,1) 100%);
    color: var(--white);
    text-transform: uppercase;
    transition: all .4s ease-in-out;
}

.main-btn:hover{
    background: transparent;
    outline:1px solid var(--primary-color);
    border-radius: 25px;
    color: var(--primary-color);
}*/






.main-btn{
	font-family: inherit;
    font-size: 16px;
	color: var(--white);
	line-height: 1.3;
    font-weight: 400;
    text-transform: uppercase;
	border: none;
    background: rgb(0,171,241);
    background-image: linear-gradient(to right, #00AAF0, #0062b5, #00AAF0, #0062b5);
    background-size: 300% 100%;
	padding: 14px 29px;
	margin: 0;
	transition: all .4s ease-in-out;
}

.main-btn:hover{
    background-position: 100% 0;
}




.main-btn .fa-arrow-right-to-arc{
    margin-left: 17px;
}

.border-btn{
    color: var(--primary-color);
    background-color: transparent;
    border: 1px solid var(--primary-color);
    padding: 14px 29px;
    text-transform: uppercase;
    transition: all .4s ease-in-out;
    background-size: 300% 100%;
    
}

.border-btn:hover{ 
    background-image: linear-gradient(to right, #00AAF0, #0062b5, #00AAF0, #0062b5);
    border-color: transparent;
    color: var(--primary-color);
    color: var(--white);
    background-position: 100% 0;
}

.border-btn:hover .border-btn .fa-arrow-right-to-arc{
    color: var(--white);
}

.border-btn .fa-arrow-right-to-arc{
    margin-left: 17px;
}


#loader {
	color: #ffdb4e;
	text-align: center;
	padding: 0;
	margin: 10px 0 0 0;
	font-size: 14px;
    animation: loaderBlink 0.5s ease-in-out infinite alternate;
}

@keyframes loaderBlink{
    0%{ opacity: 0.7; }
    100%{ opacity: 0; }
}