@charset "utf-8";
/* CSS Document */

.if-album { height: 100vh; }
.table { --bs-table-bg: cadetblue; }
.teach_l_item {
    display: inline-block;
    background: var(--color-3);
    border: solid var(--color-4);
    border-radius: 10px;
    padding: 5px;
    margin: 5px;
    color: aliceblue;
    }
.teach_l_item:hover {
    background-color:  var(--color-4);
    color: var(--color-2);
    transform: scale(1.1);
    }

.anchor {
    position: relative;
    top: -200px;
    }
.prep {
        height: 300px;
        width: 700px;
        margin: auto;
    }
.prep_photo { float: left; }   
.pr_photo {
    height: 250px;
    width: 190px;
    object-fit: cover;
    border-radius: 10px;
    }
.prep_bio {
    float: right;
    }
.tbl_teach {
    opacity: 0.8;
    height: 250px;
    text-align: center;
    }
.tbl_teach h3 {
    color: darkred;
    font-size: x-large;
    margin-bottom: 0;
    }
.tbl_name { border-radius: 10px 10px 0 0; }
.tbl_predm {
    color: aliceblue;
    font-size: 24px;
    }
.tbl_extra {
    text-align: left;
    padding-left: 10px;
    border-radius: 0 0 10px 10px;
    }
.tbl_dates {
    text-align: left;
    padding-left: 10px;
    }
.tbl_date1 { text-align: right; }
.tbl_date2 { text-align: left;  }
.tbl_dash { width: 20px; }
.btn_up {
    position: fixed;
    bottom: 2rem;
    height: 60px;
    right: 0px;
    opacity: 0.7;
    }
@media (max-width: 985px) {
    .btn_up { bottom: 0; }
}
/*
.st_m_item {
    display: inline-block;
    background: var(--color-3);
    border: solid var(--color-4);
    border-radius: 10px;
    padding: 5px;
    margin: 5px;
    color: var(--color-2);
    width: 120px;
    }
.st_m_item:hover {
    background-color:  blue;
    color: lightgreen;
    animation: 3s forwards slide;
    }
.nav-link-cust {
    color: #303C6C;
}
ul {
    padding-left: 0;
}
.st_l_item {
    display: inline-block;
    background: var(--color-3);
    border: solid var(--color-4);
    border-radius: 10px;
    padding: 5px;
    margin: 5px;
    color: aliceblue;
    }
.st_l_item:hover {
    background-color:  var(--color-4);
    color: var(--color-2);
    /*
    animation: 3s forwards slide;
    
    transform: scale(1.1);
    }

.st_m_item {
    display: inline-block;
    background: var(--color-3);
    border: solid var(--color-4);
    border-radius: 10px;
    padding: 5px;
    margin: 5px;
    color: var(--color-2);
    width: 120px;
    }
.st_m_item:hover {
    background-color:  blue;
    color: lightgreen;
    animation: 3s forwards slide;
    }


@media (max-width: 985px) {
    .btn_up { bottom: 0; }
}

.stud_bio {
    float: right;
    }
.anchor {
    position: relative;
    top: -200px;
    }
.tbl_stud {
/*    background-color: cadetblue!important; 
    opacity: 0.8;
    height: 250px;
    border-radius: 10px;
    }
.tbl_stud h3 {
     color: darkred;
     font-size: x-large;
     margin-bottom: 0;
    }
.stud {
    height: 280px;
     margin: auto;
    }
.stud_photo {
    float: left;
    width: 190px;    
    height: inherit;
    }   
.table {
    --bs-table-bg: cadetblue;
}
.st_photo {
    height: 250px;
    width: 190px;
    object-fit: cover;
    border-radius: 10px;
    }
@keyframes fade_0 {
    0% { opacity: 1; }
    50% {  opacity: 0;  }
    100% { opacity: 1; }
}

@keyframes fade_1 {
    0% { opacity: 0; }
    50% {  opacity: 1;  }
    100% { opacity: 0; }
}

.photo_swap_0 {
    animation: 10s infinite fade_0;
}

.photo_swap_1 {
    animation: 10s infinite fade_1;
    position: relative;
    top: -250px;
}    
.tbl_dates {
    text-align: right;
    width: 25%;
    color: beige;
    }
.students {
    max-width: 900px;        
    }
.tbl_lbl {
    text-align: right;
    width: 150px;
    color: beige;
}
.tbl_date1 {
    text-align: right;
    padding-left: 10px;
    width: 150px;
    }
.tbl_date2 {
    text-align: left;
    }
.tbl_dash {
    width: 20px;
    text-align: center;
    }
.tbl_data {
    color: #FBE8A6;
    font-size: larger;
    }
@media (max-width: 985px) {
    .tbl_data {  font-size: small; }
}
*/