:root {


  --mainColor: ;


  --mainFontColor: rgba(0, 0, 0, .85);


  --mainBorder: 1.5px solid var(--mainFontColor);


}


*{


  font-weight: bold;


}


ul, ol, li, h1, h2, h3, h4, h5, h6, p, a, footer{


  font-weight : bold;


}


#mainBg {


  background-image: url(img/bg.jpg);


}





.mainCover {


  /* background-color: rgba(34, 24, 20, 0.6); */


}





#home {


  background-image: url(img/home.jpg);


}





/* .homeCover{


    background-color:rgba(64,33,15,0.1);


} */


.item3{


  width: 60%;


}


#logo img{


  max-height: 150px;


  width: 150px;


}


header{


  height: 100px;


}


#toTop {


  opacity: 0;


  text-decoration: none;


  /* position: fixed;


    bottom: 30px;


    right: 2%; */


  overflow: hidden;


  z-index: 999;


  width: 30px;


  height: 30px;


  border: none;


  text-indent: 100%;


  background: url(img/top.svg) no-repeat 0 0;


  cursor: pointer;


  background-size: 100%;


  background-position: center;


  transition: 0.5s;


}





#about p a {


  padding: 5px 18px;


  background-color: #df7e46;


  color: rgb(252, 252, 252);


  transition: all .2s ease-in-out;


  border-radius: 30px;


  font-size: 1.5em;


  font-weight: bold;


  width: 100px;


  text-align: center;


}





img {


  border-radius: 15px


}





@media screen and (max-width:1024px) {


  #home {


    height: 50vw;


  }


}





.mainList li a {


  font-weight: 600;


  font-size: 18px;





}


@media screen and (max-width:950px) {


 #logo{


     top:-15px


}


#logo img{


  max-height: 150px;


}


}


@media screen and (max-width:480px) {





 #logo img{


   max-height: 100px;


   width: auto;


 }


 }


 @media screen and (max-width:414px) {


  #about h2{


    font-size: 18px;


  }


  }


  @media screen and (max-width:375px) {


    article{


     width: 90%;


    }


    }