.course{
    width:80%;
    margin:auto;
    text-align: center;
    padding-top:100px;
}
.h1{
    font-size:36px;
    font-weight:600;
}
p{
    color:#777;
    font-size:14px;
    font-weight: 300;
    line-height:22px;
    padding:10px;
}
.mydiv{
    width:80%;
    margin:auto;
    text-align: left;
    padding-top:100px;
    color:black;
    /* font-size:14px; */
    font-weight: 300;
    line-height:25px;
    /* padding:10px; */
    background: #ff7f0057;
    border-radius:10px;
    margin-bottom:1%;
    padding:20px 12px;
    box-sizing:border-box;
}
.course-col p{
    color:#777;
    font-size:13px;
    font-weight: 300;
    line-height:22px;
    padding:10px;
}
.row{
    margin-top:5%;
    display:flex;
    justify-content:space-between;
}

.course-col{
    flex-basis: 31%;
    background: #ff7f0085;
    border-radius:10px;
    margin-bottom:5%;
    padding:20px 12px;
    box-sizing:border-box;
    transition:0.5s;
    
    cursor: pointer;
}

h3{
    text-align:center;
    font-weight:600;
    margin:10px 0;
}

.course-col:hover{
    box-shadow: 0 0 20px 0px rgba(0,0,0,0.2);
}
.mydiv:hover{
    box-shadow: 0 0 20px 0px rgba(0,0,0,0.2);
}

@media(max-width:700px){
    .row{
        flex-direction:column;
    }
   .s1{
       height:200px;width:300px;
   }
}

#icons{
    width: 60px;
    text-align: center;
    position: relative;
}