/*@import url('https://fonts.googleapis.com/css2?family=Qwitcher+Grypen:wght@400;700&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Allura&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap');

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	/* overflow: hidden; */
}

:root {
	--primary-color: #001223;

	--secondary-color-1: #f6921e;
	--secondary-color-2: #6ba1b8;
	--secondary-color-3: #ab856a;
	--secondary-color-4: #acac78;
	--secondary-color-5: #03a9c2;

	--icon-color-1: #f6921e;
	--icon-color-2: #c1b49a;
	--icon-color-3: #6ba1b8;
	--icon-color-4: #87564d;
	--icon-color-5: #c1b49a;
	--icon-color-6: #6ba1b8;
	--icon-color-7: #5e2e25;
	--icon-color-8: #b78083;
	--icon-color-9: #f6921e;
	--icon-color-10: #ab856a;
	--icon-color-11: #acac78;

	--tertiary-color: #fff;
}

html {
	scroll-behavior: smooth;
}

html,
body {
	background-color: #000000;
	font-family: helvetica, arial, sans-serif;
	overflow-x: hidden;
}

.miinus {
    display: none;
}

nav {
	position: relative;
}
.swiper-button-next, .swiper-button-prev{
    color:#ffffff;
}
.open-menu {
	width: 35px;
	height: 3px;
	background-color: #fff;
	margin-right: 20rem;
	cursor: pointer;
	position: absolute;
	transition: all 0.6s;
	margin-top: 1.3rem;
	top: 0;
	margin-left: 10px;
}


.accordion{
	transform: translateZ(0);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  background: #fff;
  /*width: 70%;*/
  width: 100%;
  margin: 0 auto;
}

.accordion > .accordion-toggle{
	position: absolute;
	opacity: 0;
	display: none;
}

.accordion h2{
    color:#fff;
}
.accordion h5{
    color:#fff;
        font-size: 1.1rem;
}
.accordion > label{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: start;
    height: 50px;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 700;
    /* border-top: 1px solid #ddd; */
    background: transparent;
    cursor: pointer;
}

.accordion > label:after {
  content: '\002B';
  position: absolute;
  color: #fff;
  top: 0px;
  right: 20px;
  font-family: fontawesome;
  /*transform: rotate(90deg);*/
  transition: .3s transform;
}

.accordion > section{
	height: 0;
	transition: .3s all;
	/*overflow: hidden;*/
	    overflow-y: scroll;
}

.accordion > section::-webkit-scrollbar {
  width: 1em;
}

.accordion > section::-webkit-scrollbar-thumb {
    background-color: #03A9C2;
    outline: 1px solid transparent;
    border-radius: 25px;
}

.accordion > section::-webkit-scrollbar-track {
    /* box-shadow: inset 0 0 6px rgb(0 0 0 / 30%); */
    border-radius: 10px;
    border: 1px solid #f1f1f1;
    background: #dbdbdb;
}

.accordion > .accordion-toggle:checked ~ label:after{
 /*transform: rotate(0deg);*/
 content: '\2212';
 color: #fff;
}

.accordion > .accordion-toggle:checked ~ section{
  height: 200px;
}

.accordion > section p {
      margin: 15px 0;
    padding: 0 20px 12px 40px;
    color: #fff;
    font-size: 19px;
}
.accordion img {
    padding-left: 10px;
    padding-right: 40px;
}

.accordion h2.Ress {
    padding-bottom: 15px;
    color: var(--secondary-color-1);
    background-image: url(images/assets_moduler.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}
.accordion h2.Off {
    color: var(--secondary-color-2);
    padding-bottom: 15px;
    background-image: url(images/assets_furniture.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}
.accordion h2.Comm {
    color: var(--secondary-color-3);
    padding-bottom: 15px;
    background-image: url(images/assets_decor.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}
.accordion h2.Con {
    color: var(--secondary-color-4);
    padding-bottom: 15px;
    background-image: url(images/assets_homeimprovement.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}



/*label.toggle3 > img {*/
/*    width: 100px;*/
/*    height: auto;*/
/*}*/

label.toggle3 > h5 {
    margin-right: 3rem;
}

/*section .acc-scroll {*/
/*    height: 200px;*/
/*    overflow-y: scroll;*/
/*}*/
.hamB {
	position: relative;
	/*width: 50px;*/
	/*height: 50px;*/
	right: 15rem;
	top: 4rem;
}

.logo_block > img {
    width: 35%;
}

.nav-image {
    padding-top: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 0 auto;
    position: relative;
    z-index: 2;
    padding-bottom: 1rem;
}

.footer-right>.linkss {
    /* margin-top: 50rem; */
    margin-top: 0rem;
    /* margin-top: 35rem; */
    display: flex;
    border-bottom: solid #fff 1px;
    flex-direction: column;
    /* justify-content: center; */
}
.social img {
    width: 131px;
    padding: 15px;
}

/* Dropdown start */
.dropbtn {
	background-color: #3498DB;
	color: white;
	padding: 16px;
	font-size: 16px;
	border: none;
	cursor: pointer;
}

.dropbtn:hover,
.dropbtn:focus {
	background-color: #2980B9;
}

.dropdown {
	position: relative;
	display: inline-block;
}

.dropdown-content {
	display: flex;
	/* position: absolute; */
	/* background-color: #f1f1f1; */
	min-width: 160px;
	overflow: auto;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
}

.dropdown-content a {
    color: #fff;
    padding: 12px 22px;
    text-decoration: none;
    display: flex;
    font-family: helvetica;
    align-items: center;
	font-size: 22px;
	font-weight: 200;
}

.dropdown-content a.Ress {
	color: var(--secondary-color-1);
}

.dropdown-content a.Ress:hover {
	color: #fff;
}

a.Ress > img {
    margin-right: 5px;
        width: 40px;
}

.dropdown-content a.Off {
	color: var(--secondary-color-2);
}

.dropdown-content a.Off:hover {
	color: #fff;
}

a.Off > img {
    margin-right: 5px;
        width: 40px;
}

.dropdown-content a.Comm {
	color: var(--secondary-color-3);
}

.dropdown-content a.Comm:hover {
	color: #fff;
}

a.Comm > img {
    margin-right: 5px;
        width: 40px;
}

.dropdown-content a.Con {
	color: var(--secondary-color-4);
}

.dropdown-content a.Con:hover {
	color: #fff;
}

a.Con > img {
    margin-right: 5px;
        width: 40px;
}

.dropdown-content > img {
	margin-right: 5px;
}

.dropdown a:hover {
	background-color: #ddd;
}

.show {
	display: block;
}

/* Dropdown end */

.open-menu::before {
	content: '';
	position: absolute;
	width: 35px;
	height: 3px;
	background-color: #fff;
	top: .5rem;
	cursor: pointer;
}

.open-menu::after {
	content: '';
	position: absolute;
	width: 35px;
	height: 3px;
	background-color: #fff;
	bottom: .5rem;
	cursor: pointer;
}

.menus {
	height: 100vh;
	width: 100%;
	background: #001223f8;
	z-index: 10;
	position: absolute;
	top: 0;
	overflow: hidden;
	display: none;
	/* display: flex; */
	justify-content: start;
	transition: all 0.6s;
	/* flex-direction: column; */
}

.menu-items {
	width: 1600px;
	/* background: #ffffff79; */
	margin: 0 auto;
	padding-top: 5rem;
	padding-bottom: 3rem;
}

.menus-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.close-icon {
	width: 30px;
	height: 4px;
	background-color: #fff;
	margin-right: 10rem;
	transform: rotate(45deg);
	position: relative;
	cursor: pointer;
	margin-top: 2rem;
}

.close-icon::after {
	content: '';
	position: absolute;
	width: 30px;
	height: 4px;
	background-color: #fff;
	transform: rotate(90deg);
}

.menus-top>img {
	margin-left: 12rem;
	margin-bottom: 2rem;
}

.linked {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	position: relative;
}

.linked>a {
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.7px;
	text-transform: uppercase;
	margin-top: 4rem;
	text-decoration: none;
	color: var(--tertiary-color);
	border-top: 1px solid var(--tertiary-color);
	border-right: 1px solid var(--tertiary-color);
	padding-right: 1rem;
	padding-top: 1rem;
}

.linked>a.products {
	position: relative;
}

.in_menus {
	position: absolute;
	top: 10rem;
	left: 28rem;
	display: flex;
	flex-direction: column;
}

.in_menus>a {
	margin-bottom: 1rem;
	text-decoration: none;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.7px;
	text-transform: capitalize;
}

a.residental {
	color: var(--secondary-color-1);
	transition: .3s;
	position: relative;
}

a.residental::before {
	content: '';
	position: absolute;
	left: 12rem;
	top: .5rem;
	width: 0px;
	height: 0px;
	/* background: #fff; */
	opacity: 0;
	transition: all .8s;
	transform-origin: left;
	border-top: 13px solid transparent;
	border-bottom: 13px solid transparent;
	border-left: 13px solid var(--tertiary-color);
}

a.residental:focus::before {
	opacity: 1;
}

a.residental::after {
	content: '';
	width: 0%;
	height: 3px;
	background-color: var(--secondary-color-1);
	bottom: 0;
	left: 0;
	position: absolute;
	transition: all .7s;
}

a.residental:focus::after {
	width: 115%;
}

a.residental:hover {
	color: var(--tertiary-color);
}

/* a.residental:hover ~ .inner-menus > a {
    opacity: 1;
} */

a.residental:focus~.inner-menus>a {
	display: block;
	opacity: 1;
}
/*Offerings*/
.accordion h2.Ress {
    padding-bottom: 15px;
    color: var(--secondary-color-1);
    background-image: url(images/assets_moduler.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}
.accordion h2.Off {
    color: var(--secondary-color-2);
    padding-bottom: 15px;
    background-image: url(images/assets_furniture.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}
.accordion h2.Comm {
    color: var(--secondary-color-3);
    padding-bottom: 15px;
    background-image: url(images/assets_decor.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}
.accordion h2.Con {
    color: var(--secondary-color-4);
    padding-bottom: 15px;
    background-image: url(images/assets_homeimprovement.svg);
    background-repeat: no-repeat;
    padding-left: 55px;
    background-size: 50px;
    padding-top: 15px;
    width: 31%;
}


.inner-menus {
	display: flex;
	flex-direction: column;
	position: absolute;
	left: 16rem;
	width: 20vw;
}

.inner-menus>a {
	text-decoration: none;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.7px;
	text-transform: capitalize;
	margin-bottom: 1rem;
	transition: all 1s;
	opacity: 0;
	display: none;
}

.inner-menus-2 {
	display: flex;
	flex-direction: column;
	position: absolute;
	left: 16rem;
	top: 3.5rem;
	width: 20vw;
}

.inner-menus-2>a {
	text-decoration: none;
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: 0.7px;
	text-transform: capitalize;
	margin-bottom: 1rem;
	opacity: 0;
	transform-origin: left;
	transition: all .5s;

}

a.lr {
	color: var(--secondary-color-1);
	transition: .3s;
}

a.lr:hover {
	color: var(--tertiary-color);
}

a.k {
	color: var(--icon-color-2);
	transition: .3s;
	z-index: 1;
}

a.k:hover {
	color: var(--tertiary-color);
}

a.b {
	color: var(--secondary-color-2);
	transition: .3s;
	z-index: 1;
}

a.b:hover {
	color: var(--tertiary-color);
}

a.d {
	color: var(--icon-color-7);
	transition: .3s;
	z-index: 1;
}

a.d:hover {
	color: var(--tertiary-color);
}

a.commercial {
	color: var(--secondary-color-2);
	transition: .3s;
	position: relative;
}

a.commercial::before {
	content: '';
	position: absolute;
	left: 13rem;
	top: .7rem;
	width: 0px;
	height: 0px;
	/* background: #fff; */
	opacity: 0;
	transition: all .8s;
	transform-origin: left;
	border-top: 13px solid transparent;
	border-bottom: 13px solid transparent;
	border-left: 13px solid var(--tertiary-color);
}

a.commercial:focus::before {
	opacity: 1;
}

a.commercial::after {
	content: '';
	width: 0%;
	height: 3px;
	background-color: var(--secondary-color-2);
	bottom: 0;
	left: 0;
	position: absolute;
	transition: all .7s;
}

a.commercial:focus::after {
	width: 130%;
}

a.commercial:hover {
	color: var(--tertiary-color);
}

/* a.commercial:hover ~ .inner-menus-2 > a {
    opacity: 1;
} */

a.commercial:focus~.inner-menus-2>a {
	opacity: 1;
}

a.crt {
	color: var(--icon-color-2);
	transition: .2s;
	z-index: 0;
}

a.crt:hover {
	color: var(--tertiary-color);
}

a.et {
	color: var(--icon-color-3);
	transition: .2s;
	z-index: 0;
}

a.et:hover {
	color: var(--tertiary-color);
}

a.ws {
	color: var(--icon-color-7);
	transition: .2s;
	z-index: 0;
}

a.ws:hover {
	color: var(--tertiary-color);
}

a.cb {
	color: var(--icon-color-4);
	transition: .2s;
}

a.cb:hover {
	color: var(--tertiary-color);
}

a.ot {
	color: var(--icon-color-9);
	transition: .2s;
}

a.ot:hover {
	color: var(--tertiary-color);
}

a.lws {
	color: var(--secondary-color-3);
	transition: .2s;
}

a.lws:hover {
	color: var(--tertiary-color);
}

a.rt {
	color: var(--secondary-color-4);
	transition: .2s;
}

a.rt:hover {
	color: var(--tertiary-color);
}

/* .getCote {
	height: 100%;
	width: 100%;
	display: flex;
	padding: 0rem;
	background: #03A9C2;
	overflow: hidden;
}

.getcote-1 {
	width: 70%;
	height: 100%;
} */

.getcote-2 {
	overflow: hidden;
	width: 15%;
	height: fit-content;
	background: #03a9c2;
	display: flex;
	align-items: center;
	justify-content: center;
	position: fixed;
	text-decoration: none;
	right: -6%;
	top: 30%;
	z-index: 10;
	transform: rotate(90deg);
}

i.fa-solid.fa-arrow-right-long {
	font-size: 2rem;
	color: #fff;
}

.getcote-2>p {
	font-size: 2rem;
	text-decoration: none;
	color: var(--tertiary-color);
	font-weight: 300;
	padding: 1rem;
	/* display: block;
	width: 100%; */
}

.quote {
        display: none;
	width: 400px;
	height: 400px;
	background: #acac78;
	border-radius: 0px;
	right: -200%;
	/* transform: translateY(-200%); */
	top: 5rem;
	position: absolute;
	z-index: 10;
	transition: all .8s;
}

form {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 2rem;
}

label {
	font-size: 1.3rem;
	margin-top: 1rem;
}

input {
	    height: 50px;
	    background: transparent;
    outline: none;
    border-radius: 0;
    padding: 0 1rem;
    font-size: 1.2rem;
    margin-top: 0.5rem;
    letter-spacing: .5px;
    /*border: 1px solid var(--primary-color);*/
    font-weight: 300;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 2px solid #fff;
}
.quote h1 {
    color: #fff;
}

/* ::placeholder {
	font-weight: 100;
} */

::-webkit-input-placeholder {
	font-weight: 100;
}

:-moz-placeholder {
	font-weight: 100;
}

::-moz-placeholder {
	font-weight: 100;
}

:-ms-input-placeholder {
	font-weight: 100;
}

::input-placeholder {
	font-weight: 100;
}

::placeholder {
	font-weight: 100;
	color:#fff;
}

#propertyname {
	margin-top: 0rem;
}
.form-but {
   padding: 10px;
    /*background-color: #fff;*/
    /*position: absolute;*/
    position: fixed;
    right: 0px;
    top: 40%;
    z-index: 99;
    font-size: 25px;
}


 .form-but a {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: rotate(90deg) translateY(-1rem);
    padding: 0.5rem 1rem;
    font-size: 1rem;
    color: #fff;
    background-color: #04aac2;
    outline: none;
    border: none;
}

     /*  .notification-container {
position: absolute;
top: 0;
right: 0;
width: 300px;
display: none;
height: 100%;
overflow: hidden;
background: #107b10;
z-index: 9999;
transform: translateX(100%);
-webkit-transform: translateX(100%);
}

.selected {
animation: slide-in 0.5s forwards;
-webkit-animation: slide-in 0.5s forwards;
}

.dismiss {
animation: slide-out 0.5s forwards;
-webkit-animation: slide-out 0.5s forwards;
}

@keyframes slide-in {
0% {
-webkit-transform: translateX(100%);
}
100% {
-webkit-transform: translateX(0%);
}
}

@-webkit-keyframes slide-in {
0% {
transform: translateX(100%);
}
100% {
transform: translateX(0%);
}
}

@keyframes slide-out {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(100%);
}
}

@-webkit-keyframes slide-out {
0% {
-webkit-transform: translateX(0%);
}
100% {
-webkit-transform: translateX(100%);
}
}*/

.form-but a {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: rotate(90deg) translateY(-1rem);
    padding: 0.5rem 1rem;
    font-size: 1rem;
    color: #fff;
    background-color: #04aac2;
    outline: none;
    border: none;
}
#button {
	width: 100%;
    font-size: 1.5rem;
    padding: 0.5em 1em;
    margin-top: 2rem;
    outline: none;
    border: 2px solid #ffffff;
    border-radius: 0px;
    transition: all .3s;
    color: #fff;
    cursor: pointer;
    background: transparent;
}

#button:hover {
	background: var(--tertiary-color);
	color: var(--primary-color);
}

.move {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 20px;
	height: 20px;
	cursor: pointer;
}

/* .nav-image {
	padding-top: 1rem;
	display: flex;
	align-items: start;
	justify-content: space-between;
	position: relative;
	z-index: 2;
	padding-bottom: 1rem;
} */

.container {
	width: 70%;
	margin: 0 auto;
	padding: 4rem 0 9rem;
	max-width: 70%;
}

.container>h1 {
	font-size: 5rem;
	font-size: 4rem;
	font-weight: 900;
	/* font-size: 2.5rem;
	font-weight: 400; */
	color: var(--tertiary-color);
	/* color: var(--primary-color); */
	text-align: left;
	padding-bottom: 2rem;
	margin: 0;
	letter-spacing: .5px;
	text-transform: uppercase;
	display: inline-block;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	padding-top: 1rem;
	padding-right: 2rem;
}

.accordion {
	background: #000000;
	border-radius: 0px;
	padding: 30px;
	border: 1px solid #ffffff;
	/* margin-top: 5rem; */
}

ul {
	margin-bottom: 0;
	list-style-type: none;
}

.question {
	border-top: 1px solid #eee;
	padding: 20px;
	cursor: pointer;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.question h5 {
	width: 75%;
	font-size: 1.175rem;
	font-weight: 100;
	color: var(--tertiary-color);
}

.question h2 {
	margin: 0;
	font-size: 20px;
	color: #03a9c2;
}

.question .icon {
	position: absolute;
	top: 0;
	right: 20px;
	height: 100%;
	display: flex;
	align-items: center;
	color: #03A9C2;
	transition: 1s cubic-bezier(.175, .885, .32, 1.275) all;
}


.answer {
	/* To work with the accordion we need to define the max-height: 0; only after we click we will work with the height */
	max-height: 0;
	overflow: hidden;
	transition: 1s cubic-bezier(.175, .885, .32, 1.275) all;
	display: flex;
	justify-content: space-between;
}

.answer::-webkit-scrollbar {
	width: 15px;
	display: none;
}

.answer::-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
	border-radius: 10px;
	border: 1px solid #f1f1f1;
	background: #dbdbdb;
	display: none;
}

.answer::-webkit-scrollbar-thumb {
	background-color: #03A9C2;
	outline: 1px solid transparent;
	border-radius: 25px;
	display: none;
}

.answer p {
color: #fff;
    padding: 20px 10px 16px 40px;
    font-size: 16px;
}

.accordion li.open .question .icon {
	transform: rotate(180deg);
}

.accordion li.open .answer {
	max-height: 350px;
	overflow-y: scroll;
}

/*.miinus {*/
/*    content: '\F2EA';*/
/*}*/

/*.miinus {*/
/*    display: none;*/
/*}*/

.mid_p {
	display: flex;
    /* flex-direction: column; */
    /* margin-left: 7rem; */
    padding: 1rem 0;
    width: 90%;
    justify-content: space-between;

}



ul.kit-ul {
    position: relative;
    margin-left: 35px;
    color: #fff;
    margin-top: 15px;
}
ul.kit-ul li {
    padding: 10px;
}

ul.kit-ul > li::before {    
    content: '';
    position: absolute;
    height: 5px;
    width: 5px;
    background: #f6921e;
    left: -0.5rem;
    margin-top: 4px;
    }
.bi {
    color: #fff;
    font-size: 35px;
}

.mid_p>h6 {
	font-size: 1.175rem;
	color: #cccccc;
	letter-spacing: 1.5px;
	font-weight: 300;
	text-transform: uppercase;
	    padding: 0 15px 15px 0;
}

.mid_p>p {
	font-size: 1.105rem;
	letter-spacing: 0.5px;
	color: var(--tertiary-color);
}
.Kitchen h6 {
    font-size: 1.175rem;
    color: #cccccc;
    letter-spacing: 1.5px;
    font-weight: 300;
    text-transform: uppercase;
        margin-left: 25px;
}
.Kitchen {
    border-right: solid 2px #3e3e3e;
    padding-right: 185px;
}
.line{
    border-right: none !important;;
}
.Kitchen-1 {
    border-right: solid 2px #3e3e3e;
    padding-right: 15px;
}
.Kitchen-1 h6 {
    font-size: 1.175rem;
    color: #cccccc;
    letter-spacing: 1.5px;
    font-weight: 300;
    text-transform: uppercase;
        margin-left: 25px;
}

.Kitchen-2 {
    border-right: solid 2px #3e3e3e;
    padding-right: 30px;
}
.Kitchen-2 h6 {
    font-size: 1.175rem;
    color: #cccccc;
    letter-spacing: 1.5px;
    font-weight: 300;
    text-transform: uppercase;
        margin-left: 25px;
}
.kit{
    display: flex;
    flex-direction: column !important;
}
/*.Wardrobe h6 {*/
/*    font-size: 1.175rem;*/
/*    color: #cccccc;*/
/*    letter-spacing: 1.5px;*/
/*    font-weight: 300;*/
/*    text-transform: uppercase;*/
/*}*/
/*.Storage h6 {*/
/*    font-size: 1.175rem;*/
/*    color: #cccccc;*/
/*    letter-spacing: 1.5px;*/
/*    font-weight: 300;*/
/*    text-transform: uppercase;*/
/*}*/

.nav-image>img {
	padding-left: 16rem;
	width: 20%;
}


.hero_slider {
	height: 75vh;
	width: 100%;
	/* margin-top: -14.5rem; */
}

.swiper {
	width: 100%;
	height: 100%;
	position: relative;
}

.swiper-slide>img {
	height: 100%;
	width: 100%;
	position: relative;
	object-fit: cover;
}

.swiper-slide>img.heartt {
	position: absolute;
	top: 10%;
	right: 10%;
	/* z-index: 5; */
	width: 40%;
	height: 80%;
}

.swiper-slide>h6 {
	position: absolute;
	top: 80%;
	/*left: 5%;*/
	padding-left: 55px;
	filter: drop-shadow(1px 3px 1px black);
	font-size: 4rem;
	font-weight: 200;
	font-family: 'Roboto', sans-serif;
	/*text-transform: lowercase;*/
	/* transform: scale(5); */
	color: #ffffff;
	/*font-family: 'Qwitcher Grypen', cursive;*/
	/*font-family: 'Allura', cursive;*/
	z-index: 3;
	/*filter: drop-shadow(2px 4px 1px #444);*/
}

.top {
	/* height: 200vh; */
	background: #000000;
	/* background: #d15dff; */
	overflow: hidden;
	display: flex;
	height: 100%;
	justify-content: center;
	position: relative;
}

.top-left-image {
	width: 65%;
	    padding-top: 150px;
    z-index: 9;
}

.heart-img {
	width: 45%;
	height: 75%;
	/* height: 175vh; */
	background-image: url(./images/dinning.jpg);
	background-size: cover;
	/*margin-left: -15rem;*/
	background-repeat: no-repeat;
	-webkit-mask-image: url(./images/assets_mask.svg);
	mask-image: url(./images/assets_mask.svg);
	-webkit-mask-size: 40vw;
	mask-size: 40vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	position: relative;
	z-index: 10;
	/* transition: .5s; */
	/* display: block; */
}

.heart-img1 {
	width: 45%;
	height: 75%;
	/* height: 165vh; */
	background-image: url(./images/h1.jpg);
	background-size: cover;
	/*margin-left: -15rem;*/
	background-repeat: no-repeat;
	-webkit-mask-image: url(./images/assets_mask.svg);
	mask-image: url(./images/assets_mask.svg);
	-webkit-mask-size: 40vw;
	mask-size: 40vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	position: absolute;
	top: 10rem;
	display: none;
	transition: .5s;
	z-index: 10;
}

.heart-img2 {
	width: 45%;
	height: 75%;
	/* height: 165vh; */
	background-image: url(./images/h6.jpg);
	background-size: cover;
	/*margin-left: -15rem;*/
	background-repeat: no-repeat;
	-webkit-mask-image: url(./images/assets_mask.svg);
	mask-image: url(./images/assets_mask.svg);
	-webkit-mask-size: 40vw;
	mask-size: 40vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	position: absolute;
	top: 10rem;
	display: none;
	transition: .5s;
	z-index: 10;
}

.heart-img3 {
	width: 45%;
	height: 75%;
	/* height: 165vh; */
	background-image: url(./images/living.jpg);
	background-size: cover;
	/*margin-left: -15rem;*/
	background-repeat: no-repeat;
	-webkit-mask-image: url(./images/assets_mask.svg);
	mask-image: url(./images/assets_mask.svg);
	-webkit-mask-size: 40vw;
	mask-size: 40vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	position: absolute;
	top: 10rem;
	display: none;
	transition: .5s;
	z-index: 10;
}

.top-right {
	display: flex;
	flex-direction: column;
	width: 25%;
	align-items: flex-start;
}

.top-right-text {
	/* background-color: #8b8b8b; */
	text-align: center;
	padding-top: 5rem;
}

.top-right-text>h1 {
	color: var(--tertiary-color);
	font-weight: 500;
	font-size: 3rem;
	border-bottom: 1px solid var(--tertiary-color);
	letter-spacing: 0.5px;
	line-height: 1.3em;
	position: relative;
}

.top-right-text>h4 {
	color: var(--tertiary-color);
	font-weight: 100;
	font-size: 2.5rem;
	letter-spacing: 0.5px;
	line-height: 1.3em;
}

.top-right-bottom {
	margin-top: 6rem;
}

.top-right-bottom>h1 {
	font-size: 8rem;
	/*transform: scale(4);*/
	text-transform: uppercase;
	color: var(--tertiary-color);
	padding-left: 0;
	padding-top: 2rem;
	position: relative;
}

/* .top-right-bottom > h1.love {
	position: relative;
} */
/*.love_line1 {*/
/*	position: absolute;*/
/*	height: 2px;*/
/*	width: 85%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -10rem; */
/*	left: -12rem;*/
/*	bottom: 32rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line1;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line1;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/
.love_line1 {
    position: absolute;
    height: 2px;
    width: 85%;
    background-color: #fff;
    left: -12rem;
    bottom: 41rem;
    transform: rotate(-26deg);
    animation-name: line1;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line1;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}

@keyframes line1 {
	0% {
		transform: translateX(-1%) rotate(-26deg);
		width: 86%;
		/* left: -5rem; */
	}

	25% {
		transform: translateX(-2%) rotate(-26deg);
		width: 86%;
		/* left: -6rem; */
	}

	50% {
		transform: translateY(-3%) rotate(-26deg);
		width: 86%;
		/* left: -6rem; */
	}

	75% {
		transform: translateX(-2%) rotate(-26deg);
		width: 86%;
		/* left: -5rem; */
	}

	100% {
		transform: translateX(-1%) rotate(-26deg);
		width: 86%;
		/* left: -5rem; */
		opacity: 1;
	}
}

@-webkit-keyframes line1 {
	0% {
		transform: translateX(-1%) rotate(-26deg);
		width: 86%;
		/* left: -5rem; */
	}

	25% {
		transform: translateX(-2%) rotate(-26deg);
		width: 86%;
		/* left: -6rem; */
	}

	50% {
		transform: translateY(-3%) rotate(-26deg);
		width: 86%;
		/* left: -6rem; */
	}

	75% {
		transform: translateX(-2%) rotate(-26deg);
		width: 86%;
		/* left: -5rem; */
	}

	100% {
		transform: translateX(-1%) rotate(-26deg);
		width: 86%;
		/* left: -5rem; */
		opacity: 1;
	}
}

/*.love_line2 {*/
/*	position: absolute;*/
/*	height: 2px;*/
/*	width: 84%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -4.5rem; */
/*	left: -11rem;*/
/*	bottom: 28rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line2;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line2;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/
.love_line2 {
    position: absolute;
    height: 2px;
    width: 84%;
    background-color: #fff;
    left: -11rem;
    bottom: 38rem;
    transform: rotate(-26deg);
    animation-name: line2;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line2;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}

@keyframes line2 {
	0% {
		transform: translateX(0.5%) rotate(-26deg);
		width: 84%;
		/* left: -5rem; */
	}

	25% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -6rem; */
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 84%;
		/* left: -6rem; */
	}

	75% {
		transform: translateX(0%) rotate(-26deg);
		width: 84.3%;
		/* left: -6rem; */
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -6rem; */
		opacity: 1;
	}
}

@-webkit-keyframes line2 {
	0% {
		transform: translateX(0.5%) rotate(-26deg);
		width: 84%;
		/* left: -5rem; */
	}

	25% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -6rem; */
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 84%;
		/* left: -6rem; */
	}

	75% {
		transform: translateX(0%) rotate(-26deg);
		width: 84.3%;
		/* left: -6rem; */
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -6rem; */
		opacity: 1;
	}
}

/*.love_line3 {*/
/*	position: absolute;*/
/*	height: 1px;*/
/*	width: 84%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -8rem; */
/*	left: -11rem;*/
/*	bottom: 30rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line3;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line3;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/
.love_line3 {
    position: absolute;
    height: 1px;
    width: 84%;
    background-color: #fff;
    left: -11rem;
    bottom: 40rem;
    transform: rotate(-26deg);
    animation-name: line3;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line3;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}
@keyframes line3 {
	0% {
		transform: translateX(0.5%) rotate(-26deg);
		width: 84%;
		/* left: -5rem; */
	}

	25% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -6rem; */
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 84%;
		/* left: -6rem; */
	}

	75% {
		transform: translateX(0%) rotate(-26deg);
		width: 84%;
		/* left: -5rem; */
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -5rem; */
		opacity: 1;
	}
}

@-webkit-keyframes line3 {
	0% {
		transform: translateX(0.5%) rotate(-26deg);
		width: 84%;
		/* left: -5rem; */
	}

	25% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -6rem; */
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 84%;
		/* left: -6rem; */
	}

	75% {
		transform: translateX(0%) rotate(-26deg);
		width: 84%;
		/* left: -5rem; */
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		/* left: -5rem; */
		opacity: 1;
	}
}


 .form-but a {
    position: absolute;
    right: -5px;
    top: 50%;
    transform: rotate(270deg) translateY(1rem);
    padding: 0.5rem 1rem;
    font-size: 1rem;
    color: #fff;
    background-color: #04aac2;
    outline: none;
    border: none;
}

   .notification-container {
position: absolute;
top:10rem;
right: 0;
width:360px;
display: none;
/*height: 50%;*/
height:auto;
overflow: hidden;
background: #acac78;
z-index: 9999;
transform: translateX(100%);
-webkit-transform: translateX(100%);
}
#closeFilePanel p {
    padding: 15px;
    font-weight: 600;
}
.selected {
animation: slide-in 0.5s forwards;
-webkit-animation: slide-in 0.5s forwards;
}

.dismiss {
animation: slide-out 0.5s forwards;
-webkit-animation: slide-out 0.5s forwards;
}

@keyframes slide-in {
0% {
-webkit-transform: translateX(100%);
}
100% {
-webkit-transform: translateX(0%);
}
}

@-webkit-keyframes slide-in {
0% {
transform: translateX(100%);
}
100% {
transform: translateX(0%);
}
}

@keyframes slide-out {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(100%);
}
}

@-webkit-keyframes slide-out {
0% {
-webkit-transform: translateX(0%);
}
100% {
-webkit-transform: translateX(100%);
}
}

.top-right-bottom > img:nth-child(1) {
  height: 80%;
    width: 100%;
    position: absolute;
    top: 13rem;
    left: -2%;
    animation-duration: 4s;
    animation-name: float;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

.top-right-bottom > img:nth-child(2) {
      height: 74%;
    width: 100%;
    position: absolute;
    top: 23rem;
    left: 2%;
    animation-duration: 4s;
    animation-name: float1;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}



.top-right-bottom > img:nth-child(3) {
        height: 80%;
    width: 100%;
    position: absolute;
    top: 32rem;
    left: -8%;
    animation-duration: 4s;
    animation-name: float;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
.top-right-bottom > img:nth-child(4) {
    height: 80%;
    width: 100%;
    position: absolute;
    top: 32rem;
    left: 0%;
    animation-duration: 5s;
    animation-name: float;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    transition: 3s ease;
}

@keyframes float {
    0% {
        transform: translateX(-1rem);
    }
    /*50% {*/
    /*    transform: translate(0rem);*/
    /*}*/
    100% {
        transform: translate(1rem);
    }
}

@keyframes float1 {
    0% {
        transform: translateX(-1rem);
    }
    /*50% {*/
    /*    transform: translate(0rem);*/
    /*}*/
    100% {
        transform: translate(1rem);
    }
}
.top-right-bottom {
    margin-top: 6rem;
    display: flex;
    flex-flow: column;
    margin-bottom: 3rem;
}

.top-right-bottom img{
    margin-top: 6rem;
}
/*.love_line4 {*/
/*	position: absolute;*/
/*	height: 2px;*/
/*	width: 84%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -16rem; */
/*	left: -11rem;*/
/*	bottom: 19rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line4;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line4;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/
.love_line4 {
    position: absolute;
    height: 2px;
    width: 84%;
    background-color: #fff;
    left: -11rem;
    bottom: 29rem;
    transform: rotate(-26deg);
    animation-name: line4;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line4;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}

@keyframes line4 {
	0% {
		transform: translateX(0.5%) rotate(-26deg);
		width: 84%;
	}

	25% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
	}

	50% {
		transform: translateY(1.5%) translateX(1.3%) rotate(-26deg);
		width: 84.2%;
	}

	75% {
		transform: translateX(1.2%) rotate(-26deg);
		width: 83%;
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		opacity: 1;
	}
}

@-webkit-keyframes line4 {
	0% {
		transform: translateX(0.5%) rotate(-26deg);
		width: 84%;
	}

	25% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
	}

	50% {
		transform: translateY(1.5%) translateX(1.3%) rotate(-26deg);
		width: 84.2%;
	}

	75% {
		transform: translateX(1.2%) rotate(-26deg);
		width: 83%;
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.5%;
		opacity: 1;
	}
}

/*.love_line5 {*/
/*	position: absolute;*/
/*	height: 1px;*/
/*	width: 84%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -19rem; */
/*	left: -11rem;*/
/*	bottom: 21rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line5;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line5;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/

.love_line5 {
    position: absolute;
    height: 1px;
    width: 84%;
    background-color: #fff;
    left: -11rem;
    bottom: 32rem;
    transform: rotate(-26deg);
    animation-name: line5;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line5;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}


@keyframes line5 {
	0% {
		transform: translateX(1%) rotate(-26deg);
		width: 85%;
	}

	25% {
		transform: translateX(-0.1%) rotate(-26deg);
		width: 83.8%;
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 85%;
	}

	75% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.8%;
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 84%;
		opacity: 1;
	}
}

@-webkit-keyframes line5 {
	0% {
		transform: translateX(1%) rotate(-26deg);
		width: 85%;
	}

	25% {
		transform: translateX(-0.1%) rotate(-26deg);
		width: 83.8%;
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 85%;
	}

	75% {
		transform: translateX(1%) rotate(-26deg);
		width: 83.8%;
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 84%;
		opacity: 1;
	}
}

/*.love_line6 {*/
/*	position: absolute;*/
/*	height: 2px;*/
/*	width: 84%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -26rem; */
/*	left: -7.5rem;*/
/*	bottom: 10rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line6;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line6;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/

.love_line6 {
    position: absolute;
    height: 2px;
    width: 84%;
    background-color: #fff;
    left: -7.5rem;
    bottom: 21rem;
    transform: rotate(-26deg);
    animation-name: line6;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line6;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}


@keyframes line6 {
	0% {
		transform: translateX(1.5%) translateY(-.3%) rotate(-26deg);
		width: 85%;
	}

	25% {
		transform: translateX(1.4%) translateY(-.5%) rotate(-26deg);
		width: 84%;
	}

	50% {
		transform: translateX(1.2%) rotate(-26deg);
		width: 84%;
	}

	75% {
		transform: translateX(1.3%) rotate(-26deg);
		width: 84%;
	}

	100% {
		transform: translateX(1.5%) rotate(-26deg);
		width: 84%;
		opacity: 1;
	}
}

@-webkit-keyframes line6 {
	0% {
		transform: translateX(2.5%) translateY(-3%) rotate(-26deg);
		width: 85%;
	}

	25% {
		transform: translateX(1.4%) translateY(-5%) rotate(-26deg);
		width: 84%;
	}

	50% {
		transform: translateX(-.2%) rotate(-26deg);
		width: 84%;
	}

	75% {
		transform: translateX(1.3%) rotate(-26deg);
		width: 84%;
	}

	100% {
		transform: translateX(1%) rotate(-26deg);
		width: 84%;
		opacity: 1;
	}
}

/*.love_line7 {*/
/*	position: absolute;*/
/*	height: 1px;*/
/*	width: 88.5%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -29rem; */
/*	left: -16rem;*/
/*	bottom: 10rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line7;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line7;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/
.love_line7 {
    position: absolute;
    height: 1px;
    width: 88.5%;
    background-color: #fff;
    left: -16rem;
    bottom: 21rem;
    transform: rotate(-26deg);
    animation-name: line7;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line7;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}


@keyframes line7 {
	0% {
		transform: translateY(8%) rotate(-26deg);
		width: 88.5%;
	}

	25% {
		transform: translateY(1%) rotate(-26deg);
		width: 88.8%;
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 88.5%;
	}

	75% {
		transform: translateY(1%) rotate(-26deg);
		width: 88.8%;
	}

	100% {
		transform: translateY(5%) rotate(-26deg);
		width: 88.5%;
		opacity: 1;
	}
}

@-webkit-keyframes line7 {
	0% {
		transform: translateY(8%) rotate(-26deg);
		width: 88.5%;
	}

	25% {
		transform: translateY(1%) rotate(-26deg);
		width: 88.8%;
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 88.5%;
	}

	75% {
		transform: translateY(1%) rotate(-26deg);
		width: 88.8%;
	}

	100% {
		transform: translateY(5%) rotate(-26deg);
		width: 88.5%;
		opacity: 1;
	}
}

/*.love_line8 {*/
/*	position: absolute;*/
/*	height: 1px;*/
/*	width: 94%;*/
/*	background-color: #fff;*/
	/* left: -5rem;
    bottom: -31rem; */
/*	left: -12rem;*/
/*	bottom: 9rem;*/
/*	transform: rotate(-26deg);*/
/*	animation-name: line8;*/
/*	animation-duration: 5s;*/
/*	animation-iteration-count: infinite;*/
/*	-webkit-animation-name: line8;*/
/*	-webkit-animation-duration: 5s;*/
/*	-webkit-animation-iteration-count: infinite;*/
/*	transition: 3s ease;*/
/*}*/

.love_line8 {
    position: absolute;
    height: 1px;
    width: 94%;
    background-color: #fff;
    left: -12rem;
    bottom: 19rem;
    transform: rotate(-26deg);
    animation-name: line8;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    -webkit-animation-name: line8;
    -webkit-animation-duration: 5s;
    -webkit-animation-iteration-count: infinite;
    transition: 3s ease;
}

@keyframes line8 {
	0% {
		transform: translateY(2%) rotate(-26deg);
		width: 94%;
	}

	25% {
		transform: translateY(-0.1%) rotate(-26deg);
		width: 94.8%;
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 94%;
	}

	75% {
		transform: translateY(1%) rotate(-26deg);
		width: 94.8%;
	}

	100% {
		transform: translateY(1%) rotate(-26deg);
		width: 94%;
		opacity: 1;
	}
}

@-webkit-keyframes line8 {
	0% {
		transform: translateY(2%) rotate(-26deg);
		width: 94%;
	}

	25% {
		transform: translateY(-0.1%) rotate(-26deg);
		width: 94.8%;
	}

	50% {
		transform: translateY(1.3%) rotate(-26deg);
		width: 94%;
	}

	75% {
		transform: translateY(1%) rotate(-26deg);
		width: 94.8%;
	}

	100% {
		transform: translateY(1%) rotate(-26deg);
		width: 94%;
		opacity: 1;
	}
}

.top-right-bottom>h1 span {
	animation-name: loveT;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	-webkit-animation-name: loveT;
	-webkit-animation-duration: 3s;
	-webkit-animation-iteration-count: infinite;
	text-transform: capitalize;
	-webkit-font-smoothing: auto;
	/* transition: 3s ease; */
	position: absolute;
	/* opacity: 0; */
	/* animation: loveT forwards; */
}

.top-right-bottom>h1 span.being {
	animation-name: beingT;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	-webkit-animation-name: beingT;
	-webkit-animation-duration: 3s;
	-webkit-animation-iteration-count: infinite;
	transition: .5s ease;
	position: absolute;
	text-transform: lowercase;
	-webkit-font-smoothing: auto;
}

.top-right-bottom>h1 span.in {
	animation-name: inT;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	-webkit-animation-name: inT;
	-webkit-animation-duration: 3s;
	-webkit-animation-iteration-count: infinite;
	transition: .7s ease;
	position: absolute;
	text-transform: lowercase;
	-webkit-font-smoothing: auto;
}

.top-right-bottom>p.home-off {
	animation-name: homeT;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	-webkit-animation-name: homeT;
	-webkit-animation-duration: 3s;
	-webkit-animation-iteration-count: infinite;
	transition: .5s ease;

	max-width: 9vw;
    top: 44rem;
    right: 15rem;
}

.top-right-bottom>p {
	position: absolute;
	color: var(--tertiary-color);
	max-width: 7vw;
	/* top: 55rem; */
	top: 41rem;
	/* top: 52rem; */
	right: 18rem;
	font-size: 1.3rem;
}

.linkss {
	/* margin-top: 50rem; */
	margin-top: 29rem;
	/* margin-top: 35rem; */
	display: flex;
	flex-direction: column;
	/* justify-content: center; */
}

.linkss>a {
	margin-bottom: 2rem;
	text-decoration: none;
	font-size: 2rem;
	text-transform: uppercase;
	transition: .3s ease-out;
	letter-spacing: 0.7px;
	transform-origin: left;
	/* transform: translateX(-15rem); */
	display: flex;
	align-items: center;
}

.linkss>a:nth-child(1) {
	color: var(--secondary-color-1);
	transform-origin: left;
}

.linkss>a:nth-child(1):hover {
	color: var(--tertiary-color);
	transform: scale(1.1);
	/* transform: scale(1.1) translateX(-13rem); */
}

.linkss>a:nth-child(2) {
	color: var(--secondary-color-2);
	transform-origin: left;
}

.linkss>a:nth-child(2):hover {
	color: var(--tertiary-color);
	transform: scale(1.1);
	/* transform: scale(1.1) translateX(-13rem); */
}

.linkss>a:nth-child(3) {
	color: var(--secondary-color-3);
	transform-origin: left;
}

.linkss>a:nth-child(3):hover {
	color: var(--tertiary-color);
	transform: scale(1.1);
	/* transform: scale(1.1) translateX(-13rem); */
}

.linkss>a:nth-child(4) {
	color: var(--secondary-color-4);
	transform-origin: left;
}

.linkss>a:nth-child(4):hover {
	color: var(--tertiary-color);
	transform: scale(1.1);
	/* transform: scale(1.1) translateX(-13rem); */
}

.link-img {
	width: 45px;
	height: 45px;
	margin-right: 0.4em;
}

.second-sec {
	margin: 0 auto;
	max-width: 70%;
	width: 80%;
	padding-top: 6rem;
	padding-bottom: 6rem;
	position: relative;
}

.second-sec>p {
	font-size: 2.2rem;
	letter-spacing: 0.5px;
	line-height: 1.3em;
	color: var(--tertiary-color);
	text-align: left;
}

.a-line {
	height: 100%;
	width: 1px;
	background: var(--secondary-color-2);
	right: -3rem;
	top: 4rem;
	position: absolute;
	transform: rotate(330deg) translateY(-100%);
	transition: all 0.5s;
	opacity: 0;
	/* transform: translateY(); */

	/* visibility: hidden; */
}

p:hover~.a-line {
	transform: rotate(330deg) translateY(0%);
	opacity: 1;
}

.residental {
	/*margin: 0 auto;*/
	margin: 145px auto;
	width: 77%;
	margin-bottom: -3rem;
}

.residental h1 {
	/* margin: 0 auto; */
	width: fit-content;
	font-size: 5rem;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	line-height: 1.5em;
	color: var(--tertiary-color);
	position: relative;
	border-top: 1px solid var(--tertiary-color);
	border-right: 1px solid var(--tertiary-color);
	padding-right: 1rem;
	margin-left: 3rem;
}

.residental-tabs {
	padding-top: 3rem;
	margin: 0 auto;
	width: 90%;
	z-index: 2;
	position: relative;
}

.tab {
	float: left;
	/* border-right: 1px solid #ccc; */
	background-color: transparent;
	width: 10%;
	position: relative;
	/* height: 195vh; */
}

/* Style the buttons inside the tab */
.tab button {
	display: block;
	background-color: inherit;
	color: var(--tertiary-color);
	padding: .7rem 1rem;
	width: 100%;
	border: none;
	outline: none;
	text-align: left;
	cursor: pointer;
	transition: 0.3s;
	font-size: 17px;
}

/* Change background color of buttons on hover */
.tab button:hover {
	background-color: transparent;
}

/* Create an active/current "tab button" class */
.tab button.active {
	background-color: transparent;
}

/* Style the tab content */
.tabcontent {
	float: left;
	padding: 0px 12px;
	border: 1px solid #ccc;
	width: 80%;
	/* border-left: none; */
	color: var(--tertiary-color);
	height: auto;
	/* height: 195vh; */
}

.one {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/001.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: top left;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_livinng.png);
	mask-image: url(./images/masks_livinng.png); */
	-webkit-mask-size: 60vw;
	mask-size: 60vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
}

.one>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

/* .view-img1,
.view_img2,
.view_img3,
.view_img4,
.view-img5,
.view_img6,
.view_img7,
.view_img8,
.view_img10,
.view_img11,
.view_img9 {
	display: block;
} */

/* #view-img1,
#view_img2,
#view_img3,
#view_img4,
#view-img5,
#view_img6,
#view_img7,
#view_img8,
#view_img10,
#view_img11,
#view_img9 {
	display: none;
} */

img#my_image,
img#my_image2,
img#my_image3,
img#my_image4,
img#my_image5,
img#my_image6,
img#my_image7,
img#my_image8,
img#my_image10,
img#my_image11,
img#my_image9 {
	display: none;
}

.view-img1,
.view_img2,
.view_img3,
.view_img4,
.view-img5,
.view_img6,
.view_img7,
.view_img8,
.view_img10,
.view_img11,
.view_img9 {
	width: 80%;
	/* display: block; */
}

img#my_image,
img#my_image2,
img#my_image3,
img#my_image4,
img#my_image5,
img#my_image6,
img#my_image7,
img#my_image8,
img#my_image10,
img#my_image11,
img#my_image9 {
	width: 80%;
	/* display: none; */
}

#one {
	padding: 4rem;
	margin-bottom: 8rem;
	/* z-index: 1; */
}

img#my_image {
	width: 80%;
	/* padding-bottom: 1rem; */
}

#one>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--secondary-color-1);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#one>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--secondary-color-1);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--secondary-color-1); */
}

#one>.line1 {
	width: 100%;
	height: 6px;
	margin-top: 0.7rem;
	background: var(--secondary-color-1);
}

#one>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#one::after {
	content: '';
	position: absolute;
	top: 6rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--secondary-color-1);
	/* background: red; */
}

div#one {
	border: 1px solid var(--secondary-color-1);
}

#two {
	padding: 4rem;
	margin-bottom: 8rem;
	z-index: -1;
}

img#my_image2 {
	width: 80%;
}

#two>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-2);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#two>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-2);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-2); */
}

#two>.line2 {
	width: 100%;
	height: 6px;
	margin-top: 0.7rem;
	background: var(--icon-color-2);
}

#two>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

.two {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/002.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: top left;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_kitchen.png);
	mask-image: url(./images/masks_kitchen.png);
	margin-left: -15rem; */
	-webkit-mask-size: 80vw;
	mask-size: 80vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
}

div#two::after {
	content: '';
	position: absolute;
	top: 14rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-2);
}

.two>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

div#two {
	border: 1px solid var(--icon-color-2);
}

#three {
	padding: 4rem;
	margin-bottom: 8rem;
	z-index: -1;
}

img#my_image3 {
	width: 80%;
}

#three>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-3);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#three>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-3);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-3); */
}

#three>.line3 {
	width: 100%;
	height: 6px;
	background: var(--icon-color-3);
	margin-top: 0.7rem;
}

#three>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#three {
	border: 1px solid var(--icon-color-3);
}

.three {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/003.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_bedroom.png);
	mask-image: url(./images/masks_bedroom.png); */
	-webkit-mask-size: 80vw;
	mask-size: 80vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -15rem; */
}

div#three::after {
	content: '';
	position: absolute;
	top: 23rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-3);
}

.three>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

#four {
	padding: 4rem;
	margin-bottom: 8rem;
}

img#my_image4 {
	width: 80%;
}

#four>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-7);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#four>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-7);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-7); */
}

#four>.line4 {
	width: 100%;
	height: 6px;
	background: var(--icon-color-7);
	margin-top: 0.7rem;
}

#four>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#four::after {
	content: '';
	position: absolute;
	top: 31rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-7);
}

div#four {
	border: 1px solid var(--icon-color-7);
}

.four {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/005.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_dinning.png);
	mask-image: url(./images/masks_dinning.png); */
	-webkit-mask-size: 70vw;
	mask-size: 70vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
}

.four>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

/* .fouth {
    position: relative;
} */

.fourth-sec {
	margin: 0 auto;
	max-width: 60%;
	width: 60%;
	padding-top: 5rem;
	padding-bottom: 0rem;
	overflow: hidden;
	position: relative;
}

.fourth-sec>p {
	font-size: 2.2rem;
	letter-spacing: 0.5px;
	line-height: 1.3em;
	color: var(--tertiary-color);
	text-align: left;
	margin-right: 3rem;
	/* position: relative; */
}

.an-line {
	height: 50%;
	width: 1px;
	background: var(--secondary-color-2);
	right: -3rem;
	bottom: 20rem;
	position: absolute;
	transition: all 0.5s;
	opacity: 0;
	transform: rotate(30deg) translateY(70%);

	/* transform: rotate(30deg) translateY(-200%); */
	/* transform: translateY(); */
	/* visibility: hidden; */
}

p:hover~.an-line {
	height: 100%;
	transform: rotate(30deg) translateY(90%) translateX(3rem);
	opacity: 1;
}

.commercial {
	margin: 0 auto;
	width: 77%;
	margin-bottom: -3rem;
}

.commercial>h1 {
	width: fit-content;
	font-size: 5rem;
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: 0.8px;
	line-height: 1.5em;
	color: var(--tertiary-color);
	position: relative;
	border-top: 1px solid var(--tertiary-color);
	border-right: 1px solid var(--tertiary-color);
	padding-right: 1rem;
	margin-left: 3rem;
}

.residental-tabses {
	padding-top: 3rem;
	margin: 0 auto;
	width: 90%;
	z-index: 2;
	position: relative;

	/* display: flex;
	height: 100%; */
}

.tabes {
	float: left;
	/* border-right: 1px solid #ccc; */
	background-color: transparent;
	width: 10%;

	/* display: flex;
	height: 100%;
	flex-direction: column; */
	/* height: 195vh; */
}

/* Style the buttons inside the tab */
.tabes button {
	display: block;
	background-color: inherit;
	color: var(--tertiary-color);
	padding: .7rem .5rem;
	width: 100%;
	border: none;
	outline: none;
	text-align: left;
	cursor: pointer;
	transition: 0.3s;
	font-size: 17px;
}

/* Change background color of buttons on hover */
.tabes button:hover {
	background-color: transparent;
}

/* Create an active/current "tab button" class */
.tabes button.active {
	background-color: transparent;
}

/* Style the tab content */
.tabcontentes {
	float: left;
	padding: 0px 12px;
	border: 1px solid #ccc;
	width: 80%;
	/* border-left: none; */
	color: var(--tertiary-color);
	height: auto;
	/* height: 195vh; */
}

#five,
#six,
#seven,
#eight,
#nine,
#ten,
#ele {
	padding: 4rem;
	margin-bottom: 10rem;
}

#five>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-5);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#five>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-5);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-5); */
}

#five>.line5 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-5);
}

#five>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#five::after {
	content: '';
	position: absolute;
	top: 6rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-5);
}

div#five {
	border: 1px solid var(--icon-color-5);
}

.five {
	width: 100%;
	/* height: 80vh; */
	height: 100%;
	/* background-image: url(./images/conference.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_conference.png);
	mask-image: url(./images/masks_conference.png); */
	-webkit-mask-size: 70vw;
	mask-size: 70vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
	/* margin-bottom: 12rem; */
}

.five>img {
	width: 100%;
	/*height: 100%;*/
	height: auto;
	padding-bottom: 1rem;
}

.tabes {
	position: relative;
}

#six>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-6);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#six>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-6);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-6); */
}

#six>.line6 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-6);
}

#six>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#six::after {
	content: '';
	position: absolute;
	top: 15rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-6);
}

div#six {
	border: 1px solid var(--icon-color-6);
}

.six {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/director_desk.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_executivedirector.png);
	mask-image: url(./images/masks_executivedirector.png); */
	-webkit-mask-size: 70vw;
	mask-size: 70vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
	/* margin-bottom: 12rem; */
}

.six>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

#seven>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-7);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#seven>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-7);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-7); */
}

#seven>.line7 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-7);
}

#seven>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#seven::after {
	content: '';
	position: absolute;
	top: 24rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-7);
}

div#seven {
	border: 1px solid var(--icon-color-7);
}

.seven {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/conference.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_workstation.png);
	mask-image: url(./images/masks_workstation.png); */
	-webkit-mask-size: 70vw;
	mask-size: 70vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
	/* margin-bottom: 12rem; */
}

.seven>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

#eight>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-8);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#eight>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-8);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-8); */
}

#eight>.line8 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-8);
}

#eight>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#eight::after {
	content: '';
	position: absolute;
	top: 34rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-8);
}

div#eight {
	border: 1px solid var(--icon-color-8);
}

.eight {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/008.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_cabinet.png);
	mask-image: url(./images/masks_cabinet.png); */
	-webkit-mask-size: 70vw;
	mask-size: 70vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
	/* margin-bottom: 12rem; */
}

.eight>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

#nine>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-9);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#nine>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-9);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-9); */
}

#nine>.line9 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-9);
}

#nine>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#nine::after {
	content: '';
	position: absolute;
	top: 43rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-9);
}

div#nine {
	border: 1px solid var(--icon-color-9);
}

.nine {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/001.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_officetable.png);
	mask-image: url(./images/masks_officetable.png); */
	-webkit-mask-size: 70vw;
	mask-size: 70vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -10rem; */
	/* margin-bottom: 12rem; */
}

.nine>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

#ten>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-10);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#ten>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-10);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-10); */
}

#ten>.line10 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-10);
}

#ten>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#ten::after {
	content: '';
	position: absolute;
	top: 52rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-10);
}

div#ten {
	border: 1px solid var(--icon-color-10);
}

.ten {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/003.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: top;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_longworkstation.png);
	mask-image: url(./images/masks_longworkstation.png); */
	-webkit-mask-size: 55vw;
	mask-size: 55vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -1rem; */
	/* margin-bottom: 12rem; */
}

.ten>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

/* img#my_image10 {
    position: absolute;
    width: 80%;
    top: 80rem;
    left: 22rem;
}

img#view_img10 {
    position: absolute;
    width: 80%;
    top: 80rem;
    left: 22rem;
} */

#ele>h3 {
	font-size: 3rem;
	font-weight: 600;
	color: var(--icon-color-11);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	margin-bottom: -1rem;
}

#ele>h5 {
	font-size: 2.5rem;
	font-weight: 500;
	color: var(--icon-color-11);
	letter-spacing: 0.7px;
	line-height: 1.5em;
	/* border-bottom: 1px solid var(--icon-color-11); */
}

#ele>.line11 {
	width: 100%;
	height: 4px;
	margin-top: .5rem;
	background: var(--icon-color-11);
}

#ele>p {
	width: 85%;
	padding-top: 1rem;
	font-size: 1.3rem;
	letter-spacing: 0.5px;
	line-height: 1.5em;
}

div#ele::after {
	content: '';
	position: absolute;
	top: 62rem;
	left: 9.5rem;
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid var(--icon-color-5);
}

div#ele {
	border: 1px solid var(--icon-color-5);
}

.ele {
	width: 100%;
	height: 100%;
	/* background-image: url(./images/004.jpg); */
	background-size: cover;
	margin-top: 3rem;
	background-position: center center;
	background-repeat: no-repeat;
	/* -webkit-mask-image: url(./images/masks_reception.png);
	mask-image: url(./images/masks_reception.png); */
	-webkit-mask-size: 55vw;
	mask-size: 55vw;
	mask-repeat: no-repeat;
	-webkit-mask-repeat: no-repeat;
	mask-mode: alpha;
	-webkit-mask-mode: alpha;
	/* margin-left: -1rem; */
	/* margin-bottom: 12rem; */
}

.ele>img {
	width: 100%;
	height: 100%;
	padding-bottom: 1rem;
}

/* img#my_image11 {
    position: absolute;
    width: 80%;
    top: 80rem;
    left: 40rem;
}

img#view_img11 {
    position: absolute;
    width: 80%;
    top: 80rem;
    left: 40rem;
} */


.subscribe {
	margin: 0 auto;
	width: 80%;
	display: flex;
	align-items: center;
	padding-top: 3rem;
	padding-bottom: 5rem;
	border-top: 1px solid var(--secondary-color-5);
}

.subscribe>input[type="email"] {
	width: 40%;
	padding: 1rem 1rem;
	background-color: transparent;
	border: 1px solid var(--secondary-color-5);
	border-radius: 0;
	color: var(--tertiary-color);
	font-size: 1.2rem;
	font-weight: 300;
	letter-spacing: 0.8px;
	line-height: 1.5em;
}

.subscribe>input[type="email"]:focus,
.subscribe>input[type="email"]:focus-visible {
	border: 1px solid var(--secondary-color-5);
	border-radius: 0;
	outline: none;
	font-size: 1.2rem;
	font-weight: 300;
	letter-spacing: 0.8px;
	line-height: 1.5em;
}

.subscribe>button {
	padding: 1.2rem 1rem;
	background-color: var(--secondary-color-5);
	text-transform: uppercase;
	color: var(--tertiary-color);
	font-size: 1.2rem;
	font-weight: 500;
	outline: none;
	border: none;
	border-radius: 1px;
	letter-spacing: 0.5px;
	line-height: 1.3em;
	margin-left: 1rem;
	cursor: pointer;
}



/* blue-space */
#blue-space{
	background-color: #04aac2;
	overflow-x: hidden;
}
#blue-scroll {
    height: auto;
    width: 100%;
	margin-left: 15%;
	padding-bottom:5%;
}
#blue-scroll .swiper-button-next{
display: none;
}
#blue-scroll .swiper-button-prev{
	display: none;
	}
#blue-space .container{
	padding: 0px;
}
.blue-img {
    padding-top: 10%;
    padding-bottom: 10%;
}
.blue-img > img {
    width: 100%;
}
/* Footer */

footer {
	display: flex;
	justify-content: space-between;
	padding: 0 10rem 6rem;
}

.footer-left>img {
	width: 45vw;
	padding-bottom: 2rem;
}

.footer-left>p:nth-child(2) {
	color: var(--tertiary-color);
	font-size: 1.5rem;
	font-weight: 200;
	letter-spacing: 0.7px;
	line-height: 1.3em;
	padding-top: 2rem;
	padding-bottom: 0.7rem;
	border-top: 1px solid var(--tertiary-color);
}

.footer-left>h2 {
	color: var(--tertiary-color);
	text-transform: uppercase;
	font-weight: 900;
	letter-spacing: 0.8px;
	line-height: 1.5em;
	font-size: 1.7rem;
}

.footer-left>h2:nth-child(4) {
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--tertiary-color);
}

.footer-left>h5 {
	color: var(--tertiary-color);
	font-size: 1.5rem;
	font-weight: 600;
	letter-spacing: 0.8px;
	line-height: 1.5em;
	padding-top: 0.7rem;
}

.footer-left>h5>a {
	color: var(--tertiary-color);
	font-size: 1.5rem;
	font-weight: 600;
	letter-spacing: 0.8px;
	line-height: 1.5em;
	padding-top: 0.7rem;
	text-decoration: none;
}

.footer-left>h5 span {
	background-color: #03a9c2;
	color: var(--primary-color);
	font-weight: 600;
	padding: 0.3rem 0.5rem;
	margin-right: 0.4rem;
	letter-spacing: 0.5px;
}

/*.footer-left>p:nth-child(8) {*/
/*	color: var(--tertiary-color);*/
/*	font-size: 1.5rem;*/
/*	font-weight: 600;*/
/*	letter-spacing: 0.7px;*/
/*	line-height: 1.5em;*/
/*	padding-top: 0.5rem;*/
/*}*/

p.add {
        color: var(--tertiary-color);
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.7px;
    line-height: 1.5em;
    padding-top: 0.5rem;
}

.footer-left>p>a {
	color: var(--tertiary-color);
	font-size: 1.5rem;
	font-weight: 400;
	letter-spacing: 0.7px;
	line-height: 1.5em;
	padding-top: 0.5rem;
	text-decoration: none;
}

.footer-left>p>a:hover {
	text-decoration: underline;
}

.footer-left>p>a>span {
	font-weight: 600;
}

.footer-right {
	/*display: flex;*/
	    padding-top: 84px;
	align-items: end;
	justify-content: end;
}


.footer-right>img {
	width: 50%;
}

.copyright {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: var(--tertiary-color);
	padding: 1.5rem 10rem;
}

.copyright>p {
	font-size: 1.3rem;
	font-weight: 100;
	letter-spacing: 0.7px;
	line-height: 1.3em;
}

.copyright>a img {
	width: 3vw;
}

@keyframes loveT {
	0% {
		transform: translateX(-3%);
	}

	25% {
		transform: translateX(-4%);
	}

	50% {
		transform: translateY(-3%);
	}

	75% {
		transform: translateX(-2%);
	}

	100% {
		transform: translateX(-3%);
		opacity: 1;
	}
}

@-webkit-keyframes loveT {
	0% {
		transform: translateX(-3%);
	}

	25% {
		transform: translateX(-4%);
	}

	50% {
		transform: translateY(-3%);
	}

	75% {
		transform: translateX(-2%);
	}

	100% {
		transform: translateX(-3%);
		opacity: 1;
	}
}


@keyframes beingT {

	0% {
		transform: translateX(2%);
		transition: 4s;
	}

	25% {
		transform: translateX(1%);
		transition: 4s;
	}

	50% {
		transform: translateX(-1%);
		transition: 4s;
	}

	75% {
		transform: translateX(1%);
		transition: 4s;
	}

	100% {
		transform: translateX(2%);
		transition: 4s;
		opacity: 1;
	}
}

@-webkit-keyframes beingT {

	0% {
		transform: translateX(2%);
		transition: 4s;
	}

	25% {
		transform: translateX(1%);
		transition: 4s;
	}

	50% {
		transform: translateX(-1%);
		transition: 4s;
	}

	75% {
		transform: translateX(1%);
		transition: 4s;
	}

	100% {
		transform: translateX(2%);
		transition: 4s;
		opacity: 1;
	}
}

@keyframes inT {
	0% {
		transform: translateY(8%);
		transition: 4s;
		margin-left: 0rem;
	}

	25% {
		transform: translateY(1%);
		transition: 4s;
	}

	50% {
		transform: translateY(0%);
		transition: 4s;
		width: 50%;
	}

	75% {
		transform: translateY(1%);
		transition: 4s;
	}

	100% {
		transform: translateY(8%);
		width: 100%;
		transition: 4s;
		opacity: 1;
	}
}

@-webkit-keyframes inT {
	0% {
		transform: translateY(8%);
		transition: 4s;
		margin-left: 0rem;
	}

	25% {
		transform: translateY(1%);
		transition: 4s;
	}

	50% {
		transform: translateY(0%);
		transition: 4s;
		width: 50%;
	}

	75% {
		transform: translateY(1%);
		transition: 4s;
	}

	100% {
		transform: translateY(8%);
		width: 100%;
		transition: 4s;
		opacity: 1;
	}
}

@keyframes homeT {
	0% {
		transform: translateY(-8%);
		transition: 4s;
		margin-left: 0rem;
	}

	25% {
		transform: translateY(-1%) translateX(-3%);
		transition: 4s;
	}

	50% {
		transform: translateY(0%) translateX(0%);
		transition: 4s;
		width: 50%;
	}

	75% {
		transform: translateY(-1%) translateX(-3%);
		transition: 4s;
	}

	100% {
		transform: translateY(-8%);
		width: 100%;
		transition: 4s;
		opacity: 1;
	}
}

@-webkit-keyframes homeT {
	0% {
		transform: translateY(-8%);
		transition: 4s;
		margin-left: 0rem;
	}

	25% {
		transform: translateY(-1%) translateX(-3%);
		transition: 4s;
	}

	50% {
		transform: translateY(0%) translateX(0%);
		transition: 4s;
		width: 50%;
	}

	75% {
		transform: translateY(-1%) translateX(-3%);
		transition: 4s;
	}

	100% {
		transform: translateY(-8%);
		width: 100%;
		transition: 4s;
		opacity: 1;
	}
}



/*@media screen and (max-width: 2560px), screen and (max-height: 1200px) {*/

/*	.heart-img {*/
/*		width: 100vw;*/
/*		height: 172vh;*/
/*	}*/

/*	.nav-image > img {*/
/*		padding-left: 30rem;*/
/*	}*/

/*	span.love {*/
/*		left: 6rem;*/
/*		top: 4.4rem;*/
/*	}*/

/*	.love_line1 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 100%;*/
/*		background-color: #fff;*/
/*		left: -5rem;*/
/*		bottom: -1rem;*/
/*	}*/

/*	.love_line2 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 100%;*/
/*		background-color: #fff;*/
/*		left: -6rem;*/
/*		bottom: 2rem;*/
/*	}*/

/*	.love_line3 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 100%;*/
/*		background-color: #fff;*/
/*		left: -6rem;*/
/*		bottom: 5rem;*/
/*	}*/

/*	span.being {*/
/*		left: 5.6rem;*/
/*		top: 6.4rem;*/
/*	}*/

/*	.love_line4 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 84%;*/
/*		background-color: #fff;*/
/*		left: -8rem;*/
/*		bottom: -8rem;*/
/*	}*/

/*	.love_line5 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 84%;*/
/*		background-color: #fff;*/
/*		left: -7rem;*/
/*		bottom: -4rem;*/
/*	}*/

/*	span.in {*/
/*		left: 5.6rem;*/
/*		top: 8.4rem;*/
/*	}*/

/*	.love_line6 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 84%;*/
/*		background-color: #fff;*/
/*		left: -8rem;*/
/*		bottom: -12rem;*/
/*	}*/

/*	.love_line7 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 88.5%;*/
/*		background-color: #fff;*/
/*		left: -14rem;*/
/*		bottom: -18rem;*/
/*	}*/

/*	.top-right-bottom > p {*/
/*		right: 18rem;*/
/*	}*/

/*	.love_line8 {*/
/*		position: absolute;*/
/*		height: 1px;*/
/*		width: 94%;*/
/*		background-color: #fff;*/
/*		left: -13rem;*/
/*		bottom: -19rem;*/
/*	}*/

/*	#five, #six, #seven, #eight, #nine, #ten, #ele {*/
/*		padding: 4rem;*/
/*		margin-bottom: 30rem;*/
/*	}*/

/*	img#my_image10, img#view_img10 {*/
/*		position: absolute;*/
/*		width: 80%;*/
/*		top: 96rem;*/
/*		left: 33rem;*/
/*	}*/

/*	img#my_image11, img#view_img11 {*/
/*		position: absolute;*/
/*		width: 80%;*/
/*		top: 95rem;*/
/*		left: 60rem;*/
/*	}*/

/*}*/


/*@media screen and (max-width: 1880px) {*/

/*    .love_line1 {*/
/*        bottom: -15rem;*/
/*    }*/

/*    .love_line2 {*/
/*        left: -6rem;*/
/*        bottom: -11rem;*/
/*    }*/

/*    .love_line3 {*/
/*        left: -6rem;*/
/*        bottom: -10rem;*/
/*    }*/

/*    .love_line4 {*/
/*        left: -6rem;*/
/*        bottom: -24rem;*/
/*    }*/

/*    .love_line5 {*/
/*        left: -6rem;*/
/*        bottom: -20rem;*/
/*    }*/

/*    .love_line6 {*/
/*        left: -4rem;*/
/*        bottom: -31rem;*/
/*    }*/

/*    .love_line7 {*/
/*        left: -6rem;*/
/*        bottom: -33rem;*/
/*    }*/

/*    .love_line8 {*/
/*        bottom: -34rem;*/
/*    }*/

/*}*/



@media screen and (min-width: 1281px) and (max-width: 1350px) { 
    /* STYLES HERE */
    
    .top-right-bottom > img:nth-child(1) {
    height: 60%;
    top: 18rem !important;
    left: -5%;
}

.top-right-bottom > img:nth-child(2) {
    height: 60%;
    top: 25rem !important;
    left: -2%;
}
.top-right-bottom > img:nth-child(3) {
    height: 60%;
    top: 32rem !important;
    left: -12%;
}
.top-right-bottom > img:nth-child(4) {
    height: 60%;
    top: 33rem !important;
    left: -2%;
}
}



@media screen and (max-width: 1440px){
	/* , screen and (max-height: 633px)  */

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		/*height: 185vh;*/
		height: 135vh;
	}

	.swiper-slide>h6 {
		/*left: 33rem;*/
		/*left: 5rem;*/
		/*font-size: 5rem;*/
		font-size: 42px;
	}

	/*.nav-image > img {*/
	/*padding-left: 16rem;*/
	/*       width: 20%;*/
	/*   }*/

.top-right-bottom > img:nth-child(1) {
    height: 60%;
    top: 11rem;
    left: 0%;
}
.top-right-bottom > img:nth-child(2) {
    height: 60%;
    top: 20rem;
    left: 2%;
}
.top-right-bottom > img:nth-child(3) {
    height: 60%;
    top: 28rem;
    left: -6%;
}
.top-right-bottom > img:nth-child(4) {
    height: 60%;
    top: 28rem;
    left: 2%;
}


	.menus {
		height: 150vh;
	}

	.nav-image>p {
		margin-left: -12rem;
	}

	.top-right-bottom>h1 {
		position: relative;
	}

	.menu-items {
		width: 100%;
		height: 100%;
	}

	.menus-top>img {
		margin-left: 7rem;
	}

	.in_menus {
		left: 22rem;
	}

	.nav-image>img {
		padding-left: 4rem;
		width: 13%;
	}

	.open-menu {
		margin-right: 10rem;
	}

	.linkss {
		margin-top: 25rem;
	}

	.top-right-bottom>p.home-off {
		max-width: 12vw;
		top: 42rem;
		right: 7rem;
	}

	.hero_slider {
		height: 100vh;
		width: 100%;
	}
	.footer-right {
    /* display: flex; */
    padding-top: 43px;
    align-items: end;
    padding-left: 50px;
    justify-content: end;
}
.linkss>a {
    margin-bottom: 2rem;
    text-decoration: none;
    font-size: 1.5rem;
    text-transform: uppercase;
    transition: .3s ease-out;
    letter-spacing: 0.7px;
    transform-origin: left;
    /* transform: translateX(-15rem); */
    display: flex;
    align-items: center;
}

	/*.quote {*/
	/*	top: 35%;*/
	/*}*/
	/* .top-right-bottom>p {
		max-width: 9vw;
		top: 40rem;
		right: 10rem;
	} */

	.second-sec {
		max-width: 70%;
		width: 70%;
	}

	.a-line {
		height: 65%;
	}

	.residental h1 {
		font-size: 4rem;
	}

	.fourth-sec {
		max-width: 70%;
		width: 70%;
	}

	.commercial>h1 {
		font-size: 4rem;
	}

	.an-line {
		right: -8rem;
		bottom: 30rem;
	}

	img#my_image10,
	img#my_image11 {
		top: 70rem;
	}

	img#view_img10,
	img#view_img11 {
		top: 70rem;
	}

	.love_line1 {
		position: absolute;
		height: 2px;
		width: 100%;
		background-color: #fff;
		/*left: -12rem;*/
		/*bottom: -24rem;*/
		/*top: 40rem;*/
		/*      right: 10rem;*/
		bottom: 38.3rem;
		left: -9rem;
	}

	.love_line2 {
		position: absolute;
		height: 2px;
		width: 100%;
		background-color: #fff;
		/*left: -11.5rem;*/
		/*bottom: -21rem;*/
		left: -7rem;
		bottom: 21rem;
	}

	.love_line3 {
		position: absolute;
		height: 1px;
		width: 100%;
		background-color: #fff;
		/*left: -11.5rem;*/
		/*bottom: -19rem;*/
		left: -8rem;
		bottom: 33rem;
	}

	.love_line4 {
		position: absolute;
		height: 2px;
		width: 100%;
		background-color: #fff;
		/*left: -11.5rem;*/
		/*bottom: -32rem;*/
		left: -8rem;
		bottom: 30rem;
	}

	.love_line5 {
		position: absolute;
		height: 1px;
		width: 100%;
		background-color: #fff;
		/*left: -11.5rem;*/
		/*bottom: -29rem;*/
		left: -8rem;
		bottom: 25rem;
	}

	.love_line6 {
		position: absolute;
		height: 2px;
		width: 100%;
		background-color: #fff;
		/*left: -11.5rem;*/
		/*   bottom: -42rem;*/
		left: -9rem;
		bottom: 14rem;
	}

	.love_line7 {
		position: absolute;
		height: 1px;
		width: 88.5%;
		background-color: #fff;
		/*left: -15rem;*/
		/*bottom: -40rem;*/
		left: -7rem;
		bottom: 11rem;
	}

	.love_line8 {
		position: absolute;
		height: 2px;
		width: 94%;
		background-color: #fff;
		/*left: -11.5rem;*/
		/*bottom: -44rem;*/
		left: -8rem;
		bottom: 11rem;
	}

	div#one::after {
		content: '';
		position: absolute;
		top: 5rem;
		left: 6.8rem;
	}

	div#two::after {
		left: 6.8rem;
		top: 11rem;
	}

	div#three::after {
		left: 6.8rem;
		top: 17rem;
	}

	div#four::after {
		left: 6.8rem;
		top: 23rem;
	}

	div#five::after {
		left: 6.8rem;
	}

	div#six::after {
		left: 6.8rem;
		top: 12rem;
	}

	div#seven::after {
		left: 6.8rem;
		top: 19rem;
	}

	div#eight::after {
		left: 6.8rem;
		top: 26rem;
	}

	div#nine::after {
		left: 6.8rem;
		top: 33rem;
	}

	div#ten::after {
		left: 6.8rem;
		top: 40rem;
	}

	div#ele::after {
		left: 6.8rem;
		top: 47rem;
	}

}

@media screen and (max-width: 1366px),
screen and (max-height: 768px) {
	.swiper-slide>h6 {
		/*left: 25rem;*/
		font-size: 5rem;
		/* transform: scale(4); */
	}

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 185vh;
		margin-left: 0;
		background-size: 50%;
	}

	.getcote-2 {
		width: 15%;
		right: -5.7%;
	}

	.getcote-2>p {
		font-size: 1.5rem;
	}

	.nav-image>img {
		width: 12%;
	}

	/*div#one::after {*/
	/*	top: 5rem;*/
	/*	left: 6.4rem;*/
	/*}*/

	/*div#two::after {*/
	/*	left: 6.4rem;*/
	/*}*/

	/*div#three::after {*/
	/*	left: 6.4rem;*/
	/*}*/

	/*div#four::after {*/
	/*	left: 6.4rem;*/
	/*}*/
	div#one::after {
    top: 5rem;
    left: 6rem;
}
div#two::after {
    left: 6rem;
    top: 10rem;
}
div#three::after {
    left: 6rem;
    top: 15rem;
}
div#four::after {
    left: 6rem;
    top: 21rem;
}

	div#five::after {
		left: 6rem;
		top: 5rem;
	}

	div#six::after {
		left: 6rem;
		top: 11rem;
	}

	div#seven::after {
		left: 6rem;
		top: 18rem;
	}

	div#eight::after {
		left: 6rem;
		    top: 24rem;
	}

	div#nine::after {
		left: 6rem;
		top: 30rem;
	}

	div#ten::after {
		left: 6rem;
		    top: 37rem;
	}

	div#ele::after {
		left: 6rem;
		top: 43rem;
	}

	.love_line1 {
		bottom: 34rem;
		left: -8rem;
	}

	.love_line2 {
		left: -8rem;
		bottom: 14rem;
	}

	.love_line3 {
		left: -3rem;
		bottom: 13rem;
	}

	.love_line4 {
		left: 1rem;
		bottom: 13rem;
	}

	.love_line5 {
		left: -8rem;
		bottom: 31rem;
	}

	.love_line6 {
		left: -8rem;
		bottom: 21rem;
	}

	.love_line7 {
		left: -11rem;
		bottom: 24rem;
	}

	.love_line8 {
		left: -14rem;
		bottom: 29rem;
	}

	.top-right-bottom>p {
		max-width: 9vw;
		top: 44rem;
		right: 9rem;
	}


}
@media screen and (max-width: 1366px){
.accordion h5 {
    color: #fff;
    font-size: 1.1rem;
    width: 65%;
}
}
@media screen and (max-width: 1326px),
screen and (max-height: 600px) {

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 175vh;
	}

	.menu-items {
		width: 100%;
		height: 100%;
	}

	.menus-top>img {
		margin-left: 7rem;
	}

	.in_menus {
		left: 22rem;
	}

	.nav-image>img {
		padding-left: 4rem;
	}

	.open-menu {
		margin-right: 10rem;
	}

	.linkss {
		margin-top: 25rem;
	}

	.top-right-bottom>p {
		max-width: 9vw;
		/*top: 58rem;*/
		right: 13rem;
	}

	.second-sec {
		max-width: 70%;
		width: 70%;
	}

	.a-line {
		height: 65%;
	}

	.residental h1 {
		font-size: 4rem;
	}

	.fourth-sec {
		max-width: 70%;
		width: 70%;
	}

	.commercial>h1 {
		font-size: 4rem;
	}

	.an-line {
		right: -8rem;
		bottom: 30rem;
	}

	img#my_image10,
	img#my_image11 {
		top: 70rem;
	}

	img#view_img10,
	img#view_img11 {
		top: 70rem;
	}

}

@media screen and (max-width: 1326px),
screen and (max-height: 550px) {

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 175vh;
	}

	.menus {
		height: 180vh;
		overflow: visible;
	}

	.inner-menus-2 {
		width: 30vw;
	}

	.menu-items {
		width: 100%;
		height: 100%;
	}

	.menus-top>img {
		margin-left: 7rem;
	}

	.in_menus {
		left: 22rem;
	}

	.nav-image>img {
		padding-left: 4rem;
	}

	.open-menu {
		margin-right: 10rem;
	}

	.linkss {
		margin-top: 25rem;
	}

	.top-right-bottom>p {
		max-width: 9vw;
		top: 58rem;
		right: 13rem;
	}

	.second-sec {
		max-width: 70%;
		width: 70%;
	}

	.a-line {
		height: 65%;
	}

	.residental h1 {
		font-size: 4rem;
	}

	.fourth-sec {
		max-width: 70%;
		width: 70%;
	}

	.commercial>h1 {
		font-size: 4rem;
	}

	.an-line {
		right: -8rem;
		bottom: 30rem;
	}

	img#my_image10,
	img#my_image11 {
		top: 65rem;
	}

	img#view_img10,
	img#view_img11 {
		top: 65rem;
	}

}



@media screen and (max-width: 1280px) {
	p#home-off {
		top: 50rem;
		right: 6rem;
		max-width: 12vw;
	}
	


.love_line1 {
    bottom: 46rem;
    left: -8rem;
}


.love_line2 {
    left: -7rem;
    bottom: 43rem;
}


.love_line3 {
    left: -7rem;
    bottom: 45rem;
}

.love_line4 {
    left: -7rem;
    bottom: 38rem;
}

.love_line5 {
    left: -7rem;
    bottom: 36rem;
}

.love_line6 {
    left: -8rem;
    bottom: 26rem;
}

.love_line7 {
    left: -10rem;
    bottom: 23rem;
}

.love_line8 {
    left: -6rem;
    bottom: 23rem;
}
.top-left-image img{
    width: 85%;
}
	.tabcontentes {
    float: left;
    padding: 0px 12px;
    border: 1px solid #ccc;
    width: 80%;
    /* border-left: none; */
    color: var(--tertiary-color);
    height: 150vh !important;
}

.footer-right {
    
    padding-top: 16px;
    
}

.top-right-bottom > img:nth-child(1) {
    height: 80%;
    top: 11rem;
    left: -9%;
}
.top-right-bottom > img:nth-child(2) {
    height: 75%;
    top: 20rem;
    left: -5%;
}

.top-right-bottom > img:nth-child(3) {
    height: 79%;
    top: 30rem;
    left: -21%;
}
.top-right-bottom > img:nth-child(4) {
    height: 80%;
    top: 29rem;
    left: -5%;
}


.five>img {
    width: 100%;
    height: auto;
    padding-bottom: 1rem;
}
.five{
    width: 100%;
    height: auto;
   
}
.six {
    width: 100%;
    height: auto;
}
.seven{
     width: 100%;
    height: auto;
}
.nine{
     width: 100%;
    height: auto;
}

.eight{
     width: 100%;
    height: auto;
}

.ten{
     width: 100%;
    height: auto;
}

.ele{
     width: 100%;
    height: auto;
}
.swiper-slide>h6 {
    /*left: 3rem;*/
    font-size: 5rem;
    /* transform: scale(4); */
}


	.top-right-bottom>h1 {
		font-size: 8rem;
		/*transform: scale(1);*/
		text-transform: uppercase;
		color: var(--tertiary-color);
		padding-left: 0;
		padding-top: 0rem;
		position: relative;
	}
}


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

	.hero_slider {
		height: 100%;
		width: 100%;
	}
	
	.linkss {
    margin-top: 17rem;
}

	.swiper-slide>h6 {
		/*left: 5rem;*/
	font-size: 35px;
	}
	
	.top-right-bottom>h1 {
        font-size: 7rem;
        /*transform: scale(1);*/
	}
	.tabcontentes {
    float: left;
    padding: 0px 12px;
    border: 1px solid #ccc;
    width: 80%;
    /* border-left: none; */
    color: var(--tertiary-color);
    height: 100vh !important;
}
.social {
   
    padding-top: 3rem;
}
.question h5 {
    padding-right: 55px;
    
}

.linkss>a {
    margin-bottom: 1.5rem;
    
    font-size: 1rem;
    text-transform: uppercase;
 
}

.footer-left>h2 {
   
    font-size: 1.2rem;
}
.top-right-bottom > img:nth-child(1) {
    height: 65%;
    top: 11rem;
    left: -15%;
}
.top-right-bottom > img:nth-child(2) {
    height: 60%;
    top: 18rem;
    left: -11%;
}
.top-right-bottom > img:nth-child(3) {
    height: 60%;
    top: 25rem;
    left: -20%;
}
.top-right-bottom > img:nth-child(4) {
    height: 60%;
    top: 25rem;
    left: -10%;
}


	.heart-img2 {
		background-size: 57%;
	}
	
	#offerings {
    padding-right: 10%;
    padding-left: 10%;
    }
    .top-left-image {
    width: 60%;
    padding-left: 30px;
}
	
	.blue-img img {
    width: 95%;
    }

    #blue-space h1 {
    font-size: 3rem;
    margin-left: 100px;
    }
	.second-sec>p {
    font-size: 1.9rem;
    letter-spacing: 0px;
    padding-bottom: 70px;
    line-height: 1.3em;
    color: var(--tertiary-color);
    text-align: left;
}

.accordion h2.Ress {
   
    width: 45%;
}
.accordion h2.Off {
 
    width: 45%;
}
.accordion h2.Comm {
    
    width: 45%;
}
.accordion h2.Con {
    
    width: 45%;
}
.Kitchen {
    
    padding-right: 40px;
}
.mid_p {
    
    overflow: scroll;
    justify-content: space-between;
}

.notification-container {
position: absolute;
top:10rem;
right: 0;
width:360px;
display: none;
/*height: 50%;*/
height: auto;
overflow: hidden;
background: #acac78;
z-index: 9999;
transform: translateX(100%);
-webkit-transform: translateX(100%);
}

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 40vh;
		margin-left: 2rem;
	}
	
	.tabcontentes {
   
    height: 120vh !important;
}

	.top-right-bottom>p {
		max-width: 16vw;
		/*top: 45rem;*/
		right: 8rem;
	}
	
	p#home-off {
        /*top: 50rem;*/
        top: 42rem;
    left: 48rem;
    }

	.top-right {
		width: 40%;
	}

	.top-left-image {
		width: 60%;
	}

	.getcote-2 {
		width: 19%;
		right: -6.4%;
	}

	div#one::after {
		top: 4.2rem;
		left: 4.5rem;
	}

	div#two::after {
		left: 4.5rem;
		top: 8rem;
	}

	div#three::after {
		left: 4.5rem;
		top: 13rem;
	}

	div#four::after {
		left: 4.5rem;
		top: 17rem;
	}

	div#five::after {
		left: 4.5rem;
		top: 4.3rem;
	}

	div#six::after {
		left: 4.5rem;
		top: 9rem;
	}

	div#seven::after {
		left: 4.5rem;
		top: 14rem;
	}

	div#eight::after {
		left: 4.5rem;
		top: 20rem;
	}

	div#nine::after {
		left: 4.5rem;
		top: 25rem;
	}

	div#ten::after {
		left: 4.5rem;
		top: 30rem;
	}

	div#ele::after {
		left: 4.5rem;
		top: 36rem;
	}

	.second-sec {
		/*max-width: 70%;*/
		/*width: 70%;*/
		max-width: 85%;
		width: 85%;
		padding-bottom: 0;
	}

	.container>h1 {
		font-size: 3rem;
	}
	
	

	.commercial>h1 {
		font-size: 3rem;
	}

	.residental h1 {
		font-size: 3rem;
	}

	.love_line1 {
		bottom: 38rem;
		left: -13rem;
	}

	.love_line2 {
		left: -12rem;
		bottom: 34rem;
	}

	.love_line3 {
		left: -12rem;
		bottom: 36rem;
	}

	.love_line4 {
		left: -12rem;
		bottom: 30rem;
	}

	.love_line5 {
		left: -12rem;
		bottom: 27rem;
	}

	.love_line6 {
		left: -12rem;
		bottom: 25rem;
	}

	.love_line7 {
		left: -13rem;
		bottom: 17rem;
	}

	.love_line8 {
		left: -8rem;
		bottom: 15rem;
	}

	.container {
		width: 90%;
		margin: 0 auto;
		padding: 4rem 0;
		max-width: 90%;
	}
	
	footer {
    display: flex;
    justify-content: space-between;
    padding: 0 5rem 5rem;
}

footer {
    align-items: flex-end;
    justify-content: space-between;
}

.footer-right {
    /*display: flex;*/
    /*align-items: end;*/
    justify-content: end;
        /*height: auto;*/
}

	/* .love_line1 {
		bottom: 115rem;
		left: -13rem;
	}

	.love_line2 {
		left: -12rem;
		bottom: 111rem;
	}

	.love_line3 {
		left: -12rem;
		bottom: 113rem;
	}

	.love_line4 {
		left: -12rem;
		bottom: 106rem;
	}

	.love_line5 {
		left: -12rem;
		bottom: 103rem;
	}

	.love_line6 {
		left: -12rem;
		bottom: 102rem;
	}

	.love_line7 {
		left: -12rem;
		bottom: 94rem;
	}

	.love_line8 {
		left: -7rem;
		bottom: 93rem;
	} */

}

@media only screen and (max-width: 834px) {
	.love_line1 {
		bottom: 41rem;
		left: -10rem;
	}

	.love_line2 {
		left: -9.5rem;
		bottom: 36rem;
	}

	.love_line3 {
		left: -10rem;
		bottom: 39rem;
	}

	.love_line4 {
		left: -9.4rem;
		bottom: 32rem;
	}

	.love_line5 {
		left: -9.4rem;
		bottom: 30rem;
	}

	.love_line6 {
		left: -9.7rem;
		bottom: 28rem;
	}

	.love_line7 {
		left: -9.6rem;
		bottom: 20rem;
	}

	.love_line8 {
		left: -6rem;
		bottom: 19rem;
	}

	p#home-off {
		top: 45rem;
		right: 2rem;
		max-width: 20vw;
	}

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 45vh;
		margin-left: 2rem;
	}

	.top-right-bottom>h1 {
		margin-left: 0rem;
	}

	.swiper-slide>h6 {
		/*left: 11rem;*/
		font-size: 3rem;
	}

	.view-img1,
	.view_img2,
	.view_img3,
	.view_img4,
	.view-img5,
	.view_img6,
	.view_img7,
	.view_img8,
	.view_img10,
	.view_img11,
	.view_img9 {
		width: 100%;
	}

	img#my_image,
	img#my_image2,
	img#my_image3,
	img#my_image4,
	img#my_image5,
	img#my_image6,
	img#my_image7,
	img#my_image8,
	img#my_image10,
	img#my_image11,
	img#my_image9 {
		width: 100%;
	}

	.container>h1 {
		font-size: 2.5rem;
		padding-bottom: 1rem;
	}

	.residental h1 {
		font-size: 2.5rem;
	}

	div#one::after {
		top: 4rem;
		left: 3.7rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--secondary-color-1);
	}

	div#two::after {
		left: 3.7rem;
		top: 8rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-2);
	}

	div#three::after {
		left: 3.7rem;
		top: 12rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-3);
	}

	div#four::after {
		left: 3.7rem;
		top: 16rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-7);
	}

	.commercial>h1 {
		font-size: 2.5rem;
	}

	div#five::after {
		left: 3.7rem;
		top: 4.3rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-5);
	}

	div#six::after {
		left: 3.7rem;
		top: 9rem;
		border-top: 15x solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-6);
	}

	div#seven::after {
		left: 3.7rem;
		top: 14rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-7);
	}

	div#eight::after {
		left: 3.7rem;
		top: 20rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-8);
	}

	div#nine::after {
		left: 3.7rem;
		top: 25rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-9);
	}

	div#ten::after {
		left: 3.7rem;
		top: 30rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-10);
	}

	div#ele::after {
		left: 3.7rem;
		top: 36rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-5);
	}

	.getcote-2 {
		width: 23%;
		right: -7.9%;
	}

	.hamB {
		position: relative;
		right: 9rem;
		top: 2rem;
	}

	.nav-image>img {
		width: 20%;
	}

}


@media only screen and (max-width: 810px) {
	.swiper-slide>h6 {
		/*left: 11rem;*/
	font-size: 28px;
		top: 85%;
	}
}

@media only screen and (max-width: 768px) {

	.linked>a {
		font-size: 1.2rem;
	}

	.in_menus>a {
		font-size: 1.2rem;
	}

	.in_menus {
		left: 12rem;
		top: 8rem;
	}

	.inner-menus {
		left: 10rem;
		top: 0rem;
		width: 50vw;
	}

	.inner-menus>a {
		font-size: 1.2rem;
	}

	.inner-menus-2 {
		left: 10rem;
		top: 2.5rem;
		width: 50vw;
	}

	a.commercial::before {
		left: 8rem;
		top: 0;
	}

	.inner-menus-2>a {
		font-size: 1.2rem;
	}

	a.residental::before {
		left: 8rem;
		top: 0;
	}

	.nav-image>img {
		padding-left: 4rem;
		width: 25%;
	}
	
	
	.footer-right>.linkss {
	    display:none;
	}
	.accordion h5 {
    
    display: none;
}
	
	
	.top-right-bottom > img:nth-child(1) {
    height: 45%;
    top: 11rem;
    left: -15%;
}
.top-right-bottom > img:nth-child(2) {
    height: 45%;
    top: 15rem;
    left: -12%;
}
.top-right-bottom > img:nth-child(3) {
    height: 45%;
    top: 19rem;
    left: -20%;
}
.top-right-bottom > img:nth-child(4) {
    height: 45%;
    top: 19rem;
    left: -10%;
}

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 65vh;
		/* margin-left: -18rem; */
	}
	.accordion h2.Ress {
   
    width: 65%;
}
.accordion h2.Off {
 
    width: 65%;
}
.accordion h2.Comm {
    
    width: 80%;
}
.accordion h2.Con {
    
    width: 65%;
}

	.top-right-text {
		text-align: center;
		margin-left: -4rem;
	}
	.notification-container {
    position: absolute;
    top: 5rem;
    right: 0;
    width: 360px;
    display: none;
    /*height: 55%;*/
    height:auto;
    overflow: hidden;
    background: #acac78;
    z-index: 9999;
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
}
	
/*	.quote {*/
/*    width: 346px;*/
/*    height: 560px;*/
/*    background: var(--tertiary-color);*/
/*    border-radius: 10px;*/
/*    top: 20%;*/
    /* transform: translateY(-200%); */
/*    right: 5rem;*/
/*    position: absolute;*/
/*    z-index: 10;*/
/*    transition: all .8s;*/
/*}*/
	

	.top-right-bottom>h1 {
		/*position: relative;*/
		/* padding-left: 6rem; */
		/*padding-top: 1rem;*/
		/*font-size: 1.5rem;*/
		position: relative;
    padding-left: 0rem;
    padding-top: 0rem;
    font-size: 4.5rem;
	}

	p#home-off {
		max-width: 20vw;
		top: 35rem;
		right: 3rem;
	}

	.getcote-2 {
		width: 24%;
		right: -8%;
	}

	.love_line1,
	.love_line2,
	.love_line3,
	.love_line5,
	.love_line4,
	.love_line6,
	.love_line7,
	.love_line8 {
		display: none;
	}
	
	
	#blue-space h1 {
    font-size: 2rem;
    margin-left: 100px;
}

	.linkss {
		margin-top: 10rem;
		margin-left: -2rem;
	}

	.second-sec>p {
		font-size: 2rem;
	}

	.residental h1 {
		font-size: 3rem;
		margin-left: 0;
	}

	.residental-tabs {
		padding-top: 3rem;
		margin: 0 auto;
		width: 95%;
	}

	.one,
	.two,
	.three,
	.four,
	.five,
	.six,
	.seven,
	.eight,
	.nine,
	.ten,
	.ele {
		width: 100%;
		/*height: 30vh;*/
		height:auto;
		margin-left: 0;
		margin-top: 2rem;
	}

	#one,
	#two,
	#three,
	#four,
	#five,
	#six,
	#seven,
	#eight,
	#nine,
	#ten,
	#ele {
		padding: 1rem;
	}

	div#one::after {
		top: 3.7rem;
		left: 3.6rem;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--secondary-color-1);
	}

	div#two::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-2);
		left: 3.6rem;
		top: 7rem;
	}

	div#three::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-3);
		left: 3.6rem;
		top: 10.5rem;
	}

	div#four::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-7);
		left: 3.6rem;
		top: 14rem;
	}

	div#five::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-5);
		left: 3.6rem;
	}

	div#six::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-6);
		left: 3.6rem;
	}

	div#seven::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-7);
		left: 3.6rem;
		top: 12.5rem;
	}

	div#eight::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-8);
		left: 3.6rem;
		top: 17rem;
	}

	div#nine::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-9);
		left: 3.6rem;
		top: 21rem;
	}

	div#ten::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-10);
		left: 3.6rem;
		top: 25rem;
	}

	div#ele::after {
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
		border-right: 15px solid var(--icon-color-5);
		left: 3.6rem;
		top: 30rem;
	}

	#ele>p {
		width: 100%;
	}

	#six>p {
		width: 100%;
	}

	#seven>p {
		width: 100%;
	}

	#eight>p {
		width: 100%;
	}

	#nine>p {
		width: 100%;
	}

	#ten>p {
		width: 100%;
	}

	#one>p {
		width: 100%;
	}

	#two>p {
		width: 100%;
	}

	#three>p {
		width: 100%;
	}

	#four>p {
		width: 100%;
	}

	#one>h3 {
		font-size: 2.5rem;
	}

	#one>h5 {
		font-size: 2rem;
	}

	#one>.line1 {
		width: 75%;
		height: 2px;
	}

	#two>h3 {
		font-size: 2.5rem;
	}

	#two>h5 {
		font-size: 2rem;
	}

	#two>.line2 {
		width: 75%;
		height: 2px;
	}

	#three>h3 {
		font-size: 2.5rem;
	}

	#three>h5 {
		font-size: 2rem;
	}

	#three>.line3 {
		width: 75%;
		height: 2px;
	}

	#four>h3 {
		font-size: 2.5rem;
	}

	#four>h5 {
		font-size: 2rem;
	}

	#four>.line4 {
		width: 75%;
		height: 2px;
	}

	#five>h3 {
		font-size: 2.5rem;
	}

	#five>h5 {
		font-size: 2rem;
	}

	#five>.line5 {
		width: 75%;
		height: 2px;
	}

	#six>h3 {
		font-size: 2.5rem;
	}

	#six>h5 {
		font-size: 2rem;
	}

	#six>.line6 {
		width: 75%;
		height: 2px;
	}

	#seven>h3 {
		font-size: 2.5rem;
	}

	#seven>h5 {
		font-size: 2rem;
	}

	#seven>.line7 {
		width: 75%;
		height: 2px;
	}

	#eight>h3 {
		font-size: 2.5rem;
	}

	#eight>h5 {
		font-size: 1.5rem;
	}

	#eight>.line8 {
		width: 75%;
		height: 2px;
	}

	#nine>h3 {
		font-size: 2.5rem;
	}

	#nine>h5 {
		font-size: 2rem;
	}

	#nine>.line9 {
		width: 75%;
		height: 2px;
	}

	#ten>h3 {
		font-size: 2.5rem;
	}

	#ten>h5 {
		font-size: 2rem;
	}

	#ten>.line10 {
		width: 75%;
		height: 2px;
	}

	.ten {
		width: 100%;
		height: 35vh;
		margin-left: 0;
		margin-top: 2rem;
	}

	#ele>h3 {
		font-size: 2.5rem;
	}

	#ele>h5 {
		font-size: 2rem;
	}

	#ele>.line11 {
		width: 75%;
		height: 2px;
	}

	.fourth-sec>p {
		font-size: 2rem;
	}

	.commercial>h1 {
		font-size: 2.5rem;
		margin-left: 0;
	}

	.residental-tabses {
		width: 95%;
	}

	img#my_image10,
	img#view_img10 {
		position: revert;
	}

	img#my_image11,
	img#view_img11 {
		top: 47rem;
		left: 11rem;
	}

	#five,
	#six,
	#seven,
	#eight,
	#nine,
	#ten,
	#ele {
		margin-bottom: 14rem;
	}

	.subscribe>input[type="email"] {
		width: 80%;
	}

	footer {
		padding: 0 3rem 3rem;
    display: flex;
    flex-flow: column;
    align-items: baseline;
	}
	.footer-right {
	    	padding: 0;
	}

	.footer-left>h2 {
		font-size: 1.5rem;
	}

	.footer-left>p:nth-child(6) {
		font-size: 1.2rem;
		padding-top: 1.5rem;
		padding-bottom: 1.5rem;
	}

	.copyright {
		padding: 1.5rem 3rem;
	}

}



@media only screen and (max-width: 428px) {

	.hamB {
		position: relative;
		right: 3rem;
		top: 0rem;
	}

	.nav-image>img {
		padding-left: 4rem;
		width: 30%;
	}

	.getcote-2 {
		width: 48%;
		right: -17%;
		top: 28rem;
	}
	.tabcontentes {
    height: auto !important;
}
.swiper-button-next, .swiper-button-prev{
    display:none;
}

	.swiper-slide>h6 {
		/*left: 2rem;*/
		font-size: 1.4rem;
		top: 80%;
	}
	
	.nav-image {
  
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-between;
    width: 90%;
    margin: 0 auto;
   
}
.top-right-bottom > img:nth-child(1) {
   width: 100%;
    top: -7rem;
    left: -13%;
    animation: none;
}
.top-right-bottom > img:nth-child(2) {
    width: 100vw;
    top: -4rem;
    left: -10%;
    animation: none;
}
.top-right-bottom > img:nth-child(3) {
   width: 100%;
    top: 1rem;
    left: -27%;
    animation: none;
}
.top-right-bottom > img:nth-child(4) {
   width: 107%;
    top: 0.8rem;
    left: -15%;
    animation: none;
}

.linkss {
    margin-top: 0rem;
 
}

.top-left-image {
    /* width: 100%; */
   margin-left: 25px;
    margin-right: auto;
    padding: 0;
    padding-top: 30px;
}
.top-left-image img {
    /* width: 85%; */
   width: auto;
    height: 200px;
}
.logo_block {
    margin-left: auto;
    margin-right: auto;
}
.logo_block > img {
    width: auto;
    height: 90px;
}
.dropdown-content {
    display: flex;
    /* position: absolute; */
    /* background-color: #f1f1f1; */
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 20%);
    width: 400px;
    z-index: 1;
}
.dropdown-content a {
    color: #fff;
    padding: 10px 5px;
    text-decoration: none;
    display: flex;
    font-family: helvetica;
    align-items: center;
    font-size: 14px;
    font-weight: 200;
}
a.Ress > img {
    margin-right: 5px;
    width: 20px;
}
a.Off > img {
    margin-right: 5px;
    width: 20px;
}
a.Comm > img {
    margin-right: 5px;
    width: 20px;
}
a.Con > img {
    margin-right: 5px;
    width: 20px;
}

	/*.quote {*/
	/*	right: 1rem;*/
	/*	    z-index: 99;*/
	/*}*/
	.footer-left>img {
    width: 70vw;
    padding-bottom: 2rem;
}

.footer-right>.linkss {
    margin-left: 1.2rem !important;
    border-bottom: 0;
}

.footer-right {
    /* display: flex; */
    padding-top: 43px;
    padding-left: 0;
}

.linkss > #contact  {
    margin-top: 10rem;
    margin-left: 1.5rem !important;
}
footer#contact {
    display: flex;
    flex-flow: column;
    /*align-items: center;*/
}

	.top {
		flex-direction: column;
	}

	.top-right {
		width: 100%;
	}
.linkss {
    margin-left: auto;
    margin-right: auto;
}
	
	.residental {
    /* margin: 0 auto; */
    margin: 90px auto;
    width: 77%;
    margin-bottom: -3rem;
}
.form-but {
    padding: 10px;
    /* background-color: #fff; */
    position: absolute;
    right: 0px;
    top: 25%;
    z-index: 99;
    font-size: 25px;
}
	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		/*height: 60vh;*/
		height: 50vh;
		-webkit-mask-size: 70vw;
		mask-size: 70vw;
		background-size: 100%;
		background-position: bottom bottom;
	}
	
	.fourth-sec {
    margin: 0 auto;
    max-width: 60%;
    width: 60%;
    padding-top: 0rem;
    padding-bottom: 0rem;
    overflow: hidden;
    position: relative;
}
	.top-right-text {
	text-align: center;
    margin-left: 2rem;
    padding-top: 7rem;
	}

	.top-right-bottom>h1 {
	    animation: none;
		margin-left: 3rem;
		font-size: 3rem;
	}
	
	.top-right-bottom>h1 span.being{
	     animation: none;
	}
	.top-right-bottom>h1 span.in{
	    animation: none;
	}
.top-right-bottom>h1 span.love {
    animation: none;
}

.accordion h5 {
    
    display: none;
}
.accordion > label {
    height: 75px;
}

	p#home-off {
		/*top: 63rem;*/
		/*right: 6rem;*/
		/*max-width: 40vw;*/
		    top: 53rem;
    right: 8rem;
        animation: none;
    max-width: 40vw;
	}

	
	.blue-img img {
    width: 77%;
    margin-left: 50px;
}
.social {
    padding-top: 0;
}
#offerings {
    padding-right: 2%;
    padding-left: 2%;
        padding-top: 55rem;
}
#blue-space h1 {
    font-size: 1rem;
    margin-left: 0px;
    padding-left: 10px;
    width: 60%;
}



	.container>h1 {
		font-size: 2rem;
		padding-bottom: 1rem;
		padding-top: 1rem;
		padding-right: 1rem;
	}

	.tab {
		width: 100%;
		display: flex;
	}

	#one,
	#two,
	#three,
	#four,
	#five,
	#six,
	#seven,
	#eight,
	#nine,
	#ten,
	#ele {
		padding: 1rem;
	}

	.tabcontent {
		width: 100%;
	}

	.commercial>h1 {
		font-size: 1.4rem;
		margin-left: -3rem;
		padding: 0.7rem;
	}

	.residental h1 {
		font-size: 1.6rem;
		padding: 0.7rem;
		margin-left: -3rem;
	}

	.second-sec {
		padding-top: 0;
		max-width: 75%;
		width: 75%;
	}

	.second-sec>p {
    font-size: 16px;
    text-align: left;
}

	.container {
		width: 100%;
		max-width: 100%;
	}

	.accordion {
		padding: 0px;
	}

	.mid_p {
		display: flex;
		flex-direction: column;
		margin-left: 1rem;
		padding: 1rem 0;
		line-height: 1.5;
	}

	.question h5 {
		font-size: 0.9rem;
		display: none;
	}

	.tabes {
		position: relative;
		display: flex;
		width: 100%;
	}

	.tabcontentes {
		width: 100%;
	}

	#five,
	#six,
	#seven,
	#eight,
	#nine,
	#ten,
	#ele {
		margin-bottom: 3rem;
	}

	footer {
		padding: 0 1rem 2rem;
	}

	.show {
		display: block;
		right: 0;
	}

	div#one::after {
		content: '';
		position: absolute;
		top: 8.8rem;
		left: 2rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-1);
	}

	div#two::after {
		content: '';
		position: absolute;
		top: 8.8rem;
		left: 9rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-2);
	}

	div#three::after {
		content: '';
		position: absolute;
		top: 8.8rem;
		left: 15rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-3);
	}


	div#four::after {
		content: '';
		position: absolute;
		top: 8.8rem;
		left: 21rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	div#five::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 1rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-5);
	}

	div#six::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 4.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-6);
	}

	div#seven::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 8rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	div#eight::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 12rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-8);
	}

	div#nine::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 15.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-9);
	}

	div#ten::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 19rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-10);
	}

	div#ele::after {
		content: '';
		position: absolute;
		top: 7rem;
		left: 22.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-11);
	}

	.footer-left>p:nth-child(8) {
		font-weight: 500;
	}

	.copyright {
		padding: 1.5rem;
	}

	.copyright>p {
		font-size: 1rem;
	}

	.copyright>a img {
		width: 5vw;
	}


}



/* Media-Query: 414 */
@media screen and (max-width: 414px) {

	html,
	body {
		position: relative;
		overflow-x: hidden;
	}

	.question h5 {
		font-size: 0.9rem;
		display: none;
	}
	.top-right-bottom > img:nth-child(1) {
   width: 100%;
    top: -3rem;
    left: -17%;
    animation: none;
}
.top-right-bottom > img:nth-child(2) {
     width: 100vw;
    top: 0rem;
    left: -14%;
    animation: none;
}
.top-right-bottom > img:nth-child(3) {
       width: 100%;
    top: 4rem;
    left: -31%;
    animation: none;
}
.top-right-bottom > img:nth-child(4) {
      width: 107%;
    top: 55px;
    left: -19%;
    animation: none;
}
.linkss {
    margin-top: 0rem;
   
}

	
#residential {
    padding-top: 60px;
}
#offerings {
    padding-right: 2%;
    padding-left: 2%;
    padding-top: 45rem;
}

	.hero_slider {
		height: fit-content;
		width: 100%;
		margin-top: 0rem;
	}

	.nav-image>img {
		padding-left: 2rem;
		width: 30%;
	}

	.open-menu {
		margin-right: 4rem;
	}

	.swiper-slide>img {
		height: 100%;
		width: 100%;
		position: relative;
		object-fit: cover;
	}

	/* .swiper-slide>h6 {
		left: 7rem;
		top: 80%;
		font-size: 2rem;
	} */

	.swiper-slide>h6 {
		/*left: 4rem;*/
		top: 80%;
		font-size: 1.7rem;
	}

	.getcote-2 {
		overflow: hidden;
		width: 35%;
		right: -11%;
		top: 60%;
	}

	.mid_p {
		display: flex;
		flex-direction: column;
		margin-left: 1rem;
		padding: 1rem 0;
		line-height: 1.5;
	}

	/*.quote {*/
	/*	right: 7px;*/
 /*       top: 15%;*/
	/*}*/

	.container>h1 {
		font-size: 2rem;
	}

	.container {
		width: 100%;
		max-width: 100%;
	}

	.accordion {
		padding: 0px;
	}

	.question h2 {
		font-size: 16px;
	}

	/*.question h5 {*/
	/*	font-size: 1rem;*/
	/*}*/

	.hamB {
		right: 3rem;
		top: 2rem;
	}

	.show {
		display: block;
		right: 0;
	}

	.getcote-2>p {
		font-size: 1rem;
	}

	.top {
		width: 100%;
		flex-wrap: wrap;
	}

	/*.top-left-image {*/
	/*	width: 100%;*/
	/*}*/

	.top-right {
		width: 100%;
		justify-content: center;
		align-items: center;
	}

	.residental {
		margin: 0 auto;
		width: 100%;
		margin-bottom: 0;
	}

	.top-right-text {
		/* text-align: center;
        margin-left: -25rem;
        padding-top: 3rem; */
		text-align: center;
		margin-left: 5rem;
		padding-top: 6rem;
		width: 100%;
	}

	.top-right-text>h1 {
		font-size: 2.5rem;
		margin-left: -2.5rem;
		width: 100%;
	}

	.top-right-text>h4 {
		font-size: 2rem;
		margin-left: -2.5rem;
		width: 100%;
	}

	.top-right-text>img {
		width: 70%;
		margin-left: -4rem;
		padding-top: 1rem;
	}

	.top-right-bottom {
		margin-top: 0;
		/* margin-left: 38rem; */
		/* margin-left: 52rem; */
		margin-left: -37rem;
	}

	.top-right-bottom>h1 {
		font-size: 5rem;
		margin-left: 16rem;
		margin-top: 0rem;
		padding-left: 5rem;
		/*transform: scale(1);*/
	}
	
	.top-right-bottom>h1 span{
	    animation:none;
	}
	.top-right-bottom>h1 span.being {
	    animation:none;
	}
	.top-right-bottom>h1 span.in {
	    animation:none;
	}

	/* .top-right-bottom>p { */
	/* max-width: 40vw;
		top: 42rem;
		right: 5rem; */
	/* max-width: 40vw; */
	/* top: 50rem; */
	/* top: 55rem; */
	/* right: 3rem; */
	/* } */

	p#home-off {
	top: 50rem;
    right: 4rem;
    animation: none;
	}

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 48vh;
		margin-left: 2.5rem;
		margin-top: -7rem;
		-webkit-mask-size: 80vw;
		background-size: 111%;
		mask-size: 80vw;
	}

	/* .heart-img, .heart-img1, .heart-img2, .heart-img3 {
		width: 120vw;
		height: 45vh;
		margin-left: 2.5rem;
		margin-top: -7rem;
		-webkit-mask-size: 60vw;
		mask-size: 80vw;
		background-size: 80%;
	} */

	.love_line1,
	.love_line2,
	.love_line3,
	.love_line5,
	.love_line4,
	.love_line6,
	.love_line7,
	.love_line8 {
		display: none;
	}
	.form-but {
    padding: 10px;
    /* background-color: #fff; */
    position: absolute;
    right: 0px;
    top: 6%;
    z-index: 99;
    font-size: 25px;
}

	/*.linkss {*/
	/*	margin-top: 15rem;*/
	/*	margin-left: -2rem;*/
		/* margin-top: 45rem;
        margin-left: -21rem; */
	/*	margin-bottom: 2rem;*/
	/*}*/

	.linkss>a {
		font-size: 1.5rem;
		margin-bottom: 1rem;
	}

	.second-sec {
		padding-top: 0;
		max-width: 75%;
		width: 75%;
	}

	.second-sec>p {
	    margin-top: 20px;
		font-size: 16px;
		text-align: left;
	}

	.a-line {
		opacity: 0;
		transform: rotate(-0deg) translateY(50%) translateX(45rem);
	}

	p:hover~.a-line {
		transform: rotate(0deg) translateY(-26%) translateX(-2rem);
		opacity: 1;
	}

	.residental h1 {
		font-size: 2rem;
		margin-left: 0rem;
	}

	.residental-tabs {
		padding-top: 0rem;
		margin: 0 auto;
		width: 95%;
	}

	.tab {
		width: 100%;
		display: flex;
		/* flex-wrap: wrap; */
	}

	.tab button {
		width: 50%;
	}

	img#my_image,
	img#my_image2,
	img#my_image3,
	img#my_image4 {
		width: 100%;
	}

	.view-img1,
	.view_img2,
	.view_img3,
	.view_img4 {
		width: 100%;
	}

	.tabcontent {
		width: 100%;
	}

	#one {
		padding: 1rem;
	}

	#one>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#one>h5 {
		font-size: 1.5rem;
	}

	div#one::after {
		content: '';
		position: absolute;
		top: 5.6rem;
		left: 2rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-1);
	}

	#one>.line1 {
		width: 100%;
		height: 2px;
	}

	#one>p {
		width: 100%;
	}

	.one {
		height: 30vh;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#two {
		padding: 1rem;
	}

	#two>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#two>h5 {
		font-size: 1.5rem;
	}

	#two>.line2 {
		width: 100%;
		height: 2px;
	}

	#two>p {
		width: 100%;
	}

	div#two::after {
		content: '';
		position: absolute;
		top: 5.6rem;
		left: 8rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-2);
	}

	.two {
		height: 30vh;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#three {
		padding: 1rem;
	}

	#three>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#three>h5 {
		font-size: 1.5rem;
	}

	#three>.line3 {
		width: 100%;
		height: 2px;
	}

	#three>p {
		width: 100%;
	}

	div#three::after {
		content: '';
		position: absolute;
		top: 5.6rem;
		left: 14rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-3);
	}

	.three {
		height: 30vh;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#four {
		padding: 1rem;
	}

	#four>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	div#four::after {
		content: '';
		position: absolute;
		top: 5.6rem;
		left: 20rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-7);
	}

	#four>h5 {
		font-size: 1.5rem;
	}

	#four>.line4 {
		width: 100%;
		height: 2px;
	}

	#four>p {
		width: 100%;
	}

	.four {
		height: 30vh;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	.fourth-sec {
		max-width: 90%;
		width: 90%;
		padding-top: 0rem;
	}

	.fourth-sec>p {
		font-size: 1.4rem;
	}

	.an-line {
		transform: rotate(-0deg) translateY(-100%) translateX(10rem);
		opacity: 0;
	}

	p:hover~.an-line {
		height: 100%;
		transform: rotate(0deg) translateY(100%) translateX(-10rem);
		opacity: 1;
	}

	.commercial {
		margin: 0 auto;
		width: 85%;
		margin-left: 0;
	}

	.commercial>h1 {
		font-size: 1.4rem;
		left: -1rem;
		width: 100%;
		margin-left: 1rem;
	}

	.residental-tabses {
		padding-top: 1rem;
		margin: 0 auto;
		width: 95%;
		z-index: 2;
		position: relative;
	}

	.tabes {
		position: relative;
		display: flex;
		/* flex-wrap: wrap; */
		width: 100%;
	}

	.tabes button {
		display: block;
		background-color: inherit;
		color: var(--tertiary-color);
		padding: 0.5rem;
		width: 50%;
	}

	img#my_image10,
	img#my_image11 {
		position: revert;
	}

	img#view_img10,
	img#view_img11 {
		position: revert;
	}

	img#my_image5,
	img#my_image6,
	img#my_image7,
	img#my_image8,
	img#my_image10,
	img#my_image11,
	img#my_image9,
	img#my_image10,
	img#my_image11 {
		width: 100%;
	}

	.view-img5,
	.view_img6,
	.view_img7,
	.view_img8,
	.view_img10,
	.view_img11,
	.view_img9,
	.view_img10,
	.view_img11 {
		width: 100%;
	}

	.tabcontentes {
		width: 100%;
	}

	#five,
	#six,
	#seven,
	#eight,
	#nine,
	#ten,
	#ele {
		padding: 1rem;
		margin-bottom: 6rem;
	}

	#five>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#five>h5 {
		font-size: 1.5rem;
	}

	#five>p {
		width: 100%;
	}

	div#five::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 1rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-5);
	}

	#five>.line5 {
		width: 100%;
		height: 2px;
	}

	.five {
		width: 100%;
		/*height: 30vh;*/
		height: auto;
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#six>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#six>h5 {
		font-size: 1.5rem;
	}

	#six>p {
		width: 100%;
	}

	div#six::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 4rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-6);
	}

	#six>.line6 {
		width: 100%;
		height: 2px;
	}

	.six {
		width: 100%;
		/*height: 30vh;*/
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#seven>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#seven>h5 {
		font-size: 1.5rem;
	}

	#seven>p {
		width: 100%;
	}

	#seven>.line7 {
		width: 100%;
		height: 2px;
	}

	div#seven::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 7.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	.seven {
		width: 100%;
		/*height: 30vh;*/
		height: auto;
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#eight>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#eight>h5 {
		font-size: 1.5rem;
	}

	#eight>p {
		width: 100%;
	}

	#eight>.line8 {
		width: 100%;
		height: 2px;
	}

	div#eight::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 12rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-8);
	}

	.eight {
		width: 100%;
		/*height: 30vh;*/
		height: auto;
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#nine>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#nine>h5 {
		font-size: 1.5rem;
	}

	#nine>p {
		width: 100%;
	}

	#nine>.line9 {
		width: 100%;
		height: 2px;
	}

	div#nine::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 14.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-9);
	}

	.nine {
		width: 100%;
		/*height: 30vh;*/
		height: auto;
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#ten>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#ten>h5 {
		font-size: 1.5rem;
	}

	#ten>p {
		width: 100%;
	}

	#ten>.line10 {
		width: 100%;
		height: 2px;
	}

	div#ten::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 18.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-10);
	}

	.ten {
		width: 100%;
		/*height: 30vh;*/
		height: auto;
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	#ele>h3 {
		font-size: 2rem;
		margin-bottom: 0rem;
	}

	#ele>h5 {
		font-size: 1.5rem;
	}

	#ele>p {
		width: 100%;
	}

	#ele>.line11 {
		width: 100%;
		height: 2px;
	}

	div#ele::after {
		content: '';
		position: absolute;
		top: 4.6rem;
		left: 22rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-11);
	}

	.ele {
		width: 100%;
		/*height: 30vh;*/
		height: auto;
		margin-top: 1rem;
		background-position: bottom;
		-webkit-mask-size: 100%;
		mask-size: 100%;
		margin-left: 0;
	}

	.subscribe {
		margin: 0 auto;
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
	}

	.subscribe>input[type="email"] {
		width: 95%;
		margin-bottom: 1rem;
		font-size: .8rem;
		letter-spacing: 1px;
		font-weight: 300;
	}

	.subscribe>input[type="email"]:focus,
	.subscribe>input[type="email"]:focus-visible {
		font-size: .8rem;
		letter-spacing: 1px;
	}

	.subscribe>button {
		width: 95%;
		margin-left: 0;
	}

	footer {
		display: flex;
		justify-content: space-between;
		padding: 1rem;
		width: 100%;
	}

	.footer-left>img {
		width: 100%;
		padding-bottom: 1rem;
	}

	.footer-left>p:nth-child(2) {
		font-size: 1.2rem;
	}

	.footer-left>h2 {
		text-transform: uppercase;
		font-weight: 900;
		letter-spacing: .8px;
		line-height: 1.5em;
		font-size: 1.4rem;
	}

	.footer-left>h5 {
		font-size: 1.1rem;
		font-weight: 400;
		letter-spacing: .6px;
		width: 130%;
	}

	.footer-left>p:nth-child(6) {
		font-size: 1.1rem;
		font-weight: 500;
		margin-bottom: 1rem;
	}

	.footer-left>p>a {
		font-size: 1.2rem;
		font-weight: 400;
	}

	.copyright {
		padding: 1rem;
		flex-wrap: wrap;
		justify-content: center;
		text-align: center;
	}

	.copyright>p {
		font-size: 1rem;
		    display: none;
	}

	.copyright>a img {
		width: 7vw;
		padding-top: 1rem;
	}

	/* Menu - items */

	.menus-top>img {
		margin-left: 2rem;
	}

	.close-icon {
		margin-right: 3rem;
	}

	.linked {
		display: flex;
		width: 100%;
		justify-content: space-between;
		align-items: baseline;
		position: relative;
		flex-wrap: wrap;
		padding-left: 5rem;
		margin-left: -4rem;
	}

	.linked>a {
		font-size: 1.2rem;
		width: 100%;
	}

	.in_menus {
		position: absolute;
		top: 21rem;
		left: 5rem;
	}

	.in_menus>a {
		font-size: 1.2rem;
	}

	a.contactus {
		margin-top: 8rem;
	}

	.inner-menus {
		left: 12rem;
		width: 40vw;
	}

	a.residental::before {
		content: '';
		position: absolute;
		left: 7rem;
		top: 0;
	}

	.inner-menus>a {
		font-size: 1.2rem;
	}

	.inner-menus-2 {
		width: 50vw;
		left: 11rem;
		top: 2.5rem;
	}

	a.commercial::before {
		content: '';
		position: absolute;
		left: 8rem;
		top: 0;
	}

	a.commercial:focus::after {
		width: 100%;
	}


	.inner-menus-2>a {
		font-size: 1.2rem;
	}

}

@media screen and (max-width: 411px) {
	.top-right-bottom>p {
		max-width: 40vw;
		top: 55rem;
		right: 3rem;
	}

	.question h5 {
		font-size: 0.9rem;
		display: none;
	}
	p#home-off {
    top: 55rem;
    right: 4rem;
}
}

/* @media screen and (max-width: 375px), screen and (max-height: 812px) {
	.top-right-bottom > p {
		max-width: 40vw;
		top: 50rem;
		right: 4rem;
	}
}

@media screen and (max-width: 375px), screen and (min-height: 667px) {
	.top-right-bottom > p {
		max-width: 40vw;
		top: 47rem;
		right: 4rem;
	}
} */

/* Media-query: 390px */
@media screen and (max-width: 390px) {
	.swiper-slide>h6 {
		/*left: 4rem;*/
		top: 81%;
		font-size: 1.5rem;
	}

	p#home-off {
		top: 56rem;
	}

	.linkss {
	    margin-top: 1rem;
	}

	.getcote-2 {
		overflow: hidden;
		width: 40%;
		right: -13.5%;
		top: 50%;
	}

	/*.quote {*/
	/*	right: 0;*/
	/*	width: 100%;*/
	/*}*/

	.question h2 {
		font-size: 12px;
	}

	/*.question h5 {*/
	/*    font-size: 0.9rem;*/
	/*        width: 66%;*/
	/*}*/

	.question h5 {
		font-size: 0.9rem;
		display: none;
	}

	.footer-right {
		/*display: flex;*/
		align-items: flex-end;
		height: 100%;
		align-self: flex-end;
		justify-content: flex-end;
	}

	div#one::after {
		content: '';
		position: absolute;
		top: 5.2rem;
		left: 2rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-1);
	}

	div#two::after {
		content: '';
		position: absolute;
		top: 5.2rem;
		left: 8rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-2);
	}

	div#three::after {
		content: '';
		position: absolute;
		top: 5.2rem;
		left: 13.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-3);
	}

	div#four::after {
		content: '';
		position: absolute;
		top: 5.2rem;
		left: 19.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	div#five::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 1rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-5);
	}

	div#six::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 4rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-6);
	}

	div#seven::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 7.3rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	div#eight::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 11rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-8);
	}

	div#nine::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 14rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-9);
	}

	div#ten::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 17.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-10);
	}

	div#ele::after {
		content: '';
		position: absolute;
		top: 4.3rem;
		left: 20.5rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-11);
	}


}

/* Media-query: 375px */
@media screen and (max-width: 375px) {

	.hero_slider {
		height: fit-content;
		width: 100%;
		margin-top: 0;
	}

	.getcote-2 {
		overflow: hidden;
		width: 40%;
		right: -13.2%;
		top: 60%;
	}

	.question h2 {
		font-size: 14px;
	}
	.top-right-bottom {
    margin-top: 0;
    
}

	.footer-right {
		/*display: flex;*/
		align-items: flex-end;
		height: 100%;
		align-self: auto;
		justify-content: flex-end;
	}
	.top-left-image img {
    /* width: 85%; */
    width: auto;
    height: 190px;
}
	
	.dropdown-content {
    
    overflow: scroll;

    width: 350px;
    
}
	
	.form-but {
    padding: 10px;
    /* background-color: #fff; */
    position: absolute;
    right: 0px;
    top: 3%;
    z-index: 99;
    font-size: 25px;
}
.top-right-bottom > img:nth-child(1) {
    width: 100%;
    top: -3rem;
    left: -9%;
}
.top-right-bottom > img:nth-child(2) {
    width: 100vw;
    top: 0rem;
    left: -6%;
}
.top-right-bottom > img:nth-child(3) {
    width: 100%;
    top: 4rem;
    left: -23%;
}
.top-right-bottom > img:nth-child(4) {
    width: 100%;
    top: 3.5rem;
    left: -4%;
}
.notification-container {
   width: 300px !important;
    height: auto !important;
}
	p#home-off {
    top: 50rem;
}

	/*.question h5 {*/
	/*       font-size: 0.9rem;*/
	/*   }*/

	.question h5 {
		font-size: 0.9rem;
		display: none;
	}

	/*.quote {*/
	/*    top: 3%;*/
	/*	right: 0;*/
	/*	width: 100%;*/
	/*}*/

	.footer-left>h5 {
		width: 140%;
	}

	.question {
		padding: 10px;
	}

	.top-right-text {
	text-align: center;
    margin-left: 0rem;
    padding-top: 2rem;
    width: 100%;
    margin-bottom: 0rem;
	}

	.commercial {
		margin: 0 auto;
		width: 85%;
		margin-left: 0;
	}

	.commercial>h1 {
		font-size: 1.5rem;
		left: -1rem;
		width: 100%;
	}
	
.container>h1 {
    font-size: 1.5rem;
}

	.top-right-text>img {
		width: 90%;
		margin-left: 0rem;
		padding-top: 1rem;
	}

	.top-right-text>h1 {
		font-size: 2rem;
		margin-left: 0rem;
		width: 100%;
	}

	.top-right-bottom>h1 {
		/*font-size: 1.5rem;*/
		/*margin-left: 0rem;*/
		/*margin-top: 3rem;*/
		font-size: 4rem;
		margin-left: 16rem;
		margin-top: 0rem;
		padding-left: 5rem;
		/*transform: scale(1);*/
	}

	.top-right-text>h4 {
		font-size: 1.5rem;
		margin-left: 0rem;
	}

	.top-right-bottom>p {
		max-width: 50vw;
		/* top: 39rem;
        right: 2rem; */
		/* top: 48rem; */
		top: 50rem;
		right: 2rem;
	}
	.residental h1 {
    font-size: 2rem;
    margin-left: 0rem;
    margin-top: 5rem;
}
#offerings {
    padding-right: 2%;
    padding-left: 2%;
    padding-top: 50rem;
}
.linkss {
    margin-top: 0rem;
    margin-left: auto;
    margin-right: auto;
}
	.residental h1 {
    font-size: 1.5rem;
    margin-left: 0rem;
    margin-top: 5rem;
}
	
	#blue-space h1 {
    font-size: 1.5rem;
    margin-left: 0px;
    padding-left: 10px;
    width: 60%;
}

	.swiper-slide>h6 {
		font-size: 2rem;
		top: 76%;
		/*left: 25%;*/
	}

	.top-right-text>h4 {
		font-size: 1.5rem;
		margin-left: -4rem;
	}

	/*.top-right-bottom > p {*/
	/*	max-width: 40vw;*/
	/*	top: 39rem;*/
	/*	right: 6rem;*/
	/*}*/

	.one {
		height: 30vh;
	}

	.one>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#one::after {
		content: '';
		position: absolute;
		top: 5rem;
		left: 1.5rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-1);
	}

	.two {
		height: 30vh;
	}

	.two>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#two::after {
		content: '';
		position: absolute;
		top: 5rem;
		left: 7rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-2);
	}

	.three {
		height: 30vh;
	}

	.three>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#three::after {
		content: '';
		position: absolute;
		top: 5rem;
		left: 12.5rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-3);
	}

	.four {
		height: 30vh;
	}

	.four>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#four::after {
		content: '';
		position: absolute;
		top: 5rem;
		left: 18rem;
		width: 0;
		height: 0;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
		border-top: 20px solid var(--icon-color-7);
	}

	.five {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.five>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#five::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 0.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-5);
	}

	.six {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.six>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#six::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 3.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-6);
	}

	.seven {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.seven>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#seven::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 6.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	.eight {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.eight>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#eight::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 10.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-8);
	}

	.nine {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.nine>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#nine::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 13rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-9);
	}

	.ten {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.ten>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#ten::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 16.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-10);
	}

	.ele {
		width: 100%;
		height: 22vh;
		margin-top: 2rem;
	}

	.ele>img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		padding-bottom: 1rem;
	}

	div#ele::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 19.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-11);
	}
}

@media screen and (max-width: 375px),
screen and (max-height:630px) {

	.top-right-text>h1 {
		font-size: 2rem;
		margin-left: 0rem;
		width: 100%;
	}

	.top-right-text>img {
		width: 90%;
		margin-left: 0rem;
		padding-top: 1rem;
	}

	.top-right-text>h4 {
		font-size: 1.5rem;
		margin-left: 0rem;
	}

	.question h5 {
		font-size: 0.9rem;
		display: none;
	}
	
	p#home-off {
    top: 50rem;
}

	/*.top-right-bottom > p {*/
	/*	max-width: 40vw;*/
	/*	top: 50rem;*/
	/*   	right: 4rem;*/
	/*}*/

	.five {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.six {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.seven {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.eight {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.nine {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.ten {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.ele {
		width: 100%;
		height: auto;
		/*height: 30vh;*/
		margin-top: 2rem;
	}

	.hamB {
		right: 3rem;
		top: 1rem;
	}

	.top-right-bottom>p {
		max-width: 50vw;
		/* top: 48rem; */
		top: 53rem;
		right: 2rem;
	}

	.swiper-slide>h6 {
		font-size: 1.2rem;
		top: 76%;
		/*left: 10%;*/
	}

}

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

	/* .top-right-bottom > h1 {
		font-size: 1.2rem;
		margin-left: -18rem;
        margin-top: 4rem;
	} */

	.swiper-slide>h6 {
		font-size: 1rem;
		top: 76%;
		/*left: 10%;*/
	}

	p#home-off {
		top: 50rem;
		max-width: 50vw;
		right: 3rem;
	}

	.top-right-bottom>h1 {
		font-size: 4rem;
		margin-left: -20rem;
		margin-top: 1rem;
	}

	.top-right-bottom {
		margin-top: 0;
    /* margin-left: 38rem; */
    /* margin-left: 52rem; */
    margin-left: 14rem;
	}

	.top-right-text>h4 {
		font-size: 1.5rem;
		margin-left: 1rem;
	}

	/* .top-right-text {
        text-align: center;
        margin-left: -21rem;
        padding-top: 3rem;
    } */

	.top-right-text {
	    text-align: center;
    margin-left: 0rem;
    margin-bottom: 2rem;
    padding-top: 7rem;
	}

	/* .linkss {
        margin-top: 40rem;
        margin-left: -18rem;
        margin-bottom: 2rem;
    } */

	.linkss {
        margin-top: 0rem;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 2rem;
}

	.inner-menus {
		left: 10rem;
	}

	.inner-menus-2 {
		left: 10rem;
	}

	/* .heart-img, .heart-img1, .heart-img2, .heart-img3 {
        width: 100vw;
        height: 57vh;
        margin-left: 1rem;
        margin-top: 23rem;
    } */

	.heart-img,
	.heart-img1,
	.heart-img2,
	.heart-img3 {
		width: 100vw;
		height: 57vh;
		margin-left: 2rem;
		margin-top: -8rem;
	}

	.dropdown-content {
		right: 0;
	}

	/* .top-right-bottom > p {
		max-width: 50vw;
		top: 35rem;
		right: 2rem;
	} */

	/* .top-right-bottom>p {
		max-width: 50vw;
		top: 40rem;
		right: 3rem;
	} */

	#one>h5 {
		font-size: 1.3rem;
	}

	#two>h5 {
		font-size: 1.3rem;
	}

	#three>h5 {
		font-size: 1.3rem;
	}

	#four>h5 {
		font-size: 1.3rem;
	}

	#five>h5 {
		font-size: 1.3rem;
	}

	#six>h5 {
		font-size: 1.3rem;
	}

	#seven>h5 {
		font-size: 1.3rem;
	}

	#eight>h5 {
		font-size: 1.3rem;
	}

	#nine>h5 {
		font-size: 1.3rem;
	}

	#ten>h5 {
		font-size: 1.3rem;
	}

	#ele>h5 {
		font-size: 1.3rem;
	}

	.residental h1 {
		font-size: 1.7rem;
	}

	/* .commercial > h1 {
		font-size: 1.4rem;
		left: .3rem;
	} */

	.commercial>h1 {
		font-size: 1.2rem;
		left: 0.3rem;
		width: 105%;
	}

	.a-line {
		height: 66%;
		top: 5rem;
	}

	p:hover~.an-line {
		bottom: 40rem;
	}

	.footer-left>h2 {
		font-weight: 600;
		font-size: 1rem;
	}

	.footer-left>p>a {
		font-size: 1.1rem;
	}

	.hamB {
		right: 2rem;
		top: 1rem;
	}

	.getcote-2 {
		overflow: hidden;
		width: 45%;
		right: -15%;
		top: 60%;
	}

	div#one::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 1.3rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-1);
	}

	div#two::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 6.3rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-2);
	}

	div#three::after {
		content: '';
		position: absolute;
		top: 4.2rem;
		left: 11rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-3);
	}

	div#four::after {
		content: '';
		position: absolute;
		top: 4.1rem;
		left: 15.8rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	div#five::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 0.4rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-5);
	}

	div#six::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 3rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-6);
	}

	div#seven::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 5.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-7);
	}

	div#eight::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 8.8rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-8);
	}

	div#nine::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 11.2rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-9);
	}

	div#ten::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 14rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-10);
	}

	div#ele::after {
		content: '';
		position: absolute;
		top: 3.8rem;
		left: 16.7rem;
		width: 0;
		height: 0;
		border-left: 15px solid transparent;
		border-right: 15px solid transparent;
		border-top: 15px solid var(--icon-color-11);
	}

	#one>p {
		width: 100%;
		font-size: 1rem;
	}

	#two>p {
		width: 100%;
		font-size: 1rem;
	}

	#three>p {
		width: 100%;
		font-size: 1rem;
	}

	#four>p {
		width: 100%;
		font-size: 1rem;
	}

	#five>p {
		width: 100%;
		font-size: 1rem;
	}

	#six>p {
		width: 100%;
		font-size: 1rem;
	}

	#seven>p {
		width: 100%;
		font-size: 1rem;
	}

	#eight>p {
		width: 100%;
		font-size: 1rem;
	}

	#nine>p {
		width: 100%;
		font-size: 1rem;
	}

	#ten>p {
		width: 100%;
		font-size: 1rem;
	}

	#ele>p {
		width: 100%;
		font-size: 1rem;
	}

	.footer-left>h5>a {
		color: var(--tertiary-color);
		font-size: 1rem;
	}

	.footer-left>p:nth-child(8) {
		color: var(--tertiary-color);
		font-size: 1rem;
	}

}