/* flex box css*/

.flex {
    display: flex;
    align-items: center;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-sb {
    justify-content: space-between;
}


/*--- element start from the left --*/

.flex-start {
    align-items: flex-start !important;
    justify-content: flex-start;
}


/*--- element start from the right --*/

.flex-end {
    align-items: flex-end !important;
    justify-content: flex-start;
}

.flex-col {
    flex-direction: column;
}


/*when the screen size is change the element wrap as the svreen size */

.flex-wrap {
    display: flex;
    flex-wrap: wrap;
}


/* gap for flex box */

.gap-15 {
    gap: 1.5rem !important;
}

.gap-20 {
    gap: 2rem !important;
}

.gap-3 {
    gap: 3rem !important;
}

.p-0 {
    padding: 0;
}

.m-0 {
    margin: 0;
}

.p-relative {
    position: relative;
}


/* button css */

.btn_hover1 {
    display: inline-block;
    position: relative;
    overflow: hidden;
    border-radius: 50px;
    border: 1.5px solid #68aa2e;
    z-index: 1;
    letter-spacing: 0.8px;
    background: linear-gradient(180deg, #65f307 0.01%, #f2fff1 100%);
    cursor: pointer;
}

.btn_hover1:before {
    border-radius: 50px;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all 0.3s ease-in;
    background: linear-gradient(42deg, #011230 0.01%, #2c7f29 100%);
    z-index: -1;
    top: 0;
    right: 0;
}

.btn_hover1:hover::before {
    width: 0;
    background: linear-gradient(42deg, #011230 0.01%, #2c7f29 100%);
}