* {
    margin: 0;
    padding: 0;
    outline: 0;
    /*border:.1px solid red;*/
}


/*update comment*/
@font-face {
    font-family: 'ProximaNovaRgRegular';
    src: url('fonts/proximanova-regular-webfont.eot');
    src: url('fonts/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/proximanova-regular-webfont.woff') format('woff'), url('fonts/proximanova-regular-webfont.ttf') format('truetype'), url('fonts/proximanova-regular-webfont.svg#ProximaNovaRgRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ProximaNovaSoftRegular';
    src: url('fonts/proximanovasoft-regular-webfont.eot');
    src: url('fonts/proximanovasoft-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/proximanovasoft-regular-webfont.woff') format('woff'), url('fonts/proximanovasoft-regular-webfont.ttf') format('truetype'), url('fonts/proximanovasoft-regular-webfont.svg#ProximaNovaSoftRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body, html {
    height: 100%;

}

    body#home h1#logo {
        top: 36px;
    }

body {
    font-size: 14px;
    line-height: 18px !important;
    font-family: 'ProximaNovaSoftRegular', sans-serif !important;
    color: #333;
    min-width: 100%;
    display: flex;
    flex-direction: column;
}

.lwblue {color:#037a91;}
.lwred {color:#c31a09;}
.lworange {color:#f28102;}


    .logo-text{letter-spacing: .25rem; color:#dc3545;}
    .logo-text span {font-variant: small-caps; color:#626161;}
    .motto-text{margin-top: .25rem;letter-spacing: .1rem;color:#626161;}
    a.navbar-brand {text-decoration: none;}
.strong {font-weight:bold;}
/*flex*/
.flex {display:flex;}
.flex-row {flex-direction: row;}
.flex-col {flex-direction: column;}
.flex-justify-between{justify-content:space-between;}
.flex-justify-around{justify-content:space-around;}
.flex-align-center {align-items: center;}
.flex-start {justify-content: flex-start;}
.flex-end {justify-content: flex-end;}

/*responsive*/
.img-responsive {
    display: block;
    width: 100% \9;
    max-width: 100%;
    height: auto;
}


/*utilities*/

/*line-heights*/
/*line-heights*/
.lh-n1 {line-height:.1rem;}
.lh-n7 {line-height:.7rem;}
.lh-n75 {line-height:.75rem;}
.lh-n8 {line-height:.8rem;}
.lh-n85 {line-height:.85rem;}
.lh-n9 {line-height:.9rem;}
.lh-n95 {line-height:.95rem;}
.lh-1 {line-height:1rem;}
.lh-125 {line-height:1.25rem;}
.lh-15 {line-height:1.5rem;}
.lh-175 {line-height:1.75rem;}
.lh-2 {line-height:2rem;}




@media (min-width: 576px)
{
.lh-sm-n7 {line-height:.7rem;}
.lh-sm-n75 {line-height:.75rem;}
.lh-sm-n8 {line-height:.8rem;}
.lh-sm-n85 {line-height:.85rem;}
.lh-sm-n9 {line-height:.9rem;}
.lh-sm-n95 {line-height:.95rem;}
.lh-sm-1 {line-height:1rem;}
.lh-sm-15 {line-height:1.5rem;}
.lh-sm-175 {line-height:1.75rem;}
.lh-sm-2 {line-height:2rem;}
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px)
{
.lh-md-n7 {line-height:.7rem;}
.lh-md-n75 {line-height:.75rem;}
.lh-md-n8 {line-height:.8rem;}
.lh-md-n85 {line-height:.85rem;}
.lh-md-n9 {line-height:.9rem;}
.lh-md-n95 {line-height:.95rem;}
.lh-md-1 {line-height:1rem;}
.lh-md-15 {line-height:1.5rem;}
.lh-md-175 {line-height:1.75rem;}
.lh-md-2 {line-height:2rem;}
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px)
{
.lh-lg-n7 {line-height:.7rem;}
.lh-lg-n75 {line-height:.75rem;}
.lh-lg-n8 {line-height:.8rem;}
.lh-lg-n85 {line-height:.85rem;}
.lh-lg-n9 {line-height:.9rem;}
.lh-lg-n95 {line-height:.95rem;}
.lh-lg-1 {line-height:1rem;}
.lh-lg-15 {line-height:1.5rem;}
.lh-lg-175 {line-height:1.75rem;}
.lh-lg-2 {line-height:2rem;}
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px)
{
    .lh-xl-n7 {line-height:.7rem;}
.lh-xl-n75 {line-height:.75rem;}
.lh-xl-n8 {line-height:.8rem;}
.lh-xl-n85 {line-height:.85rem;}
.lh-xl-n9 {line-height:.9rem;}
.lh-xl-n95 {line-height:.95rem;}
.lh-xl-1 {line-height:1rem;}
.lh-xl-15 {line-height:1.5rem;}
.lh-xl-175 {line-height:1.75rem;}
.lh-xl-2 {line-height:2rem;}
}



/*font-face sizes*/
.f-n1 {font-size:.1rem;}
.f-n7 {font-size:.7rem;}
.f-n75 {font-size:.75rem;}
.f-n8 {font-size:.8rem;}
.f-n85 {font-size:.85rem;}
.f-n9 {font-size:.9rem;}
.f-n95 {font-size:.95rem;}
.f-1 {font-size:1rem;}
.f-125 {font-size:1.25rem;}
.f-15 {font-size:1.5rem;}
.f-175 {font-size:1.75rem;}
.f-2 {font-size:2rem;}




@media (min-width: 576px)
{
.f-sm-n7 {font-size:.7rem;}
.f-sm-n75 {font-size:.75rem;}
.f-sm-n8 {font-size:.8rem;}
.f-sm-n85 {font-size:.85rem;}
.f-sm-n9 {font-size:.9rem;}
.f-sm-n95 {font-size:.95rem;}
.f-sm-1 {font-size:1rem;}
.f-sm-15 {font-size:1.5rem;}
.f-sm-175 {font-size:1.75rem;}
.f-sm-2 {font-size:2rem;}
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px)
{
.f-md-n7 {font-size:.7rem;}
.f-md-n75 {font-size:.75rem;}
.f-md-n8 {font-size:.8rem;}
.f-md-n85 {font-size:.85rem;}
.f-md-n9 {font-size:.9rem;}
.f-md-n95 {font-size:.95rem;}
.f-md-1 {font-size:1rem;}
.f-md-125 {font-size:1.25rem;}
.f-md-15 {font-size:1.5rem;}
.f-md-175 {font-size:1.75rem;}
.f-md-2 {font-size:2rem;}
.f-md-225 {font-size:2.25rem;}
.f-md-25 {font-size:2.5rem;}
.f-md-275 {font-size:2.75rem;}
.f-md-2 {font-size:2rem;}
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px)
{
.f-lg-n7 {font-size:.7rem;}
.f-lg-n75 {font-size:.75rem;}
.f-lg-n8 {font-size:.8rem;}
.f-lg-n85 {font-size:.85rem;}
.f-lg-n9 {font-size:.9rem;}
.f-lg-n95 {font-size:.95rem;}
.f-lg-1 {font-size:1rem;}
.f-lg-15 {font-size:1.5rem;}
.f-lg-175 {font-size:1.75rem;}
.f-lg-2 {font-size:2rem;}
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px)
{
    .f-xl-n7 {font-size:.7rem;}
.f-xl-n75 {font-size:.75rem;}
.f-xl-n8 {font-size:.8rem;}
.f-xl-n85 {font-size:.85rem;}
.f-xl-n9 {font-size:.9rem;}
.f-xl-n95 {font-size:.95rem;}
.f-xl-1 {font-size:1rem;}
.f-xl-125 {font-size:1.25rem;}
.f-xl-15 {font-size:1.5rem;}
.f-xl-175 {font-size:1.75rem;}
.f-xl-2 {font-size:2rem;}
.f-xl-225 {font-size:2.25rem;}
.f-xl-25 {font-size:2.5rem;}
.f-xl-275 {font-size:2.75rem;}
}


.ht-un {height:unset!important;}





/*WIDTHS*/

    .w-10  {width:10% !important;}
    .w-15  {width:15% !important;}
    .w-20  {width:20% !important;}
    .w-30  {width:30% !important;}
    .w-35  {width:35% !important;}
    .w-40  {width:40% !important;}
    .w-45  {width:45% !important;}
    .w-55  {width:55% !important;}
    .w-60  {width:60% !important;}
    .w-65  {width:65% !important;}
    .w-70  {width:70% !important;}
    .w-70  {width:75% !important;}
    .w-80  {width:80% !important;}
    .w-85  {width:85% !important;}
    .w-90  {width:90% !important;}
    .w-95  {width:95% !important;}
@media (min-width: 576px)
{
    .w-sm-10  {width:10% !important;}
    .w-sm-15  {width:15% !important;}
    .w-sm-20  {width:20% !important;}
    .w-sm-30  {width:30% !important;}
    .w-sm-35  {width:35% !important;}
    .w-sm-40  {width:40% !important;}
    .w-sm-45  {width:45% !important;}
    .w-sm-55  {width:55% !important;}
    .w-sm-60  {width:60% !important;}
    .w-sm-65  {width:65% !important;}
    .w-sm-75  {width:75% !important;}
    .w-sm-70  {width:70% !important;}
    .w-sm-80  {width:80% !important;}
    .w-sm-85  {width:85% !important;}
    .w-sm-90  {width:90% !important;}
    .w-sm-95  {width:95% !important;}
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px)
{
    .w-md-10  {width:10% !important;}
    .w-md-15  {width:15% !important;}
    .w-md-20  {width:20% !important;}
    .w-md-30  {width:30% !important;}
    .w-md-35  {width:35% !important;}
    .w-md-40  {width:40% !important;}
    .w-md-45  {width:45% !important;}
    .w-md-55  {width:55% !important;}
    .w-md-60  {width:60% !important;}
    .w-md-65  {width:65% !important;}
    .w-md-70  {width:70% !important;}
    .w-md-75  {width:75% !important;}
    .w-md-80  {width:80% !important;}
    .w-md-85  {width:85% !important;}
    .w-md-90  {width:90% !important;}
    .w-md-95  {width:95% !important;}
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px)
{
    .w-lg-10  {width:10% !important;}
    .w-lg-15  {width:15% !important;}
    .w-lg-20  {width:20% !important;}
    .w-lg-30  {width:30% !important;}
    .w-lg-35  {width:35% !important;}
    .w-lg-40  {width:40% !important;}
    .w-lg-45  {width:45% !important;}
    .w-lg-55  {width:55% !important;}
    .w-lg-60  {width:60% !important;}
    .w-lg-65  {width:65% !important;}
    .w-lg-70  {width:70% !important;}
    .w-lg-70  {width:75% !important;}
    .w-lg-80  {width:80% !important;}
    .w-lg-85  {width:85% !important;}
    .w-lg-90  {width:90% !important;}
    .w-lg-95  {width:95% !important;}
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px)
{
    .w-xl-10  {width:10%;}
    .w-xl-10  {width:10% !important;}
    .w-xl-15  {width:15% !important;}
    .w-xl-20  {width:20% !important;}
    .w-xl-30  {width:30% !important;}
    .w-xl-35  {width:35% !important;}
    .w-xl-40  {width:40% !important;}
    .w-xl-45  {width:45% !important;}
    .w-xl-55  {width:55% !important;}
    .w-xl-60  {width:60% !important;}
    .w-xl-65  {width:65% !important;}
    .w-xl-70  {width:70% !important;}
    .w-xl-70  {width:75% !important;}
    .w-xl-80  {width:80% !important;}
    .w-xl-85  {width:85% !important;}
    .w-xl-90  {width:90% !important;}
    .w-xl-95  {width:95% !important;}
}

.btn {font-size:1.25rem;}
/*bootstrap color-profile overrides */
/* Primary Color Overrides */
.bg-primary, .btn-primary, .text-primary, .badge-primary
{
    background-color: #037a91 !important;
    border-color: #037a91 !important;
    color: #fff !important; /* Ensure text is white for contrast */
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active,
    .link-primary:hover, .link-primary:focus
    {
        background-color: darken(#037a91, 10%) !important;
        border-color: darken(#037a91, 10%) !important;
    }

/* Info Color Overrides */
.bg-info, .btn-info, .text-info, .badge-info
{
    background-color: #787676 !important;
    border-color: #68787f !important;
    color: #fff !important;
}

    .btn-info:hover, .btn-info:focus, .btn-info:active,
    .link-info:hover, .link-info:focus
    {
        background-color: darken(#68787f, 10%) !important;
        border-color: darken(#68787f, 10%) !important;
    }

/* Success Color Overrides */
.bg-success, .btn-success, .text-success, badge-success
{
    background-color: #f16410 !important;
    border-color: #f28102 !important;
    color: #fff !important;
}

    .btn-success:hover, .btn-success:focus, .btn-success:active,
    .link-success:hover, .link-success:focus
    {
        background-color: darken(#f28102, 10%) !important;
        border-color: darken(#f28102, 10%) !important;
    }


/* Alert Color Overrides */
.bg-alert, .btn-alert, .text-alert, badge-alert
{
    background-color: #f28102 !important;
    border-color: #f28102 !important;
    color: #fff !important;
}

    .btn-alert:hover, .btn-alert:focus, .btn-alert:active,
    .link-alert:hover, .link-alert:focus
    {
        background-color: darken(#f28102, 10%) !important;
        border-color: darken(#f28102, 10%) !important;
    }

/*LessonSheet Control Panel*/


.btn.btn-facebook
{
    background-color: #1877F2 !important; /* Facebook Blue */
    color: #FFFFFF; /* White for text */
    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
}

    .btn.btn-facebook:hover
    {
        background-color: rgba(24, 119, 242, 0.8); /* Lighter on hover */
    }

.btn.btn-linkedin
{
    background-color: #0A66C2; /* LinkedIn Blue */
    color: #FFFFFF; /* White for text */
    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
}

    .btn.btn-linkedin:hover
    {
        background-color: rgba(10, 102, 194, 0.8); /* Lighter on hover */
    }

.btn.x
{
    background-color: #000;
    color: #FFFFFF;
    transition: background-color 0.3s ease;
}

    .btn.x:hover
    {
        background-color: #68787f !important;
    }

.btn.btn-pinterest
{
    background-color: #E60023; /* Pinterest Red */
    color: #FFFFFF !important; /* White for text */
    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
}

    .btn.btn-pinterest:hover
    {
        background-color: rgba(230, 0, 35, 0.8); /* Lighter on hover */
    }


.btn.btn-word
{
    background-color: #2b579a; /* Word Blue */
    color: #FFFFFF; /* White for text */
    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
}

    .btn.word:hover
    {
        background-color: rgba(10, 102, 194, 0.8); /* Lighter on hover */
    }
.ico
{
    display: inline-block;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 10%;
    color: white; /* Change this color to your desired icon color */
}
    .ico.ico-assign{background-color: #f28102;}
    .ico.ico-flashcard{background-color: #037a91;}



#CollaborateLink > span, #ShareLink > span, #fbsharelink > span, #lnsharelink >span, #pinsharelink > span, #popupTwitter > span
{
    position: unset;
    background-position: unset;
}
/*checkbox overrides*/
.diffGroupCheck, .LessonPlanCheck
{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border: 1px solid #adb5bd;
    padding: 0.25rem;
    border-radius: 0.25rem;
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    cursor: pointer;
    outline: none;
}

    .diffGroupCheck:checked, .LessonPlanCheck:checked
    {
        background-color: #037a91; /* or any desired color */
        border-color: gray; /* or any desired color */
    }

        .diffGroupCheck:checked::after, .LessonPlanCheck:checked::after
        {
            content: '\2713';
            display: block;
            text-align: center;
            color: #fff;
            font-size: 1rem;
            font-weight: bold;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            line-height: 1.25rem;
        }

    .diffGroupCheck:hover, .LessonPlanCheck:hover
    {
        border-color: #007bff;
    }

    .diffGroupCheck:focus, .LessonPlanCheck:focus
    {
        box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
    }

    .diffGroupCheck:disabled, .LessonPlanCheck:disabled
    {
        background-color: #e9ecef;
        border-color: #e9ecef;
        cursor: not-allowed;
    }

        .diffGroupCheck:disabled::after, .LessonPlanCheck:disabled::after
        {
            color: #adb5bd;
        }