body {
    margin:2%;
    background-color: lightblue;
}

span {
  color: rgb(8, 131, 19);
}

.sideNav {
  margin:2.5% 2.1%;
  height:100%;
  width:0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(137, 199, 130);
  overflow-x: hidden;
  transition: 0.5s;
}

.sideNav a{
  text-decoration:none;
  font-size: 30px;
  font-family: sans-serif;
  color: rgb(255,255,255);
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
}

.sideNav a:hover {
  color: rgb(4, 13, 65);
}

.sideNav > a:first-child {
  font-size: 50px;
  justify-content: flex-start;
  margin-left: 5%;
}

h1{
    font-size: 130px;
    color: rgb(187, 236, 155);
}

h3{
    font-size: 30px;
    color: thistle;
}

img{
    width: 800px;
    height: 400px;
}

.home{
    border-radius: 100px;
background-color: black;
}

*{
    margin: 0;
    padding: 0;
}



#img{
    width: 600px;
    height: 550px;
    background-image: url("https://cdn.britannica.com/10/94510-050-D0B814DA/Machhapuchhare-Great-Himalaya-Range-Nepal.jpg");
    background-size: cover;
    -webkit-mask: url("./paintblob.png");
    -webkit-mask-size: 100%;
}

* {
    box-sizing: border-box;
  }
  
  /* Style inputs */
  input[type=text], select, textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    margin-top: 6px;
    margin-bottom: 16px;
    resize: vertical;
  }
  
  input[type=submit] {
    background-color: #04AA6D;
    color: white;
    padding: 12px 20px;
    border: none;
    cursor: pointer;
  }
  
  input[type=submit]:hover {
    background-color: #45a049;
  }
  
  /* Style the container/contact section */
  .container {
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 10px;
  }
  
  /* Create two columns that float next to eachother */
  .column {
    float: left;
    width: 50%;
    margin-top: 6px;
    padding: 20px;
  }
  
  /* Clear floats after the columns */
  .row:after {
    content: "";
    display: table;
    clear: both;
  }
  
  /* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
  @media screen and (max-width: 600px) {
    .column, input[type=submit] {
      width: 100%;
      margin-top: 0;
    }
  }