@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;500;600&display=swap');
/*===================================================================
#3c4179 purple blue   #dfe6e9 light grey #aaa69d tan grey
#3354a3 royal blue    #b2bec3  med grey   #d1ccc0  medium tan grey *
#456788 blue grey     #636e72  dark grey    #114569 logo color btn #247cd4;
=====================================================================*/
/*=============================================================
            #0a85f8;              GENERIC font-family: 'Pacifico', cursive;
==============================================================*/

body{
    font-family: 'Montserrat', sans-serif;
}


h1,
h2,
h3,
h4,
h5{
    text-transform:uppercase;
}

h2{
    font-size:1.8rem;
}

h3{
    font-size:1.2rem;
    line-height:2rem;
}

h4{
    font-size:1.1rem;
}

h5{
    font-size:0.9rem;
}

.banner-accent{
    font-family: 'Pacifico', cursive;
    text-transform:capitalize;
    font-size:1.9rem;
    color:#fff;
}
.banner-heading{
text-transform: uppercase;
font-size:1.8rem;
font-weight:600;
}

@media(min-width:320px) and (max-width:494px){
   .banner-heading{
      font-size:1.1rem;
   
        }
          
    .img-fluid.me.mb-3{
        width:50%;
        justify-content: center;
    }

    p.lead.banner-par{
        font-size:.9rem !important;
    }

    .find-your-house h3{
        font-size:1.5rem;
      
    }

}

/*=============================================================
                          IMAGE
==============================================================*/
img{
    width:100%;
}

.small{
    width:40%;
}

.me{
    width:90%;
}
p{
    font-size:15px;
    line-height:1.9rem;
    font-weight:300;

}
.lead{
    line-height:2rem;

}
iframe{
    height:100vh;
   
}

.content-title-underline{
width:40px;
height:6px;
background-color:#71b100;
margin:0 auto 40px auto;
}

.content-box{
    padding:60px;
    border: 1px solid #dfe6e9 ;

}

.banner-heading{

    -webkit-animation-duration: .7s;
    animation-duration:.7s;
}


.p.lead.banner-par{
    -webkit-animation-delay: .6s;
    animation-delay: .6s;
}
/*=============================================================
            

           HEADER
==============================================================*/
.homecover{
    background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)), url(../img/home-hero.jpg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
    height:100vh;
    position:relative;
}


.jumbotron{
    background-image:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)), url(../img/jumbotron.jpg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;
}
.accent{
    font-size:3rem;
    font-weight:900;
}

.color{
    color:#cebc8f;
}

p.lead.banner-par{
font-size:1.6rem;
text-transform:uppercase;
font-weight:100;
}

.banner{
    position:absolute;
    top:60%;
    left:50%;
    transform: translate(-50%, -50%);
    width:80%;
    }

.btn-primary{
    background-color:#114569;
    border-color:#114569;
    border-radius:none;
}
 .btn-primary:hover{
     background-color:#247cd4;
     border-color:#247cd4;
 }
i{
    color:#114569;
}
i:hover{
color:#247cd4;
}

a{
    color:white;
}
a:hover,
a:active{
color:white;
}


a.nav-link{
    text-transform:uppercase;
    font-size:20px;
    font-weight:900;

}


.img.img-fluid.icon.mb-4{
    width:80%;
    color:#567899;
}


 /*=============================================================
                          FIND YOUR HOME.row.no-gutters [class*=col-]{
    padding-left:0;
    padding-right:0;
  }
  
==============================================================*/

.find-your-house p{
    font-size:1.1rem;
    letter-spacing: 2px;
}

.find-your-house{
    background-image:linear-gradient(rgba(0,0,0,0.3),rgba(0,0,0,0.3)),url(../img/contact.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    padding:12px;
}

.find-your-house .row{
height: 26rem;

}

.find-your-house h3{
    font-size:1.8rem;
    font-weight:900;
}



  
  /* to create zoom-in affect*/
  
  .img-wrapper img:hover{
    transform:scale(1.5);
    cursor:zoom-in;
  }
  
  .img-wrapper {
    overflow:hidden;
  }
  /* makes zoom-in affect change smoothly*/
  .img-wrapper img{
    transition:transform .5s;
  }
  



/*=============================================================
                          FOOTER
==============================================================*/

footer{
    background-color:#567899;
}

a{
    color:#ffffff;
}


.copyright{
    font-size:12px;
}