@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");


:root{
    --yellow : #FDC500;
    --green : #74B72A;
    --blue : #0177BF;
    --red : #fd0302;
    --purple : #0f1537;
}

.text-warning { color : #FDC500; }
.text-success { color : #74B72A; }
.text-primarys { color : #0177BF; }
.text-dangers { color : #fd0302; }
.text-grey { color: #F4F4F4; }
.text-purple { color: #0f1537; }
.bg-warning { background-color : #FDC500; }
.bg-success { background-color : #74B72A; } 
.bg-primary { background-color: #0177BF; }
.bg-danger { background-color : #fd0302; }
.bg-grey { background-color: #F4F4F4; }

body {
    font-family: 'Roboto', serif;
}

.p-text {
    font-family: 'Roboto', serif;
    font-size: 15px;
    line-height: 27px;
    font-weight: 500;
}

.hero-text h1{
    font-family: "Roboto Slab", serif;
    color: var(--yellow);
    font-size: 60px;

}

.hero-text h2{
    font-family: "Roboto Slab", serif;
    color: var(--green);
    font-size: 30px;

}

.hero-text h5{
    font-family: "Roboto Slab", serif;
}

.ms-n11 {
    margin-left: -11px;
}

.mt-n4 {
    margin-top: -1rem;
}

.r-slab {
    font-size: 14px;
    font-weight: 600;
}

.text-30 {
    font-size: 30px;
    font-family: "Roboto", serif;
    line-height: 1.8em;
}

.text-19 {
    font-size: 1.3em;
    line-height: 27px;
    color: #666666;
}

input, button, select, textarea {
    border: 1px solid #eee;
    padding: 9px 10px;
    box-shadow: none;
    text-shadow: none;
}

.box-icon {
    width: 60px;
    height: 60px;
    color: #FFF;
    background-color:  var(--blue);
}

.class-card {
    font-family: "Roboto Slab", serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 28.8px;
}

.start-19 {
    left: 19%;
}

.start-25 {
    left: 25%;
}

.box-icon:hover {
    background-color: #F4F4F4;
    border: 1px solid #EEE;
    color: var(--blue);
}

.course-bg {
    background-image: url("../images/course-bg/frontend.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
} 

.course-bg-gd {
    background-image: url("../images/course-bg/graphics.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
}

.course-bg-mgve {
    background-image: url("../images/course-bg/video-editing.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
}

.course-bg-forex {
    background-image: url("../images/course-bg/forex.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
}

.course-bg-ui-ux {
    background-image: url("../images/course-bg/UI-UX.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
}

.course-bg-cs {
    background-image: url("../images/course-bg/cybersecurity.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
}

.course-bg-no-code {
    background-image: url("../images/course-bg/no-code.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    border-radius: 5px !important;
}

.get-started-title {
    font-family: "Roboto Slab", serif;
    font-size: 2rem;
    color: var(--purple);
    line-height: 1;
}

.get-started-list {
    font-size: 1rem; 
    color: #000;
    font-weight: 500;
}

.join-class-md {
    text-align: center;
    font-size: 0.875rem;
    font-weight: 600;
    color: #FFF;
    text-transform: uppercase;
    text-decoration: none;
    background-color: var(--red);
    padding: 10px 20px;
    border-radius: 2px;
}

ul {
    list-style-type: none;
}

.my-50 {
    margin: 7rem auto;
}

.what-learn {
    font-size: 3rem;
    color: var(--purple);
    line-height: 1;
    text-align: left;
    font-family: Lato;
    font-weight: 700;
    font-style : normal
}

.blue-title {
    color: var(--blue);
    font-size: 2rem;
    line-height: 1.2;
}

.disc-offer {
    font-size: 2.5rem;
    text-align: center;
    font-family:Roboto;
    font-weight:700;
    font-style: normal;
}

.disc-duration {
    color: #5e7f96;
}

.disc-price {
    font-size: 3rem;
    font-weight: 700;
}

.strikethrough {
    position: relative;
    display: inline-block;
}

.strikethrough:after {
    position: absolute;
    content: "";
    left: 0;
    top: 50%;
    right: 0;
    border-top: 3px solid #dd0031 !important;
    border-color: inherit;
    -webkit-transform: rotate(+5deg);
    -moz-transform: rotate(+5deg);
    -ms-transform: rotate(+5deg);
    -o-transform: rotate(+5deg);
    transform: rotate(+5deg);
}

.strikethrough:before {
    position: absolute;
    content: "";
    left: 0;
    top: 50%;
    right: 0;
    border-top: 3px solid #dd0031 !important;
    border-color: inherit;
    -webkit-transform: rotate(-5deg);
    -moz-transform: rotate(-5deg);
    -ms-transform: rotate(-5deg);
    -o-transform: rotate(-5deg);
    transform: rotate(-5deg);
}

.join-class-md-blue {
    text-align: center;
    font-size: 1.2rem;
    font-weight: 500;
    color: #FFF;
    text-transform: capitalize;
    text-decoration: none;
    background-color: #006397;
    padding: 10px 20px;
    border-radius: 4px;
}

.small {
    color: #666666;
}

.std-testi-title {
    text-transform: uppercase;
    color:#006397;
    font-size:20px;
    font-weight:600;
}

.testimonial-text {
    height: auto !important; 
    max-height: unset !important; 
    display: block !important; 
    -webkit-line-clamp: unset !important;
}

.testimonial-card:hover {
    margin-top: -10px;
    transition: 1s;
}

.form-below-bg {
    background-color: #005C8D;
}

.faq-styling {
    font-size: 2rem;
    text-align: center;
    font-family:Lato;
}


@keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.blinking-text {
    font-size: 14px;
    color: rgb(255, 180, 40);
    animation: blink 1s infinite;
}