:root{
    --color: rgb(255, 227, 182);
    --bc-color: rgb(18, 88, 79);
    --dark-color: rgb(24, 20, 36);
    --list-color: rgb(240, 220, 188);
    --link-color: rgb(151, 144, 144);
}


/* Color Settings */
*,
::before,
::after{
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

body{
    background-color: var(--bc-color);
}

p{
    color: var(--color);
}

a{
    font-size: 16px;
    color: var(--link-color);
    text-decoration-line: none;

}

h1,h2,h3,h4,h5,h6{
    color: var(--color)
}

th,
td,
tr{
    color: rgb(106, 199, 118);
}

/* coloring */

.fri { 
    color: #888; 
}      

.yff {
     color: #f1c40f;
     }    

.ikm1 { 
    сolor: #8e44ad; 
}   

.ikm2 {
     color: #e67e22;
     }   

.ikm3 { 
    color: #e74c3c;
 }   

.imk {
     color: #ff69b4;
     }   

.mat { 
    color: #3498db; 
}   

.eng { 
    color: #2ecc71; 
}    

.kro { 
    color: #1abc9c; 
}    

/* coloring */

.timeplan__table, .timeplan__list, .timeplan__name-list{
    color: var(--list-color);
}

table {
    margin: 0 auto;        
    border-collapse: collapse;
    text-align: center;    
}
  
  table th, table td {
    border: 1px solid #ccc;
    padding: 8px 12px;
    font-weight: 600;
}


/* Main Structure */
.header{
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 100px;
}


.timeplan__title{
    font-size: 60px;
    text-align: center;
    -webkit-text-stroke: .5px var(--dark-color); 
}

.timeplan__figure{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 10px;
}

.timeplan__figure:not(:last-child){
    margin-bottom: 10%;
}

.timeplan__img-desc{
    font-size: 12px;
    font-weight: 500;
}

.timeplan__list{
    display: flex;
    row-gap: 20px;
    flex-direction: column;
    align-items: center;
    font-weight: 550;
}

.timeplan__list-item{
    font-size: 15px;
}

.timeplan__table{
    display: inline-block;
    text-align: center;
}

.timeplan__table-container{
    margin: 50px;
    text-align: center;
}

.timeplan__table:not(:last-child){
    margin-top: 50px;
}


.timeplan__present-title{
    display: flex;
    justify-content: center;
    align-items: center;
}

.timeplan__present-title:not(:last-child){
    margin-top: 25px;
    margin-bottom: 25px;
}


.timeplan__name-list{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    row-gap: 10px;
    font-size: 25px;
}

@media (max-width: 767px){
    .timeplan__img{
        max-width: 350px;
        height: auto;
    }
}