@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css");
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('fonts.css');

	html, body {
		height: 100%;
		margin: 0;
		padding: 0;
	}
	body {
		justify-content: center;
		align-items: center;
		background:#fff;
	}
	body {
		font-family: 'GlacialIndifference', 'Roboto' !important;
		color: #000000;
		font-size: 20px;
	}
	h1, h2, h3, h4, h5, h6 {
		font-family: 'aBlackLives';
	}
	p, span, div {
		font-family: 'GlacialIndifference', 'Roboto' !important;
	}
	.h-70 {
	    height: 70% !important;
	}
	.h-75 {
	    height: 75% !important;
	}
	.h-80 {
	    height: 80% !important;
	}
	.h-85 {
	    height: 85% !important;
	}
	.h-90 {
	    height: 90% !important;
	}
	.h-120 {
	    height: 120% !important;
	}
	.aBlackLives {
		font-family: 'aBlackLives', 'Roboto' !important;
	}
	.GlacialIndifference {
		font-family: 'GlacialIndifference', 'Roboto' !important;
	}
	.GlacialIndifferenceBold {
		font-family: 'GlacialIndifferenceBold', 'Roboto' !important;
	}
	.DMSansBlack {
		font-family: 'DMSansBlack', 'Roboto' !important;
	}
	#home {
		/* Specify the desired dimensions for the section */
		height: 768px !important;
		width: 1024px !important;
		min-height: 768px !important;
		min-width: 1024px !important;
		max-height: 768px !important;
		max-width: 1024px !important;
		/* Center the section horizontally */
		margin: 0 auto;
	}
	#home{
		.left-body {
			width:624px;
		}
		.bg-sidebar {
			width:400px;
		}
		.appbox {
			height: 720px !important;
			width: 1024px !important;
			min-height: 720px !important;
			min-width: 1024px !important;
			max-height: 720px !important;
			max-width: 1024px !important;
		}
	}
	.left-body {
		border-left: 10px solid #1c6da5;
		height: 768px !important;
		min-height: 768px !important;
		max-height: 768px !important;
	}
	.left-body h4{
		font-size: 30px !important;
	}
	.left-body h5{
		font-size: 24px !important;
	}
	.ultra-water-bg {
	  background-image: url('../images/ultra-water-bg.jpg');
	  /* Set the size of the container */
	  height: 768px; /* Set the height as needed */
	  /* Position and size the background image */
	  background-size: cover; /* Adjust as needed */
	  background-position: center top; /* Adjust as needed */
	}
	.logo {
		max-width:350px;
	}
	.small-logo {
		max-width:175px;
	}
	.home-logo {
		max-width:343px;
	}

	.bg-full {
	  /* Set the size of the container */
	  height: 767px; /* Set the height as needed */
	  /* Position and size the background image */
	  background-size: cover; /* Adjust as needed */
	  background-position: center top; /* Adjust as needed */
	}
	.bg-sidebar {
	  /* Set the size of the container */
	  height: 768px; /* Set the height as needed */
	  /* Position and size the background image */
	  background-size: cover; /* Adjust as needed */
	  background-position: center top; /* Adjust as needed */
	}
	.bg-home {
	  background-size: contain; /* Adjust as needed */
	  background-image: url('../images/bg-home.jpg');
	  background-position: center center; /* Adjust as needed */
	}
	.bg-home2 {
	  background-size: contain; /* Adjust as needed */
	  background-image: url('../images/bg-home2.jpg');
	  background-position: center center; /* Adjust as needed */
	}
	.bg-about {
	  background-image: url('../images/bg-about.jpg');
	}
	.bg-hire {
	  background-image: url('../images/bg-hire.jpg');
	}
	.bg-gb {
	  background-image: url('../images/bg-gb.jpg');
	}
	.bg-know {
	  background-image: url('../images/bg-know.jpg');
	}
	.bg-score {
	  background-image: url('../images/bg-score.jpg');
	}
	.bg-watertest {
	  background-image: url('../images/bg-watertest.jpg');
	}
	.bg-chlorinetest {
	  background-image: url('../images/bg-chlorinetest.jpg');
	}
	.bg-tdstest {
	  background-image: url('../images/bg-tdstest.jpg');
	}
	.bg-report {
	  background-image: url('../images/bg-report.jpg');
	}
	.bg-wholehome {
	  background-image: url('../images/bg-wholehome.png');
	}
	.bg-ultrahomecombo {
	  background-image: url('../images/bg-ultrahomecombo.jpg');
	}
	.bg-filtration {
	  background-image: url('../images/bg-filtration.jpg');
	}
	.bg-bottled {
	  background-image: url('../images/bg-bottled.jpg');
	}
	.bg-acidity {
	  background-image: url('../images/bg-acidity.jpg');
	}
	.bg-h2series {
	  background-image: url('../images/bg-h2series.jpg');
	}
	.bg-summary {
	  background-image: url('../images/bg-summary.jpg');
	}
	.bg-package {
	  background-image: url('../images/bg-package.jpg');
	  height:535px;
	  min-height:535px;
	}

    @keyframes loopVideo {
        0% {
            transform: scale(1.1);
        }
        100% {
            transform: scale(1.1);
        }
    }

    .background-video {
        position: relative;
        top: 0;
        left: 0;
        width: 400px;
        height: 768px;
        overflow: hidden;
        z-index: -1;
    }
    .background-video video {
        animation: loopVideo 5s linear infinite;
    }
	.page-title {
		font-family: 'aBlackLives' !important;
		color: #ffffff;
		font-size: 25px;
	}

	.bullet-box .bi {
		font-size:45px;
		line-height: 18px !important;
		position: relative;
		top:10px;
	}
	.custom-list {
	  list-style-type: none; /* Remove default list styles */
	  padding-left:10px;
	  font-size:18px;
	}

	.custom-list li::before {
	  content: ""; /* Add an empty content */
	  display: inline-block; /* Make the content inline */
	  width: 10px; /* Set the width of the bullet */
	  height: 10px; /* Set the height of the bullet */
	  background-color: #3fbaeb; /* Set the color of the bullet */
	  border-radius: 50%; /* Make the bullet round */
	  margin-right: 15px; /* Adjust spacing between bullet and text */
	}
	.custom-list li span {
		font-family: 'GlacialIndifferenceBold', 'Roboto' !important;
		color: #f67400;
	}

	.gradiant-box {
		background-image: linear-gradient(to bottom, #f9f9f9, #f4f4f4, #efefef, #ebebeb, #e6e6e6);
	}

	.circle-div {
	    width: 140px;
	    height: 140px;
	    background-color: white;
	    border: 6px solid #4e9d2d;
	    border-radius: 50%; /* This makes it a circle */
	}
	.circle-div-red {
	    width: 140px;
	    height: 140px;
	    background-color: white;
	    border: 6px solid #db0600;
	    border-radius: 50%; /* This makes it a circle */
	}
	.circle-div-score {
	    width: 140px;
	    height: 140px;
	    background-color: #763877;
	    border: 6px solid #18a0db;
	    border-radius: 50%; /* This makes it a circle */
	}
	.circle-div p,
	.circle-div-red p,
	.circle-div-score p {
		font-size: 18px;
		line-height:22px;
	}
	.circle-small {
	    width: 110px;
	    height: 110px;		
	}
	.circle-yellow {
	    width: 140px;
	    height: 140px;
	    background-color: #ffd85f;
	    border: 6px solid #fff;
	    border-radius: 50%; /* This makes it a circle */
	}
	.circle-red {
	    width: 140px;
	    height: 140px;
	    background-color: #e20000;
	    border: 6px solid #fff;
	    border-radius: 50%; /* This makes it a circle */
	}
	.circle-brown {
	    width: 140px;
	    height: 140px;
	    background-color: #d57301;
	    border: 6px solid #fff;
	    border-radius: 50%; /* This makes it a circle */
	}



	.border-green {
		border: 1px solid #a6ce39;
	}
	.dark {
		border: 1px solid #000;
	}

	.btn-dark {
		border: 2px solid #a6ce39;
		border-radius: 12px;
		color: #a6ce39;
		text-transform: uppercase;
		padding: 10px 20px;
		font-size: 16px;
	    font-family: 'DMSansBold', 'Roboto';
	    text-decoration: none;
	}
	.btn-dark:hover {
		border: 2px solid #a6ce39;
		color: #000;
		background: #fff;
	    text-decoration: none;
	}

	.btn-primary {
		border: 2px solid #4e9d2d;
		border-radius: 12px;
		background: #4e9d2d;
		color: #ffffff;
		padding: 10px 20px;
		font-size: 20px;
	    font-family: 'GlacialIndifference', 'Roboto';
	    text-decoration: none;
	    border-radius: 0px;
	}
	.btn-primary:hover {
		border: 2px solid #4e9d2d;
		color: #fff;
		background: #4e9d2d;
	    text-decoration: none;
	}
	.bg-lightbar {
		background: #1c6da5;
	}
	.bg-dark {
		background: #212121;
	}
	.bg-light {
		background: #e5e5e5 !important;
	}
	.border-bottom-1 {
		border-bottom: 1px solid #e5e5e5 !important;
	}
	.border-dark {
		border-color: #212121 !important;
	}
	.border-blue {
		border-color: #3fbaeb !important;
	}

	a {
	    color: #006eaa; /* Sets the text color to blue */
	    text-decoration: underline; /* Removes underline */
	}

	/* Hover effect for hyperlinks */
	a:hover {
	    color: #0a4774; /* Change color on hover */
	    text-decoration: underline; /* Underline on hover */
	}
	/* .navigation {
		position: absolute;
		bottom: 10px;
	}*/
	.navigation a {
	    color: #96b0c2; /* Sets the text color to blue */
	    text-decoration: underline; /* Removes underline */
	}
	.navigation a:hover {
	    color: #0a4774; /* Change color on hover */
	    text-decoration: underline; /* Underline on hover */
	}

	hr {
	    border: none;
	    border-top: 1px solid #ccc;
	}

	.text-green {
		color: #a6ce39 !important;
	}
	.text-teal {
		color: #15b0bf !important;
	}
	.text-blue {
		color: #006eaa !important;
	}
	.text-dark {
		color: #0a4774 !important;
	}
	.text-grey {
		color: #5c5c5c !important;
	}
	.text-medium {
		color: #a79700 !important;
	}
	.text-purple {
		color: #5f4296 !important;
	}
	.text-maroon {
		color: #763877 !important;
	}
	.text-white-border {
		color: #fff !important;
	  -webkit-text-stroke-width: 1px;
	  -webkit-text-stroke-color: #000;
	}
	.text-blue-light {
		color: #809cc2 !important;
	}


	.bg-green {
		background: #a6ce39 !important;
	}

	.text-small {
		font-size: 16px !important;
	}

	.fs-small {
		font-size: 19px;
	}
	.fw-bold{
    	font-family: 'aBlackLives';
    	font-weight: 900 !important;
	}
	.fw-regular {
		font-weight: 300 !important;
	}
	.text-regular {
    	font-family: 'GlacialIndifference', 'Roboto' !important;
	}
    /* Style the placeholder text */
    .form-control::placeholder {
        color: #006eaa !important; /* Change this to the desired color */
    }




