/*
00. Library override(ex. bootstrap etc) --------------------
01. Text and Typography ------------------------------------
02. Common element(ul,ol,li,body,div etc.) -----------------
03. Common class(padding, margin etc.) ---------------------
04. Header styles ------------------------------------------
05. Footer styles-------------------------------------------
06. Common content------------------------------------------
07. Pages and Posts-----------------------------------------
08. Extra styles--------------------------------------------
09. Media Query---------------------------------------------
*/
	/* End Table of Contents */

/* 00. Library override(ex. bootstrap etc) start*/
/* 00. Library override(ex. bootstrap etc)   end*/


/* 01. Text and Typography start */
/* 01. Text and Typography end */


/* 02. Common element(ul,ol,li,body,div etc.) start*/
/* 02. Common element(ul,ol,li,body,div etc.) end*/


/*03. Common class(padding, margin etc.) start*/
/*03. Common class(padding, margin etc.) end*/


/*04. Header styles start*/
.main-header .elementor-item-active{
    background: linear-gradient(90deg, #F7C833 0%, #7B33F7 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.main-header .menu-item:not(.contact-btn) .elementor-item{
    transition: 0.3s ease all;    
}

.main-header .menu-item:not(.contact-btn) .elementor-item:hover{
    background: linear-gradient(90deg, #F7C833 0%, #7B33F7 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: 0.3s ease all;
}



.main-header .menu-item.contact-btn a{
    padding: 18px 50px 18px 25px !important;
    position: relative;
    z-index: 1;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-direction: row-reverse;
    color: #ffffff !important;
    border-radius: 30px;
    font-weight: 500 !important;
    background: linear-gradient(90deg, #F7C833, #7B33F7, #F7C833);
    background-size: 200% 100%;
    background-position: left center;

    transition: background-position 0.5s ease;
}

.main-header .menu-item.contact-btn a::before{
    content: "";
    width: 16px;
    height: 16px;
    display: inline-block;
    background-image: url('../images/white-arrow.svg');
    background-size: contain;
    background-repeat: no-repeat;
    right: 25px;
    background-color: transparent !important;
        opacity: 1 !important;
}

.main-header .menu-item.contact-btn a::after{
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    border-radius: 30px;
    z-index: -1;

    background: linear-gradient(90deg, #F7C833, #7B33F7, #F7C833);
    background-size: 200% 100%;
    background-position: left center;

    transition: background-position 0.5s ease;
}

.main-header .menu-item.contact-btn a:hover{
    background-position: right center;
}

.main-header .menu-item.contact-btn a:hover::after{
    background-position: right center;
}



/*04. Header styles end*/


/*05. Footer styles start*/ 
/*05. Footer styles end*/


/*06. Common content start*/ 
/*06. Common content end*/


/*07. Pages and Posts satrt*/
	/*Homepage satrt*/
		
	/*Homepage end	*/
/*07. Pages and Posts end*/


/* 08. Extra styles start*/
/* 08. Extra styles end*/


/*09. Media Query start*/
		@media screen and (min-width: 992px) {

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

		}

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

		}

	/*Tablet*/
		@media screen and (max-width: 991px) {
	 
		}

	/*Small Device*/
		@media screen and (max-width: 767px) {

		}

	/*Mobile Device*/
		@media screen and (max-width: 640px) {
	 
		}

	/*Extra Small Mobile Device*/
		@media screen and (max-width: 480px) {
 
		}
		@media screen and (max-width: 420px) {

		}
/*09. Media Query end*/