*{	
	margin:0px;
	padding:0px;
}

p{margin-bottom:0rem!important;}

#tspace{margin-top:5rem;}

.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    border:none!important;
    border-color:none!important;
}
body {
   font-family: 'Euclid Circular B';
    font-style: normal;
    font-weight: 400;
	font-size:18px;
	color: #1E1E1E;
}
  .property-container2{
    padding: 50px 100px;
  }
  .custom-header {
    margin-left: 100px;
    margin-right: 100px;
  }
  
 .custom-container {
    padding-left: 100px;
    padding-right: 100px;
  }
  .custom-container2{
	padding: 100px 100px;
  }

  @media (min-width: 0) {
    .row.gap-40 {
      --bs-gutter-x: 40px;
      --bs-gutter-y: 40px;
    }
  }
  
 
  
  @media (min-width: 0) {  
	  .row.gap-70 {
		  --bs-gutter-x: 70px;
		  
		}
  .row.gap-25 {
      --bs-gutter-x: 25px;
      --bs-gutter-y: 25px;
    }
    .row.gap-50 {
      --bs-gutter-x: 50px;
      --bs-gutter-y: 50px;
    }
	.row.gap-100 {
      --bs-gutter-x: 100px;
      --bs-gutter-y: 100px;
    }
	
	.row.gap-15 {
      --bs-gutter-x: 15px;
      --bs-gutter-y: 15px;
    }
  }
  
  .card-wrapper {
  padding-left: 100px;
}

.card-container {
	width: 566px; 
	display: flex;
	flex-direction: column;
	gap: 35px;

}

.sticky-header{
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
padding: 15px 18px;
gap: 15px;
background: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: 5px 5px 22px rgba(0, 0, 0, 0.1);
border-radius: 10px;
}

#s-menu{
	gap:12px;
	display:flex;
}

.s-menu{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px;
width: 40px;
height: 40px;
background: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 20px;

}


.s-menu.active{
	color: #fff;
    background: linear-gradient(100.53deg, #EB4432 3.64%, #F3AF48 128.56%);

	}
.s-menu.active img{filter: brightness(0) invert(1);}
#s-menu .dropdown-menu {
    Position:absolute;    
    align-items: center;
	left:-200px;
    border-bottom: 1px solid #EAECF0;
    font-size: 14px;
    border-radius: 8px;
	padding:0px;
	z-index: 9999;
}

#s-menu  .dropdown-item {
    width: 256px;
    display: flex;
    align-items: center;
    height: 50px;
    border-bottom: 1px solid #EAECF0;
    font-size: 14px;
    border-radius: 8px;
}

.navbar, .space{
	padding-top:25px;
	padding-bottom:25px;
}

.pcount{
	 display: flex;
	flex-direction: row;
	 align-items: flex-start;      
	  gap: 5px;
	 width: 566px;
	 height: 66px;
	}
 .custom-card {
      height: 100%;
      flex: none;
      align-self: stretch;
      flex-grow: 0;
      width: calc((566px - 10px) / 3); /* subtracting 2 gaps of 5px, then divide */
    }

.hero-img {
    width:764px!important;
	height: 674px;
	top: 0px;
	right:80px;
    padding-left:0px!important  
}
.hbanner, .property-content{
	background-color:#F1FBFF;
	
}

.baner-cont{
	padding-left:100px;
}

.head{
	font-size:55px;
	font-weight:600;
	line-height:64px;
}

.head2{
	font-size:32px;
	font-weight:600;
	line-height:64px;
}


.hbanner .subtext{font-size:21px;}
.subtext2{color: rgba(30, 30, 30, 0.7);font-size:16px;line-height:28px;}
  
/**********************search section code********************************/



.search-container{
	box-sizing: border-box;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 20px;
	gap: 15px;
	left: calc(50% - 832px/2);
	position: absolute;
width: 832px;
	height: 89px;
	
	top: 624px;
	background: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 5px 5px 22px rgba(0, 0, 0, 0.1);
	border-radius: 20px;
}

.cwidth{width:576px;}


.search-section {
  margin-top: -40px;
}

.search-wrapper {
  max-width: 700px;
  margin: auto;
}

.search-container {
  position: relative;
  top:-2rem;
}

.search-input {
  width: 100%;
  
}


.search-icon {
  position: absolute;
  top: 50%;
  left: 14px;
  transform: translateY(-50%);
  color: #999;
  font-size: 1.2rem;
  pointer-events: none;
  z-index: 1;
}*/

::placeholder {
  color: #1E1E1E!important;
  opacity:30%!important;
  font-size:18px!important;
  font-weight:400;
}

::-ms-input-placeholder { /* Edge 12 -18 */
  color: red;
}

.search-btn {
	padding: 12px 25px;
    gap: 10px;
    width: 164px;
    height: 49px;
	color:#fff;
    background: linear-gradient(100.53deg, #EB4432 3.64%, #F3AF48 128.56%);
}

.search-btn:hover {
  background: linear-gradient(100.53deg, #D6372C 3.64%, #E5973D 128.56%);
}


/* Hide dropdown by default */

.search-dropdown {
display: none;
position: absolute;
top: calc(100% + 10px); /* show below input field */
left: 0;
width: 100%; /* same width as input field */
background: #FFFFFF;
border-radius: 20px;
box-shadow: 5px 6px 16px rgba(0, 0, 0, 0.09);
border: 1px solid rgba(0, 0, 0, 0.2);
padding: 12px 0;
z-index: 10;
gap: 15px;

/*height:300px;*/
}






/* Show dropdown when input is focused */
.search-container:focus-within .search-dropdown {
display: block;
}

.search-dropdown .dropdown-item {
border-radius: 10px;

}

.search-wrapper1 {
	/* Frame 22 */

box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: row;
align-items: center;
padding: 7px 7px 7px 17px;
gap: 15px;


  width: 100%;
  max-width: 612px;
  position: relative;
  background: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.2);
box-shadow: 5px 5px 22px rgba(0, 0, 0, 0.1);
border-radius: 10px;
}

.search-input1 {
  padding: 2px;
  border: none;
  border-radius: 12px;
  width: 100%;
  background: transparent;
}


.search-input1::placeholder {
  color: #1E1E1E!important;

  font-size:18px!important;
  font-weight:400;
}

.search-input1:focus {
  outline: none;
  box-shadow: none;
}

.search-icon1 {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #aaa;
  font-size: 16px;
}

.search-btn1 {
  color:#fff;

padding: 0px 12px;
gap: 10px;
width: 42px;
height: 40px;
background: linear-gradient(100.53deg, #EB4432 3.64%, #F3AF48 128.56%);
border-radius: 8px;

}


.city-list{padding:0px 20px;}

.city-list .dropdown-item{
padding: 12px 15px;
max-width: 792px;
height: 75px;
border-radius: 12px;
cursor: pointer;
}
.city-list .dropdown-item.active{
background: #FAFAFA;}
 
.dsubtext{font-size:16px;color:rgba(51, 51, 51, 1);padding-bottom:10px;}

.dsubtext2{font-size:18px;color:rgba(51, 51, 51, 1);}

.dsubtext3{font-size:16px;color:rgba(51, 51, 51, 0.6);}

.p-card{
box-sizing: border-box;
display: flex;
padding: 0px 0px 20px;
gap: 10px;

background: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.07);
border-radius: 27px;
}


.p-card .card-body{
display: flex;
flex-direction: column;
padding: 0px 20px;
gap: 12px;
}


/**************************************************************************
	propertysection code 
***********************************************************************/


.p-img {
  overflow: hidden;
  position: relative;  
  border-top-left-radius: 20px;  /* matches Bootstrap's .rounded-top-4 */
  border-top-right-radius: 20px;
}

.p-img img {
  transition: transform 0.4s ease;
  width: 100%;
}

.card:hover .p-img img {
  transform: scale(1.05);
}

/* Position the heart icon at top right */
.heart {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #fff; 
  /*background: red;*/
  border-radius: 50%;
  padding:5px 10px;
  z-index: 9;
  /*box-shadow: 0 2px 6px rgba(0,0,0,0.2);*/
}

.heart2 {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #dc3545; 
  background: white;
  border-radius: 50%;
  padding:5px 10px;
  z-index: 9;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

.heart2  img{top: -0.1rem;
position: relative;}

.bg-light3 {
    background: rgba(38, 101, 176, 0.1);
	color:#1F64B4;
	font-size:14px;
	font-weight:400;
}

.add p{font-size:14px;}
.price{color:rgba(30, 30, 30, 0.7);font-size:22px;}
.map-container{
padding-top:20px;}


.add2 p{font-size:12px;}

.p-card2 {
  display: flex;
  flex-direction: row;
  align-items: stretch; 
  padding: 20px;
  gap: 10px!important;
  height: 337px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.07);
  border-radius: 20px;
  overflow: hidden; 
}

.p-img2 {
  height: 100%;
  overflow: hidden;
  position: relative;
  border-radius: 20px;
}

.p-img2 img {
  height: 100%;
  width: 100%;
  max-width: 580px; 
  overflow: hidden;
  border-radius: 20px;
  position: relative;
  flex-shrink: 0;
   transition: transform 0.4s ease;
}

.card:hover .p-img2 img {
  transform: scale(1.05);
}


.p-body{
	display: flex;
	flex-direction: column;
	gap: 12px;
	justify-content: space-evenly;
	flex-grow: 1;
}

/*********************************************************************
button code 
/********************************************************************/
.explore-btn{
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.2);
  
}



/* Frame 2 */
.explore-btn1{

align-items: center;
padding: 15px 25px;
gap: 10px;

width: 188px!important;
height: 55px;

background: linear-gradient(100.53deg, #EB4432 3.64%, #F3AF48 128.56%);
border-radius: 12px;
;

}
.explore-btn1:hover, .explore-btn1{
  background: linear-gradient(100.53deg, #D6372C 3.64%, #E5973D 128.56%);
  color:#fff;
  border:none;
}

.explore-btn:hover {
  background: linear-gradient(100.53deg, #D6372C 3.64%, #E5973D 128.56%);
  color:#fff;
  border:none;
}


/* Frame 1753 */


.icon-bg {
  font-size: 180px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.btn-custom {
  background-color: white;
  color: #ff5722;
  border: none;
  font-weight: 500;
  cursor: pointer!important;
}

.btn-custom:hover {
  background-color: #f8f8f8!important;
    color: #ff5722!important;
}

.cust-height{
height:332px;}

.newsletter{
	background-color:#2C3A8B;
}

.subscribe-btn {
    background: linear-gradient(100.53deg, #F3AF48 3.64%, #EB4432 128.56%);
    color: white;
    cursor: pointer; 
font-size:20px;	
}
.slider-gap{
	
display: flex;
flex-direction: column;
gap: 20px;
}


/********************** banner code*************************/

.bg-home {
  background-color: #F9AB42;
}

.bg-rent {
  background-color: #F14436;
}

.gradient-text2 {
		font-weight: bold;
		text-align: center;
		background: linear-gradient(95.85deg, #EB4432 16.11%, #F3AF48 85.89%);
		background-size: 200% 100%;
		-webkit-background-clip: text; /* For webkit browsers */
		background-clip: text; /* Standard syntax for future compatibility */
		color: transparent;
		animation: flowEffect 30s linear infinite;
		margin-bottom: 50px;
		font-size:38px;
    }
    
    
    @keyframes flowEffect {
      0% {
        background-position: 200% 0%;
      }
      100% {
        background-position: -200% 0%;
      }
    }
    

/*************************Dutch Cities Code ****************************************/

a{text-decoration:none;}

.cities,.faq {
    background-color: #F1FBFF;
}
.section-title {
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 30px;
}


.bg-amsterdam {background-image: url('../images/new1.png'); }
.bg-denhaag { background-image: url('../images/new2.png'); }
.bg-maastricht{ background-image: url('../images/new3.jpg'); }
.bg-eindhoven{ background-image: url('../images/new4.jpg'); }
.bg-utrecht { background-image: url('../images/new5.jpg'); }
.bg-nijmegen { background-image: url('../images/new6.jpg'); }
.bg-rotterdam { background-image: url('../images/new7.jpg'); }

.city-card {
  position: relative;
  border-radius: 15px;
  overflow: hidden;
  height: 321px;
  background-size: cover;
  background-position: center;
  color: white;
  display: flex;
  align-items: flex-end;
  padding: 15px;

  transition: transform 0.4s ease;
}

/* Create a background layer that zooms */
.city-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: inherit;
  transform: scale(1);
  transition: transform 0.4s ease;
  z-index: 0;
}

/* Zoom the pseudo background on hover */
.city-card:hover::before {
  transform: scale(1.1);
}

/* Keep overlay and info above zoom layer */
.city-overlay {
  background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0));
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0; left: 0;
  z-index: 1;
}

.city-info {
  position: relative;
  z-index: 2;
}

.city-title {
    font-size: 26px;
    font-weight: 500;
    line-height: 28px;
}
.city-subtitle {
  font-size: 1rem;
}

.img-fit {
height: 200px;
border-radius: 20px;
width:100%;
object-fit:cover;
}



/*********************************Promise section****************************************/
.gradient-line {
    width: 40px;
    height: 3px;
    background: linear-gradient(91.8deg, #EB4432 1.59%, #F3AF48 100%);
    border-radius: 5px;
    margin-top: 4px;
}

.gradient-text {
    background: linear-gradient(91.8deg, #EB4432 1.59%, #F3AF48 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;

}

.gradient-icon {
    font-size: 1.4rem;
    margin-right: 6px;
    background: linear-gradient(91.8deg, #EB4432 1.59%, #F3AF48 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
}


.promise h2{line-height:50px;}

/*************************faq****************************************************/
.answer {
      padding: 12px 20px;
      max-width: 872px;
    }

    .accordion-item {
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 12px 20px;
      background: #FFFFFF;
      border: 1px solid rgba(0, 0, 0, 0.1) !important;
      border-radius: 15px !important;
    }

    .accordion-header {
      border-radius: 15px !important;
    }

    .accordion-button:focus {
      box-shadow: none !important;
    }

    

    .accordion-button {
      color: #1e1e1e !important;
      background-color: #FFF !important;
      font-size: 18px;
      box-shadow: none !important;
    }

    .accordion-button::after {
      display: none !important;
    }

    .accordion-button .icon i {
      transition: transform 0.3s ease;
    }

    .accordion-button:not(.collapsed) .icon i::before {
      content: "\f068"; /* minus */
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
    }

    .accordion-button.collapsed .icon i::before {
      content: "\f067"; /* plus */
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
    }
	
/********************************updates**************************/

.updates .card{border:rgba(0, 0, 0, 0.1);}


/**********************************************************
		proterty page code start here
*******************************************************************/

.nav-link {color:#1E1E1E;}


.text-orange{
  color: #F8923B;
}
.subtext3{font-size:18px;}


.property-content .price {
    color: #F8923B;
    font-size: 2rem;
    font-weight: 500;
}

.property-content .old-price {
    text-decoration: line-through;
    color: grey;
    font-size: 18px;
    margin-left: 10px;
}	

.red-link {
    color: #ff0000;
    text-decoration: underline;
}

.contact-btn {
    color: white;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 15px 12px;
gap: 10px;
width: 240.5px;
height: 50px;
background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%);
border-radius: 8px;


}

.subtext4{font-size:16px;}

.cust-btn2 {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 15px 3px;
  gap: 8px;
  width: 158px;
  height: 50px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  color: #1E1E1E;
}

.grad{
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 15px 3px;
  gap: 8px;
  width: 158px;
  height: 50px;
  background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%);
  color: #fff !important;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  
}

.prof-login{
padding: 10px 10px 15px;
background: #F6FCFF;
border-bottom: 1px solid #EAECF0;
flex: none;
order: 0;
align-self: stretch;
flex-grow: 0;
}

.prof-login .pic{
display: flex;
flex-direction: row;
align-items: center;
padding: 9px 10px;
gap: 12px;
border-radius: 6px;
flex: none;
order: 0;
align-self: stretch;
flex-grow: 0;
}

.cust-btn3 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 15px 12px;
  gap: 10px;
  width: 133px;
  height: 50px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 8px;
  color: #1E1E1E;
}

.cust-btn2 img, .cust-btn3 img {
  width: 14px !important;
}

/* Remove img:hover */
.cust-btn2:hover img, .cust-btn3:hover img {
filter: brightness(0) invert(1);
}

.cust-btn2:hover,
.cust-btn3:hover {
  background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%);
  color: #fff !important;
}

.social-property{font-size:38px; height:48px;}

.custom-modal {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px;
  gap: 10px;
  width: 100%;
  max-width: 582px;
  height: auto;
 border:0px solid #fff!important;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 4px 9px 13px rgba(0, 0, 0, 0.05);
  border-radius: 30px;
}

.custom-modal2 {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px;
  gap: 10px;
  width: 100%;
  max-width: 882px;
  
 border:0px solid #fff!important;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 4px 9px 13px rgba(0, 0, 0, 0.05);
  border-radius: 30px;
}

.modal-header {
	Position:absolute;
	right:0;
	z-index:1;
}

.update{
display: flex;
align-items: flex-start;
padding: 0px 0px 20px;
gap: 10px;
background: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.1);
box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.07);
border-radius: 20px;
}

.update .btn-custom1{

	width: 113px !important;
    height: 39px;
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 5px;

}

.btn-custom1:hover{
  background: linear-gradient(100.53deg, #D6372C 3.64%, #E5973D 128.56%);
  color:#fff;
  border:none;
}


.update .card-body{
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 0px 20px;
gap: 12px;
width: 386.67px;
}	


/*********************************************************************************
property page 3 code 

***********************************************************************************/
 .like-icon {
		  position: absolute;
		  top: 15px;
		  left: 15px;
		  background-color: white;
		  border-radius: 50%;
		  width: 48px;
		  height: 48px;
		  display: flex;
		  align-items: center;
		  justify-content: center;
		  font-size: 24px;
		  color: red;
		  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
		  cursor: pointer;
    }
    .thumbnail-row {
      display: flex;
      gap: 18px;
      justify-content: space-between;
      margin-top: 10px;
    }
    .thumb {
      width: 233.6px;
      height: 171px;
      cursor: pointer;
      overflow: hidden;
      border-radius: 15px;
      border: 1px solid rgba(0, 0, 0, 0.3);
      transition: border 0.3s ease;	  
    }
	
    .thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 10px;
	  
   }
    .thumb:hover {
      border-color: #007bff;
    }
	
	.carousel-item img {
	  width: 100%;
	  height: 534px; 
	  object-fit: cover; 
	  box-sizing: border-box;
		height: 534px;
		border: 1px solid rgba(0, 0, 0, 0.3);
			border-radius: 20px;

	}
	
	.thumb5 {
      position: relative;
    }

    .thumb5 .overlay {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      border-radius: 10px;
      color: white;
      padding: 10px;
      font-size: 40px;
      position:absolute; 
	  background:rgba(0,0,0,0.5); 
	  color:white; width:100%; 
		height:100%; display:flex; align-items:center; justify-content:center; font-weight:bold; font-size:20px;
    }
	
	.mapping{display:flex;gap:50px;}
	.map-image{
		width: 501px !important;
		max-width: 100%;
		height: 280px;
	}
	 .map-image .map2{
		width: 501px !important;
		
	}
	.map-bnt{display:flex;gap:20px;}
	
	
	#s-popup .gap-40 {
		  display: flex;
		  flex-direction: column;
		  gap: 40px;
		}
	  #s-popup .gap-15 {
		  display: flex;
		  flex-direction: column;
		  gap: 15px;
		}
		#s-popup .gap-30 {
		  gap: 30px;
		}
		
		#s-popup .gap-20 {
		  display: flex;
		  flex-direction: column;
		  gap: 20px;
		}
		.pgap-20 {
		  gap: 20px;
		}
	
.request-address{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 10px 12px;
	gap: 10px;
	background: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
}

.request-address:hover img{
filter: brightness(0) invert(1);
}

.request-address:hover {
  background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%);
  color: #fff !important;
}



.plan{
	font-size: 10px;
    border-radius: 15px;
    height: 400px;
	}
.price-plan{font-size:22px;}

.plan ul{
	 list-style-type:none;
	 line-height:1.5rem;
	 padding-left: 0rem;
	 
}
.plan-info{
	padding: 8px 12px 18px;
}
.grey {background: rgba(0, 0, 0, 0.2);}

.grandient{background:rgba(248, 146, 59, 1)}

.black{
	background:rgba(51, 51, 51, 1)
	
	
}
.grey .plan-title{ background: #c5c3c3;border-radius: 15px;}
.black .plan-title {background:rgba(0, 0, 0, 0.2);border-radius: 15px;}
.grandient .plan-title{
	
background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%);
border: 1px solid rgba(0, 0, 0, 0.05);
border-radius: 10px;
}
/***************************************************************************************
  message chat box
****************************************************************************************/

#message-box{margin-top:7rem;}


#sidebar{
box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 0px;
width: 360px;
height: 1147px;
background: #FFFFFF;
border-right: 1px solid #EAECF0;
}

.profile{
display: flex;
flex-direction: row;
align-items: center;
padding: 0px;
gap: 12px;
font-size:12px;
color:rgba(0, 0, 0, 0.75)
}

#message-box .p-name{font-size:14px;color:#000;font-weight:500;}
 #sidebar .space{padding:0px 25px;}
	#message-box .list-group-item{ padding:14px 25px;}
.prof{
width: 40px;
height: 40px;
background: #F2F4F7;
border-radius: 200px;
flex: none;
order: 0;
flex-grow:1;
font-size:16px!important;
text-align:center;
padding:8px;

}
.list-group-item.active {
    z-index: 2;
    color:rgba(0, 0, 0, 1);
    background-color: rgba(47, 57, 211, 0.1)
    
}

.view-property{	
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 10px 16px;
gap: 8px;
font-size:14px!important;
height: 40px;
background: #FFFFFF;
border: 1px solid rgba(30, 30, 30, 0.3);
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
border-radius: 8px;
flex: none;
order: 1;
flex-grow: 0;
font-weight:500;
}


.chat-messages{
font-size:12px;
padding: 20px 25px 24px;
gap: 24px;

}

.chat-body{
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 0px;
gap: 16px;
flex: none;
order: 0;
align-self: stretch;
flex-grow: 0;
}


.divider2 {
	width:100%;
    display: flex;
    align-items: center;
    text-align: center;
    color: #888;
    margin: 10px 0;
}
.divider2::before, .divider2::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #ccc;
}

.divider2:not(:empty)::after{
    margin-left: .75em;
}
.divider2:not(:empty)::before{
    margin-right: .75em;
}

#chatWindow .dropdown-item{
    width: 256px;
    display: flex;
    align-items: center;
    height: 50px;
    border-bottom: 1px solid #EAECF0;
	font-size:14px;
	border-radius: 8px;
}


#chatWindow .dropdown-menu{
padding:0px;
background: #FFFFFF;
border: 1px solid #EAECF0;
box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);
border-radius: 8px;
}

.chatWindow .dropdown-item.active,
.chatWindow .dropdown-item:active {
    color: var(--bs-dropdown-link-active-color);
    text-decoration: none;
    background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%) !important;
}

.rpInput{
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
padding: 12px 15px;
gap: 10px;
height: 54px;
background: #FFFFFF;
border: 1px solid rgba(0, 0, 0, 0.2);
border-radius: 10px;
flex: none;
order: 1;
align-self: stretch;
flex-grow: 0;
}


.rpInput::placeholder {
  color: #bbbaba!important;
  font-size:16px!important;
  font-weight:400;
}

.msend, .msend:active{	
padding: 8px;
width: 36px;
height: 36px;
color:#fff!important;
background: linear-gradient(95.75deg, #EB4432 2.59%, #F3AF48 114.96%);
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
border-radius: 8px;
}


/****************************************************************************************
	footer pages
*******************************************************************************************/
	.social-icon {
		width: 32px;
		margin-right: 10px;
	}
	.footer {
		background-color: #F6FCFF;
	}
	
	.footer-bottom {
		background-color: #1F64B4;
	}
	

/*************************************************************************************
all media query
*************************************************************************/

@media (max-width: 768px) {
  .search-container {
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
  }

  .search-input {
    padding: 16px 16px 16px 40px;
  }

  .search-icon {
    top: 12px;
    transform: none;
  }

  .search-btn {
    position: static;
    transform: none;
    width: 100%;
  }

}

@media(max-width:1164px){
	.mapping {
    display: flex;
	flex-direction:column;
    gap: 50px;
}
}

/* meadia query of property 3*/
@media(min-width: 1459px) {
	  .p-img2 img {
		height: 100%;
		width: 100%;
		max-width: 100% !important; 
		object-fit: cover;
		border-radius: 20px;
		display: block;
	  }
	  .p-card2 {
		height: 350px;
	}
	.thumb {
      width:100%!important;
}
}