/* 
*  CSS TABLE OF CONTENTS
*   
*  1.0 - Reset
*  2.0 - Fonts
*  3.0 - Globals
*  4.0 - Color Palette
*  5.0 - Buttons
*  5.0 - Header
*  6.0 - Body
*    6.1 - Sliders
*    6.2 - Imagery
*  7.0 - Footer
*/

/*** 1.0 - Reset ***/
body,
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
}

/*** 2.0 - Fonts ***/
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Montserrat', sans-serif;
}

body, p {
    font-family: 'Lato', sans-serif;
}

.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6{
    font-family: 'Montserrat', sans-serif;
}

/*** 3.0 - Globals ***/
.logo {
    width: 40%;
}

.ellipsed {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

a:hover img{
    opacity: .9;
}
/* containers */
.cas-container-lg {
    padding: 12% 6%;
}

/*** 4.0 - Color Palette ***/
:root {
    --cas-primary: #396781;
    --cas-secondary: #786E63;
    --cas-secondary-light: #B1A99F;
    --cas-secondary-muted: #E1DFDC;
    --cas-info: #538095;
    --cas-info-light: #D2DFE5;
    --cas-light: #F2F2F2;
    --cas-dark: #2A4963;
}

body{
    color: var(--cas-dark);
}

::selection {
    color: var(--cas-dark);
    background: var(--cas-light);
}

.bg-cas-primary {
    background-color: var(--cas-primary);
}

.bg-cas-secondary {
    background-color: var(--cas-secondary);
}

.bg-cas-secondary-light {
    background-color: var(--cas-secondary-light);
}

.bg-cas-secondary-muted {
    background-color: var(--cas-secondary-muted);
}

.bg-cas-info {
    background-color: var(--cas-info);
}

.bg-cas-info-light {
    background-color: var(--cas-info-light);
}

.bg-cas-light {
    background-color: var(--cas-light);
}

.bg-cas-dark {
    background-color: var(--cas-dark);
}

.text-cas-primary {
    color: var(--cas-primary);
}

.text-cas-secondary {
    color: var(--cas-secondary);
}

.text-cas-secondary-light {
    color: var(--cas-secondary-light);
}

.text-cas-secondary-muted {
    color: var(--cas-secondary-muted);
}

.text-cas-info {
    color: var(--cas-info);
}

.text-cas-light {
    color: var(--cas-light);
}

.text-cas-dark {
    color: var(--cas-dark);
}

.link-cas-primary {
    color: var(--cas-primary);
    text-decoration: underline;
    transition: all .5s linear;
}

.link-cas-primary:hover,
.link-cas-primary:focus {
    color: var(--cas-secondary);

    transition: all .25s linear;
}

/*** 5.0 - Buttons ***/
.btn {
    border-width: 1.5px;
    font-weight: 600;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    padding: 2% 5%;
}

.btn-outline-light {
    color: var(--cas-light);
    border-color: var(--cas-light);
}

.btn-outline-light:hover,
.btn-outline-light:active {
    color: var(--cas-secondary);
    background-color: var(--cas-secondary-muted);
    border-color: var(--cas-secondary-muted);
}

.btn-outline-secondary {
    color: var(--cas-secondary);
    border-color: var(--cas-secondary);
}

.btn-outline-secondary:hover,
.btn-outline-secondary:active {
    color: var(--cas-secondary);
    background-color: var(--cas-secondary-muted);
    border-color: var(--cas-secondary-muted);
}

.btn-outline-primary {
    color: var(--cas-primary);
    border-color: var(--cas-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary:active {
    color: var(--cas-primary);
    background-color: var(--cas-secondary-muted);
    border-color: var(--cas-secondary-muted);
}

.btn-outline-light:focus,
.btn-outline-secondary:focus,
.btn-outline-primary:focus {
    box-shadow: 0 0 0 0.1rem rgb(248 249 250 / 50%);
}

/*** 5.0 - Header ***/
h2 {
    font-size: 2.75rem;
    font-weight: 800;
    letter-spacing: 1.2;
}

h3 {
    font-size: 1.4rem;
}

h4 {
    font-size: 1.2rem;
}

/*** 6.0 - Navigation Bar ***/
.navbar {
    padding: 3%;
}

.nav-item {
    margin: .5%;
}

.navbar-light .navbar-nav .nav-link {
    color: var(--cas-light);
    font-family: 'Montserrat', sans-serif;
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: 1.2;
    text-transform: uppercase;
    transition: 2ms ease;
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
    color: var(--cas-secondary-muted);
    transition: 2ms ease;
}

.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .show>.nav-link {
    color: var(--cas-secondary-muted);
    transition: 2ms ease;
}

.bg-nav {
    transition: 500ms ease;
    background-color: var(--cas-primary);
    opacity: 90%;
}

.bg-nav.scrolled {
    transition: 500ms ease;
    background-color: var(--cas-primary);
    opacity: 1;
}

.navbar-toggler {
    background: transparent;
    border: 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 1rem;
    margin: 0;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
    padding: 2%;
}

.navbar-toggler span {
    color: var(--cas-light);
}

.dropdown-menu {
    background-color: rgba(0, 0, 0, 0);
    border: 0;
    padding: 0;
    margin: 0;
}

.dropdown-item {
    padding: 2%;
    color: var(--cas-light);
    font-family: "Montserrat", sans-serif;
}

.dropdown-item.active,
.dropdown-item:active,
.dropdown-item.focus,
.dropdown-item:focus,
.dropdown-item.focus-visible {
    color: var(--cas-light);
    background-color: var(--cas-info);
    outline: 0;
}

.dropdown-divider {
    border-top: var(--cas-info);
}

/*** 5.1 - Typography ***/
.small-text {
    font-size: .75rem;
}

.lead {
    font-size: 1.10rem;
}




/*** 5.2 - Forms ***/

.form-control:focus {
    color: var(--cas-dark);
    background-color: #fff;
    border-color: var(--cas-primary);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
}

button, input, optgroup, select, textarea{
    font-family: "Montserrat", sans-serif;
}
/*** 7.0 - Footer ***/