@import url('https://fonts.googleapis.com/css?family=Poppins:400,700');

.first_div {
    background: linear-gradient(to right, #000, #201f1f);
    font-family: 'Poppins', sans-serif;
    /*overflow-x: hidden;*/
    padding: 4em;
}

body {
    background: #000;
}

.main_div{
  position: relative;
}

hr {
    border: none;
    height: 5px;
    /* Set the hr color */
    color: #333; /* old IE */
    background-color: #333; /* Modern Browsers */
}

img {
  display: block;
  margin: 3em 0em;
  margin-bottom: 4em;
}

p{
  color: #eee;
  padding-bottom: 2.5em;
  margin: 0;
}
h1{
  color: #fff;
  font-weight: 700;
}
.site-footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin-top: 3rem;
}
.site-footer a {
  color: #777;
  font-size: 0.75rem;
  text-decoration: none;
}
.site-footer a:hover,
.site-footer a:focus {
  color: #bbb;
  text-decoration: underline;
}
.second_div{
  background: #D24000;
  font-family: 'Poppins', sans-serif;
  overflow-x: hidden;
  padding: 0em;
  margin: auto;
}
.second_div img{
  margin: 0;
  width: 100%;
}
.clearfix::after{
    content: "";
    display: table;
    clear: both;
}

/* ---------------------------- */
/* for laptop devices */
/* ----------------------------*/

@media (min-width: 769px){
    .first_div{
      position: absolute;
      top:0;
      float:left;
      left:0;
      width: 50%;
      padding: 20vh;
    }
    .site-footer {
      bottom: 3rem;
      left: 20vh;
      margin: 0;
      position: absolute;
    }
    .second_div{
      position: absolute;
      top:0;
      float: right;
      width: 50%;
      right: 0;
      margin: auto;
      padding: 20vh;
    }
    .wrap{
        min-height: 100vh;
    }
    .clearfix::after{
        content: "";
        display: table;
        clear: both;
    }
    h1{
      color: #fff;
      font-weight: 700;
      font-size: 4.5em;
    }
    .second_div img{
      display: block;
      text-align: center;
      width: 100%;
      /*box-shadow: 0 10px 36px 6px #807991;*/
    }

}