* {
    padding: 0;
    margin:0.5vh 0;
    background-color: rgb(255, 254, 252);
  }

  html{
    scrollbar-gutter: stable; 
    }
    
body{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color:rgb(24, 24, 24);
}

h1,h2,h3,h4{
    text-align: center;
    font-family: Georgia, Times, serif;
}

h1{
    font-size: 2.5em;
    margin-top: 30px;
    hyphens: auto;
}
h2{
    font-size: 1.5em;
    margin-bottom: 20px;
}
header{
    max-width: 600px;
    margin:10px auto;
    text-align:center;
    padding:0 20px;
    
}

footer{
    max-width: 600px;
    margin:60px auto;
    text-align:center;
}

main{
    max-width: 600px;
    margin: 20px auto;
    padding:0 20px;
    line-height: 1.6em;
}
article{
    width:100%;
}

main p{
    margin:10px auto;
}

ul {
    
    list-style-type: none;
    max-width: 200px;
    margin: auto;
    overflow: hidden;
   
    
}

li { 
    float: left;
    width: 50%;
    text-align: center;
    font-size: 1em;
   
}

li a{ 
    padding: 10px 20px;
    display: inline-block;
    text-decoration: none;
    color: rgb(24, 24, 24);
    border-radius: 30px;
}   

li a:active{
    color:#a2a2a2;
}
    
li a:hover{
    
    background-color:#e9e9e9 ;
}   

   
p {
    overflow: hidden;
    font-size: 1em;

}

header img {
    
    max-width: 70%;
    margin-bottom: 20px;
}

article img {
    width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
}


.active, .active:hover, section a:hover{
    background-color: #FF0000;
    color:#fff; 
    font-weight: 600;
}   
    

 header p{
    font-size: 1.4em;
    font-weight: 400;
    margin-bottom: 50px;
 }

 section div{
    margin: 20px auto;
    text-align: center;
 }


 section a{
    text-decoration: none;
    color: rgb(24, 24, 24);
    border-radius: 30px;
    background-color: #e9e9e9;
    margin-left: 30px;
    padding: 5px 20px 6px 20px;
}

hr{
  border: none;  
}
section a:active, .active:active{
    background-color: #ff2c2c;
}

.article_Nav{
    max-width: 600px;
    margin:50px auto;
    text-align:center;
    padding:0 20px;

}
.article_Nav a{
    
    margin:20px 10px;
} 




 @media screen and (max-width: 600px) {
    section div, section div i, section div strong {
        display: block;
    }
    section div a{
        display: inline-block;
        margin:10px auto;
        padding: 10px 30px;
        
        
    }
    .article_Nav a{
        display:block;
        margin:10px auto;
    }
  }