@tailwind base; @tailwind components; @tailwind utilities; @layer base { @font-face { font-family: Futura Light; src: url(/assets/fonts/Futura/FuturaStdLight.woff) format("woff"); } @font-face { font-family: Futura Heavy; src: url(/assets/fonts/Futura/FuturaStdHeavy.woff) format("woff"); } @font-face { font-family: FuturaBook; src: url(/assets/fonts/Futura/FuturaStdBook.woff) format("woff"); } @font-face { font-family: Futura Medium; src: url(/assets/fonts/Futura/FuturaStdMedium.woff) format("woff"); } } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } #planning { zoom: 80%; } #Layout { zoom: 80%; } /* Firefox */ input[type="number"] { -moz-appearance: textfield; } .changeBox { overflow: hidden; position: relative; } .changeBox div { margin: 0; margin-bottom: 1em; /* Adjust this value for the desired space between paragraphs */ line-height: 1.4; } .changeBoxproName { overflow: hidden; position: relative; } .changeBoxproName div { margin: 0; /* Adjust this value for the desired space between paragraphs */ /* line-height:2.5; */ } .changeBoxproNameMobile { overflow: hidden; position: relative; } .changeBoxproNameMobile div { margin-top: 0; /* Adjust this value for the desired space between paragraphs */ /* line-height: 1.4; */ } * { font-family: "Futura Light"; } .lakeShoreVideoSlides::-webkit-scrollbar { display: none; } .lakeslides { display: none; } .lakeslides1 { display: none; } .font-FuturaHeavy { font-family: "Futura Heavy"; } .stickyPro { position: fixed; top: 0; width: 100%; } body { /* zoom: 95%; */ } .body a { cursor: pointer; } .w3-animate-bottom { position: relative; animation: animatebottom 0.9s; } @keyframes animatebottom { from { bottom: -300px; opacity: 0; } to { bottom: 0; opacity: 1; } } .w3-animate-left { position: relative; animation: animateleft 0.9s; } @keyframes animateleft { from { left: -300px; opacity: 0; } to { left: 0; opacity: 1; } } .w3-animate-top { position: relative; animation: animatetop 0.9s; } @keyframes animatetop { from { top: -300px; opacity: 0; } to { top: 0; opacity: 1; } } .w3-animate-opacity { animation: opac 0.8s; } @keyframes opac { from { opacity: 0; } to { opacity: 1; } } #myDiv { animation: slide-in-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; } #myDiv1 { /* animation: slide-in-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; */ } #NewDiv { /* animation: slide-in-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; */ } @keyframes slide-in-right { 0% { transform: translateX(100%); } 100% { transform: translateX(0); } } @import url("https://fonts.googleapis.com/css2?family=Arapey&family=Inter&display=swap"); .bgblue80 { background: rgba(25, 46, 70, 0.7); } /* viedo */ .video-container { z-index: -100; width: 100%; height: 90vh; /* overflow: hidden; */ /* margin-bottom: 0%; */ top: -10px; left: 0; display: flex; justify-content: center; } #video-bg { width: 100%; /* height: auto; */ object-fit: cover; display: flex; justify-content: center; /* z-index: -100; */ /* margin-bottom: 0%; */ /* margin-top: auto; */ } .video-Mobile-container { z-index: -100; width: 100%; height: 100%; overflow: hidden; position: relative; /* bottom: 0; */ left: 0; } #video-Mobile-bg { /* height: 90%; */ height: 100%; width: 100%; object-fit: cover; object-position: bottom; } /* NAV BAR */ .contentVideo { position: fixed; /* bottom: 0; */ height: 100%; color: #f1f1f1; width: 100%; padding: 20px; } .animate-slide-in-right { animation-duration: 0.5s; animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .slider-container { width: 100%; height: auto; display: flex; /* overflow: scroll; */ object-fit: cover; /* margn: 20px; */ min-height: 50vh; max-height: 90vh; /* aspect-ratio: video; */ position: relative; } .slide { position: absolute; margin: 40px; top: 0; left: 0; /* height: 100%; */ width: 100%; object-fit: cover; opacity: 0; width: 100%; animation-duration: 1s; animation-fill-mode: both; animation-timing-function: ease-out; animation-delay: 0s; animation-play-state: paused; /* Add the animate__slower class */ animation-duration: 2s; animation-delay: 0.5s; animation-fill-mode: backwards; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); } .slide.active { opacity: 1; animation-duration: 0.5s; animation-fill-mode: both; animation-timing-function: ease-out; animation-delay: 0s; animation-play-state: running; /* Add the animate__slower class */ animation-duration: 0.5s; animation-delay: 0.5s; animation-fill-mode: forwards; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); } /* asyugdihijasfdtgyuhijskamljsdhgh */ .max-h-0 { max-height: 0; } #myVideo { /* position: ; */ right: 0; bottom: 0; z-index: 0; min-width: 100%; /* min-height: 100%; */ /* object-fit: cover; */ } /* ..................................accodian STart ............................................... */ /* .containerwidth { width: 100%; } */ .wrapper { background-color: #ffffff; padding: 10px 20px; margin-bottom: 20px; border-radius: 100%; -webkit-box-shadow: 0 15px 25px rgba(0, 0, 50, 0.2); box-shadow: 0 15px 25px rgba(0, 0, 50, 0.2); } .toggle { /* width: 100%; */ background-color: transparent; /* display: -webkit-box; */ /* display: -ms-flexbox; */ /* display: flex; */ /* -webkit-box-align: center; */ /* -ms-flex-align: center; */ /* align-items: center; */ /* -webkit-box-pack: justify; */ /* -ms-flex-pack: justify; */ /* justify-content: space-between; */ font-size: 16px; color: #111130; font-weight: 600; /* border-radius: 60px; */ /* outline: none; */ cursor: pointer; /* padding: 10px 0; */ } .content { /* position: relative; */ /* font-size: 14px; */ /* text-align: justify; */ /* line-height: 30px; */ height: 0; overflow: hidden; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; } .w3r-dot { /* width: 120px; */ /* height: 120px; */ padding: 10px; margin: 10px; background-image: radial-gradient(#ffffff 2px, transparent 11%); /* radial-gradient(#e53935 10%, transparent 11%); */ background-size: 15px 15px; /* background-position: 0 0, 30px 30px; */ background-repeat: repeat; } /* ..................................accodian end ............................................... */ /* ...............................................TESTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTTt start ...........................................*/ .slider-wrap { position: relative; top: 10%; /* left: 5%; */ /* width: 100%; */ /* height: 700px; */ /* border: 1px solid rgb(0, 0, 0); */ cursor: grab; } .slider { position: relative; top: 0; left: 0; height: 100%; width: screen; overflow: hidden; } .slider-inner { /* overflow:scroll; */ overflow-x: scroll; scroll-snap-align: x; scroll-snap-type: mandatory; position: relative; display: flex; gap: 12px; /* justify-content: space-between; */ width: 100%; height: 100%; /* display: flex; */ } .item { position: relative; /* padding: 6px; */ /* display: flex; */ align-items: center; justify-content: center; /* width: 500px; */ /* top: 1%; */ background-color: rgb(255, 255, 255); /* border: 1px solid rgb(0, 0, 0); */ } .progress-bar { position: relative; top: -50px; /* right: 0; */ margin: 10px; height: 20px; width: 100%; /* border: 2px solid rgb(88, 86, 86); */ /* border-radius: 10px; */ background-color: #ada8a8; } .progress-timeline { position: relative; top: 0; left: 0; /* left:auto ; */ width: 10%; height: 20px; background-color: rgb(41, 32, 107); } /* Hide scrollbar for Chrome, Safari and Opera */ .slider-inner :-webkit-scrollbar { display: none; } Hide scrollbar for IE, Edge and Firefox */ .slider-inner { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ } /* ....................................TESTTTTTTTTTTT END ......................................*/ /* .................................... villas prototypes ....................................... */ .slideshow-container1 { position: relative; } .slideshow-container2 { position: relative; } .mySlides { display: none; } img { vertical-align: middle; } .mySlidesW1 { display: none; } img { vertical-align: middle; } .dotE2:hover, .dotE3:hover { font-weight: bold; } .active, .dotE2:hover { font-family: "Futura Heavy"; /* font-weight:bold; */ } .active, .dotE1:hover { font-weight: bold; } .active, .dotE3:hover { font-weight: bold; } .dot2W:hover { font-weight: bold; } .dot2:hover { font-weight: bold; } /* Fading animation */ .fade { animation-name: fade; animation-duration: 1.5s; } @keyframes fade { from { opacity: 0.6; } to { opacity: 1; } } /* FOOTER GALLERY start */ #myImg { border-radius: 5px; cursor: pointer; transition: 0.3s; } #myImg:hover { opacity: 0.7; } /* The Modal (background) */ .modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 1; /* Sit on top */ padding-top: 100px; /* Location of the box */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0, 0, 0); /* Fallback color */ background-color: rgba(0, 0, 0, 0.9); /* Black w/ opacity */ } /* Modal Content (image) */ .modal-content { margin: auto; display: block; width: 80%; max-width: 700px; } /* Add Animation */ .modal-content { -webkit-animation-name: zoom; -webkit-animation-duration: 0.5s; animation-name: zoom; animation-duration: 0.6s; } @-webkit-keyframes zoom { from { -webkit-transform: scale(0); } to { -webkit-transform: scale(1); } } @keyframes zoom { from { transform: scale(0); } to { transform: scale(1); } } /* The Close Button */ .close { position: absolute; top: 15px; right: 35px; color: #f1f1f1; font-size: 40px; font-weight: bold; transition: 0.3s; } .close:hover, .close:focus { color: #bbb; text-decoration: none; cursor: pointer; } /* 100% Image Width on Smaller Screens */ @media only screen and (max-width: 700px) { .modal-content { width: 100%; } } /* FOOTER GALLERY END */ /* /////////////////////////////////////////////// */ .scroller { height: 400px; overflow-y: scroll; scroll-snap-type: y mandatory; } .scroller section { scroll-snap-align: start; } .video { /* background-image: url('https://img.youtube.com/vi/nZcejtAwxz4/maxresdefault.jpg'); */ /* width:700px; */ /* height:700px; */ /* object-fit: cover; */ } #videosList { width: 100%; overflow: hidden; overflow-x: scroll; display: flex; position: relative; scroll-behavior: smooth; } .next-video { /* position: absolute ; */ /* top: 50%; */ /* right: 0 ; */ scroll-snap-type: y mandatory; transform: translateY(-50%); } /* Hide Play button + controls on iOS */ /* video::-webkit-media-controls { display:none !important; } */ /* ////////////////////////////////////////////////////// */ #owl-demo, #owl-demo-1 { background: #3fbf79; padding: 30px 0px; margin: 10px; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; text-align: center; width: 900px; height: 900px; } .customNavigation { text-align: center; padding: 20px; } .customNavigation a { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* .myInfo { display: block; } */ .activated { /* scale: 220; */ transform: scale(1.5); color: #1e2d44; } /* /////////////////////////////.................................////////////////////////////////////// */ .carousel { position: relative; animation: scroll linear infinite; } .slides { display: flex; overflow-x: scroll; scroll-behavior: smooth; } .slidem { flex: 0 0 100%; width: 50%; padding: 20px; box-sizing: border-box; background-color: #f2f2f2; border: 1px solid #ccc; } .next-button { position: absolute; top: 50%; right: 10px; transform: translateY(-50%); scroll-snap-type: y mandatory; /* transform: translateX(-100%); */ } .prev-button { position: absolute; top: 10%; left: 0; transform: translateY(50%); scroll-snap-type: y mandatory; /* transform: translateX(-100%); */ } .eastvilla { display: none; } .westvilla { display: none; } /* // Progress Bar */ .progress { position: fixed; top: 0; left: 0; height: 10px; background-color: purple; transition: all linear 0.1s; min-width: 1%; } .dot { height: 10px; width: 10px; background-color: #ffffff; border-radius: 50%; display: inline-block; } .demo { } /* .............................................` */ #contactForm { display: none; z-index: 9999; /* border: 6px solid salmon; */ /* padding: 2em; */ /* width: 400px; */ text-align: center; /* background: #fff; */ position: fixed; top: 40%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); } #myModal form input, #popup-form form input, textarea { width: 60%; padding: 10px; border-radius: 4px; font-size: 14px; background: none; outline: none; border: 1px solid #333; } #myModal, #Googlemeet, #popup-form { z-index: 9999; position: fixed; top: 40%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }