@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;800&display=swap');
 *{
     box-sizing: border-box;
     padding: 0;
     margin: 0;
}
 ul li{
     list-style: none;
}
 body{
     font-family: 'Montserrat', sans-serif;
}
.about {<!--from   ww w.j av  a2s . com-->
   padding: 2em;
}
.about:after { /* this is the border */
    content:"";
    display:block;
    width: 3.5em;
    max-width:70%;
    border-bottom: 1px solid #B70E0C;
    
}
 .bg{
     background-image: url('Images/bg-large_3.png') ;
     background-size: cover;
     background-repeat: no-repeat;
     height: 100vh;
     color: white;
     padding: 5em 6em;
}
 .main-bg{
     height: 100%;
     display: flex;
     justify-content: center;
}
 .content{
     padding-top: 1em;
     padding-left: 1em;
}
 .logo{
     margin-bottom: 1em;
}
 .dropdown{
     background-color: rgba(0,0,0,0.6);
     max-width: 17em;
     font-size: 1.2em;
     text-align: center;
     border-radius: 1.4em;
     position: relative;
     border-style: solid;
     border-color: #B70E0C;
     border-width: 2px;
}
 .select{
     display: flex;
     align-items: center;
     justify-content: space-between;
     cursor: pointer;
     padding: 0.75em 2em;
}
 .select:hover {
     background-color: rgba(183,14,12,0.5);
     background-image: linear-gradient(rgba(183,14,12,0.3), rgba(0,0,0,0.5));
     border-radius: 1.4em;
}
 .arrow {
     border: solid #B70E0C;
     border-width: 0 4px 4px 0;
     display: inline-block;
     padding: 7px;
     transform: rotate(45deg);
     -webkit-transform: rotate(45deg);
     margin-left: 1em;
     margin-top: -6px;
}
 .select:hover .arrow{
     border: solid white;
     border-width: 0 4px 4px 0;
     display: inline-block;
     padding: 7px;
}
 .arrow-rotate{
     margin-top: 5px;
     transform: rotate(-135deg);
     -webkit-transform: rotate(-135deg);
}
 .menu{
     display: none;
     opacity: 0;
     padding: 0.75em 2em;
     overflow: hidden;
     max-height: 0;
}
 .menu li a{
     text-decoration: none;
     color: #ffffff;
}
 .menu li:hover{
     cursor: pointer;
     text-decoration: underline;
}
 .menu-open{
     display: block;
     opacity: 1;
     max-height: 200px;
     transition: all 0.5s ease-in;
}
 .menu-close{
     display: block;
     opacity: 1;
     overflow: hidden;
     padding: 0;
     max-height: 0;
     transition: max-height 0.3s ease-out;
}
 .text{
     font-size: 55px;
     margin-bottom: 1.5em;
}
/*Large screen*/
 @media only screen and (min-width: 1200px){
     body{
         font-size: 1.2em;
    }
     .bg{
         background-image: url('Images/bg-large.png') ;
    }
     .main-bg{
         display: block;
         padding-left: 150px;
    }
     .dropdown{
         margin: 0;
    }
}
 @media only screen and (min-width: 1100px){
     .bg{
         background-image: url('Images/bg-large_1.png') ;
    }
}
/*small screen*/
 @media only screen and (max-width: 500px){
     .bg{
         padding: 0;
    }
    .text{
     font-size: 10vw;
 }
 .dropdown{
     font-size: 1em;
}
.classic .lesson-header-wrap .lesson-header__author {
  display: none !importnant;
}