Week 3

 This week I have created another page with my code here is a screenshot:

MY PART OF CSS CODE:

* {

  box-sizing: border-box;

}

body {

  font-family: Arial, Helvetica, sans-serif;

  margin: 0;

}

.header {

  padding: 100px;

  text-align: center;

  border: 2px solid black;

  padding: 25px;

  background: url("https://m.dw.com/image/46046054_101.jpg");

  background-repeat: twice;

  background-size: 750px 400px;

}

.header h1 {

  font-size: 60px;

}

.header p {

  font-size: 20px;

  color: white;

}

.navbar {

  overflow: hidden;

  background-color: #222;

}

.navbar a {

  float: left;

  display: block;

  color: white;

  text-align: center;

  padding: 14px 20px;

  text-decoration: none;

}

.navbar a.right {

  float: right;

}

.navbar a:hover {

  background-color: #ddd;

  color: black;

}

.row {  

  display: -ms-flexbox;

  display: flex;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

}

.side {

  -ms-flex: 30%;

  flex: 30%;

  background-color: #f1f1f1;

  padding: 20px;

}

.main {   

  -ms-flex: 70%; 

  flex: 70%;

  background-color: white;

  padding: 20px;

}

.fakeimg {

  background-color: #aaa;

  width: 100%;

  padding: 20px;

}

.footer {

  padding: 20px;

  text-align: center;

  background: #ddd;

}

@media screen and (max-width: 700px) {

  .row {   

    flex-direction: column;

  }

}

@media screen and (max-width: 400px) {

  .navbar a {

    float: none;

    width: 100%;

  }

}

.Gallary{

  text-align: center;

  font-size: 60px

}