style.css

@import url('https://fonts.googleapis.com/css2?family=Satisfy&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik&display=swap');

body{
    margin: 0;
    padding: 0;
    font-family: 'Rubik', sans-serif;
}

.text-dif{
    font-family: 'Satisfy', cursive;
}

h1, h2, h3{
    font-weight: bold;
    font-family: 'Satisfy', cursive;
}

.Showcase,.bg-yellow, .getUpdated{
    background-color:cornflowerblue;
}

.item1-color{
    color:darkmagenta;
}

.back-item1{
    background-color:darkmagenta;
}

.item2-color{
    color:rgb(3, 190, 19);
}

.back-item2{
    background-color:rgb(3, 190, 19);
}

.item3-color{
    color:deeppink;
}

.back-item3{
    background-color:deeppink;
}

h2, h3{
    font-weight: bold;
}

@media (min-width: 768px){
    .news-input{
        width: 50%;
    }

    p{
        font-size:10px;
    }
}

@media (max-width: 768px){
    .grad-1 {
        background-image: linear-gradient(to right, darkmagenta , rgb(3, 190, 19));
        height: 5px;
        width: 95%;
        margin: auto;
        border-radius: 3px;
    }
    
    .grad-2 {
        background-image: linear-gradient(to right, deeppink, rgb(3, 190, 19));
        height: 5px;
        width: 95%;
        margin: auto;
        border-radius: 3px;
    }
}