/*This is the links*/
@font-face {
	font-family:robotothin;
	src:url(Fontdesign/Basic/Roboto/Roboto-Thin.ttf);
}
@font-face {
	font-family:fira-bold;
	src:url(Fontdesign/Basic/fira/FiraSans-SemiBold.ttf);
}
@font-face {
	font-family:Os;
	src:url(Fontdesign/Basic/fira/FiraSans-Medium.ttf);
}
@font-face {
	font-family:fira-book;
	src:url(Fontdesign/Basic/fira/FiraSans-Light.ttf);
}

@font-face {
	font-family:fira-regular;
	src:url(Fontdesign/Basic/fira/FiraSans-Regular.ttf);
}


/*Custom Scroller*/

/* width */
body::-webkit-scrollbar {
  width: 5px;
  
}
/* Track */
body::-webkit-scrollbar-track {
  box-shadow: inset 0px 0 1px #eeeeee; 
  background-color:white;
  
}
#privacy h1{
	font-size:40px;
}
#privacy h2{
	font-size:18px;
}
#privacy p{
	font:bold 14px fira-book;
}
#privacy {
	margin:20% 5% 0 5%;
}
#careerpic {
	background-image:url("../Image/career.jpg");
	background-size:cover;
	height:200px;
	
}

#sectorpic {
	background-image:url("../Image/sector.jpg");
	background-size:cover;
	background-repeat:no-repeat;
	background-position:0 -20px;
	height:200px;
}
#aboutuspic{
	background-image:url("../Image/About.jpg");
	background-size:cover;
	background-repeat:no-repeat;
	background-position:0 -20px;

	height:200px;
}
#careerpic h1, #sectorpic h1, #aboutuspic h1{
text-align:center;

font:bold 40px fira-bold;
padding-top:20%;
color:white;
text-shadow:0 0 3px black;
margin-bottom:3%;

}
#sectorpic {
	margin-bottom:5%;
}
.sectorparagraph {
font:25px fira-book;
}
.container {
	width:100%;
	height:250px;

}
.container p {
font:bold 15px fira-book;
text-align:center;
margin:5%;
}
.container div:hover{
opacity:0.7;
transition:opacity 0.3s;
}
#sector1,#sector2, #sector3, #sector4,#sector5, #sector6, #sector7,#sector8{
	margin:2%;
	box-shadow:0 0 1px black;
	border-radius:10px;
	height:200px !important; width:95%;
	
}
.sectorbutton {
	text-align:center !important;
	margin:auto !important;
	width:40% !important;
	padding:2% !important;
}
#viewsector summary {
	text-align:center;
	padding:1%;
	width:10%;
	margin:auto;
	color:white;
	background-color:black;
	font:18px fira-bold;
	cursor:pointer;
}
#viewsector summary:hover {

	background-color:#ffba00 ;
	transition:background 0.3s;
	
}

#sector1 {
	background-image:url("../Image/FoodSolutions.jpg");
	background-size:cover;

	


}
#sector2 {
	background-image:url("../Image/Health&Wellness.jpg");
	background-size:cover;

	

}
#sector3 {
	background-image:url("../Image/Nutracueticalss.jpg");
	background-size:cover;


}
#sector4 {
	background-image:url("../Image/Construction.jpg");
	background-size:cover;

	


}
#sector5 {
	background-image:url("../Image/Renewable Energy.jpg");
	background-size:cover;

	


}
#sector6 {
	background-image:url("../Image/Organic Fertilizer.jpg");
	background-size:cover;

	


}
#sector7{
	background-image:url("../Image/Travel & Tourism.jpg");
	background-size:cover;

	


}
#sector8 {
	background-image:url("../Image/ME.jpg");
	background-size:cover;

	


}

.left-align{
text-align:left !important;
margin-left:5% !important;
padding:0% !important;
}
/* Handle */
body::-webkit-scrollbar-thumb {
  background: #343434; 
  border-radius: 10px;
}
/* Handle on hover */
body::-webkit-scrollbar-thumb:hover {
  background: #222222; 
}
/* width */
div::-webkit-scrollbar {
  width: 1px;
  
}
/* Track */
div::-webkit-scrollbar-track {
  box-shadow: inset 0px 0 1px #eeeeee; 
  background-color:white;
  
}
/* Handle */
div::-webkit-scrollbar-thumb {
  background: #343434; 
  border-radius: 10px;
}
/* Handle on hover */
div::-webkit-scrollbar-thumb:hover {
  background: #222222; 
}
.opening-contact {
	background-image:url("../Image/tel.jpg");
	background-size:cover;
	background-position:0px 00px;
	width:100%;
	height:200px;
}

.opening-contact h1{
	text-align:center;
	padding:20%;
	color:white;
	font:40px fira-bold ;
	text-shadow:0 0 5px black;
}

html {
  scroll-behavior:smooth;
}
body {
	margin:0;
	animation:slider 10s infinite;
  scroll-behavior:smooth;
  font-family:fira-book;

}

video {
  object-fit: cover;
  width: 100%;
  height: 100vh;
position:absolute;

  top: 0%;
  left: 0;
}
.viewport-header {
  position: relative;
 
}
body {

margin:0%;
padding:0%;
overflow-x:none;
box-sizing:border-box;
}
.block {
width:100%;
height:100%;
background-color:white;
box-sizing:border-box;
}
.firstBlock {
width:100%;
height:100%;
background-color:white;
margin:auto;

}
.firstBlock h2{

font:bold 40px;
text-align:center;
padding:2%;
}

#homeblock {
	
background-color:transparent;
}
.secondBlock{

margin:auto;
height:100%;
box-sizing:border-box;
}
.forthBlock{


margin:auto;
height:120%;
box-sizing:border-box;

}

.secondBlock h2, .thirdBlock h2, .forthblock h2{

font:bold 40px fira-book;
text-align:center;
margin-top:5%;
padding:2%;

}
.thirdBlock {

box-sizing:border-box;
background-color:white;


}

.firstBlock p{

font:bold 20px fira-book;
text-align:center;
color:white;
padding:2%;
}
.secondBlock p{

font:bold 20px fira-book;
text-align:center;
margin:5%;
}
.secondBlock img{
object-fit:cover;
}
#slidebrands img {
width:100%;
 justify-contents: space-evenly;
}
.secondBlock img:hover{
opacity:0.6;
transition:opacity 0.3s;
}

.secondBlock li{

font: 20px fira-book;
list-style-type:circle;
margin:1%;
}
.secondBlock ul{


margin:2%;
}
.navfloat {
position:fixed;
top:0%;
margin:0;
background-color:rgba(0,0,0,0.4);
right:0%;
width:100%;
display:block;
padding:0.5%;
z-index:10;



}
.innerblock {
	z-index:1;
	padding:15%;
	margin:0% 2% 2% 2%;
}
.block {
	z-index:2;
}
.innerblock h1{
	z-index:2;
	
}
.innerblock p {
	z-index:2;
}
.downbutton {
font:bold 30px arial;
text-align:center;
color:white;
border:3px solid white;
width:200px;
margin:auto;
padding:1%;
margin-bottom:5%;
display:block;
height:40px;
font:20px fira-book;
text-decoration:none

}	
.navfloat .navlinks {
	display:inline-block;

	padding:4% 0.5%;
	font:13px fira-regular;
	color:white;
	text-decoration:none;

}
.navfloat .navlinks:hover {
	background-color:#ffba00;
	color:white;
	transition:background 0.3s, color 0.3s;
	

}
#logo {
	display:inline-block;
	float:left;
	padding:1%;
	margin-left:1%;
	font:bold 18px fira-book;
	color:black;
	text-decoration:none;
	
}
#alignlogo{
	width:100px;
	margin:-20px 0 -20px -15px;
}
#aboutusmain h2 {
	font:bold 20px fira-book
}
#aboutusmain h3 {
text-align:center;
font:bold 17px fira-book;
}

#aboutusmain p {
	margin:2% 5% 5% 5%; 
	font:bold 15px fira-book;
	
}
.footer {
	background-color:black;
	

	bottom:0;
	
	padding:5% 5% 20% 5%;
	
font:17px fira-book;
	
	
}
.mobileedit60 {
 width:100% !important;
}
footer{
	background-color:#ffba00;
	
	margin:0 0 -5px 0;
	padding:5px 0 -0px 0;
	text-align:center;
	color:white;
	
}
footer a{
	text-decoration:none;
	font:bold 15px fira-book;
	text-align:left;
	color:black;
	float:left;
	margin-bottom:0px;

	
}
.break {
	height:50px;
}
footer p{
	text-align:left;
	color:black;
font:bold 15px fira-book;

	
}
footer .flex {
margin: 1% 0 0% 2.5%;
justify-content:left !important;
align-items:start !important;
}
.word-spacing {
	display:inline-block;
width:25px;}
.footerContainer a {
	color:white;
	width:100%;
	text-decoration:none;
	display:block;
	padding:1%;
	margin:5px 0%;
	font:14px fira-book;
	text-align:left;
	line-height:25px;
}
.footerContainer a:hover {
opacity:0.6;
}
.footerContainer  {
margin:0;
padding:0%;
}

.footerContainer p  {
color:white;
font-size:14px;
}

/* Slideshow container */
.slideshow-container {
  position: relative;
  background: transparent;
  width:100%;
  height:110%;
  margin:auto;
  z-index:3;
  
}

/* Slides */
.mySlides {
  display: none;
  padding: 5px;
  text-align: center;
  width:90%;
  opacity:0.1;
  margin:auto;
  z-index:3;
}

.mySlides P{
	font:bold 25px fira-book;

text-align:justify;
margin:2% 5% 5% 2%;
text-align:center;
	z-index:3;
}

/* Next & previous buttons */
.prev, .next {
	
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: 40px;
  height:40px;
  text-align:center;
  margin-top: -30px;
  padding: 16px;
  color: #888;
  font-weight: bold;
  font-size: 20px;
  border-radius:400px;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  position: absolute;
  right: 0;
  border-radius:400px;
  width: 40px;
  height:40px;
  text-align:center;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: #454545;
  color: white;
}

/* The dot/bullet/indicator container */
.dot-container {
  text-align: center;
  padding:20px 0;
  background: white;
  width:90%;
  margin:auto;
}


/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 5px;
  width:55px;
  margin: 0 2px;
  background-color: #bbb;
  
  display: inline-block;
  transition: background-color 0.6s ease;
}

/* Add a background color to the active dot/circle */
.active, .dot:hover {
  background-color: #717171;
}

/* Add an italic font style to all quotes */
q {font-style: italic;
font:bold 15px fira-book;
color:black;
text-align:justify;
margin:2% 1% 5% 1%;
text-align:center;
}


/* Add a blue color to the author */
.author {color: cornflowerblue;}
.flex {
	display:flex;
	flex-direction:column;
	justify-content:space-evenly;

}
.aboutus {
	margin:0;
	background-color:#c9c9c9;
	width:100%;

	padding:0;
	
}
#subaboutus{
	font:bold 30px fira-book;
	text-align:left;
	margin:1%;
	padding:0%
	
	
}
.aboutus p{
	font:bold 20px fira-book;
	text-align:justify;
	margin:2%;
	
}
#learnmore{
	text-decoration:none;
	width:40px;
	padding:1%;
	margin:10% 0%;
	color:black;
	font-weight:bold;
	
	
border:1px solid black;
	
}
#learnmore:hover{
	background-color:black;
	color:white;
	transition:background 0.3s, color 0.3s;
	

}
.aboutus img {
	width:30%;
	height:60%;
margin:0% 0%;
	border:1px solid black;
	float:left;
	
}
.featurecontainer {
	width:200px;
	height:200px;
	overflow-x:auto;
	margin:auto;
	object-fit:cover;
	justify-contents:center !important;
	
	}

	[type='email'] {
		width:100%;
		padding:5%;
	
		border:1px solid white;
		margin:1%;
		font:20px fira-book;
	}
	[type='email']:focus {
		transition: border 0.3s;
		color:white;
		background-color:black;
	
		border:1px solid white;
		
	}
	[type='submit'] {
		width:50%;
		padding:3%;
		font:20px fira-book;
		text-align:center;
		background-color:black;
		border:1px solid white;
		color:white;
		display:block;
		margin:3% auto;
	}
	[type='submit']:hover {
		transition:background 0.3s, color 0.3s;
		background-color:white;
		border:1px solid white;
		color:black;
		
	}
	#sociallinks{
		width:75%;
		display:flex;
        

		justify-content:left;
		
		
	}
	#flink {
		    display: flex;
    flex-direction: row;
    justify-content: left !important;
	}
	#aboutus {
		
		background-color:gray;
		width:100%;
	}

	#sociallinks a{
		color:white;
		display:inline-block;
		width:20%;
		
		font:30px fira-book;
		text-decoration:none;
	}
	.fab, .far {
    font-weight: 400;
    font-size: 30px;
	margin-right:5%;
}
	
.mySlides img {
width:40%;
object-fit:contain;
}	
.mySlides h3 {
font:bold 40px fira-book;
margin:5%;
text-align:center;
}	
	
	
/* Set a style for all buttons */
button {
  background-color: #4CAF50;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
  opacity: 0.9;
}

button:hover {
  opacity:1;
}
button:active{
	border:none;
	outline:none;
}

/* Float cancel and delete buttons and add an equal width */
.cancelbtn, .deletebtn {
 
  width: 50%;
}

/* Add a color to the delete button */
.deletebtn {
	 font-family:fira-book;
  background-color: #f44336;
}

/* Add padding and center-align text to the container */
.container {

  text-align: center;
}

/* The Modal (background) */
.modal {
  font-family:fira-book;	
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: none; /* Enable scroll if needed */
  background-color: transparent;
  padding-top: 50px;
}

/* Modal Content/Box */
.modal-content {
  background-color: #fefefe;
  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

.modal-content-leader {
  background-color: #fefefe;
  margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
  border: 1px solid #888;
  height:70%;
  width: 60%; /* Could be more or less, depending on screen size */
}
.modal-content-leader p {
text-align:center;
margin:10% important!;

}
.modal-content-leader img {
  float:left;
  width:40%;
  height:100%;
  margin:0;
  border:1px solid black;
}

/* Style the horizontal ruler */
hr {
  border: 1px solid #f1f1f1;
  margin-bottom: 25px;
}
 
/* The Modal Close Button (x) */
.close {
  position: relative;
left:200px;
  font-size: 40px;
  font-weight: bold;
 color:black;
}

.close:hover,
.close:focus {
  color: #f44336;
  cursor: pointer;
}

/* Clear floats */
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

/* Change styles for cancel button and delete button on extra small screens */
@media screen and (max-width: 300px) {
  .cancelbtn, .deletebtn {
     width: 100%;
  }
}

#identityabout {
width:90%;
height:60%;
background-color:gray;
border:1px solid black;
margin-bottom:10%;
}
.brandicon img{
	width:200px;
}
.brandicon img:hover{
	width:300px;
	transition:width 0.3s;
}
#branddrop summary {
	font:20px fira-book;
	text-align:center;
	margin:4%;
	border:none;
	outline:none;
	opacity:0.5;
}
#branddrop summary:focus {
	opacity:1;

	
}
#branddrop summary:hover {
	opacity:1;
	transition:opacity 0.3s;

	
}
#branddrop  {
	
	margin:5%;
}
#branddrop p {
	font:15px fira-book;
	text-align:center;
	margin:4%;
}
.sideproductlinks a{
	display:block;
	color:black;
	padding:2%;
text-decoration:none;	
text-align:center;

	
}
.sideproductlinks a:focus{
opacity:0.5;

transition:opacity 0.5s;
}
.sideproductlinks .productheading{
	text-align:left;
	text-align:center;
margin:0%;	

margin-left:-5%;	

	
}
.sideproductlinks{
	width:40%;

	top:20%;
	
	
	
}
#productlist {
overflow-x:auto;
width:50%;
float:left;

}
#productlist .productcontainer {
	background-color:#fdfdfd;
	padding:1%;

	box-sizing:border-box;
	overflow:hidden;
	height:150px;
	width:50%;
	margin:1%;
	float:left;
}
 .productcontainer img{
object-fit:cover;
	width:30%;
	
}


#productlist .productcontainer img {
	float:left;
	width:30%;
	margin:4%;

border-radius:10px;
box-shadow:0 0 3px #cfcfcf;
	
}
#productlist .productcontainer p {
	
	
	font:15px fira-book;
	margin:5% 1%;
}
.normalblock {
	
	margin:5%;
	
}
.normalblock h2 {
	
	font:30px fira-book;
	
	
}
.normalblock p {
	font:15px fira-book;
	
	
}
#slideshow {
	margin:auto;
	
}

.slidecontainer {
	animation:effect 8s alternate infinite;

background-color:white;
	height:450px;
	width:100%;
	position:relative;
	border-radius:5px;
	margin:auto;
	z-index:3;
}
.slideimage  {
	
	border:2px solid black;

	height:90%;
	width:40%;
	border-radius:10px;
	z-index:3;
	margin: 2%;

	
}
.slidetext  {
	
	font:25px fira-book;
	width:50%;
	text-align:justify;
	

	
}
.slidecontainer p {
		z-index:3;
	font:bold 18px fira-book;
	line-height:26px;
	margin: 2%;
    
	
}
.button {
	text-decoration:none;
	margin:2% auto;
	padding:2%;
	color:white;
	background-color:black;
	display:block;
	width:40%;
	font-weight:bold;
	
}
.button:hover {
	background-color:#ffba00;
	transition:background 0.3s;
	
}
#animationbox1 {
	position:absolute;
	width:500px;
	height:500px;
	top:6%;
	left:0%;
	background-color:#f1f1f1;
	border-radius:7px;
	z-index:-1;
	animation:leftblock ease-in 5s infinite;
	
	
}
#animationbox2 {
	position:absolute;
	top:20%;
	left:33%;
	width:500px;
	height:300px;
	background-color:#c1c1c1;
	border-radius:7px;
	z-index:-1;
	animation:rightblock ease-out 5s infinite;
	
	
}

.fa {
	margin:0%;
	border-radius:1000px;
	width:50px;
	height:50px;
}

.left {
text-align:center;
}
label {
	font:20px ralwayregular;
}

#pagenav {
    position:fixed;
	top:15%;
	left:2%;
	background-color:black;
color:white;
border-radius:10px;
	font:15px fira-book;
	padding:1%;
	text-align:center;
}
.pagelinks{
font:bold 15px fira-book;
cursor:pointer;

}
.pagelinks:hover{
opacity:0.7;
transition:opacity 0.3s;
}
.footer h3 {
	font:bold 15px fira-book;
	color:white;
	text-align:left;
	margin-top:5%;
}
.footer img{
	display:none;
	margin: -60px 0 30px 0px ;
	width:100px;
}
i {
	color:white;
	font-size:30px;
}
#heading {
	margin-top:50%;
font-size:32px; 
text-align:left;}
#openinghook {
	font-size:15px;
	text-align:left; ;
}

.innerblock h1{
	font:bold 40px fira-bold;
	color:white;
	text-shadow:0 0 2px black;
	text-align:center;
}
.innerblock pre{
	font:bold 40px fira-bold;
	color:white;
	text-shadow:0 0 2px black;
	text-align:center;
}
.secondBlock h1{
	font:60px fira-bold;
	text-align:center;
	padding-top:5%;
	
}
.frame {
	border:none;
	width:1000px;
	height:600px;
	margin-left:-100px;
	overflow-x:hidden;
}
.detail {
	display:block;
	margin:auto;
	background:#8410b5;
	color:white;
	width:40%;
	padding:2%;
	text-align:center;
	text-decoration:none;
	margin-top:10%;
	
	
}
#careermain h1 {
	font:bold 30px fira-book;
margin-bottom:3%;
	text-align:center;
}
#careermain h2 {
	font:bold 30px fira-book;
	text-align:center;
}
#careermain p {
	font:bold 14px fira-book;
	text-align:center;
	margin:0 5% 3% 5%;;
}
.valuebox {
	box-shadow:0 0 2px #adadad;
	border-radius:4px;
	padding:3%;
	width:60%;
	margin: 5% auto;
	
	background-color:white;
}
#jobs h1 {
	text-align:center;
	font-size:40px;
}
#jobs p{
	text-align:center;
	font:bold 15px fira-book;
}
.valuebox:hover {
opacity:0.8;
}
.valuebox img {
	width:80px; 
	display:block;
	margin:auto !important;
}
.valuebox h4 {
	text-align:center;
}
#coremain p {
	
	text-align:center;
	font:bold 15px fira-book;
	margin: 1% 5% 5% 5%;
}
#coremain {
	background-color:rgba(255, 186, 0, 0.1);
	bored-radius:7px;
	padding:2% 10% 10% 10%;
	margin:2%;
	
}
p {
	line-height:26px !important;
}
.slidecontainer {
margin-top:5% !IMPORTANT;
height:370px !important; }
.slidecontainer .left{
text-align:left;
width:90%;
font-size:14px;
}
.slidecontainer h2{
vertical-align:center;
text-align:left !important;
margin-bottom:5%;
font-size26px;

}
.dot-container{
text-align:left !important;
position:absolute;
font-size:18px;
left:25%;
width:50% !important;
display:inline-block;

}
.dot-container .dot {
width:30px;
}
.slidecontainer ul{

text-align:left !important;
}
.left-align{
text-align:left !important;
margin-left:5% !important;
padding:0% !important;
}
form img {

margin-right:5% !important;
}
form h1 {

text-align:left;
}
.sectorparagraph {
text-align:center;
margin:5%;
font:bold 15px fira-book !important;
}
.left-align{
text-align:left !important;
margin-left:5% !important;
padding:0% !important;
}
#imageslide {
display:none;}
#erase {
	display:none;
}
.largecontainer {
width:70%;
margin:5% auto !important;
}
#mobilealign .leftheading, #mobilealign .left {
	text-align:center !important;
	
}
#description h2 {
	font-size:20px !important;
	text-align:left;
	margin:5% 3% 1% 3%;
}
#description {
	padding-top:1%;
	padding-bottom:1%;
}
#description h3 {
	text-align:left;
	font-size:16px !important;
	margin:-5px 3% 1% 5%;
}
#description p {
	font-size:12px !important;
}