moodle_theme_ilb/scss/courselist.scss

@media screen and
(min-width: 200px) and
(max-width: 765px){
    .course-card-view {
        min-width: calc(100% - 0.5rem) !important;
        max-width: calc(100% - 0.5rem) !important;
    }
    .popover {
        max-width: 100% !important;
        width: 95% !important;
    }
}

@media screen and
(min-width: 766px) and
(max-width: 986px){
    .course-card-view {
        min-width: calc(50% - 0.5rem) !important;
        max-width: calc(50% - 0.5rem) !important;
    }
    .popover {
        max-width: 100% !important;
        width: 80% !important;
    }
}


@media screen and
(min-width: 987px) and
(max-width: 1250px){
    .course-card-view {
        min-width: calc(33% - 0.5rem) !important;
        max-width: calc(33% - 0.5rem) !important;
    }
    .popover {
        max-width: 100% !important;
        width: 80% !important;
    }

}

@media screen and
(min-width: 1251px) and
(max-width: 4080px){
    .popover {
        max-width: 100% !important;
        width: 60% !important;
    }

}
.course-card-view {
    box-shadow: 5px 5px 9px -4px rgba($black, .1);
    padding-bottom: 4rem;
    min-width: calc(25% - 0.5rem);
    max-width: calc(25% - 0.5rem);

    .course-card-img div {
        height: 6.5rem;
        background-position: top right;
        background-size: cover;
    }

    .card-see-more {
        position: absolute;
        bottom: 0;
        width: 100%;

        .btn {
            width: 90%;
        }
    }
}

body#page-enrol-index {
    .box.generalbox > div {
        @extend .course-card-view;
        position: relative;
    }
}



.minheight{
    background-position: top center !important;
}

.boxCursos {
    transition: box-shadow .3s;
    border: 1px solid #ccc;
    float: left;
    background: #fff; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  #011c35 1%, #E0E0E0 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(1%,#fff), color-stop(100%,#E0E0E0)); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover,  #fff 1%,#E0E0E0 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover,  #fff 1%,#E0E0E0 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover,  #fff 1%,#E0E0E0 100%); /* IE10+ */
    background: radial-gradient(ellipse at center,  #fff 1%,#E0E0E0 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0264d6', endColorstr='#1c2b5a',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
.tamanhoBoxCursos{
    max-height: 440px;
}
.boxCursos:hover {
    -webkit-box-shadow: 0px 0px 14px -2px rgba(0,0,0,1);
    -moz-box-shadow: 0px 0px 14px -2px rgba(0,0,0,1);
    box-shadow: 0px 0px 14px -2px rgba(0,0,0,1);
}

.btn-mais-info{
    color: white;
    background-color: #0069d9;
    border-color: #0069d9;
    border-radius: 5px;
}

.btn-mais-info:hover{
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58) !important;
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58)!important;
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58)!important;
    color: white!important;
    background-color: #0072ed !important;
    border-color: #0072ed !important;

}
.btn-primary:hover{
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58) !important;
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58)!important;
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58)!important;
    color: white!important;
    background-color: #0072ed !important;
    border-color: #0072ed !important;

}
.textCardEdited {
    font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
    font-size: 16px;
    text-align: center;
    text-transform: uppercase;
    text-rendering: optimizeLegibility;
    color: #444444;
}
.elegantshd {
    color: #131313;
    letter-spacing: .15em;
}

.propertiesTextColor{
    color:#303030;

}
.propertiesTextColor:hover{
    color:#787878 !important;
    text-decoration: none !important;
}

.btn-inscrever{
    color: #fff;
    background-color: #28a745;
    border-color: #28a745;
    border-radius: 5px;
    margin-top: 10px;
}

.btn-inscrever:hover{
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58) !important;
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58) !important;
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.58) !important;
    color: #fff !important;
    background-color: #30c752 !important;
    border-color: #30c752 !important;
}

.card-body{
    margin-bottom: 10px;
}