*{margin: 0;
padding: 0;
box-sizing: border-box;
}

*,*::before,*::after{box-sizing: border-box;}
body{font-family: sans-serif;
}
nav{position: sticky;
top: 0px;}
.nav-list{background: white;
margin: 0;
padding: 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.nav-item{
  list-style: none;  
  margin-right: 32px;
}
.nav-item a{
    text-decoration: none;
    color: black;
 margin-left: 15px;

 background: rgb(167, 245, 215);
 font-size: 16px;
 font-family: sans-serif;
 outline: none;
 border: none;
 padding: .5rem 1rem;
 cursor: pointer;
 }
.nav-item a:hover{
   text-decoration: none;
   color: white;
   background: black;
   transition:.8s ;
   -webkit-transition:.8s ;
   -moz-transition:.8s ;
   -ms-transition:.8s ;
   -o-transition:.8s ;
}

  .nav-item:first-child{margin-right: auto;}
button{
    background: rgb(167, 167, 245);
    font-size: 16px;
    font-family: sans-serif;
    outline: none;
    border: none;
    padding: .5rem 1rem;
    cursor: pointer;
}
button:hover{
    color: white;
    background: black;
    transition: .8s;
}

/* ====================================
main menu
==================================== */
#main{width: 90%;
    height: auto;
    margin: 50px auto;
    border: 1px solid black;
    display: grid;
    grid-template-rows: repeat(2,350px);
    grid-template-columns: repeat(auto-fill,minmax(150px,280px));
    gap: 20px;
    grid-auto-rows: 230px;
   justify-items: center;
   
}
#div1{background: ;}
#google{width: 290px;
height: 200px;
margin-top: 50px;
margin-left: 85px;}

#div2{
      
}
#div2:hover{ rotate: 360deg; transition: .9s; -webkit-transition: .9s; -moz-transition: .9s; -ms-transition: .9s; -o-transition: .9s;}
#div3{background:;}
#div4{background: green;}
#div5{background: white;}
#div6{background: red;
text-align: center;
}
#div7{background:cyan;}
#div8{background: white;}
.menufisso{width: 180px;}
img{width: 210px;
height: auto;
float: right;
margin-right: 28px;
}
img:hover{ rotate: 360deg; transition: .9s; -webkit-transition: .9s; -moz-transition: .9s; -ms-transition: .9s; -o-transition: .9s;
}
#paella {
    width: 210px;
    height: auto;
   
}
.fritto{width: 240px;
height: auto;
.fritto {
	width: 240px;
	height: auto;
	margin-left: 90px;
	overflow: hidden;
}
}
.fritto1{width: 240px;
    height: auto;}
    .header{text-align: center;}
/* medeaquery00==
======================== */
@media screen and (max-width:414px) {

    
    #main{width: 90%;
    display: grid;
    grid-template-rows: repeat(9,350px);
    grid-template-columns: ;
    justify-content: center;

    }
    #div1{background:none;
    grid-row: 8/9;
    }
    #div2{background: red;}
    #div3{background: ;}
    .menufisso{margin-left: 70px;
    margin-right: 65px;
    }
    #div4{background: red;
    
    }
    #div5{background: none;}
    
    #paella{margin-left: 28px;
    margin-right: 28px;}
    #div6{background: red;}
    #div7{background:none;}
    .fritto{margin-left: 90px;
    margin-right: 88px;
    }
   
    .fritto1{margin-right: 88px;}
    #div8{background: red;}
    #div9{background: none;
   margin-left: 25px;
   width: 300px;
    }
    
    #iframe{width: 280px;}

#google {
    width: 290px;
    height: 200px;
    margin-top: 50px;
    margin-left: 30px;
}
.nav-item a{
    text-decoration: none;
    color: black;
 margin-left: 8px;

 background: rgb(167, 245, 215);
 font-size: ;
 font-family: sans-serif;
 outline: none;
 border: none;
 padding:0px;
 cursor: pointer;
   }
   .nav-item a:hover{
    text-decoration: none;
    color: white;
    background: black;
    transition:.8s ;
    -webkit-transition:.8s ;
    -moz-transition:.8s ;
    -ms-transition:.8s ;
    -o-transition:.8s ;
 }
 



}
   /* style for menu ----------------
   ---------------------------------*/
   










/* 


.header{text-align:center ;overflow: hidden;
}
.indrizzo{color:blue;}
.euro {
    padding-right: 100px;
    color: rgb(42, 8, 231);
    text-size-adjust: 50px;
    transform: rotate(320deg);
    -webkit-transform: rotate(320deg);
    -moz-transform: rotate(320deg);
    -ms-transform: rotate(320deg);
    -o-transform: rotate(320deg);
    margin: 20px 0;
        margin-top: 20px;
        margin-left: 0px;
    margin-left: -60px;
    margin-top: -10px;
}
.piatto{
color: red;
}
.euro2{
    padding-right: 100px;
    color: rgb(42, 8, 231); text-size-adjust: 50px; transform: rotate(320deg); -webkit-transform: rotate(320deg); -moz-transform: rotate(320deg); -ms-transform: rotate(320deg); -o-transform: rotate(320deg);
    
    margin: 20px 0; 
    margin-left: 170px;
    margin-top: -40px;
   
}
.serata{text-align: center;}
.euro3{
    padding-right: 100px;
    color: rgb(42, 8, 231); text-size-adjust: 50px; transform: rotate(320deg); -webkit-transform: rotate(320deg); -moz-transform: rotate(320deg); -ms-transform: rotate(320deg); -o-transform: rotate(320deg);
    
    margin: 20px 0; 
    margin-left: 270px;
    margin-top: -60px;
   
}
.domenica {
    background: red;
    padding: 0px ;
    margin: 0 500px;
    font-size: 28px;
}
.inner{padding-top: 30px;}

img{width:30% ;
height: auto;

} */

