﻿:root {
    --cus-purple: #6a52a3;
    --cus-purple-dark: #563d7c;
    --cus-orange: #ff7003;
    --cus-orange-light: #FF7003C6;
    --cus-orange-dark: #da6d03;
    --cus-maroon: #721c24;
    --cus-maroon-dark: #611c24;
    --cus-light-grey: #f8f8f8;
    --cus-grey: #efefef;
    --cus-ivory: #fdfde0;
    --cus-ivory-plus: #FAFAC4;
    --cus-aliceblue: #f0f8ff;
    --cus-aliceblue-plus: #d7f1fc;
    --cus-ivory-light: #fffff099;
    --cus-primary-light: #0d6efdc2;
    --cus-success-light: #198754E2;
    --cus-danger-light: #DC3545D8;
}

h1,h2,h3,h4 {
    font-size: 1.5em;
    color: var(--cus-purple);
    line-height: 1.6em;
    border-bottom: 2px solid var(--cus-grey);
    margin-bottom: 1rem;
}

h3, h4 {
    font-size: 1.2em;
}

.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,0.85);
}
.navbar-dark .navbar-nav .nav-link:hover {
    color: rgba(255,255,255,1.0);
}

.text-purple {
    color: var(--cus-purple);
}
.text-purple-dark {
    color: var(--cus-purple-dark);
}
.text-orange {
    color: var(--cus-orange);
}
.text-orange-light {
    color: var(--cus-orange-light);
}
.text-orange-dark {
    color: var(--cus-orange-dark);
}
.text-maroon {
    color: var(--cus-maroon);
}
.text-ivory {
    color: var(--cus-ivory);
}
.text-ivory-light {
    color: var(--cus-ivory-light);
}
.text-aliceblue {
    color: var(--cus-aliceblue);
}

.bg-purple {
    background-color: var(--cus-purple);
    color: var(--bs-white);
}
.bg-purple-dark {
    background-color: var(--cus-purple-dark);
    color: var(--bs-white);
}
.bg-orange {
    background-color: var(--cus-orange);
    color: var(--bs-white);
}
.bg-orange-light {
    background-color: var(--cus-orange-light);
    color: var(--bs-white);
}
.bg-orange-dark {
    background-color: var(--cus-orange-dark);
    color: var(--bs-white);
}
.bg-maroon {
    background-color: var(--cus-maroon);
    color: var(--bs-white);
}
.bg-ivory {
    background-color: var(--cus-ivory);
    color: var(--bs-dark);
}
.bg-ivory-light {
    background-color: var(--cus-ivory-light);
    color: var(--bs-dark);
}
.bg-aliceblue {
    background-color: var(--cus-aliceblue);
    color: var(--bs-dark);
}
.bg-success-light {
    background-color: var(--cus-success-light);
    color: var(--bs-white);
}
.bg-danger-light {
    background-color: var(--cus-danger-light);
    color: var(--bs-white);
}
.bg-primary-light {
    background-color: var(--cus-primary-light);
    color: var(--bs-white);
}

.btn-purple {
    background-color: var(--cus-purple);
    color: var(--cus-light-grey);
}
.btn-purple:hover {
    background-color: var(--cus-purple-dark);
    color: var(--bs-white);
}

.btn-orange {
    background-color: var(--cus-orange);
    color: var(--cus-light-grey);
}

.btn-orange:hover {
    background-color: var(--cus-orange-dark);
    color: var(--bs-white);
}
.btn-orange-light {
    background-color: var(--cus-orange-light);
    color: var(--cus-light-grey);
}

.btn-orange-light:hover {
    background-color: var(--cus-orange);
    color: var(--bs-white);
}
.btn-orange-dark {
    background-color: var(--cus-orange-dark);
    color: var(--bs-white);
}

.btn-orange-dark:hover {
    background-color: var(--cus-orange);
    color: var(--bs-white);
}

.btn-maroon {
    background-color: var(--cus-maroon);
    color: var(--cus-light-grey);
}
.btn-maroon:hover {
    background-color: var(--cus-maroon-dark);
    color: var(--bs-white);
}

.btn-ivory {
    background-color: var(--cus-ivory);
    color: var(--bs-secondary);
}
.btn-ivory:hover {
    background-color: var(--cus-ivory-plus);
    color: var(--bs-dark);
}

.btn-aliceblue {
    background-color: var(--cus-aliceblue);
    color: var(--bs-secondary);
}
.btn-aliceblue:hover {
    background-color: var(--cus-aliceblue-plus);
    color: var(--bs-dark);
}

.btn-primary-light {
    background-color: var(--cus-primary-light);
    color: var(--bs-white);
}
.btn-primary-light:hover {
    background-color: var(--bs-primary);
    color: var(--bs-white);
}

.btn-success-light {
    background-color: var(--cus-success-light);
    color: var(--cus-light-grey);
}
.btn-success-light:hover {
    background-color: var(--bs-success);
    color: var(--bs-white);
}

.btn-danger-light {
    background-color: var(--cus-danger-light);
    color: var(--cus-light-grey);
}
.btn-danger-light:hover {
    background-color: var(--bs-danger);
    color: var(--bs-white);
}

.border-purple-light {
    border: 1px solid #6a52a312;
}
.border-orange {
    border: 1px solid var(--cus-orange);
}

/*p {*/
/*    margin-bottom: 0;*/
/*}*/
.pagination li {
    padding-top: 2px;
    padding-bottom: 2px;
}
.pagination a{
    text-decoration: none;
    color: #efefef;
    padding-left: 10px;
    padding-right: 10px;
}
.pagination a:hover{
    text-decoration: none;
    color: white;
}
.disabledElement {
    pointer-events: none;
    opacity: 0.4;
}

#topPoster {
    height: 150px;
    background: url("/img/edu_poster2.jpg") repeat;
    /*background: url("/img/pattern1.png") repeat;*/
}

#at4-share {
    background-color: var(--bs-light);
}

.nav-link.active {
    border-radius: 5px;
    background-color: var(--cus-purple-dark);
}
.nav-link:hover {
    border-radius: 5px;
    background-color: var(--cus-purple-dark);
}
.hoverHighlight:hover {
    background-color: var(--cus-ivory);
}
