*,
*::after,
*::before{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    font-family: "Lato", sans-serif;
    /* font-family: "Arimo", sans-serif; */
    /* font-family: "Six Caps", Sans-serif; */
}
ul{
    list-style: none;
    padding: 0;
    margin: 0;
}
a{
    text-decoration: none;
    font-family: "Lato", sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Arimo";
}

:root{
    --grayblack:#29333d;
}
header .header-wrapper .lt-block{
    width: 25%;
}
header .rt-block.d-flex.align-items-center {
    width: 100%;
    justify-content: space-between;
}

header {
    position: sticky;
    left: 0;
    top: 0;
    width: 100%;
    background-color: white;
    transition: all 0.3s ease-in-out;
    /* box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; */
    z-index: 333;
    border-bottom: 1px solid #d5d5d5;
}

body.scroll-down header {
    transform: translate3d(0, -100%, 0);
}
body.scroll-up header {
   box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.15);
    border-bottom: 1px solid #ddd;
}

header .stellarnav {
    width: max-content;
    z-index: 9900;
}
header .stellarnav ul li a {
    text-transform: capitalize;
    color: #606060;
}
.stellarnav>ul>li>a {
    padding: 20px 16px;
}
.login-register{
    padding-inline:16px ;
    background-color: #fff;
    color: #29333d;
    font-size: 12px;
    text-transform: capitalize;
    padding-block: 12px;
    border: none;
}
.submit{
    padding-inline:16px ;
    border: 1px solid #03b5c3;
    color: #03b5c3;
    background-color: #fff;
    font-size: 12px;
    text-transform: capitalize;
    padding-block: 12px;
    text-decoration: none;
    border-radius: 3px;
    font-weight: 600;
}

.banner {
    background-image: url("../../assets/images/homepage-banner.jpg");
    width: 100%;
    background-position: 0px 25%;
    background-repeat: no-repeat;
    background-size: cover;
    padding-block: 100px;
}
.overly{
    width: 100%;
    height: 100%;
    top: 0;
    background-color: #001438;
    opacity: 0.29;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
    z-index: 1;
}
.banner-content {
    z-index: 2;
    width: 45%;
}
.banner .banner-content ul li span {
    color: #6EC1E4;
    font-size: 40px;
}
.banner .banner-content ul li {
    font-family: "Arimo", Sans-serif;
    font-size: 23px;
    font-weight: 400;
    color: #fff;
    padding-block-start: 15px;
}
.banner .banner-content h1{
    color: #ffffff;
    font-family: "Six Caps", Sans-serif;
    font-size: 107px;
    font-weight: normal;
    letter-spacing: 2.8px;
}
.contact-btn{
    font-family: "Arimo", Sans-serif;
    font-size: 14px;
    text-transform: uppercase;
    color: #27425D;
    background-color: #FFFFFF;
    padding: 15px 50px 15px 50px;
    display: inline-block;
    border-radius: 3px;
    margin-block-start: 50px;
    font-weight: 500;
}
.contact-btn:hover{
    background-color:#27425dcb ;
    color: #ccc9c9;
}


/* ======================== AGENT ========== */
.agent{
    background-color: #EFEFEF;
    padding-block: 60px;
}
.agent .col-lg-4 .box{
    padding: 20px;
}
.agent .agent-info {
    padding: 30px 20px;
    font-size: 14px;
    line-height: 1.85em;
    border: 1px solid #d1d1d1;
    border-top: none;
    background: #ffff;
}
.agent figure {
    margin: 0;
    overflow: hidden;
}
.agent .box .agent-info h5 {
    color: #262624;
    font-size: 20px;
    text-transform: capitalize;
}
.agent .box .agent-info h6{
    font-family: "Arimo";
    color: #878c92;
    margin-top: 3px;
    font-size: 14px;
}
.agent-bottom-sce{
    padding-block-start: 100px;
}

/* ======================== The River District ========== */

.the-river-district{
    padding-block: 100px;
}
.the-river-district .col-lg-4 .box-flex{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.the-river-district h5 {
    text-transform: uppercase;
    color: #494f5c;
    font-size: 16px;
    font-family: 'Arimo';
    font-weight: 200;
}
.heading h3{
    color: #27425D;
    font-size: 65px;
    font-weight: 700;
    font-family: "Arimo", sans-serif;
    padding-inline-end: 10px;
}
.the-river-district .img-block{
    overflow: hidden;
    transition: 0.5s;
}
.the-river-district .img-block img{
    transition: 0.5s;
} 
.the-river-district .img-block:hover img{
    scale: 1.2;
    transition: 0.5s;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
}
.the-river-district p {
    color: #8d9095;
    font-size: 16px;
    line-height: 1.6;
}

/* ======================= Turbulencet ========================  */
.turbulencet{
    padding-block: 100px;
    border-top: 1px solid #bebbbb;
}
.turbulencet .text-content {
    width: 62%;
    text-align: center;
    margin: 0 auto;
}
.sec-heading {
    font-size: 45px!important;
    text-align: center;
    padding-inline: 80px!important;
}
.turbulencet .contact-btn{
    background-color: #27425D;
    color: #fff;
    transition: 0.5s;
}
.turbulencet .contact-btn:hover{
    background-color: #53CCD6;
    transition: 0.5s;
}

.turbulencet p {
    color: #8d9095;
    font-size: 16px;
    line-height: 1.7;
}

/* ======================= Guidance ======================== */
.guidance {
    padding-block: 100px;
    border-top: 1px solid #bebbbb;
}

.guidance .box p {
    color: #7e8695;
    font-size: 16px;
    line-height: 1.7;
    font-weight: 300;
}
.guidance .box{
    padding-inline: 20px;
}
h5.holder {
    font-weight: 600;
    color: #27425D;
    font-size: 18px;
    padding-block-start: 10px;
    text-transform: capitalize;
}
.guidance .col-lg-6{
    padding-block-start: 80px;
}
footer{
    padding-block-start: 60px;
    border-top: 1px solid #bebbbb;
    padding-block-end: 60px;
}
footer ul li a {
    color: #191919;
    font-size: 14px;
}
footer ul li.flex a{
    display: flex ;
    gap: 10px;
    align-items: center;
}
footer ul li.flex a span{
    font-size: 17px;
}
span.broker{
    font-size: 14px;
    color: #191919;
}
.social-media a {
    display: inline-block;
    min-width: 40px;
    padding: 5px 10px;
    border: 1px solid #efefef;
    color: #000000;
    border-radius: 3px;
}
.social-media a:hover{
    background-color: #517FA4;
    color: #fff;
}
.end-footer{
    background-color: #EFEFEF;
    padding-block: 20px;
}
.end-footer a{
    color: #000;
    font-size: 14px;
}
.end-footer p{
    color: #000;
    font-size: 14px;
    margin: 0;
}

/* ********************** ABOUT PAGE ********************* */
.about-banner {
    background-image: url(../../assets/images/about-banner-bg.jpg);
    background-size: cover;
    width: 100%;
    height: 100%;
    padding-block: 50px;
    background-repeat: no-repeat;
    background-position: center;
}
.about-banner .banner-content h1{
    color: #ffffff;
    font-family: "Six Caps", Sans-serif;
    font-size: 50px;
    font-weight: normal;
    letter-spacing: 2px;
    margin: 0;
    text-align: center;
    font-weight: 600;
}
.about-banner .overly{
    width: 100%;
    height: 100%;
    top: 0;
    background-color: #000000;
    opacity: 0.7;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
    z-index: 1;
}
.about-us {
    padding-block: 80px;
}
.about-us .paragraph p{
    font-family: Roboto, sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    background-color: #ffffff;
    text-align: left;
}
.about-us .paragraph {
    padding-inline-end: 60px;
}
.about-us-footer{
    border-top: none;
}
.about-us .image-block{
    width: 80%;
}


/* ************* agent page****************** */
.agents-banner h2{
    font-size: 18px;
    color: #efefef;
    font-weight: 300;
    font-family: 'Lato', 'sans-serif';
    text-transform: uppercase;
}
.agents-banner {
    background-image: url(../../assets/images/agents-hero-bg.jpg);
    background-size: cover;
    width: 100%;;
}
.agents-wrapper{
    padding-block-start: 60px;
}
.agents-banner form{
    padding: 20px;
    background: #efefef;
    border: 1px solid #d5d9dd;
}
.search-input{
    border: none;
    outline: none;
    color: #444;
    display: inline-block;
    width: 100%;
    padding: 11px 16px;
    height: 42px;
    background: #fff;
    border: 1px solid #d5d9dd;
    border-radius: 3px;
    font-size: 14px;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Arimo";
}
.agents-wrapper .agents-info h4{
    color: #000;
    font-size: 22px;
    font-weight: 400;
}
.agents-wrapper .agents-info h5{
    color: #878c92;
    font-size: 18px;
    font-weight: 400;
}
.agents-wrapper .agents-list .col-lg-3 .box{
    border: 1px solid #d5d9dd;
}
.agents-info {
    padding-inline: 20px;
    padding-block-start: 20px;
    padding-block-end: 110px;
}
.agents-info ul li a{
    display: flex;
    justify-content: space-between;
}
.agents-info ul li:nth-child(1) {
    padding-block-end: 7px;
    border-bottom: 1px solid #d5d9dd;
}
.agents-info ul li:nth-child(2){
    padding-block-start: 6px;
}

.agents-info ul li a span{
    color: #878c92;
}
.agents-info ul li a {
    color: #000;
    font-size: 14px;
}
.agents-wrapper .agents-list .box {
    max-height: 528px;
    margin-block-start: 25px;
}
fieldset {
    background: #EFEFEF;
    padding: 20px;
}


/* *******************contact******************* */

.contact-form{
    padding-block-start: 200px;
    padding-block-end: 100px;
}
.control{
    outline: none;
    color: #444;
    display: inline-block;
    width: 100%;
    margin: 0 0 16px 0;
    padding: 11px 16px;
    height: 42px;
    background: #fff;
    border: 1px solid #d5d9dd;
    border-radius: 3px;
}
.contact-form .send {
    padding-inline: 25px;
    background-color: #03b5c3;
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
    padding-block: 12px;
    text-decoration: none;
    border-radius: 3px;
    font-weight: 600;
    border:none;
    margin-block-start: 20px;
}
.contact-detalis h5 {
    margin: 0;
    padding: 10px 20px;
    font-size: 1em;
    background: #efefef;
    border-bottom: 1px solid #d5d9dd;
}
.contact-detalis ul li.flex a {
    display: flex;
    gap: 10px;
    align-items: center;
}
.contact-detalis ul li a {
    color: #191919;
    font-size: 16px;
}
.contact-detalis ul li.flex a span {
    font-size: 17px;
}
.contact-detalis{
    border-radius: 3px;
    border: 1px solid #d5d9dd;
    margin-bottom: 25px;
}
.contact-detalis .box{
    padding: 20px;
}
.contact-form .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
    padding-inline-end: 100px;
}
.input-group-box {
    padding-block-end: 25px;
}


/************ submit-listing-banner *******/
.submit-listing-banner {
    background-image: url(../../assets/images/listing-hero-bg.jpg);
    background-size: cover;
    width: 100%;;
}
.must-be-login{
    padding-block: 60px;
}
.submit-listing-banner .banner-content h1 {
    font-family: "Arimo", sans-serif;
    text-transform: uppercase;
}
.must-be-login .submit {
    padding-inline: 25px;
    border: none;
    color: #ffffff;
    background-color: #03b5c3;
    font-size: 12px;
    text-transform: capitalize;
    padding-block: 12px;
    text-decoration: none;
    border-radius: 3px;
    font-weight: 600;
}
.must-be-login h4{
    font-weight: normal;
    color: #262624;
    font-size: 22px;
}
.must-be-login .login-page{
    padding: 15% 8%;
    border: 1px solid #d5d9dd;
}

/****************** popup-login *****************/
.popup-wrapper {
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 999999;
    top: 0;
    backdrop-filter: blur(10px);
    display: none;
}
.popup-wrapper .wrapper-content {
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    display: flex;
    justify-content: center;
}
.popup-login {
    width: 16%;
    background: #ffffff;
    position: absolute;
    top: 10%;
    padding: 20px;

    
}
.popup-login .contact-btn {
    font-family: "Arimo", Sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    background: #27425D;
    color: #fff;
    padding: 12px 50px 12px 50px;
    display: inline-block;
    border-radius: 3px;
    margin-block-start: 16px;
    font-weight: 500;
    border: none;
    width: 100%;
}
.popup-login .box label{
    display: block;
    padding-block-end: 5px;
    font-size: 16px;
    font-weight: 400;
    color: rgb(135, 140, 146);
}
.popup-login h4{
    font-family: "Arimo", sans-serif;
    font-size: 21px;
    font-weight: 400;
    color:rgb(38, 38, 36);
}
.popup-login p{
    font-size: 16px;
    font-weight: 400;
    color: rgb(135, 140, 146);
    padding-block-end: 10px;
    padding-block-start: 10px;
}
.popup-login p a{
    color:rgb(0, 0, 0)
}
.popup-login .control{
    outline: none;
    color: #444;
    display: inline-block;
    width: 100%;
    margin: 0 0 16px 0;
    padding: 11px 16px;
    height: 42px;
    background: #fff;
    border: 1px solid #d5d9dd;
    border-radius: 3px;
}
.social-app a {
    width: 100%;
    display: inline-block;
    background: #3A7EA2;
    padding-block: 5px;
    margin-block-start: 20px;
}
.social-app a img {
    position: relative;
    left: 30px;
    top: -5px;
}
.social-app a.google{
    background-color: #C63D2D;
}
.social-app a.twitter{
    background-color: #55C5EF;
}
.lost-your-psw{
    font-size: 12px;
    font-weight: 400;
    color: rgb(0, 0, 0);
    padding-block-start: 20px;
    display: inline-block;
}
a.close-btn {
    position: absolute;
    right: 5%;
    background: #55c5ef;
    top: 0%;
    padding: 8px;
    border-radius: 0 0 20px 20px;
    color: #fff;
}

/****************** popup-register *****************/
.register-form {
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 999999;
    top: 0;
    backdrop-filter: blur(10px);
    display: none;
}
.register-form .wrapper-content {
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    display: flex;
    justify-content: center;
}
.popup-register {
    width: 16%;
    background: #ffffff;
    position: absolute;
    top: 10%;
    padding: 20px;

    
}
.popup-register .contact-btn {
    font-family: "Arimo", Sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    background: #27425D;
    color: #fff;
    padding: 12px 50px 12px 50px;
    display: inline-block;
    border-radius: 3px;
    margin-block-start: 16px;
    font-weight: 500;
    border: none;
    width: 100%;
}
.popup-register .box label{
    display: block;
    padding-block-end: 5px;
    font-size: 16px;
    font-weight: 400;
    color: rgb(135, 140, 146);
}
.popup-register h4{
    font-family: "Arimo", sans-serif;
    font-size: 21px;
    font-weight: 400;
    color:rgb(38, 38, 36);
}
.popup-register p{
    font-size: 16px;
    font-weight: 400;
    color: rgb(135, 140, 146);
    padding-block-end: 10px;
    padding-block-start: 10px;
}
.popup-register p a{
    color:rgb(0, 0, 0)
}
.popup-register .control{
    outline: none;
    color: #444;
    display: inline-block;
    width: 100%;
    margin: 0 0 16px 0;
    padding: 11px 16px;
    height: 42px;
    background: #fff;
    border: 1px solid #d5d9dd;
    border-radius: 3px;
}




/* *****************single page *************/
.title-header {
    padding-block: 10px;
    border-bottom: 1px solid #d5d9dd;
    background-color: #EFEFEF;
}
.title-header h5{
    color: #191919;
    font-size: 17px;
    font-weight: 400;
}
.title-header a{
    color: #878c92;
    font-size: 13px;
    font-weight: 400;
}
.title-header span i{
     color: #878c92;;
}
.title-header h6{
    color: rgb(25, 25, 25);
    font-size: 13px;
    font-weight: 400;
}
.single-post .col-lg-6 .content p {
    padding-block-start: 22px;
    font-size: 14px;
    color: rgb(25, 25, 25);
}
.single-post .contact-detalis {
    border-radius: 3px;
    border: none;
    margin-bottom: 25px;
}
.single-post .contact-detalis ul li:nth-child(2) {
    border-top: 1px solid #cfcdcd;
    margin-block-start: 15px;
}
.single-post{
    padding-block-start: 70px;
}
.single-post .box{
    border: 1px solid #d5d9dd;;
}
.check-back-soon p{
    font-size: 16px;
    font-weight: 700;
    color: rgb(25, 25, 25);
}
.check-back-soon {
    margin: 0 0 60px 0;
    padding: 15% 20px;
    text-align: center;
    border: 1px solid #efefef;
    background: #f9f9ed;
}
.single-post .content h3{
    font-family:"Arimo", sans-serif;
    font-size: 28px;
    font-weight: 400;
    color: rgb(38, 38, 36);
}
.single-post .content strong{
    font: 14px;
    color: rgb(25, 25, 25);
    font-weight: 700;
}
.single-post .contact-detalis ul li.flex a span {
    font-size: 17px;
    color:#878EA0;
}
.single-post .contact-detalis ul li.flex a {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
}