@charset "utf-8";

@font-face{
	font-family: "titillium";
	src: url("../fonts/TitilliumWeb-Regular.ttf") format("truetype");
	}

@font-face{
	font-family: "titilliumsmib";
	src: url("../fonts/TitilliumWeb-SemiBold.ttf") format("truetype");
	}
	
@font-face{
    font-family: "SonsieOne";
    src: url("../fonts/SonsieOne-Regular.otf") format("truetype");
	}

@font-face{
    font-family: "eras";
    src: url("../fonts/ErasBoldITC.ttf") format("truetype");
	}
	
*{
	margin: 0;
	padding: 0;
	font-family: titillium, Helvetica, Arial, sans-serif, FontAwesome, Trebuchet MS;
	box-sizing: border-box;
}

body, html{
	top: 0 !important;
	margin: 0;
	padding: 0px;
	font-family: titillium, Helvetica, Arial, sans-serif, FontAwesome, Trebuchet MS;
    
	/* height: 100%; */ /* solve fixed over scrollbar*/
    width: 100%;
	overflow: hidden;
	/* -webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none; */
}

::-webkit-scrollbar {
	width: 0.5em;
	}
 
::-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	}
 
::-webkit-scrollbar-thumb {
	background-color: rgba(127, 140, 141, 0.5);
	outline: 1px solid slategrey;
	border-radius: 3px;
	}
	
hr.sysstyle-two{
	width: 75%;
    border: 0;
    height: 3px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #7f8c8d, rgba(0, 0, 0, 0));
	}
	
.contenthome{
	margin: auto;
	padding: 0 !important;
	/* border: 3px solid #333; */
	/* width: 75%; */
}

.content{
	margin: auto;
	padding: 0 !important;
	/* border: 3px solid #333; */
	/* width: 75%; */
}

.callnow:hover{
	/* font-weight: 600; */
	color: #c30000;
}

.callnow{
	text-decoration: none;
	color: #000;
}

/* contact */
.contactdiv{
	width: 100%;
	margin: 0 auto;
	margin-top: 50px;
	}
	
.contact{
	padding-top: 50px;
	font-family: Arial Black;
	font-size: 3em;
	font-weight: bold;
	color: #000;
	}

.hrcontact{
	width: 100%;
	left: 0; right:0;
	}

.hrcontact hr{
	width: 100px;
	height: 10px;
	background-color: #ccc;
	border: 0px solid #fff;
	}

.contacttxt{
	width: 100%;
	font-family: arial;
	font-size: 1.2em;
	font-family: 'Titillium Web', sans-serif;
	}
	
.gmap{
	width: 100%;
	height: 500px;
	margin: 0 auto;
	}
	
.contactcontent{
	padding: 50px 0px;	
	text-align: center;
	display: flex;
	justify-content: space-between;
	border: 0 solid #000;
}
	
.hrcontacts{
	width: 10%;
	}

.hrcontacts hr{
	width: 60px;
	height: 7px;
	background-color: #4576BA;
	border: 0 solid #fff;
	}
	
.inquiries{
	width: 100%;
	padding: 20px;
	display: inline-block;
	text-align: left;
	vertical-align: top;
	border: 0 solid #333;
	}
	
.headoffice{
	width: 90%;
	padding: 20px;
	display: inline-block;
	text-align: left;
	margin-left: 50px;
	vertical-align: top;
	border: 0 solid #333;
	}
	
.frmtxt{
	outline: none;
	padding: 5px;
	width: 400px;
	border: 1px solid #ccc;
	font-family: 'Titillium Web', sans-serif;
	font-size: 1em;
	margin: 2px;
	background: #F5F6F7;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	transition:.3s;
	}
	
.frmtxt:focus{
	background: #fff;
	}
	
.frmmessage{
	outline: none;
	padding: 5px;
	width: 400px;
	border: 1px solid #ccc;
	font-family: 'Titillium Web', sans-serif;
	font-size: 1em;
	margin: 2px;
	resize: none;
	background: #F5F6F7;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	transition:.3s;
	}

.frmmessage:focus{
	background: #fff;
	}

.msend{
	outline: none;
	padding: 5px 20px;
	width: 100px;
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 1.3em;
	margin: 2px;
	background: #ccc;
	cursor: pointer;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	transition:.3s;
	}
	
.msend:hover{
	background: #ff9630;
	font-weight: 600;
	}
	
.send{
	outline: none;
	padding: 5px 20px;
	width: 100px;
	border: 1px solid #ccc;
	border-radius: 5px;
	font-size: 1.3em;
	margin: 2px;
	background: #ccc;
	cursor: pointer;
	-moz-transition:.3s;
	-webkit-transition:.3s;
	transition:.3s;
	}
	
.send:hover{
	background: #ff9630;
	font-weight: 600;
	}
	
.msgerr{
	font-size: 1em;
}
	
/* contact */


/* slider */
.slider{
	position: fixed;
	height: 100vh;
	border: 0 solid #ffff00;
	
}

.slidetxt{
	position:relative; top: 50%; transform: translateY(-50%); left:0px;width:1300px;height:300px;overflow:hidden;
	border: 0 solid #ffff00;
	
	}
	
.slidetxtd{
	position: absolute; margin: 0 auto; top:50%; transform:translateY(-50%);
	width: 95%;
	left: 0; right:0;
	text-align: center;		 
	}

.alexm{
	font-family: eras;
	font-size: 4em;
	color: #fff;
	text-shadow: 3px 3px #000;
	border: 0 solid #fff;
	}

.fcont:hover{
	background: #fff;
	color: #000;
	font-weight: 700;
}

/* slider */
/* body::after{
	content: "";
	width: 100%;
	height: 100%;
	background: #DE0005;
	position: absolute;
	clip-path: circle(40% at right 100%);
	z-index: -1;
} */

.aboutspacerdiv{
	border: 0 solid #333;
	padding: 20px;
}

.spacerdiv{
	border: 0 solid #333;
	padding: 30px;
}

.suezwelltools{
	position: relative;
	display: flex;
    justify-content: space-between;
	border: 0 solid #c30000;
}

#contacttbl{
	width: 98%;
	margin: auto;	
}

#homeimgtbl{
	width: 98%;
	margin: auto;
}

#getintouch{
	font-size: 3em;
}

.suezwelltoolsphoto img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

.suezwelltoolsphoto{
	object-fit: cover;
	width: 600px;
	height: 600px;
	border-radius: 20px;
	border: 0 solid #333;
}

/* .suezwelltoolsphoto{
	display: inline-block;
	height: 700px;
	width: 100%;
	background-image: url("../images/05.png");
	background-size: 200% 100%;
	background-repeat: no-repeat;
    background-position: center center;
	border-radius: 10px; 
	border: 0 solid #333;
} */

#suezwelltoolsphome{
	font-size: 1.3em;
	font-weight: 200
}

#suezwelltoolsphead{
	font-size: 2em;
	font-weight: 700
}

.suezwelltoolstxt{
	display: inline-block;
	width: 98%;
	padding: 30px;
	border: 0 solid #333;
}

.others{
	margin: auto;
	width: 98%;
	border: 0 solid #333;
}

.rialist li{
	margin-left: 40px;
	
}

.productstxt{
	width: 50%;
	padding-left: 50px;
}

#uline{
	width: 100%;
	padding: 10px 0;
}

.unline{
	position:relative;
	background: transparent;
	border: 0 solid #333;
}

.unline:after{
    content:"";
    /* background: linear-gradient(to right, rgba(255,234,0,1) 0%, rgba(255,234,0,0) 50%); */
	background: rgb(0,0,0);
	background: -moz-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%);
	background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 50%, rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
	
    display: block;
    height: 2px !important;
    width: 100%;
    position: absolute;
    bottom: 0;
}

#modu4m{
	object-fit: cover;
	width: 600px;
	height: 600px;
	margin: auto;
	border-radius: 10px;
	border: 0 solid #333;
}

#modu3m{
	object-fit: cover;
	width: 600px;
	height: 600px;
	margin: auto;
	border-radius: 10px;
	border: 0 solid #333;
}


#modu2m{
	object-fit: cover;
	width: 600px;
	height: 600px;
	margin: auto;
	border-radius: 10px;
	border: 0 solid #333;
}

#modu1m{
	object-fit: cover;
	width: 600px;
	height: 600px;
	margin: auto;
	border-radius: 10px;
	border: 0 solid #333;
}

.moduclass img{
	border: 3px solid #333;
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

.moduclass{
	object-fit: cover;
	width: 500px;
	height: 500px;	
}

.casedownload:hover{
	background: #1672E4;
	color: #fff;
}

.casedownload{
	display: inline-block;
	font-size: 1.2em;
	line-height: 1em !important;
	color: #000;
	padding: 10px 15px;
	width: fit-content;
	border-radius: 25px;
	background: #e0e0e0;
	cursor: pointer;
	border: 1px solid #333;
}


.downloadsmobile:hover{
	background: #1672E4;
}

.downloadsmobile{
	display: inline-block;
	font-size: 1.2em;
	color: #000;
	padding: 15px;
	width: fit-content;
	border-radius: 10px;
	background: #e0e0e0;
	cursor: pointer;
	border: 1px solid #333;
}

.downloads:hover{
	background: #1672E4;
}

.downloads{
	display: inline-block;
	font-size: 1.2em;
	color: #000;
	padding: 15px;
	width: 250px;
	border-radius: 28px;
	background: #e0e0e0;
	cursor: pointer;
	border: 1px solid #333;
}

.cscontent{
	position: relative;
}

.cstxt2{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	margin: auto;
	width: 100%;
	font-size: 2.5em;
	white-space: pre-line;
	text-align: center;
	color: white;
	font-weight: 600;
	
	text-shadow: 3px 3px #000;
	/* -webkit-text-stroke: 1px #000; */
	
	border: 0 solid #fff;
	
}

.cstxtm{
	margin: auto;
	width: 600px;
	font-size: 2em;
	white-space: pre-line;
	text-align: center;
	color: #000;
	
	border: 0 solid #fff;
	cursor: pointer;
}

.cstxt{
	position: absolute;
	filter: brightness(100%);
	top: 50%;
	transform: translateY(-50%);
	margin: auto;
	width: 100%;
	font-size: 2.5em;
	white-space: pre-line;
	text-align: center;
	color: #fff;
	font-weight: 600;
	text-shadow: 2px 2px #000;
	border: 0 solid #fff;
	cursor: pointer;
}

.cs0p{
	width: 100%;
	padding: 0;
	font-size: 1.5em;
	white-space: pre-line;
	border: 0 solid #000;
}

#wwtnrps2{
	cursor: pointer;
}

#wwtnrps{
	cursor: pointer;
}

#img3tbl td{
	max-width: 1% !important;
    white-space: nowrap;
	vertical-align: top;
	text-align: center;
}





.casestudiesimg img{
	border-radius: 20px !important;
}

#cs3{
	display: inline-block;
	width: 100%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	filter: brightness(75%);
	background-image: url("../images/cs3.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	border: 0 solid #000;
}

#cs2{
	display: inline-block;
	width: 100%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	filter: brightness(75%);
	background-image: url("../images/cs2.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	
	border: 0 solid #000;
}

#cs5{
	display: inline-block;
	width: 100%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	
	background-image: url("../images/no_casing.png");
	background-size: cover;
	background-repeat: no-repeat;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	filter: brightness(75%);
	border: 0 solid #000;
}

#cs4{
	display: inline-block;
	width: 100%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	background-image: url("../images/increased_casing.png");
	background-size: cover;
	background-repeat: no-repeat;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	filter: brightness(75%);
	border: 0 solid #000;
}

#cs0{
	display: inline-block;
	width: 100%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	filter: brightness(75%);
	background-image: url("../images/cs0.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	
	border: 0 solid #000;
}

.csclass{
	object-fit: cover;
	width: 250px;
	height: 300px;
	border-radius: 20px;
	border: 0 solid #333;
}

#cs4m{
	object-fit: cover;
	width: 600px;
	height: 600px;
	border-radius: 10px;
	border: 0 solid #333;
}

#cs3m{
	object-fit: cover;
	width: 600px;
	height: 700px;
	border-radius: 10px;
	border: 0 solid #333;
}

#cs2m{
	object-fit: cover;
	width: 600px;
	height: 700px;
	border-radius: 10px;
	border: 0 solid #333;
}

#cs0m{
	object-fit: cover;
	width: 600px;
	height: 700px;
	border-radius: 20px;
	border: 0 solid #333;
}

.overpic{
	position: absolute;
	margin: auto;
	left: 0; right: 0;
	
	
	padding: 10px;
	padding-top: 30px;
	
	font-weight: 600;
	color: #fff;
	text-shadow: 7px 7px 7px #000;
	
	
	object-fit: cover;
	width: 600px;
	height: auto;
	border-radius: 20px;
	cursor: pointer;
	border: 0 solid #ccc;
}

#casestudies{
	width: 90%;
	margin: auto;
	border: 0 solid #333;
}

#specsheetstbl td{
	text-align: center;
}

#specsheets{
	width: 100%;
	margin: auto;
}

#sec13{
	width: 100%;
	display: flex;
	justify-content: space-between;
	border: 0 solid #333;

}

#sec12{
	width: 100%;
	display: flex;
	justify-content: space-between;
	border: 0 solid #333;

}

#sec1{
	width: 100%;
	display: flex;
	justify-content: space-between;
	border: 0 solid #333;

}

#paracontainer3{
	margin: auto;
	width: 100%;
	background: #EAEDF0;
	border: 0 solid #333;
}

#paracontainer2{
	margin: auto;
	width: 100%;
	border: 0 solid #333;
}

#paracontainer1{
	margin: auto;
	width: 100%;
	background: #EAEDF0;
	border: 0 solid #333;
}

#wellmodelingexpertise{
	width: 100%;
	margin: auto;
}

#proul{
	padding-left: 30px;
}

#prolist{
	font-size: 1.3em;
	margin-right: 20px;
	width: 50%;
	border: 0 solid #333;
}

#proslide{
	object-fit: cover;
	width: 50%;
	border: 0 solid #c30000;
}




.slideshowapc img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 5px;
}

.slideshowapc{
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 5px;
}

#proimgtxt{
	display: flex;
	justify-content: space-between;
	margin: auto;
	width: 100%;
	border: 0 solid #333;
}

#protxt{
	width: 100%;
	margin: auto;
}


#proimgm img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888;
}

#proimgm{
	object-fit: cover;
	width: 600px;
	height: 400px;
	border-radius: 20px;
	border: 0 solid #333;
}


#proimg img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888;
}

#proimg{
	object-fit: cover;
	width: 900px;
	height: 500px;
	border-radius: 20px;
	border: 0 solid #333;
}

#productsindiv{
	width: 90%;
	margin: auto;
	border: 0 solid #333;
}

#riafactsheetpic{
	display: inline-block;
	width: 75%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	
	background-image: url("../images/10.png");
	background-repeat: no-repeat;
	background-size: cover;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	border: 0 solid #333;
}

#pandrfactsheetpic{
	display: inline-block;
	width: 75%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	
	background-image: url("../images/10.png");
	background-repeat: no-repeat;
	background-size: cover;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	border: 0 solid #333;
}

#reqintakefactsheetpic{
	display: inline-block;
	width: 75%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	
	background-image: url("../images/08.png");
	background-repeat: no-repeat;
	background-size: cover;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	border: 0 solid #333;
}

#reqfactsheetpic{
	display: inline-block;
	width: 75%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	
	background-image: url("../images/07.png");
	background-repeat: no-repeat;
	background-size: cover;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	border: 0 solid #333;
}


.msipixx img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

.msipixx{
	object-fit: cover;
	width: 700px;
	height: 400px;
	border-radius: 20px;
	border: 0 solid #333;
}

.msipix img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

.msipix{
	object-fit: cover;
	width: 800px;
	height: 500px;
	border-radius: 20px;
	border: 0 solid #333;
}

#msipic{
	display: inline-block;
	width: 75%;
	height: 500px;
	/* margin: auto;  /* Magic! */
	
	background-image: url("../images/06.png");
	background-repeat: no-repeat;
	background-size: cover;
    background-position: center center;
	/* background-attachment: fixed; */
	/* border-radius: 10px; */
	border: 0 solid #333;
}

#servicesdiv{
	width: 90%;
	border: 0 solid #ccc;
}

#aboutdiv{
	width: 90%;
	border: 0 solid #ccc;
}

#aboutp{
	font-size: 1.5em;
	text-align: center;
	width: 80%;
	margin: auto;
	border: 0 solid #ccc;
}

#aboutbtn{
	display: block;
	text-align: center;
	width: 80%;
	margin: auto;
	border: 0 solid #ccc;
}

.factsheet:hover{
	background: #1672E4;
	color: #fff;
}

.factsheet{
	display: inline-block;
	font-size: 1.2em;
	color: #000;
	padding: 15px;
	width: fit-content;
	border-radius: 28px;
	background: #e0e0e0;
	cursor: pointer;
	border: 1px solid #333;
}

.aboutbtns:hover{
	background: #1672E4;
	color: #fff;
}

.aboutbtns{
	display: inline-block;
	font-size: 1.2em;
	color: #000;
	padding: 15px;
	width: 250px;
	border-radius: 28px;
	background: #e0e0e0;
	cursor: pointer;
	border: 1px solid #333;
}

.aboutpagepix{ /* pix */
	display: flex;
	width: 90%;
	margin: auto;
	justify-content: space-between;
	border: 0 solid #333;
}

#modusurveyguid{
	border: 0 solid #333;
	padding: 50px;
}

#wwtguid{
	border: 0 solid #333;
	padding: 50px;
}

#modusurveytxt{
	width: 40%;
	margin: auto;  /* Magic! */
}

#modum img{
	width:100%;
    height:100%;
	margin: auto;
	border-radius: 20px !important;
	box-shadow: 5px 5px 5px #888888 !important;
	}

#modum{
	object-fit: cover;
	width: 600px;
	height: 600px;

	border: 0 solid #c30000;
}

#modupc img{
	width:100%;
    height:100%;
	margin: auto;
	border-radius: 5px;
	box-shadow: 5px 5px 5px #888888;
	}

#modupc{
	object-fit: cover;
	width: 50%;
	border: 0 solid #c30000;
}

#modusurveypixm img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

#wwtpix video{
	border: 0 solid #c30000;
	/* box-shadow: 5px 5px 5px #888888; */
}

#wwtpix{
	object-fit: cover;
	width: 500px;
	height: fit-content;
	/* height: 500px; */
	border: 0 solid #c30000;
}

.wwtbgvm{
	right: 0; left: 0; top: 0;
	width: 100%; 
	height: 80%; 
	background: transparent;
	border: 0 solid #c30000;
	/* filter: grayscale(100%); */
}

#wwtpixm video{
	height: 100%;
	width: 600px;
	border: 0 solid #c30000;
}

#wwtpixm{
	padding: 0 !important;
	object-fit: cover;
	width: 600px;
	height: 420px;
	border: 0 solid green;
}

#modusurveypixmnew img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

#modusurveypixmnew{
	object-fit: cover;
	width: 600px;
	height: 600px;
	border-radius: 10px;
	border: 3px solid #333;
}

#modusurveypixm{
	object-fit: cover;
	width: 600px;
	height: 600px;
	border-radius: 10px;
	border: 5px solid #c30000;
}

#modusurveypix img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

#modusurveypix{
	object-fit: cover;
	width: 500px;
	height: 500px;
	border: 0 solid #333;
}


#wwttxt{
	width: 40%;
	margin: auto;  /* Magic! */
}

.fix{
	border: 0 solid #333;
}

.infoh{
	-webkit-transform: scaleY(0);
	-o-transform: scaleY(0);
	-ms-transform: scaleY(0);
	transform: scaleY(0);

	-webkit-transform-origin: top;
	-o-transform-origin: top;
	-ms-transform-origin: top;
	transform-origin: top;

	-webkit-transition: -webkit-transform 0.26s ease-out;
	-o-transition: -o-transform 0.26s ease;
	-ms-transition: -ms-transform 0.26s ease;
	transition: transform 0.26s ease;
	}
	
#info{
	display: none;
	background: #fff;
	z-index: 99999;
	top: 0;
	left: 0; right: 0;
	width: 100%;
	
	padding: 0;
	border-bottom: 1px solid #333;	
}

#info a:hover{
	/* font-weight: 700; */
	color: #000;
}

#info a{
	font-size: 1.3em;
	color: #7f8c8d;
	text-decoration: none;
}

#headertbl{
	margin: auto;
}

#logo{
	height: 100px;
	border: 0 solid #333;
}
	
.logo{
	width: fit-content;
	cursor: pointer;
	border: 0 solid #333;
}

.navbar{
	text-align: right !important;
	line-height: 1em;
	width: fit-content;
	height: fit-content;
	/* border: 1px solid #333; */
}

.spacer{
	color: #7f8c8d;
	text-decoration: none;
	font-size: 1.3em;
	font-weight: 500;
}

.logom{
	font-family: eras;
	font-size: 2em;
	line-height: 1em;
	padding-left: 30px;
	width: fit-content;
	border: 0 solid #333;
}

.navmob:hover{
	cursor: pointer;
}

.navmob{
	font-size: 2em;
	font-weight: 600;
	width: fit-content;
	line-height: 1em;
	border: 0 solid #000;
}

.headerm{
	display: flex;
	position: fixed;
	z-index: 1000;
	box-sizing: border-box;
	top: 0; margin: auto;
	/* justify-content: space-between; */
	margin: auto;
	padding: 10px;
	background: #36B8E9 !important;
	width: 100%;
	height: auto;
	border-bottom: 1px solid #ccc;
	
}

.header{
	position: fixed;
	margin: auto;
	top: 0; left: 0; right: 0;
	z-index: 9999;
	width: 95%;
	height: fit-content;
	background-color: #e0e0e0 !important; /* EAEDF0 */
	border-radius: 0 0 5px 5px;
	border: 0 solid #333;
}

.canvas{ /* magic */
	position: absolute;
	top: 0; left: 0; right: 0; margin: 0;
	z-index: 1;
	width: 100%;
	height: 850px;
	border: 0 solid #ccc;
}

#bgvm{
	right: 0; left: 0; top: 0;
	width: 100%; 
	min-height: 75%; 
	background: transparent;
	filter: brightness(50%);
	/* filter: grayscale(100%); */
}

#bgv123{
	right: 0; left: 0; top: 0;
	width: 100%; 
	min-height: 75%; 
	background: transparent;
	/* filter: grayscale(100%); */
}

#bgv{
	position: absolute;
	right: 0; left: 0;
	width: 100% !important;
	filter: brightness(50%);
	border: 0 solid #ffff00;
	/* filter: grayscale(100%); */
}

#wwtbgv{
	position: absolute;
	right: 0; left: 0;
	width: 100% !important;
	filter: brightness(50%);
	border: 0 solid #ffff00;
	/* filter: grayscale(100%); */
}



/* spinner */
.spinner{
	position: fixed;
	width: 100%;
	height: 100vh;
	z-index: 9999;
	text-align: center;
	
	background: #001f35;
	
	/* background-image: url("../images/spinner.jpg");
	background-size: 100% 100%;
	background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed; */
	
	
	/* background-image: -webkit-linear-gradient(145deg, #45A5FF, #32CCFE, #36B8E9);
    -webkit-animation: hue 5s infinite linear; */


	
	border: 0 solid #c30000;
}

/* @-webkit-keyframes hue {
    from {
      -webkit-filter: hue-rotate(0deg);
		}
    
    to {
      -webkit-filter: hue-rotate(360deg);
		}
	} */
	
/* lds */
.lds-roller {
  display: inline-block;
  position: relative;
  
    	margin: auto;
	left: 0;
	right: 0;
	top: 50%; transform: translateY(-50%);
	
	
  width: 80px;
  height: 80px;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* lds */

.lds-spinner {
  color: official;
  display: inline-block;
  position: relative;
  
  	margin: auto;
	left: 0;
	right: 0;
	top: 50%; transform: translateY(-50%);
	
  width: 80px;
  height: 80px;
}

.lds-spinner div {
  transform-origin: 40px 40px;
  animation: lds-spinner 1.2s linear infinite;
}
.lds-spinner div:after {
  content: " ";
  display: block;
  position: absolute;
  top: 3px;
  left: 37px;
  width: 6px;
  height: 18px;
  border-radius: 20%;
  background: #fff;
}
.lds-spinner div:nth-child(1) {
  transform: rotate(0deg);
  animation-delay: -1.1s;
}
.lds-spinner div:nth-child(2) {
  transform: rotate(30deg);
  animation-delay: -1s;
}
.lds-spinner div:nth-child(3) {
  transform: rotate(60deg);
  animation-delay: -0.9s;
}
.lds-spinner div:nth-child(4) {
  transform: rotate(90deg);
  animation-delay: -0.8s;
}
.lds-spinner div:nth-child(5) {
  transform: rotate(120deg);
  animation-delay: -0.7s;
}
.lds-spinner div:nth-child(6) {
  transform: rotate(150deg);
  animation-delay: -0.6s;
}
.lds-spinner div:nth-child(7) {
  transform: rotate(180deg);
  animation-delay: -0.5s;
}
.lds-spinner div:nth-child(8) {
  transform: rotate(210deg);
  animation-delay: -0.4s;
}
.lds-spinner div:nth-child(9) {
  transform: rotate(240deg);
  animation-delay: -0.3s;
}
.lds-spinner div:nth-child(10) {
  transform: rotate(270deg);
  animation-delay: -0.2s;
}
.lds-spinner div:nth-child(11) {
  transform: rotate(300deg);
  animation-delay: -0.1s;
}
.lds-spinner div:nth-child(12) {
  transform: rotate(330deg);
  animation-delay: 0s;
}
@keyframes lds-spinner {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* spinner */
.homeimg{
	position: relative;
	height:100vh;
	background-size: cover;
	background: rgba(0,0,0,1); /* 131C21 */
	/* background-image: url("../images/05.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
	filter: opacity(100%); */
	
	
	/* background: rgba(0,0,0,1); */
	border: 0 solid #ff0000;
}


.suezwelltoolsdiv{
	height:100vh;
	position: absolute;
	z-index: 1000;
	top: 60%; 
	transform: translateY(-50%);
	left: 0; right: 0;
	margin: auto;
	width: 100%;
	line-height: 1em;  
	border: 0 solid #ff0000;
	
	font-size: 5em;
	font-weight: 700;
	text-align: center;
	color: #fff;
}

/* .suezwelltoolsdiv{
	position: absolute;
	z-index: 1000;
	top: 50%; 
	transform: translateY(-50%);
	left: 0; right: 0;
	margin: auto;
	width: fit-content;
	line-height: 1em;  
	border: 0 solid #ff0000;
} */

#suezwelltoolsp{
	font-family: eras;
	font-size: 5em;
	color: #000;
	text-transform: uppercase;
	font-weight: 600;
	/* color: #36B8E9; */
	/* -webkit-text-fill-color: #1771E6;
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: #000; */
	
	/* -webkit-text-stroke: 0.5px #fff; */
}

#freezonecompanyp{
	font-family: titilliumsmib;
	font-size: 2.5em;
	letter-spacing: 10px;
}
	
#menubtn_back{
	position: fixed;
	z-index: 999999;
	right: 120px; bottom: 120px;
	width: fit-content;
	height: fit-content;
	padding: 20px;
	text-decoration: none;
	outline: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	}
	
#menubtn_back:hover{
	text-decoration: none;
	outline: none;
	}

.slide-up{
    bottom: 0px !important;
}

.slide-down{
    bottom: -475px !important;
}

/* pulsing */
/* x */
/* x */

.lds-ripple {
  display: inline-block;
  position: relative;
  width: 200px;
  height: 200px;
}

.lds-ripple div{
  position: absolute;
  border: 5px solid #000;
  opacity: 1;
  border-radius: 50%;
  animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
}

.lds-ripple div:nth-child(2) {
  animation-delay: -0.5s;
}

@keyframes lds-ripple {
  0% {
    top: 50px;
    left: 50px;
    width: 0;
    height: 0;
    opacity: 0;
  }
  4.9% {
    top: 50px;
    left: 50px;
    width: 0;
    height: 0;
    opacity: 0;
  }
  5% {
    top: 50px;
    left: 50px;
    width: 0;
    height: 0;
    opacity: 1;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 100px;
    height: 100px;
    opacity: 0;
  }
}
/* pulsing */

.backtop{
	display: none;
	position:fixed;
	z-index: 9999;
	left: 12px; bottom: 10px;
	
	width: 40px;
	height: 40px;
	padding: 10px;
	z-index: 1000;
	cursor: pointer;
	
	border-radius: 5px;
	
	background:#1cbfff url("../images/up.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
	opacity: 0.2;

	/* green color 00795f */
	}
	
.backtop:hover{
	opacity: 1.0;
	}

/* slider */
	
/* .alexm{
	z-index: 5001;
	top:0; right: 20px;
	display: block;
	width: -webkit-fit-content;
	width: fit-content;
	height: -webkit-fit-content;
	height: fit-content;
	line-height:1em;
	text-align: center;
	font-family: Arial;
	font-size:8em;
	font-weight: bold;
	user-select: none;
	cursor:default;
	color: #fff;
	/* border: 1px solid #000; */
	/* } */
	
	.fcont{
	/* border: 1px solid #000; */
	cursor:default;
	text-align: center;
	font-size:4em;
	/* letter-spacing: 30px; */
	color: #fff;
	}
/* jssor slider loading skin spin css */
        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from {
                transform: rotate(0deg);
            }

            to {
                transform: rotate(360deg);
            }
        }


        .jssorb032 {position:absolute;}
        .jssorb032 .i {position:absolute;cursor:pointer;}
        .jssorb032 .i .b {fill:#fff;fill-opacity:0.7;stroke:#000;stroke-width:1200;stroke-miterlimit:10;stroke-opacity:0.25;}
        .jssorb032 .i:hover .b {fill:#000;fill-opacity:.6;stroke:#fff;stroke-opacity:.35;}
        .jssorb032 .iav .b {fill:#000;fill-opacity:1;stroke:#fff;stroke-opacity:.35;}
        .jssorb032 .i.idn {opacity:.3;}
		
		
		.jssorb033 {position:absolute;}
        .jssorb033 .i {position:absolute;cursor:pointer;}
        .jssorb033 .i .b {fill:#fff;fill-opacity:0.7;stroke:#000;stroke-width:1200;stroke-miterlimit:10;stroke-opacity:0.25;}
        .jssorb033 .i:hover .b {fill:#000;fill-opacity:.6;stroke:#fff;stroke-opacity:.35;}
        .jssorb033 .iav .b {fill:#000;fill-opacity:1;stroke:#fff;stroke-opacity:.35;}
        .jssorb033 .i.idn {opacity:.3;}
		

        .jssora051 {display:block;position:absolute;cursor:pointer;}
        .jssora051 .a {fill:none;stroke:#fff;stroke-width:360;stroke-miterlimit:10;}
        .jssora051:hover {opacity:.8;}
        .jssora051.jssora051dn {opacity:.5;}
        .jssora051.jssora051ds {opacity:.3;pointer-events:none;}
		
		.jssora052 {display:block;position:absolute;cursor:pointer;}
        .jssora052 .a {fill:none;stroke:#FE5D00;stroke-width:360;stroke-miterlimit:10;}
        .jssora052:hover {opacity:.8;}
        .jssora052.jssora051dn {opacity:.5;}
        .jssora052.jssora051ds {opacity:.3;pointer-events:none;}
		
/* slider */

#wwtlist li{
	margin-bottom: 10px;
}


/* text slider */
.mySlides {display: none;}
.mySlidesm {display: none;}
img {vertical-align: middle;}

/* Slideshow container */
/* .slideshow-container {
	max-width: 1000px;
	position: relative;
	margin: auto;
} */

.slideshow-containerm{
	
	margin: auto;
	
	
	/* border: 1px solid #fff; */
}


#proslidemobile{
	width: 100%;
	height: 500px;
	border: 0 solid #333;
}


.slideshow-containerwwtmnew{
	width: 100% !important;
}

.slideshowpc{

width: 100% !important;
}


.slideshowa{
	width: 100% !important;
}

.slideshowapc{
	width: 100% !important;
}


#mudopxpc img{
	width: 100%;
	height: 100%;
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

#mudopxpc{

	width: 400px;
	height: 400px;
	border: 5px solid #333;	
}

#modupx img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

#modupx{
	width: 600px;
	height: 600px;
	border-radius: 10px;	
	border: 0 solid #c30000;
}

#modupxm img{
	border-radius: 20px;
	box-shadow: 5px 5px 5px #888888;
}

#modupxm{
	width: 600px;
	height: 600px;
	border-radius: 10px;	
	border: 0 solid #c30000;
}

.slideshowa img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.slideshow-containerwwtm{
	width: 100%;
	border: 0 solid #c30000;
}

.slideshow-containerwwt{
	width: 500px;
	height: 500px;
	left: 0;
}

.slideshow-container{
	position: absolute;
	margin: auto;
	width: 100%;
	font-family: eras;
	font-size: 1em;
	color: #fff;
	text-shadow: 3px 3px #000;
	top: 60%;
	/* border: 1px solid #fff; */
}

/* Caption text */
.textm {
	font-family: eras;
	color: #f2f2f2;
	font-size: 2em;
	padding: 8px 12px;
	position: absolute;
	bottom: 8px;
	width: 100%;
	text-align: center;
}

.text {
	font-family: eras;
	color: #f2f2f2;
	font-size: 2em;
	padding: 8px 12px;
	position: absolute;
	bottom: 8px;
	width: 100%;
	text-align: center;
}

/* Number text (1/3 etc) */
.numbertextm {
  color: #f2f2f2;
  font-size: 12px;

  position: absolute;
  top: 0;
}

.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dotm {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.activem {
  background-color: #717171;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fadem {
	animation-name: fade;
	animation-duration: 1.5s;
}

.fade {
	animation-name: fade;
	animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .3} 
  to {opacity: 1}
}
/* text slider */

/* ::-webkit-scrollbar-thumb {
    background-image: linear-gradient(180deg, #D0368A 0%, #708AD4 99%);
    box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);
    border-radius: 100px;
} */

/* products slider */

/* mobile */
/* .mobile{
	position: relative;
	display: none;
	background: rgba(0,0,0,0.1);
	border-radius: 20px;
	width: 80%;
	height: 80%;
} */
/* mobile */

/* @media only screen and (max-width: 600px){ */
/* media query */

#homebtnv a{
	text-decoration: none;
	color: transparent !important;
}

#homebtn{
	font-size: 4.5em;
	color: #000;
	
	text-decoration: none;
	
}

#menuin{
	position: absolute;
	width: 100%;
	height: auto;
	top: 50%; transform: translateY(-50%);
	color: #fff;
	text-align: center !important;
	border: 0 solid #fff;
}
	
.mobnavlnk:hover{
	background: #ffff00;
	border-bottom: 0 solid #c30000;
}

.mobnavlnk{
	width: 500px;
	padding: 20px;
	margin: auto;
	margin-bottom: 20px;
	font-size: 3em;
	color: #000;
	background: #e0e0e0;
	border-radius: 10px;
	
	border-bottom: 0 solid transparent;
}

#mobileul li a{
	display: block;
	text-decoration: none !important;

	font-size: 3em;
	color: #000;
	outline: none;
	
	width: 500px;
	padding: 10px;
	color: #000;
	background: #e0e0e0;
	border: 0 solid #ff0000 !important;
	border-radius: 20px !important;
	
	/* box-shadow:0px 0px 0px 5px black inset; */
	
	/* box-shadow: 3px 3px 3px #000; */
	
	/* background-image: -webkit-linear-gradient(145deg, #45A5FF, #32CCFE, #36B8E9);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
    -webkit-animation: hue 5s infinite linear;
	-webkit-text-stroke-color: #1ABC9C; */



/*	background-image: -webkit-linear-gradient(145deg, #45A5FF, #32CCFE, #36B8E9);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
    -webkit-animation: hue 5s infinite linear;
/* -webkit-text-stroke-color: #1ABC9C;  */

	/* text-shadow: 2px 2px 2px #888888; */
}

#mobileul li:last-child{
	border-bottom: 0 solid #000;
}

#mobileul li{
	white-space: nowrap;
	padding: 30px;
	width: fit-content;
	text-align: center;
	margin: auto;
	text-decoration: none;
	outline: none;
	Background-color: transparent !important;
	background: none;
	border-bottom: 0 solid #7f8c8d;

}

#mobileul ul{
	margin: 0;
	padding: 0;
	
}


@-webkit-keyframes hue {
    from {
      -webkit-filter: hue-rotate(0deg);
		}
    
    to {
      -webkit-filter: hue-rotate(360deg);
		}
	}

#navbarm{
	display: none;
	position: fixed;
	z-index: 99999;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 100% !important;

	overflow: hidden;
	background: #EAEDF0;
	/* background: #EAEDF0; */
	background: rgba(0,0,0,0.9);
	border: 0 solid #000;
}

#mobile{
	position: absolute;
	width: 100%;
	display: none;
}

/* mob */
@media screen and (max-width: 400px){
	body, html{
		zoom: 70%;
	}

	.header{
		display: none;
	}
	
	#navbarm{
		display: block;
	}

	.content{
		display: none
	}

	.spinner{
		height: 100% !important;
	}
	
	#pc{
		display: none;
	}
	
	#mobile{
		display: block;
	}

	#logo{
		width: 250px;
		height: 100px;
	}
	
	.gmap{
		width:100%;
		height: 500px;
		margin: 0 auto;
	}
		
	nav ul li a{
		color: #000;
		font-size: 1.5em;
	
	}
	
	.aboutspacerdiv{
		border: 0 solid #333;
		padding: 30px;
	}

	.spacerdiv{
		border: 0 solid #333;
		padding: 40px;
	}
	
	.homeimg{
		height: 400px !important;
		background: none;
	}
	
	.canvas{ /* magic */
		width: 100%;
		height: 400px !important;
	}
	
	.slider{
		height: 500px !important;
	}

	.slidetxt{
		top: 75%;
		transform: translateY(-50%);
	}
	
	.contenthome{
		/* position: absolute !important;
		top: 900px;
		margin: 0; left:0; right:0;
		padding: 0 !important; */
		zoom: 60%;
		/* border: 3px solid #333; */
		/* width: 75%; */
	}
	
	.suezwelltoolsdiv{
		height: 800px;
	}
	
	#homepage{
		display: none;
	}
	
	#homepagemobile{
		display: block;
		width: 100% !important;
	}
	
	.headoffice{
		margin-left: 25px;
	
	}
	
	.frmtxt{
		font-size: 2em;
	}
	
	.frmmessage{
		font-size: 2em;
	}
	
	.backtop{
		zoom: 200%;
	}
}

 /* tab */
@media screen and (min-width: 401px) and (max-width: 700px){
	body, html{
		zoom: 70% !important;
	}

	.header{
		display: none;
	}
	
	#navbarm{
		display: block;
	}
	
	.content{
		display: none
	}
			
	#pc{
		display: none;
	}
	
	#mobile{
		display: block;
	}
	
	#pc{
		display: none;
	}

	#logo{
		width: 250px;
		height: 100px;
	}
	
	.gmap{
		width:100%;
		height: 500px;
		margin: 0 auto;
	}
		
	nav ul li a{
		color: #000;
		font-size: 1.5em;
	
	}
	
	.aboutspacerdiv{
		border: 0 solid #333;
		padding: 30px;
	}

	.spacerdiv{
		border: 0 solid #333;
		padding: 40px;
	}
	
	.homeimg{
		height: 650px !important;
		background: none;
	}
	
	.canvas{ /* magic */
		width: 100%;
		height: 650px !important;
	}
	
	.slider{
		height: 650px !important;
	}

	.contenthome{
		/* position: absolute !important;
		top: 900px;
		margin: 0; left:0; right:0;
		padding: 0 !important; */
		zoom: 60%;
		/* border: 3px solid #333; */
		/* width: 75%; */
	}
	
	.suezwelltoolsdiv{
		height: 800px;
	}
	
	#homepage{
		display: none;
	}
	
	#homepagemobile{
		display: block;
		width: 100% !important;
	}
	
	.headoffice{
		margin-left: 25px;
	
	}
	
	.frmtxt{
		font-size: 2em;
	}
	
	.frmmessage{
		font-size: 2em;
	}


	.backtop{
		zoom: 200%;
	}
}

/* @media screen and (min-width: 1024px) and (max-width: 1280px){
	body, html{
		zoom: 80%;
	}
} */