/* Fish CSS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */:root {  --colour1: #2f8a9b;  --colour2: #ccebd9;  --colour3: #376968;  --colour4: #ebf3ed;  --footeradjust: 390px;}body{	font-family: "brando-sans", sans-serif;	font-weight: 400;	/* background-color: var( --colour1 ); */	 background-color: #fff;}p, li{	font-size: 16px;	line-height: 22px;	letter-spacing: .5px;	color: #444;}h1, h2, h3, h4{	font-family: "utopia-std-display", serif;	font-weight: 400;	color: var( --colour1 );}.secondColour{	color: var( --colour2 );}.heading{	grid-gap: 4px;}.img	{	border-radius: 16px;}.heading h1{	color: var( --colour1 );	font-size: 40px;	letter-spacing: 2px;}.button {	justify-self: start;	padding: 12px 16px;	border: 1px solid #ffffff;	border-radius: 8px;	position: relative;	overflow: hidden;	background-color: transparent;	text-align: center;	text-transform: uppercase;	font-size: 16px;	transition: .3s;	z-index: 1;	font-family: inherit;	color: #ffffff;}.button::before {	content: '';	width: 0;	height: 350%;	position: absolute;	top: 50%;	left: 50%;	transform: translate(-50%, -50%) rotate(45deg);	background: #b2b2b2;	transition: .2s ease;	display: block;	z-index: -1;}.button:hover::before { width: 110%;}.button:hover h3 { color: #fff;}.border-bot{	border-bottom: solid white 2px;}a{	color: var( --colour1 );	text-decoration: none;}/* - Page Content - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */#page-content {    display: grid;    grid-gap: 32px;    padding: 64px 0 32px;    background-color: #fff;    z-index: 6;    margin-top: -150px;    padding-bottom: 400px;	margin-bottom: -300px;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.socials-bar-container{	display: grid;	z-index: 20;	grid-gap: 8px;	padding: 16px;	background-color: var( --colour1 );}.socials-bar-container i{	font-size: 24px;}.socials-bar-container a {    color: #fff;}@media( max-width: 767px ){	.socials-bar-container a	{		grid-row: 1;        text-align: center;	}}@media( min-width: 768px ){	.socials-bar-container	{		position: fixed;							top: 25%;		right: 0px;		grid-gap: 16px;		padding: 16px;		background-color: rgba(34, 34, 34, 0.8);		border-bottom-left-radius: 16px;		border-top-left-radius: 16px;	}		.socials-bar-container a	{		grid-column: 1;        width: 16px;        height: 16px;	}}			/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.sect-a{	display: grid;	grid-template-columns: auto;}@media( min-width: 768px ){	.sect-a 	{		grid-template-columns: auto 384px 384px auto;	}}@media( min-width: 992px ){	.sect-a 	{		grid-template-columns: auto 496px 496px auto;	}}@media( min-width: 1200px ){	.sect-a 	{		grid-template-columns: auto 600px 600px auto;	}}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.workspace{	grid-gap: 32px;}.heading-1{	grid-gap: 4px;}.heading-1 h1{	font-size: 35px;	color: #fff;}.heading-1 h3{	font-size: 23px;	font-style: italic;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.heading-2{	grid-gap: 4px;	align-self: center;	justify-self: center;}.heading-2 h1{	font-size: 40px;	color: #DDD;	justify-self: center;}.heading-2 h3{	font-size: 26px;	font-style: italic;	color: #B8B8B8;	justify-self: center;}.heading-2 .btn{	justify-self: center;	margin-top: 32px;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */hr{	justify-self: center;	width: 50vw;	border: none;	border-top: 1px solid;	color: #cecece;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.btn{	border: solid 2px;	color: #ffffff;	padding: 12px 16px;	text-decoration: none;	font-size: 16px;	border-radius: 32px;	transition: background ease .2s, transform ease .2s;	justify-self: start;}.btn:hover{	cursor: pointer;	background-color: var( --colour1 );	transform: scale(0.9);	}/* - */.feature-a{	display: grid;	grid-gap: 32px;	justify-content: start;		overflow-x: hidden;	width: 100%;}.feature-a-img{	grid-row: 1;	grid-column: 1;	width: 50vw;}.feature-a-content{	grid-row: 1;	width: 568px;	margin: 32px 0;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.feature-b{	display: grid;	grid-gap: 32px;	justify-content: end;		overflow-x: hidden;	width: 100%;	}.feature-b-img{	grid-row: 1;	grid-column: 2;	width: calc(50vw - 16px );}.feature-b-content{	grid-row: 1;	width: 568px;	margin: 32px 0;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.list{ display: grid; grid-gap: 8px; align-content: center;}.list p{ align-content: center; display: grid; grid-template-columns: max-content auto;}.list p:before{ font-family: "Font Awesome 5 Pro"; font-weight: 300; color: #a5a5a5; align-self: start; content: "\f054"; margin-right: 8px; font-size: 16px;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.feat-1-container{	grid-gap: 16px!important;	margin-bottom: 64px;}.feat-gal-img-1{	background-image: url(../img/gallery/1-thmb.jpg);}.feat-gal-img-2{	background-image: url(../img/gallery/2-thmb.jpg);}.feat-gal-img-3{	background-image: url(../img/gallery/3-thmb.jpg);}.feat-gal-img-4{	background-image: url(../img/gallery/4-thmb.jpg);}.feat-gal-img-5{	background-image: url(../img/gallery/5-thmb.jpg);}.feat-gal-img-6{	background-image: url(../img/gallery/6-thmb.jpg);}.feat-gal-img-7{	background-image: url(../img/gallery/7-thmb.jpg);}.feat-gal-img-8{	background-image: url(../img/gallery/8-thmb.jpg);}.feat-1-block-double {	padding-top: 200%;}.feat-1-block {	padding-top: 100%; 	position: relative;	background-color: #f1f1f1; 	border-radius: 32px;	background-size: 100% 100%;	background-position: center;	background-size: cover;	transition: all .5s ease-in-out; }.feat-1-block:hover {	/* background-size: 105% 105%; */}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.feat-1-block-half {	padding-top: 50%; }.feat-1-block-third {	padding-top: 33%;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.feat-1-container .button	{	background-color: var( --colour1 );	border: none;}	.feat-1-container .button h3{	color: #fff;}.feat-1-block-inner{	display: grid;	padding: 16px;	align-content: end;	justify-content: start;	background-color: color-mix(in lab, var( --colour1 ) 60%, #111 40%);	margin-bottom: 32px;	grid-gap: 4px;	align-self: end;}.feat-1-block-inner p{	margin : 24px 0;}.section-type2{	background-color: color-mix(in lab, var( --colour1 ) 60%, #111 40%);}.section-type3{	background-image: url('../img/testimonial-bg.jpg');	background-attachment: fixed;	background-position: center center;	background-color: #111;	background-repeat: no-repeat;	background-size: cover;	min-height: 400px;	padding: 64px 0 128px;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.paralax-banner{	height: 384px;	overflow: hidden;	background-image: url( ../img/para.jpg );	background-attachment: fixed;	background-position: center;	background-repeat: no-repeat;	background-size: cover;	margin: 64px 0;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.contact-item {	grid-template-columns: max-content auto;	align-content: center;}.contact-item .element{	background-color: var( --colour1 );	padding: 2px;	border-radius: 64px;}.contact-item i, .contact-item svg{	align-self: center;	color: #fff;	background-color: var( --colour1 );	padding: 16px;	border-radius: 64px;	justify-self: center;	font-size: 24px;	border: solid 4px #fff;				}.contact-item a{	align-self: center;}.contact-item p{	align-self: center;}@media( max-width: 767px ){	.long-txt	{		font-size: 12px;	}				}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.w100 {    width: 100%;}.elem-table {    border: 1px solid #fff;    background-color: #fff;    width: 100%;    text-align: left;    border-collapse: collapse;}thead {    background-color: var( --colour1 );    border-bottom: 2px solid #fff;}th {    font-size: 14px;    font-weight: bold;    color: #FFFFFF;    border-left: 2px solid #fff;    text-transform: uppercase;    letter-spacing: 2px;    border: solid 1px;    height: 20px;}th h1 {    font-size: 14px;}tr:nth-child(2n) {    background: rgba( 222, 222, 222, 0.30 );}/*** TABLE STYLING ***/table {    border: 1px solid #fff;    background-color: #fff;    width: 100%;    text-align: left;    border-collapse: collapse;}table td,table th {    border: 1px solid #fff;    padding: 10px 10px;}table tbody td {    font-size: 13px;}table thead th:first-child {    border-left: none;}table tfoot td {    font-size: 14px;}table tfoot .links {    text-align: right;}.card{	padding: 32px;	box-shadow: rgba( 0, 0, 0, 0.24 ) 0px 3px 8px;	transition : all ease .25s;	cursor: pointer;}.card:hover{	box-shadow: rgba( 99, 99, 99, 0.2 ) 0px 2px 8px 0px;}.cent{	text-align: center;	justify-self; center;}/* Testimonials - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.testimonial-container{	display: grid;	width: 100%;	background-image: url('../img/testimonial-bg.jpg');	background-attachment: fixed;	background-position: center center;	background-color: #111;	background-repeat: no-repeat;	background-size: cover;		min-height: 300px;		padding: 32px 0 64px;	padding-bottom: 400px;	margin-bottom: calc( var( --footeradjust ) * -1 );	z-index: 10;}.testimonial{	display: grid;	align-self: center;	justify-self: center;		grid-row: 1;	grid-column: 1;		grid-gap: 16px;		width: 512px;	max-width: 80vw;		opacity: 1;		transition: opacity ease .5s;		z-index: 3;}.opacity-0{	opacity: 0!important;}.testimonial h3{	color: #fff;	justify-self: center;	font-size: 32px;}.testimonial p{	color: #fff;	justify-self: center;	text-align: center;}.star-container{	display: grid;	align-content: center;	justify-content: center;}.star{	color: #252525;	grid-row: 1;}.testimonial-controls{	display: grid;	z-index: 1;	grid-row: 2;	grid-column: 1;	align-content: center;	padding: 0 32px;}@media( min-width: 992px ){	.testimonial-controls	{		grid-row: 1;		grid-column: 1;	}}.testimonial-arrow{	color: #fff;	font-size: 32px;	grid-row: 1;	grid-column: 1;		transition: opacity .5s ease;}.testimonial-arrow:hover{	cursor: pointer;	opacity: 0.5;}.testimonial-left{	justify-self: start;}.testimonial-right{	justify-self: end;}.testimonial-dots{	display: grid;	grid-gap: 8px;	justify-content: center;	justify-self: center;	align-self: center;	z-index: 3;		grid-row: 2;	grid-column: 1;}.testimonial-dot{	grid-row: 1;	width: 8px;	height: 8px;	border-radius: 16px;	border: #fff solid 1px;	align-self: center;}.testimonial-dot:hover{	cursor: pointer;	border-color: #252525;}.active-testimonial-dot{	background-color: var( --colour1 );	border-color: var( --colour1 );	/*border: none;*/}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.cntr{	text-align: center;}:root {  --line-width: 55%;  --line-colour: var( --colour1 );}.line{	width: 100%;	display: grid;	grid-gap: 32px;	grid-template-columns: auto max-content auto;	opacity: 0.5;	margin: 24px 0;}.line i,.line svg{  align-self: center;  font-size: 24px;  color: var(--line-colour);}.line::before{  content: "";  height: 1px;  align-self: center;  justify-self: end;  width: var(--line-width);  background-color: var(--line-colour);}.line::after{  content: "";  height: 1px;  align-self: center;  justify-self: start;  width: var(--line-width);  background-color: var(--line-colour);}    	.alt .line i, .alt .line svg{  color: #fff;}.alt .line::before{  background-color: #fff;}.alt .line::after{  background-color: #fff;}    		@media( min-width: 992px ){	.page-img	{		grid-row: 1;		grid-column: 2;	}	.img-left	{		grid-column: 1;	}	.page-content	{		grid-row: 1;	}}.center{	text-align: center;}.list{	display: grid;	align-content: center;}.list p{	align-content: center;	display: grid;	grid-template-columns: max-content auto;	margin-left: 32px;}.list p:before{	font-family: "Font Awesome 5 Pro";    font-weight: 300; 	color: var( --colour1 ); 	align-self: start; 	content: "\f054"; 	margin-right: 8px; 	font-size: 16px; 	padding-right: 8px;}		/* - - - - - - - - - - - - - - - - - - - - - - - - */.alt{	background-color: var(--colour3);	padding: 64px 0!important;}	.alt p{	color: var( --colour4 );}.alt b{	color: #fff;}.alt :is( h1, h2, h3, h4, .header-block ){	color: #fff;}.alt .list p:before{	color: #fff;}.sub-heading {	font-size: 28px;}.sub-heading {	font-size: 28px;}/* - - - - - - - - - - - - - - - - - - - - - - - - */.btn-fancy {	background-color: transparent;	border: 2px solid var(--colour2);	border-radius: 0;	box-sizing: border-box;	color: #fff;	cursor: pointer;	display: inline-block;	float: right;	font-weight: 700;	letter-spacing: 0.05em;	margin: 0;	outline: none;	overflow: visible;	padding: 1.25em 2em;	position: relative;	text-align: center;	text-decoration: none;	text-transform: none;	transition: all 0.3s ease-in-out;	user-select: none;	font-size: 13px;	margin-top:16px;	 justify-self: start;}.btn-fancy::before {	content: " ";	width: 1.5625rem;	height: 2px;	background: var(--colour2);	top: 50%;	left: 1.5em;	position: absolute;	transform: translateY(-50%);	transform-origin: center;	transition: background 0.3s linear, width 0.3s linear;}.btn-fancy .text {	font-size: 1.125em;	line-height: 1.33333em;	padding-left: 2em;	display: block;	text-align: left;	transition: all 0.3s ease-in-out;	text-transform: uppercase;	text-decoration: none;	color: var(--colour2);}.btn-fancy .top-key {	height: 2px;	width: 1.5625rem;	top: -2px;	left: 0.625rem;	position: absolute;	background: #e8e8e8;	transition: width 0.5s ease-out, left 0.3s ease-out;}.btn-fancy .bottom-key-1 {	height: 2px;	width: 1.5625rem;	right: 1.875rem;	bottom: -2px;	position: absolute;	background: #e8e8e8;	transition: width 0.5s ease-out, right 0.3s ease-out;}.btn-fancy .bottom-key-2 {	height: 2px;		width: 0.625rem;	right: 0.625rem;	bottom: -2px;	position: absolute;	background: #e8e8e8;	transition: width 0.5s ease-out, right 0.3s ease-out;}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.alt .btn-fancy {	border: 2px solid var( --colour4 );}.alt .btn-fancy::before {	background: var( --colour4 );}.alt .btn-fancy .text {	color: var( --colour4 );}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - */.alt .btn-fancy .top-key {	background: var( --colour3 );}.alt .btn-fancy .bottom-key-1 {	background: var( --colour3 );}.alt .btn-fancy .bottom-key-2 {	background: var( --colour3 );}.btn-fancy:hover {	color: white;	background: var(--colour2);}.alt .btn-fancy:hover {	color: white;	background: var(--colour2);}.alt .btn-fancy:hover {	color: var(--colour4);  background: var(--colour4);}.btn-fancy:hover::before { width: 0.9375rem; background: white;}.btn-fancy:hover .text { color: white; padding-left: 1.5em;}.alt .btn-fancy:hover::before {	background: var( --colour3 );}.alt .btn-fancy:hover .text {	color: var( --colour3 );}.btn-fancy:hover .top-key { left: -2px; width: 0px;}.btn-fancy:hover .bottom-key-1, .btn-fancy:hover .bottom-key-2 {	right: 0;	width: 0;}/* - - - - - - - - - - - - - - - - - - - - - - - - */.btn-chameleon {    background-color: var( --colour2 );    border: none;    color: white;    padding: 16px 32px;    text-align: center;    font-size: 16px;    margin: 4px 2px;    transition: 0.3s;    justify-self: start;    border-radius: 5px;    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05),        0 2px 2px rgba(0, 0, 0, 0.05),        0 4px 4px rgba(0, 0, 0, 0.05),        0 8px 8px rgba(0, 0, 0, 0.05),        0 16px 16px rgba(0, 0, 0, 0.05);}.btn-chameleon:hover {    background-color: var( --colour1 );    color: var( --colour2 );    cursor: pointer;}/* - - - - - - - - - - - - - - - - - - - - - - - - */.alt .btn-chameleon {    background-color: var( --colour4 );    color: var( --colour3 );}.alt .btn-chameleon:hover {    background-color: var( --colour2 );    color: #fff;}/* - - - - - - - - - - - - - - - - - - - - - - - - */.btn-thai {	padding: 20px 60px;	border: none;	outline: none;	position: relative;	z-index: 1;	border-radius: 5px;	background: linear-gradient(to right, var( --colour1 ), var(--colour2));	cursor: pointer;  	text-align: center;	color: #fff;	justify-self: start;}.btn-thai::before {	content: "";  	position: absolute;  	left: 1px;  	right: 1px;  	top: 1px;  	bottom: 1px;  	border-radius: 4px;  	background-color: #111;  	z-index: -1;  	transition: 200ms}.btn-thai::after {  	content: attr(data);  	font-size: 16px;  	background: linear-gradient(to left, var(--colour1), var(--colour2));  	-webkit-background-clip: text;  	color: transparent;  	transition: 200ms}.btn-thai:hover::before {  	opacity: 50%;  	top: 0px;  	right: 0px;  	bottom: 0px;  	left: 0px;}.btn-thai:hover::after{  	color: white;}.btn-speech {	justify-self: start;	padding: 12px 16px;	border: 1px solid #ffffff;	border-radius: 16px 16px 16px 0;	position: relative;	overflow: hidden;	background-color: transparent;	text-align: center;	text-transform: uppercase;	font-size: 16px;	transition: all ease .2s;	z-index: 1;	color: var( --colour1 );	border: solid 2px var( --colour1 );	background-color: #fff;}.alt .btn-speech{	border: solid 2px var( --colour4 );	background-color: #fff0;}.btn-speech::before {	content: '';	width: 0;	height: 350%;	position: absolute;	top: 50%;	left: 50%;	transform: translate(-50%, -50%) rotate(45deg);	background: var( --colour1 );	transition: .2s ease;	display: block;	z-index: -1;}.alt .btn-speech::before {	background: var( --colour4 );}.btn-speech:hover::before {	width: 110%;}.btn-speech:hover{	transform: translate( 0px, 2px) scale(0.99);	border: solid 2px #fff;}.alt .btn-speech:hover{	border: solid 2px var( --colour3 );}.btn-speech h3 {	color: var( --colour1 );	transition: all ease .2s;}.alt .btn-speech h3 {	color: var( --colour4 );}.btn-speech:hover h3 {	color: var( --colour4 );}.alt .btn-speech:hover h3 {	color: var( --colour3 );}/* - - - - - - - - - - - - - - - - - - - - - - - - */.minus-32{	margin-bottom: -32px;}.minus-64{	margin-bottom: -64px;}.dec-pull{	margin: -32px 0;}.custom-shape-divider-bottom-1776939884 {    bottom: 0;    left: 0;    width: 100%;    overflow: hidden;    line-height: 0;    transform: rotate(180deg);}.custom-shape-divider-bottom-1776939884 svg {    position: relative;    display: block;    width: calc(156% + 1.3px);    height: 59px;}.custom-shape-divider-bottom-1776939884 .shape-fill {    fill: #376968;}.custom-shape-divider-top-1776939961 {    top: 0;    left: 0;    width: 100%;    overflow: hidden;    line-height: 0;    transform: rotate(180deg);}.custom-shape-divider-top-1776939961 svg {    position: relative;    display: block;    width: calc(242% + 1.3px);    height: 59px;    transform: rotateY(180deg);}.custom-shape-divider-top-1776939961 .shape-fill {    fill: #376968;}