.dataCard{
    background: linear-gradient(to right, #0054A4, #336699);
    margin: 20px 20px;
    padding: 10px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}
.video iframe{
    height: 200px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}
.title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 20px;
    font-weight: 500;
    color: #fff;
}
.save img{
    width: 25px;
}
.search{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 20px;
}
.search input[type=text]{
    border-radius: 10px;
    border: none;
    background: linear-gradient(to right, #0054A4, #336699);
    padding: 10px;
    width: 100%;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}
.search input[type=text]::placeholder{
    color: #fff;
    font-size: 15px;
    font-weight: 500;
}
.search input[type=text]:focus{
    outline: none !important;
    border: none;
}
/* ##################################################################################################################### */
/* ################################################# Media Query Starts ################################################ */
/* ##################################################################################################################### */

/* Non Mobiles Display None */
@media only screen and (max-width: 300px){
    body{
        display: none;
    }
}

/* For Small Mobiles */
@media only screen and (min-width: 320px){
    /* body{
        background-color: aqua;
    } */
}

/* For Medium Mobiles */
@media only screen and (min-width: 375px){
    /* body{
        background-color: red;
    } */
}

/* For Large Mobiles */
@media only screen and (min-width: 425px){
    /* body{
        background-color: green;
    } */
}

/* For Tablets */
@media only screen and (min-width: 768px){
    /* body{
        background-color: blue;
    } */
}

/* Non Mobiles Display None - No Desktop Support */
@media only screen and (min-width: 800px){
    body{
        display: none;
    }
}

/* ##################################################################################################################### */
/* ################################################# Media Query Ends ################################################## */
/* ##################################################################################################################### */