﻿.btn-subject.active
{
    padding: 7px 20px;
    border-radius: 25px; /* border: 2px solid #2463EB; */
    background: #2463EB;
    color: #FFF;
    font-size: 14px;
    cursor: pointer;
}

.btn-subject
{
    padding: 8px 18px;
    border-radius: 25px;
    border: 1px solid #A1A1A1;
    background: #fff;
    font-size: 14px;
    cursor: pointer;
}
.box-shadow
{
    margin-bottom: 10px;
    border-top: 3px solid #434343;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.3);
    margin-bottom: 10px;
}
.box-shadow label
{
    /*padding: 1px 10px;     background: #D9D9D9;     border-radius: 10px;     margin-top: 5px;     font-size: 12px;*/
    color: #000;
}
.box-shadow p
{
    font-weight: 500;
}
.nopadding
{
    padding: 0;
}
.NotesLink
{
    background: #FFB18F;
    color: #000;
    font-weight: 500;
    margin: 10px 10px 10px 0px;
    padding: 3px; /* width: 57px; */
    display: block;
}

#main-content
{
    padding: 10px;
    box-shadow: 1px 1px 1px 1px rgb(0 0 0 / 50%);
    border: 1px solid #d1d1d1;
    text-align: left;
    margin-bottom: 30px;
}
#main-content h1
{
    margin: 0 0 10px 0;
    font-size: 16px;
    font-weight: 500;
}
#main-content h2
{
    margin: 0 0 10px 0;
    font-size: 15px;
    font-weight: 500;
}
#main-content h3
{
    margin: 0 0 10px 0;
    font-size: 14px;
    font-weight: 500;
}
#main-content li
{
    text-align: left;
}
#main-content ul
{
    list-style: disc;
}
.share-div
{
    background: #F5F5F5;
    padding: 5px 15px;
    margin: 0 0 10px 0;
}
.ModuleBtnOption
{
    text-align: right;
    margin-top: 5px;
}
.ModuleBtn img
{
    height: 15px;
}
.ModuleBtn
{
    padding: 5px;
    border-radius: 50%;
    background: #FFF;
}
.LeftModule
{
    position: sticky;
    top: 136px;
    z-index: 111;
    background: #FFF;
}

.flip-card
{
    background-color: transparent;
    border: 1px solid #969696;
    perspective: 1000px; /* height: 297px; */
    border-radius: 11px;
    height: 100%;
}

/* This container is needed to position the front and back side */
.flip-card-inner
{
    position: relative; /*width: 100%;*/
    height: 354px;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d; /* height: 100%; */
}

.col-md-4
{
    margin-bottom: 20px;
}
/* Do an horizontal flip when you move the mouse over the flip box container */
/* .flip-card:hover .flip-card-inner
        {
            transform: rotateY(180deg);
        }
        */
/* Position the front and back side */
.flip-card-front, .flip-card-back
{
    position: absolute; /*width: 218px;     height: 306px;*/
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 18px;
    border: 1px solid #FFF;
    height: 100%;
    width: 100%;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front
{
    background-color: #bbb;
    color: black;
}
.col-md-4 .flip-card-front img, .col-md-4 .flip-card-back img
{
    /* width: 218px !important; */ /* height: 306px; */
    height: 100%;
    max-width: 100%; /* height: auto; */
    width: 100%;
    border-radius: 10px;
}
/* Style the back side */
.flip-card-back
{
    background-color: dodgerblue;
    color: white;
    transform: rotateY(180deg);
}
.btn-rotate
{
    position: absolute;
    border: none;
    top: 85%;
    right: 18px;
    background: transparent;
    padding: 4px;
    border-radius: 5px;
}
.macMoreCourses .pagehead .pageHerosplitHeader
{
    padding: 20px 0 32px;
    position: relative;
}
.btn-rotate img
{
    height: 17px !important;
}
.pageHerosplitHeader:first-child
{
    padding: 25px 0 1px 0;
    margin-bottom: 25px;
    background-color: #F5E9FF;
    border-radius: 25px;
}
@media screen and (min-width: 768px)
{
    .subjectseo
    {
        width: 77%;
    }
    /*#main-content .col-md-3 img
        {
            width: 252px !important;
        }*/

    .flip-card-inner
    {
        height: 279px;
    }

}
@media screen and (max-width: 998px)
{
    /* #main-content .col-md-4, #main-content .col-md-3, #main-content .col-md-4.col-md-3
        {
            width: 50% !important;
            float: left !important;
        }*/
}
@media screen and (max-width: 768px)
{
    .subjectseo
    {
        width: 90%;
    }
    .LeftModule
    {
        position: absolute;
        z-index: 111;
        background: #FFF;
        width: 60%;
        margin-left: 4%;
    }
    /*.LeftModule
                                {
                                    display: none;
                                }*/

    .LeftModule
    {
        width: 266px;
        position: sticky;
        top: 135px;
    }
    .LeftModule .mobile-row
    {
        padding: 0;
        position: absolute;
        z-index: 99;
        background: white;
    }

}
.subjectseo
{
    margin: auto;
    padding: 10px 0 0 0;
    color: #40128B;
}
.subjectseo p
{
    font-size: 15px;
}
.title h1
{
    color: #40128B;
}
.pageHerosplitHeader:nth-child(2)
{
    position: sticky;
    top: 74px;
    background: #FFF;
    z-index: 1111;
    border-bottom: 1px solid #e2e2e2;
}
#main-content p
{
    font-size: 14px;
    text-align: justify;
    line-height: 1.6;
}
.activerow
{
    background: #ffb18f3d;
}
.activelink
{
    background: #2463eb;
    color: #ffffff;
}
.LeftModule p
{
    text-align: left;
}


