*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.nav-link{     
    color: #626262 !important;
    font-size: 16px;
    text-transform: uppercase;
    font-family: 'Playfair Display', serif; 
    margin-left: 3rem;
}
.nav-link:hover{
    color: #000 !important;
    transition: ease-in-out .3s;
}
.img-fluid{
    margin-top: 50px;
}
.nav-link::after{
    content: '';
    height: 2px;
    width: 0;
    display: block;
    margin: auto;
    background: #626262;
}
.nav-link:hover::after{
    width: 100%;
    transition: all .4s;
}
.col-md-6{ 
    text-align: center;
}
.col-md-6 h1,
.col-md-6 h4, 
.col-md-6 p{
    text-align: left;
}
.col-md-6 h1{
    color: #626262;
    margin-bottom: 30px;
    font-size: 32px;
    font-family: 'Playfair Display', serif;
}
.col-md-6 h4{
    text-transform: uppercase;
    color: #626262; 
    font-size: 14px;
    margin: 30px 0;
    font-family: 'Playfair Display', serif;
}
.col-md-6 p{
    color: #626262;
    line-height: initial;
    font-family: 'Playfair Display', serif;
}

section{ 
    padding: 60px 80px;
}
.perfect h3{  
    text-transform: uppercase;
    color: #626262; 
    font-size: 14px;
    margin-bottom: 30px;
    font-family: 'Ubuntu', sans-serif;
}
.perfect h2{ 
    text-transform: uppercase;
    color: #626262; 
    font-size: 14px;
    margin-top: 50px;
    font-family: 'Ubuntu', sans-serif;
}
.perfect h1{ 
    color: #626262;
    margin-bottom: 30px;
    font-size: 32px;
    font-family: 'Playfair Display', serif;
}
.perfect p{ 
    color: #626262;
    line-height: initial;
    font-family: 'Playfair Display', serif;
}
.newsletter{
    text-align: center;
    background: #F0F0F0;
}
.email{
    padding: 70px 0;  
}
.email h1{
    color: #626262;
    margin-bottom: 60px; 
    margin-top: 10px;
    font-size: 32px;
    text-align: center; 
    font-family: 'Playfair Display', serif;
}
.email input{ 
    width: 40%; 
    border: none;
    border-bottom: 1px solid #000;
    padding: 1rem;
    background: transparent;
    font-size: 16px;
    font-family: 'Playfair Display', serif;
}
.email input:focus{
    outline: none;
}
.btn{
    text-align: center;
}
.btn-success{
    padding: 15px 40px;
    font-size: 18px;
    border: 1px solid #626262;
    background: transparent;
    color: #626262;
    cursor: pointer;
    font-family: 'Playfair Display', serif;
    border-radius: 0; 
    margin-bottom: 150px; 
}
.btn-success:hover{
    font-size: 18px;
    border: 1px solid #000;
    background: transparent;
    color: #000;
}
footer{
    background: #F0F0F0;  
    width: 100%;
    padding: 30px 20px 10px;
}
footer ul li{
    list-style: none;
    display: inline-block;
    padding: 0 10px;
}
footer ul li a{
    color: #000;
    text-decoration: none;
    font-size: 16px;  
    font-family: 'Playfair Display', serif;  
}
footer .follow{
    text-align: right; 
}














/* Responsive Code */


  /* 
    ##Device = Low Resolution Tablets, Mobiles (Landscape) 
    ##Screen = B/w 481px to 767px
  */
   
  @media (min-width: 481px) and (max-width: 800px) {
    section{
        padding: 25px 8px;
    }
    footer .follow{
        text-align: center;
    }
    ol, ul {
        padding-left: 2rem;
    }
    .email input{ 
        width: 80%; 
    }
    
  }
  
  /* 
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
  */
  
  @media (min-width: 320px) and (max-width: 480px) {
    
    section{
        padding: 25px 8px;
    }
    ol, ul {
        padding-left: 2rem;
    }
    footer .follow{
        text-align: center;
    }
    .col-md-6 h1{
        margin-bottom: 10px;
        font-size: 22px;
        text-align: center;
    }
    .col-md-6 h4{
        font-size: 14px;
        margin: 10px 0; 
        text-align: center;

    }
    .col-md-6 p{
       font-size: 12px;
       text-align: center;

    }
    .email h1{
        margin-bottom: 30px; 
        margin-top: 10px;
        font-size: 22px;
    }
    .perfect h1{      
        margin-bottom: 10px;
        font-size: 22px;
    }
    .perfect p{ 
        font-size: 14px;
    }
    .email{
        padding: 30px 0;  
    }
    .email input{ 
        width: 100%; 
        font-size: 14px;
    }
    
  }

  @media (min-width: 100px) and (max-width: 319px) {
    
    section{
        padding: 25px 8px;
    }
    ol, ul {
        padding-left: 2rem;
    }
    footer .follow{
        text-align: center;
    }
    
  }