@charset "utf-8";

*, *::before, *::after{
    box-sizing: border-box;
}

body{
    /* width: 1920px;  */
     /* margin: 0 auto;  */
    min-height: 100vh;
    background-color: #dff1f5;
    display: grid;
    grid-template:
   "... ...... ...... ...... ...... ...... ..." 
   "header header header header header header header" 510px
   "... ...... ...... ...... ...... ...... ..." 60px
   "... left   ...... center ...... right  ..." 1fr
   "... ...... ...... ...... ...... ...... ..." 
   "... ...... ...... mainA  ...... ...... ..."
   "footer footer footer footer footer footer footer" 150px
   "... ...... ...... ...... ...... ...... ..."
   / 200px 250px auto minmax(500px,1fr) auto 200px 200px;
 
}

main{
    margin: 30px 5% 0;
}

.text_link{
    color:blue;
}
.text_link:hover{
    background-color:lightsteelblue;   
}

ul{
    list-style-type: none;
}

a{
    text-decoration: none;
    color: #333;
}

@media screen and (max-width: 1600px){
    body {
       
        grid-template:
        "... ...... ...... ...... ...... ...... ..." 
        "header header header header header header header" 510px
        "... ...... ...... ...... ...... ...... ..." 60px
        "... left   ...... center ...... right  ..." 1fr
        "... ...... ...... ...... ...... ...... ..." 
        "... ...... ...... mainA  ...... ...... ..."
        "footer footer footer footer footer footer footer" 150px
        "... ...... ...... ...... ...... ...... ..."
        / 10px 250px auto minmax(500px,1fr) auto 200px 10px;
    }




@media screen and (max-width: 980px){
    body {
       
        grid-template:
        "... ...... ...... ...... ...... ...... ..." 
        "... header header header header header ..." 510px
        "... ...... ...... ...... ...... ...... ..." 30px
        "... center center center center center ..." 1fr
        "... ...... left   left   right  ...... ..." 
        "... mainA  mainA  mainA  mainA  mainA  ..."
        "... footer footer footer footer footer ..." 150px
        "... ...... ...... ...... ...... ...... ..."
        / 0 auto auto 500px auto auto 0;

        max-width: 980;
        width: 100%;
    }

    header{
        max-width:980px;
        width: 100%;
        font-size: 10px;
    }

    header img{
        max-width: 700px;
        width: 100%;
    }

    .list_nav_header2{
font-size: 15px;
    }



    main{
        max-width:980px;
        margin-top: 20px;
    }

  
  .se_container{
      max-width: 700px;
  }

    

}

   
   
/* @media screen and (max-width: 1600px){
    body {
       
        grid-template:
        "... ...... ...... ...... ...... ...... ..." 
        "... header header header header header ..." 510px
        "... ...... ...... ...... ...... ...... ..." 30px
        "... left   ...... center ...... right  ..." 1fr
        "... ...... ...... ...... ...... ...... ..." 
        "... footer footer footer footer footer ..." 150px
        "... ...... ...... ...... ...... ...... ..."
        / auto 250px auto minmax(600px,1fr) auto 150px auto;
    }
} */


/* @media screen and (max-width: 980px){
    body {
        
        width: auto;
        grid-template:
            "header header header"
            "center center center" 1fr
            "left   right  ....." 
            "footer footer footer" 150px;
        }

       

        .nav_header2 li{
            margin: 10px 0px 0px 40px;
            
        }

        .logo_header{
            font-size: 5px;
        }

        img{
            width: 60%;
        }

        aside {
            margin-left: 40px;
            margin-top: 15px;
            width: 200px;
            
            }
} */