body {
    font-family: Arial, sans-serif;
    background-color: #ffffff;
    color: #333;
}
/* insert a section NEW MENU */
.menu-item {
    background-color: white;
    color: black;
    padding: 15px;
    transition: background-color 0.3s, color 0.3s;
	border-radius: 23px;
}

.menu-item:hover {
    background-color:#ff1915; 
	color: white;
}	
.menu-item1 {
    background-color: white;
    color: black;
    padding: 15px;
    transition: background-color 0.3s, color 0.3s;
	border-radius: 23px;
}

.menu-item1:hover {
    background-color:#41a5d7; 
	color: white;
}		
/* insert a section NEW MENU */
.head_a1 {
	margin-right: 5%;
    margin-left: 5%;
}

.col_a {
	margin-right: 27%;
    margin-left: 27%;
}

.col_a1 {
	background-color: #2ea34d;
	color: white;
	padding-top:30 px;
}

.content-text {
	margin-right: 5%;
    margin-left: 5%;
}

.cont_text {
	color: rgb(69, 164, 212);
	font-weight: bold;
}


.img_m {
	background-image: url(2023_11.gif);
	height:550px;
	width: 100%;
	background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
    margin-right: 0%;
    margin-left: 0%;
	z-index: 10;
	
   /* Префиксы вендоров */
  -webkit-background-size: cover; /* для Safari (включая мобильные устройства) и Chrome */
  -moz-background-size: cover; /* для Firefox */
  -o-background-size: cover; /* для Opera */
  -ms-background-size: cover; /* для Internet Explorer и Edge */
  -webkit-background-attachment: fixed; /* для Safari (включая мобильные устройства) и Chrome */
  -moz-background-attachment: fixed; /* для Firefox */
  -o-background-attachment: fixed; /* для Opera */
  -ms-background-attachment: fixed; /* для Internet Explorer и Edge */
}

.img_m1 {
	background-image: url(spb_c.gif);
	width: 100%;
	background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
    margin-right: 0%;
    margin-left: 0%;
	z-index: 10;
	
   /* Префиксы вендоров */
  -webkit-background-size: cover; /* для Safari (включая мобильные устройства) и Chrome */
  -moz-background-size: cover; /* для Firefox */
  -o-background-size: cover; /* для Opera */
  -ms-background-size: cover; /* для Internet Explorer и Edge */
  -webkit-background-attachment: fixed; /* для Safari (включая мобильные устройства) и Chrome */
  -moz-background-attachment: fixed; /* для Firefox */
  -o-background-attachment: fixed; /* для Opera */
  -ms-background-attachment: fixed; /* для Internet Explorer и Edge */
}

.bak {
	background-color: #ffffff;
	/*opacity:0.9;   уровень прозрачности в css*/
}

.sc1_0 {
            transition: transform 1s;
			z-index: 20;
        }

.sc1_0:hover {
            transform: scale(1.2);

}


    .btn1 {
        background-color: #b0d4de;
        color: white;
        border: 4px solid rgb(255, 255, 255);
        padding: 5px 13px;
        text-align: center;
        display: inline-block;
        font-size: 14px;
        cursor: pointer;
        border-radius: 23px;
    }

    table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    }

    th, td {
    padding: 10px;
    text-align: center;
    border-bottom: 1px solid #ddd;
    }

    th {
    background-color: #99bfec;
    font-weight: bold;
    position: sticky;
    top: 0;
    }
    tr {
    background-color: #eaedf1;
    }
    tr:hover {
    background-color: #fefee5;
    }

    .word {
    text-align: left;
    font-weight: bold;
    }

    .transcription {
    color: #666;
    font-style: italic;
    }

    .level {
    text-transform: uppercase;
    font-size: 12px;
    padding: 5px 8px;
    border-radius: 0px;
    color: rgb(246, 246, 246);
    }
    .beginner1 {
        background-color: #2b6b9f;
    }

    .beginner2 {
    background-color: #a42e84;
    }

    .beginner3 {
        background-color: #2ea34d;
        }

    .intermediate {
    background-color: #fff0c2;
    }

    .advanced {
    background-color: #e9bec4;
    }

    .translation {
    font-style: italic;
    color: #666;
    }

    .part-of-speech {
    text-transform: uppercase;
    font-size: 12px;
    padding: 5px 8px;
    border-radius: 4px;
    }

    .noun {
    background-color: #edf0f2;
    }

    .verb {
    background-color: #ffc0cb;
    }

    .adjective {
    background-color: #bae1c6;
    }

    .adverb {
    background-color: #ffeb99;
    }

    .image {
    max-width: 100px;
    max-height: 100px;
    }
    .tabl {
    padding-left: 5%; 
    padding-right: 5%;  
    }
    @media (max-width: 768px) {
    th, td {
        font-size: 14px;
    }
  .anim {
        display: none;
        
    }

    .word, .transcription, .level, .translation, .part-of-speech {
        display: block;
        text-align: center;
    }

    .level, .part-of-speech {
        margin-bottom: 5px;
    }
    
	
	

    @media (max-width: 480px) {
    .anim {
        display: none;
    }

    .btn1 {
        background-color: #b0d4de;
        color: white;
        border: 4px solid rgb(255, 255, 255);
        padding: 3px 8px;
        text-align: center;
        display: inline-block;
        font-size: 14px;
        cursor: pointer;
        border-radius: 23px;
    }
    }












@media all and (max-width: 600px) {
	
.head_a1 {
	margin-right: 2%;
    margin-left: 2%;
}
.col_a {
	margin-right: 13%;
    margin-left: 13%;
}

}