/* ==========================================================================
Global Styles
========================================================================== */
html {
  scroll-behavior: smooth;
}
html.sr .load-hidden {
    visibility: hidden;
}




/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  color: #FCD0AF;
  font-family: 'Montserrat', sans-serif;
  background: #ffffff; font-weight: 400;
}

h2{font-size: 30px;font-weight: 300; line-height: 48px; margin-bottom: 25px}
h3{font-size: 24px;font-weight: 500; margin-bottom: 1em}
h4{font-size: 20px;font-weight: 400;}
p{font-size: 18px; margin-top:20px; margin-bottom: 20px; font-weight: 400; line-height: 24px; letter-spacing: 0.1rem}
.carousel-control.left, .carousel-control.right{background: none}
@media (min-width: 768px){
  .container{width: 1080px}
}

.text-black{color: #231F20!important}
section{padding:60px 0; overflow: hidden;}
.bg-green{background: #163131}
ul{margin-block-start: 0;
    margin-block-end: 0; padding-inline-start: 0}
* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 20;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
  padding-right: 0;
  padding-left: 0;
}
.navbar-wrapper .navbar {
  padding-right: 15px;
  padding-left: 15px;
}
/*.navbar-wrapper .navbar .container {
  width: auto;
}*/

.navbar-nav{position: relative;top:8px;}

.navbar{padding: 10px;background: #ffffff;}

.ijmlandlogo{width: 80%; position: relative;top:-5px;}
.navbar-nav>li>a{color: #000; }
.nav>li>a:focus, .nav>li>a:hover{
color:#007DC4; ;
}
.navbar-nav>li>a{padding-top: 8px;padding-bottom: 8px;text-transform: uppercase; font-weight: 500; font-size: 15px; letter-spacing: 0.1em}
.navbar-toggle .icon-bar{background:#FF564C;}
.navbar-toggle{border: 1px solid #FF564C}
.registerbtn a,.registerbtn a:hover{background: #007DC4!important; border-radius: 20px!important; color: #fff!important;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1); 
}

/* Content*/

.intro{padding:0 40px 40px; margin-top: 4%}
.ijmavelalogo{width: 30%; float: left; margin-top: 40px}
.defijm{width: 120px;float: right;}
.introtext{margin: 80px auto}
.avelaintro{width: 20%; margin: 40px auto;display: block;}

.keyvisual{padding: 0}
.keytext{position: relative; display: block; margin:0 auto; top:-80px; height: 24px}

.facilities{padding: 80px 0}
.facilities img{margin:0 auto;}
.featlist{margin: 32px 15px; list-style: none;}
.featlist li{font-size: 18px; margin-bottom: 4px}
.text-white{color: #ffffff}

.keyvisual4{padding: 0}
.keyvisual4 .container-fluid{padding:0}
.keyvisual4 .col-md-4{height: 880px; display: flex; align-items: center; justify-content: center}

.kvtext{text-align: center; color: #ffffff; margin-top: 6.5em}
.kvtext h3{font-weight: 300; margin:0}
.kvtext p{margin: 12px auto;}

.keybg1{background: url(../images/kbg1.jpg) no-repeat; background-size: cover; background-position: center;}
.keybg2{background: url(../images/kbg2.jpg) no-repeat; background-size: cover; background-position: center;}
.keybg3{background: url(../images/kbg3.jpg) no-repeat; background-size: cover; background-position: center;}

.growup{color:#231F20}
.growup img{margin:30px auto;}
.steprow{margin-top: 50px}
.pdttype{width: 70%; padding:40px}
.producttype p{font-size: 15px; line-height: 24px}

.spacious{color:#231F20 }

.featrow{display: flex; justify-content: center;margin-top: 30px}
.featcirc{background: #907050; color: #ffffff; border-radius: 100px; font-size: 18px;
  margin: 24px; width: 180px; height: 160px; display: flex; justify-content: center; align-items: center; text-align: center;}

/*floorplan*/
.floorplan{background: #E2E0DD; color:#231F20 }
ul.floorlist{list-style: none; margin-top: 30px}
ul.floorlist li{display: inline-block; padding: 0px;font-size: 18px; color: #000; cursor: pointer;}
ul.floorlist li:hover,ul.floorlist li.active{color: #468365;text-decoration: underline;}
ul.floorlist li a{font-size: 24px; color: #000; cursor: pointer;}
ul.floorlist li a:hover,ul.floorlist li.active a{color: #ff6600; text-decoration: underline;}

#avelaFloor{margin-top: 30px}
#avelaFloor .carousel-indicators li{
  background: none;border:0;border-radius: 0; text-indent: 0; width: auto; height: auto; display: block;}
#avelaFloor .carousel-indicators{top:60%; position: relative; left: 0; width: auto; margin-left: 0}
.floortitle{font-weight: 500; margin-bottom: 20px}
.floorMenu{margin-top:20%}

@media (min-width: 992px){
  .modal-lg{width: 1200px}
}


.loancal{background: #E2E0DD}
.loanCalculator{margin-bottom: 30px}
.loanCalculator .form-group{ display: flex; }
.loanCalculator label{width: 185px; display: block;position: relative;top:5px;}
.instalmentbox{background: #F3F3F3; color: #231F20; border-radius: 10px; padding: 20px}
.instalmentPrice{font-size: 28px}
.instalmentbox p{margin: 10px 0}
.calculateBtn{position: relative;left: 81%;background: #468365; color: #ffffff;border: none; border-radius: 0}
.calculateBtn:hover{background-color: #2b2a29; color: #ffffff}
.registerForm .form-control{
  padding: 12px;
  border: 0;
  background: #2b2a29;
  border-radius: 0;
  margin-top: 5px;
}
.submit-btn-2 {
    background: #468365;
    color: #ffffff;
    padding: 10px 30px;
}
.submit-btn-2:hover{background-color: #2b2a29; color: #ffffff; text-decoration: none}
.register{background: #ffffff}
.register .col-md-8{background: #F7EFEB; padding: 30px 20px;}
.checkbox p{font-size: 16px; margin:0}
.formrow{display: flex;}
.regsubmitbtn{float: right;}

/*Footer*/

footer{background: #ffffff;padding: 40px 0; color: #231F20}
.social a{margin-left: 10px}
.social img{width: 25px;}
.footer-link li {list-style: none; display: inline-block;margin-left: 15px} 
.footer-link li a{color: #232323}
.footeralign,.connectwithus{text-align: right;}
.connectwithus p{margin-top: 0}

@media (max-width: 768px) {
  footer{text-align: center;}
  .footer-link li {display: block;}
  .connectwithus,.footeralign{text-align: center; margin-top: 30px;}
}
/* Footer Ends */


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (max-width: 768px) {
.intro{ padding:0 15px 20px;margin-top: 70px}
.ijmavelalogo{margin-top: 30px; width: 180px}  
.defijm{width: 80px}
.avelaintro{margin:20px auto; width: 60%}
.keytext{height: 16px; top:-30px}
.facilities{padding:40px 15px 30px}
.featlist{margin:24px 15px}
.facilities .col-md-5{margin-bottom: 40px}
.steprow{margin-top: 0px}
.pdttype{padding: 25px 25px 5px}
.featrow{flex-wrap: wrap;justify-content: space-evenly; margin-top: 15px}
.featcirc{width: 140px; height: 140px;margin:8px; }
.producttype .col-md-6{margin-bottom: 40px}
.carousel-indicators{bottom: 5%;}
.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev{
  margin-top: 50px
}
.calculateBtn{left: 0; }
.register{padding: 20px 0}
.floorMenu{margin-top: 0; margin-bottom: 24px}
#avelaFloor{margin-top: 0}
#avelaFloor .carousel-indicators li{display: inline-block;margin:0 8px; font-size: 14px}
ul.floorlist{margin:12px auto}
.floortitle{margin-bottom: 0px}

h2{font-size: 28px; font-weight: 300;line-height: 36px}
h3{font-size: 24px}
p{font-size: 16px}
.keyvisual4 .col-md-4{height: 680px}
.kvtext{margin-top:4.8rem}

section{padding:60px 5px;overflow: hidden;}
.featTxt2{display: flex;}
.featTxt2 h2{margin-left:12px; top:-6px;}
.table>tbody>tr>td:first-child{width: 45%}
.register .row{margin:0}

}


/*Gallery*/
.selection{text-align: center;}
.selection a{font-size: 16px; color: #000; padding: 8px 16px; cursor: pointer; margin: 0 20px}
.selection a:hover{text-decoration: none; color: #29830b}
.selection a.active{color: #29830b; font-weight: bold;}

#artistimpression,.interiorgal{padding: 60px 0}
#interiorgallery{width: 90%; margin: 0 auto;}
@media (max-width: 768px) {
  .gallery{padding:60px 0}
  .selection {display: flex;flex-wrap: wrap; justify-content: center;}
  .selection a{padding: 8px; margin:0 4px}
  #artistimpression,.interiorgal{padding: 20px 0}
  #interiorgallery{width: 100%; margin: 0 auto;}
  #interiorgallery .carousel-indicators{display: none;}
#interiorgallery .carousel-control .glyphicon-chevron-left, #interiorgallery .carousel-control .glyphicon-chevron-right, 
#interiorgallery .carousel-control .icon-next, #interiorgallery .carousel-control .icon-prev{
  margin-top: 0;
}
}