@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

*{ font-family: 'Merriweather Sans', sans-serif; font-weight: lighter; }

@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;0,1000;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900;1,1000&display=swap');

h1, h2, h3, h4, h5{
    font-family: 'Mulish', sans-serif;
}


.bg-skilldy{
    background: linear-gradient(to right top, #FF2D69, #FFA747 70%, #FFF500)!important;
}

.btn-skilldy{
    background: linear-gradient(to right top, #FF2D69, #FFA747 70%, #FFF500)!important;
    -webkit-transition: 200ms ease-in-out;
    -moz-transition: 200ms ease-in-out;
    -o-transition: 200ms ease-in-out;
    transition: 200ms ease-in-out;
    border: 2px solid #040500;
}

/*
.btn-skilldy:hover{
    background: none!important;
    border-width: 2px;
    border-style: solid;
    border-radius: 15px;
    border-image: linear-gradient(to right top, #FF2D69, #FFA747 70%, #FFF500) 1;
} */

.btn-skilldy:hover {
    border-color: #ffce00!important;
    background: none!important;
}

.btn-oultine-skilldy{
    background: none!important;
    border-width: 2px;
    border-style: solid;
    border-radius: 15px;
    border-image: linear-gradient(to right top, #FF2D69, #FFA747 70%, #FFF500) 1;
}



.btn-skilldy-animate:hover{
    transform: scale(1.05);
}



.color-skilldy{
    background: -webkit-gradient( linear, left bottom, right top, from( #FF2D69), color-stop(0.7,  #FFA747), to(#FFF500) );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.rounded-6{ border-radius: 15px; }

.border-top-skilldy{
    border-top-width: 4px;
    border-top-style: solid;
    border-image: linear-gradient(to right top, #FF2D69, #FFA747 70%, #FFF500) 1;
}

.rounded-skilldy{
    border-radius: 2rem !important;
}

.btn-plus-skilldy{
    font-size: 60px;
    color: #CCCCCC;
}

.btn-plus-skilldy:hover{
    background: -webkit-gradient( linear, left bottom, right top, from( #FF2D69), color-stop(0.7,  #FFA747), to(#FFF500) );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn-skilldy-active{
    background: -webkit-gradient( linear, left bottom, right top, from( #FF2D69), color-stop(0.7,  #FFA747), to(#FFF500) );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn:focus {
    outline: none;
    box-shadow: none;
}


.flip-card {
    background-color: transparent;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.flip-card-front {
}

.flip-card-back {
    transform: rotateY(180deg);
}

.bg-skilldy-jaune{
    background: #ffce00!important;
}
.text-skilldy-jaune{
    color: #ffce00!important;
}

.bg-skilldy-orange{
    background: #ff8e39!important;
}
.text-skilldy-orange{
    color: #ff8e39!important;
}

.bg-skilldy-rose{
    background: #ff2d69!important;
}
.text-skilldy-rose{
    color: #ff2d69!important;
}

h1{
    font-size: 3.5rem;
}

@media all and (max-width: 800px) {
    .no-mobile {
        display: none;
    }
    h1, h2, h3, h4, h5{
        text-align: center!important;
    }
    h1{
        font-size: 2.5rem;
    }
    .text-start{
        text-align: center;
    }
    .fixed-mobile{
        position: absolute;
    }
    .min-height-mobile{
        min-height: 340px!important;
    }
    .padding-top-mobile{
        padding-top: 120px!important;
    }
    .center-mobile{
        text-align: center!important;
    }
}

@media all and (min-width: 801px) {
    .only-mobile {
        display: none;
    }

}

@media all and (max-width: 572px) {
    .mobile-center{
        text-align: center!important;
    }
    .img-mobile{ padding: 20px 60px; }
}