html{
      scroll-behavior:smooth;
  }
  button#btn_expand:hover {
    background-color: #1884d6;
}
button#btn_expand {
    border-radius: 0px 0px 10px 10px;
}
  li{
        color:#fff;
    }
    p{
        color:#fff;
    }
.row3 {
    padding: 50px 10px 50px 10px;
}
      .card_header{
              background-color: #F2F1F8 !important;
            height: 500px;
            flex-direction: row-reverse;
            display: flex;
      }
      .img_header{
        object-fit: cover;
        border-radius: 10px;
        max-width: 600px;
      }
      .content_card_left{
        flex-direction: column;
        align-items: center;
      }
      .btn_viewcourse{
          width: 100%;
    font-weight: 500;
    margin-top: 15%;
    display: flex;
    justify-content: center;
    padding: 10px;
    border-radius: 10px;
    font-size: 19px;
    background-color: #46a2fd;
    color: #fff;
    transition:all 200ms ease-in-out;
      }
      .btn_viewcourse:hover{
          transform:translateY(-5px);
            color: #fff;
            background-color: #3a81c8;
            text-decoration:none;
            cursor:pointer;
      }
      .card_educ_info.front {
                      overflow: hidden;
            transition: height 0.5s ease-out;
    flex-direction: column;
    display: flex;
    border-radius: 10px;
    box-shadow: 1px -1px 20px 4px rgb(0, 0, 0, 0.2);
    background-color: #fff;
    padding: 10px;
    align-items: center;
}
.tab-content p {
    color: #000;
}
div#tab_b li {
    padding: 10px;
    color: #000;
}
.tab-content > .active {
    padding: 20px;
    display: block;
}
.card_horizontal{
    margin: 10px;
    transition: all 200ms ease-in-out;
    color: #fff;
    padding: 20px;
    align-items: center;
    justify-content: space-between;
    display: flex;
    border-radius: 10px;
    background-color: #46a2fd;
    width: 80%;
    height: 100px;
}
.card_horizontal:hover{
    transform:translateY(-10px);
}
.card_down {
        transition: all 200ms ease-in-out;
    padding: 15px;
    flex-direction: column;
    transition: all 400ms ease-in-out 0s;
    display: none;
    border-radius: 0px 10px 10px 10px;
    margin: 10px;
    box-shadow: 1px 4px 19px 4px;
    width: 80%;
}
div#container0 {
    padding: 0px !important;
}
.tab-content {
    padding: 0px !important;
}
                        #svg_requires{
                                transition: all 200ms ease-in-out;
                            transform: rotateX(0deg);
                        }
                        #svg_duration{
                                transition: all 200ms ease-in-out;
                        }
                        #svg_destination{
                                transition: all 200ms ease-in-out;
                        }
                        .card_down p{
                            color:#000;
                            font-size:15px;
                        }
                        .card_down li{
                            font-size:20px;
                            color:#000;
                        }
                        .card_content {
                        width: 100%;
                        }
                        .about-tab{
                        border-radius: 10px;
                        padding: 20px;
                        border: 3px outset #46a2fd;
                        flex-direction: column;
                        display: flex;
                        max-width: 80%;
                        }
                        .img_icon{
                            width:200px;
                        }
                        .content_mod {
                            justify-items: center;
                            padding: 10px;
                            grid-template-columns: repeat(3, 1fr);
                            flex-wrap: wrap;
                            display: grid;
                            width: 100%;
                            /* max-height: 100%; */
                        }
.content_mod p{
    color:#000 !important;
}
.container1{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: start;

}
.text-align-start{
    width:100%;
}
.container_about_educ{
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 20px;
}
.padding10px{
    padding: 10px;
}
.padding10px li{
    padding:10px;
}
.img_container{
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 300px;
}
.extra_info{
    flex-direction: column;
    display: flex;
}
.extra_info li{
    padding: 10px;
    color: #000;
}
.img-fluid{
    max-width:700px;
    position: relative;
    object-fit: cover;
}
/*---------------MEDIAQUERY---------------------------*/

    @media(max-width:1200px){
        .card_horizontal {
    width: 100%;
    }
        
        .row3{
            padding: 50px 0px 50px 0px;
        }
        .img-fluid{
        max-width:1000px;
        }
        .card_header {
            background-color: #F2F1F8 !important;
            height: auto;
            flex-direction: column;
            display: flex;
        }
        .card_header.img-fluid{
            object-fit: cover;
            height: 500px;
            max-width: 100%;
        }
    }
    @media(max-width:991px){
        .about-tab{
                max-width: 100%;
                height: auto;
        }
        .tab-content > .active {
    padding: 20px 0px;
    }
    }
    @media(max-width:768px){
        .card_down {
    width: 100%;
    }
        .card_educ_info.front {
    padding: 25px;
    }
        .container1 {
    padding-top: 30px;
    }
        .container_about_educ {
    flex-direction: column-reverse;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px;
}
        .content_mod {
    grid-template-columns: repeat(2, 1fr) !important;
    }
        .container, .container-sm {
                max-width: 100% !important;
            }
        .img_icon{
            width:150px;

        }

    }
        @media(max-width: 576px) {
    .modal-dialog {
        max-width: 60% !important;
        margin: 1.75rem auto;
    }
    .content_mod {
    grid-template-columns: repeat(1, 1fr) !important;
    }
    img {
    width: 100%;
}
        }