@media all and (min-width: 768px) and (max-width: 1236px) 
{

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
 width:70%;
  margin: 0 auto;


}
.weather
{
   display: grid;
   grid-template-columns: 1fr 1fr;
   text-align: center;
}
.contact-form {
	width:70%;
  margin: 0 auto;

}
.navigation li:first-child {display: block;}
.navigation li {display: none;}

.nav picture img {
	
display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        width: 70%;
        text-align: center;
        margin: auto;
        min-height: 200px;
       
        align-items: center;
}
.navigation a 
{
display: block;
color: black;
padding: 0.75rem;
text-align: left;
text-decoration: none;

}
.temples img {
	width: 100%;
	height: auto;
} 
.flex {
	display: block;
}


}