body {
    font-family: "Montserrat", sans-serif;
    text-align: center;
  }
  
  html {
    scroll-behavior: smooth;
  }  
  
  div{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border: 0;
    display: block;
  }
  
  div.row{
    margin: 0;
    padding: 0;
  }
  
  .font-weight-bold{
    font-weight: bold;
  }
  
  h1, h2, h3 {
    font-family: "Montserrat-Black", sans-serif;
  }
  
  /* navbar section */
  .navbar{
    background-color: #f74d22;
    color: white;
  
  
      font-family: "source-sans-pro",Arial,Helvetica,sans-serif;
  }
  /* contact section starts here */
  .contact-us-navbar{
    background-color: #333;
  }
  div.contact-us-row{
    background-color: #333;  
    text-align: left;
    padding-left: 10%;
  }
  div.contact-us-div{
    background-color: #333;
    color: #fff;
  }
  
  /* contact us section ends here */
  
  a.navbar-a-tags{
    color: white;
    font-weight: bold;
    text-decoration:none ;
    display: block;
    padding: 0;
    margin: 0em 1em 0 0;
  }
  .navbar-brand {
    font-family: "Ubuntu", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    color: white !important;
  }
  button.navbar-toggler{
    border-color: #fff !important;
  }
  ul.navbar-nav.ml-auto{
    background-color: #f74d22;
  }
  /* fisrt top DIV section */
  #top-div{
  padding-top: 2rem;
  background-color: #f74d22;
  color: white;
  text-align: left;
  padding-left: 10%;
  }
  #top-div h1{
    font-weight: bold;
    font-size: 4rem;
  }
  #top-div p{
    text-align: left;
    padding: 0 0 5% 3%;
    width: 73%;
    font-size: 1.3rem;
  }
  div.web-desiners-developer-in-the-heart-of-nigeria{
    text-align: left;
    padding: 5% 10%;
  }
  div.web-desiners-developer-in-the-heart-of-nigeria h4{
    font-size: 1.2rem;
    font-weight: bold;
  }
  /* our services section */
  .our-web-design-services{
    background-color: #f74d22;
    padding: 5%;
  }
  .our-web-design-services .card{
    padding: 10%;
    border-radius: 10px;
  }
  div.our-mission{
    text-align: left;
    padding-top: 5rem;
  }
  .our-mission h3{
    color: yellow;
  }
  .our-mission h2{
    color: white;
  }
  .our-mission p{
    color: white;
  }
  /* main-services-section */
  #main-services-section{
    text-align: center;
    padding-top: 3rem;
  }
  #main-services-section h2{
    margin-top: 2rem;
    font-size: 3rem;
  }
  #main-services-section h4{
    margin: 2rem 0;
    color: #f74d22;
    font-weight: bold
  }
  #main-services-section .col-sm-6{
    text-align: left;
  }
  #main-services-section img{
    width: 100%;
  }
  .service-details h3{
    color: rgb(76, 76, 240);
    font-weight: bold;
  }
  /* footer section */
  div.footer-bottom{
    color: #d3d3d3;
    text-align: left;
    bottom: 0;
    padding: 3% 5%;
    width: 100%;
    background-color: #f74d22;
  }
  .bottom-menu-title{
    font-size: 0.8rem;
    font-weight: bold;
  }
  .social-media-p{
    font-size: 0.8rem;
    color: white;
  }
  .social-media-p:hover{
    color: goldenrod;
  }
  /* added from bootstrap navbar */
    body {
    padding-top: 56px;
    }
  
    @media only screen and (max-width: 767px){
      #top-div h1{
        font-size: 2.5rem;
      }
      #main-services-section img{
        width: 30%;
      }
      #main-services-section{
        padding: 0;  
      }
      .our-web-design-services{
        padding: 0;
      }
      .service-details h3{
         padding: 0;
      }
      div.web-desiners-developer-in-the-heart-of-nigeria img{
        width: 100%;
      } 
      .navbar-brand {
        font-weight: bold;
        padding: 0;
        font-size: 1.5rem;
      }
      li{
        margin: 0.6rem;
      }
    /* cuntact-us section starts here */
    .contact-us-div p{
      font-size: 0.9rem;
    }
    /* social media section */
    .social-media{
      width: 6rem;
      margin: 1rem;
    } 
  }
  
  @media only screen and (max-width: 600px){
  
    #top-div h1{
      font-size: 2rem;
    }
    #top-div p{
  width: 100%;
    }
    #main-services-section img{
      width: 60%;
    }
  
    #main-services-section .col-sm-6{
      text-align: center;
      padding: 5%;
    }
  
  }
  
  