:root {
--Ratio: 0.6 ;
--CardW: 25rem ;
--CardWMedium: ( var(--CardW) + (var(--CardW) * 0.5 ) ) ;
--CardWSmall: ( var(--CardW) - (var(--CardW) * 0.05 ) ) ;
--PhotoMargin: 0.007 ;
}






.cssCard1Box { float: left; position: relative; margin: 0 0.5rem 4rem ; width: 25rem ; height: fit-content; transition-duration: 0.3s; display: flex; flex-direction: column; align-items: center; cursor: default; border-radius: 5px ; box-shadow: 0 0px 7px rgba(0, 0, 0, 0); }


.cssCard1ImageBox{ position: relative; width: 25rem ; height: 15rem ; overflow: hidden;  display: flex; justify-content: center; align-items: center; flex-direction: column; background-color: rgba(0, 0, 0, 0 ); border-radius: 0 ; transition-duration: 0.3s; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5 );  }
/* .cssCard1ImageBox{ position: relative; width: var(--CardW) ; height: calc( var(--CardW) * var( --Ratio ) ); overflow: hidden;  display: flex; justify-content: center; align-items: center; flex-direction: column; background-color: rgba(0, 0, 0, 0); border-radius: 0 ; margin: 1.5rem 0 0 ; transition-duration: 0.3s;  } */
.cssCard1Image{ position: absolute; width: 100%; }
.cssCard1ImageBox:hover { box-shadow: 0 25px 35px rgba(0, 0, 0, 0.5 ); transition-duration: 0.3s;  }

.card1ProfilePicBox { width: 60px; height: 60px; border-radius: 100px; display: flex; justify-content: center; align-items: center; overflow-y: hidden; overflow-x: hidden; margin: 15px 0 0 0; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);  }
.card1ProfilePic { height: 100%; }


.AboutOwnerPhotoAndName {  width: 100%; display: flex; align-items: top; justify-content: right; margin: 1rem 0 1rem ; flex-direction: row; }
.AboutPhotoBox0 { height: 3rem; width: 3rem; border-radius: 50% ; display: flex; justify-content: center; align-items: center; overflow: hidden;  }



.TextBox { width: 80% ; }
.ProPic { position: absolute; top: 0; right: 0 ;  }



.cssCard1TextTitle { float: left; font-size: 1.4rem; width: 80%; margin: 0.7rem 0 0 ; text-align: left;  z-index: 1; font-weight: 600; text-transform: capitalize; }
.card1Country { width: 80%; margin: 0.3rem 0 0.1rem ; }
.card1Slogan { position: absolute; bottom: 20px ; height: 3rem ; width: 80%; text-align: center; font-size: 1rem ; z-index: 1 ; line-height: 1.2rem; }

.card1About { height: 3.5rem ; overflow-y: hidden; line-height: 1rem ; background-color: rgba(0, 0, 255, 0); }

.PublicCardProPic { width: 100% ; display: flex ; justify-content: right ; padding: 0 0 1rem ;  }
.card1Logo2Box { position: absolute; top: -6px; right: 20px; width: 60px; height: 60px; overflow: hidden ;  border-radius: 100px; display: flex; justify-content: center; align-items: center; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5); z-index: 1; }
.card1ProPic { height: 100%; }




.Card1PhotoAndNameBox { position: absolute; top: 0.5rem ; right: 0.5rem ; }




.cssCard1TextBox2 { display: flex ; justify-content: right; align-items: center; width: 100%; }


.card1LogoBox { position: absolute; top: 1.2rem; left: 0.5rem; width: 3rem ; height: auto ; overflow: hidden ; border-radius: 0px; display: flex; justify-content: center; align-items: center;  z-index: 1 ; box-shadow: 0 0 10px rgba(0, 0, 0, 0) ; }
.card1Logo { width: 75%; }
.card1LogoSmall { height: 15px; margin: 0 0.5rem 0 ;  }

.card1Count { font-weight: 600; font-size: 1.2rem; }

.card1BtnBox { padding: 0px 0 0 ; width: 100%; display: flex; justify-content: right; }

.card1DetailsAbout { height: 42px ; width: 100%;  margin-bottom: 7px ; overflow-y: hidden;  }







.PublicSearchBox { width: 100% ; display: flex; flex-direction: row; justify-content: center; padding: 0 20% 0;  }




.PublicFilterContentStyle { position: relative; float: right; width: fit-content ; height: 30px; margin-top: 5px ;  display: flex; align-items: center; justify-content: center;  z-index: 2 ; border-radius: 50rem ;  }

.PublicFilterLocationDisplay { float: right; width: fit-content ; height: 100%; display: flex; align-items: center; justify-content: right ; font-size: 0.9rem ; text-align: left ; padding: 0 1rem 0 ; border-radius: 5rem ; }

.PublicFilterInput { position: absolute; top: 0; right: 0; width: 100%; height: 100%; text-align: center; background-color: rgba(255, 255, 255, 0.653) ; z-index: 1 ; opacity: 0 ; }






.SearchBox00 { position: absolute ; top: 0 ; left: 0 ; width: 100% ; height: 100% ; }
.SearchBox0 { height: 6rem ; }

.SearchButtonBox { width: 50% ; height: 4rem ; display: flex ; align-items: center ; flex-direction: row; margin: 10px 25% 7px ; border-radius: 500px ;  }
.SearchButtonInput { width: 100% ; background-color: rgba(137, 43, 226, 0); height: 100%; padding-left: 1rem ; border-radius: 500px ; font-size: 1.1rem ; font-weight: 400 ; }
.SearchButtonSubmit { background-color: rgba(205, 222, 222, 0); border-radius: 500px ; height: 100%; width: fit-content ;  align-items: center; padding: 0 1.3rem 0 ; }

.SearchButtonSubmitIcon { height: 27% ; }
.SearchButtonSubmitIcon2 { height: 35% ; }






/* 
.PublicSearchInput {  width: 100%;  font-weight: 600; background-color: rgba(30, 110, 180, 0);  }
.PublicSearchButton { padding: 0rem;  }
.PublicSearchButtonIcon { height: 1.5rem ; }
.LoadMoreButton {  font-weight: 600; font-size: 1.2rem; border-top: solid 1px rgba(0, 0, 0, 0.2 ) ; width: 200px; text-align: center; } */




.PublicFilterButton { position: fixed; top: 20px; left: 15px ; height: 45px; width: 45px; display: flex; justify-content: center; align-items: center;  margin-right: 1rem ; z-index: 1 ; background-color: rgba(0, 0, 0, 0.1); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5 ); }



.PaginationButtons { float: left; width: 4rem; height: 30px; margin: 1rem ; border: solid 0px rgba(0, 0, 0, 0.279); display: flex; align-items: center; justify-content: center; border-radius: 5px ; }





.MapPlaces { position: relative; width: 33.33% ; height: fit-content ; padding: 7%; }
.MapPlacesTextBox { position: absolute; bottom: 10%; left: 0%; width: 100%; display: flex ; justify-content: center; align-items: center; }
.MapPlacesText { width: fit-content; padding: 0.5rem 1.5rem 0.5rem ; font-weight: 600; color: black; font-size: 1rem ; text-align: center ; background-color: rgba(213, 200, 156, 0.903) ; border-radius: 100rem; box-shadow: 0 0.3rem 0.7rem rgba(0, 0, 0, 0.3) ; }

.EdenCardsBox { position: fixed ; top: 0 ; right: 0 ; overflow: hidden; width: 100% ; height: 5rem ; display: flex ; z-index: 10 ; padding-top: 1rem ; padding-bottom: 1rem; padding-left: 5%; padding-right: 7rem; overflow-x: scroll ; }

.CardButtons { float: left; height: 3rem ; width: fit-content ; display: flex ; align-items: center; justify-content: center ; margin: 0 0.3rem 1rem ; padding: 1rem 2rem 1rem ; font-size: 1rem ; text-align: center; border-radius: 0.2rem ; }

.DomainExpressBtnsBox { height: 2.1rem ; padding-left: 4.5%; padding-right: 2%; margin-bottom: 2rem ; overflow: hidden ; }
.DomainExpressBtns { float: left; width: fit-content ; margin: 0 0.15rem 1rem ; padding: 0.5rem 2rem 0.5rem ; border-radius: 0.2rem ; text-align: center; }

.CardsMore { position: fixed; top: 0; right: 0; width: fit-content ; padding: 0 5% 0 ; height: 5rem ; cursor: pointer; z-index: 1 ; display: flex; justify-content: center ; align-items: center; }

.DomainText { position: absolute ; bottom: 0; right: 0; width: fit-content ; }











@media screen and ( max-width: 1700px ) {
}

@media screen and ( max-width: 1200px ) {
}

@media screen and ( max-width: 800px ) {
    .SearchButtonBox { width: 90% ; margin-left: 5% ; margin-right: 5% ; }
    .MapPlaces { width: 50% ;  }
    .DomainExpressBtnsBox { display: none; }
}

@media screen and ( max-width: 500px ) {
}