@import url('https://fonts.googleapis.com/css2?family=Montserrat&family=Poppins&family=Protest+Revolution&display=swap');
*{
	margin: 0;
	padding: 0;
	font-family: 'Poppins', sans-serif;
}








/*navbar color*/

.head1{
/*	height: 150px;*/
/*	background: radial-gradient(circle at center, #44a4ff 0%, #62aef7 20%, #80b9f0 40%, #9dc4e8 60%, #bbcee1 80%);*/
	background-color: #fff;
/*	background-blend-mode: overlay;*/
	/*background: rgb(63,94,251);
    background: radial-gradient(circle, rgba(63,94,251,0.3617822128851541) 0%, rgba(3,0,21,1) 53%);*/
}
.head1 a{
	color: #332765;
}
.head1 a:hover{
	color: red;
}
.head1 .navactive{
	color: whitesmoke;
}


.sqer,.cs,.sqery,.sqe{
	position: relative;
	background-color: #000;
}
/*.qwe{
	height: 700px;
}*/
.cs:before{
/*	background-image: url(../image/cs.png);*/
background-image: url(../image/casebanner.avif);
	background-repeat: no-repeat;
  background-position: 50% 0;
  background-attachment: fixed;
  background-size: cover;
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0.7;
   filter: blur(5px);
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  -webkit-mask-image: linear-gradient(to left, #000);
          mask-image: linear-gradient(to left, #000);
}
.sqery:before{
	background-image: url(../image/service.avif);
background-repeat: no-repeat;
  background-position: 50% 0;
  background-attachment: ;
  background-size: cover;
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;

   
}

.sqe:before{
  background-image: url(../image/join.jpg);
background-repeat: no-repeat;
  background-position: 50% 0;
  background-attachment: ;
  background-size: cover;
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;

   
}
.sqer:before{

	background-image: url(../image/gsoarbanner.jpg);
	background-repeat: no-repeat;
  background-position: 50% 0;
  background-size: cover;
  background-attachment: ;

  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
 
   
}
		
	.display-1 {
		line-height: 1;
	}
	.pp li::marker{
		color: #d284fd;
	}
.sdf{
	position: relative;
}

.sdf .fffh{
	font-weight: 950; 
	font-size: 6.5em;
}


.scol{
	color: #0d6efd;
	font-weight: 550;
}

.cc{
	color: #5b96d6;
}
.sclo2{
	color: #5b96d6;
	text-shadow:100px white;
}
.section1{
	border: ;
	color: whitesmoke;
	height: 70px;
   /* background-image: linear-gradient(
  280deg,
  hsl(201deg 100% 51%) 0%,
  hsl(209deg 100% 62%) 0%,
  hsl(215deg 100% 68%) 1%,
  hsl(223deg 100% 73%) 2%,
  hsl(233deg 97% 77%) 2%,
  hsl(246deg 91% 78%) 3%,
  hsl(259deg 83% 75%) 4%,
  hsl(272deg 75% 73%) 6%,
  hsl(284deg 66% 70%) 7%,
  hsl(298deg 58% 67%) 8%,
  hsl(310deg 67% 68%) 10%,
  hsl(319deg 79% 69%) 12%,
  hsl(326deg 89% 69%) 14%,
  hsl(332deg 98% 70%) 17%,
  hsl(336deg 100% 70%) 20%,
  hsl(341deg 100% 69%) 24%,
  hsl(346deg 100% 69%) 29%,
  hsl(352deg 100% 69%) 35%,
  hsl(358deg 100% 70%) 43%,
  hsl(4deg 100% 68%) 56%,
  hsl(10deg 100% 65%) 80%,
  hsl(16deg 96% 62%) 100%
);*/
background-color: #fff;
}
.section2{
	background-image: url(../image/about.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
/*  position: relative;*/

/*	 padding: 25px;*/
	
  /*background-repeat: no-repeat;
  background-size: 100% 100%;*/
}
.section3{
	background-image: url(../image/mision.jpg);
	 background-position: right;
  background-repeat: no-repeat;
  background-size: cover;

/*  background-size: 60em;*/
}
.pp{ 
	background-color: ;
	background-image: url(../image/back.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;

}
.qq , .bg{
 background-color:#fff ;
}
.bb{
background: radial-gradient(circle at 100% 100%, #5c94e8 0, #5c94e8 27px, transparent 27px) 0% 0%/30px 30px no-repeat,
            radial-gradient(circle at 0 100%, #5c94e8 0, #5c94e8 27px, transparent 27px) 100% 0%/30px 30px no-repeat,
            radial-gradient(circle at 100% 0, #5c94e8 0, #5c94e8 27px, transparent 27px) 0% 100%/30px 30px no-repeat,
            radial-gradient(circle at 0 0, #5c94e8 0, #5c94e8 27px, transparent 27px) 100% 100%/30px 30px no-repeat,
            linear-gradient(#5c94e8, #5c94e8) 50% 50%/calc(100% - 6px) calc(100% - 60px) no-repeat,
            linear-gradient(#5c94e8, #5c94e8) 50% 50%/calc(100% - 60px) calc(100% - 6px) no-repeat,
            linear-gradient(116deg, #1d78ff 45%, #0a0b0b 100%);
border-radius: 30px;
padding: 20px;
box-sizing: border-box;

}
.oo{
	background: radial-gradient(circle at 100% 100%, #fff 0, #fff 27px, transparent 27px) 0% 0%/30px 30px no-repeat,
            radial-gradient(circle at 0 100%, #fff 0, #fff 27px, transparent 27px) 100% 0%/30px 30px no-repeat,
            radial-gradient(circle at 100% 0, #fff 0, #fff 27px, transparent 27px) 0% 100%/30px 30px no-repeat,
            radial-gradient(circle at 0 0, #fff 0, #fff 27px, transparent 27px) 100% 100%/30px 30px no-repeat,
            linear-gradient(#fff, #fff) 50% 50%/calc(100% - 6px) calc(100% - 60px) no-repeat,
            linear-gradient(#fff, #fff) 50% 50%/calc(100% - 60px) calc(100% - 6px) no-repeat,
            linear-gradient(116deg, #f94c10 16%, #0a0b0b 100%);
border-radius: 30px;
padding: 10px;
box-sizing: border-box;
}
.tt{
background: radial-gradient(circle at 100% 100%, #fff 0, #fff 26px, transparent 26px) 0% 0%/30px 30px no-repeat,
            radial-gradient(circle at 0 100%, #fff 0, #fff 26px, transparent 26px) 100% 0%/30px 30px no-repeat,
            radial-gradient(circle at 100% 0, #fff 0, #fff 26px, transparent 26px) 0% 100%/30px 30px no-repeat,
            radial-gradient(circle at 0 0, #fff 0, #fff 26px, transparent 26px) 100% 100%/30px 30px no-repeat,
            linear-gradient(#fff, #fff) 50% 50%/calc(100% - 8px) calc(100% - 60px) no-repeat,
            linear-gradient(#fff, #fff) 50% 50%/calc(100% - 60px) calc(100% - 8px) no-repeat,
            linear-gradient(300deg, #020202 45%, #ffffff 100%);
border-radius: 30px;


padding: 1px;
box-sizing: border-box;

}

.mn {
	background: rgb(67,140,247);
background: linear-gradient(90deg, rgba(67,140,247,1) 0%, rgba(137,180,243,1) 50%, rgba(67,140,247,1) 100%);	
}

.gradient-text {
  /* Fallback: Set a background color. */
  background-color: red;
  
  /* Create the gradient. */
  background-image: linear-gradient(45deg, #fff, gray);
  
  /* Set the background size and repeat properties. */
  background-size: 100%;
  background-repeat: repeat;

  /* Use the text as a mask for the background. */
  /* This will show the gradient as a text color rather than element bg. */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}
.gradient-text1 {
  /* Fallback: Set a background color. */

  
  /* Create the gradient. */
  background-image: linear-gradient(45deg, #808080, #808080);
  
  /* Set the background size and repeat properties. */
  background-size: 100%;
  background-repeat: repeat;

  /* Use the text as a mask for the background. */
  /* This will show the gradient as a text color rather than element bg. */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}
.gradient-text2 {
  /* Fallback: Set a background color. */
  background-color: red;
  
  /* Create the gradient. */
  background-image: linear-gradient(45deg, #cbcbcb, #ffffff);
  
  /* Set the background size and repeat properties. */
  background-size: 100%;
  background-repeat: repeat;

  /* Use the text as a mask for the background. */
  /* This will show the gradient as a text color rather than element bg. */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}
.gradient-text3 {
  /* Fallback: Set a background color. */
  background-color: red;
  
  /* Create the gradient. */
  background-image: linear-gradient(45deg, #652e19, #1438f1);
  
  /* Set the background size and repeat properties. */
  background-size: 100%;
  background-repeat: repeat;

  /* Use the text as a mask for the background. */
  /* This will show the gradient as a text color rather than element bg. */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}

/*whatsapp Button*/
.btnwhatsapp {
  background-color: #25d366; /* WhatsApp green color */
  color: #fff; /* White text color */
  border: none; /* No border */
  border-radius: 50px; /* Round button shape */
  padding: 10px 20px; /* Adjust padding as needed */
  font-size: 16px; /* Adjust font size as needed */
  transition: background-color 0.3s ease; /* Smooth transition effect */
}

.btnwhatsapp:hover {
  background-color: #128c7e; /* Darker WhatsApp green color on hover */
}


/*whatsapp Button*/



/**/





.wrapper a{
  display: block;
  width: 200px;
  height: 50px;
  line-height: 50px;
  font-weight: bold;
  text-decoration: none;
  background: #fff;
  text-align: center;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 20px;
/*  border: 1px solid #333;*/
  transition: all .35s;
}

.icon{
  width: 50px;
  height: 50px;
  border: 3px solid transparent;
  position: absolute;
  transform: rotate(45deg);
  right: 0;
  top: 0;
  z-index: -1;
  transition: all .35s;
}

.icon svg{
  width: 30px;
  position: absolute;
  top: calc(50% - 15px);
  left: calc(50% - 15px);
  transform: rotate(-45deg);
  fill: #2ecc71;
  transition: all .35s;
}

 .wrapper a:hover{
  width: 200px;
  border: 3px solid blueviolet;
  background: transparent;
  color: blueviolet;
}

.wrapper a:hover + .icon{
  border: 3px solid #2ecc71;
  right: -25%;
}

/*
*/

.ht{
		background-color:#3b97fe;

}


.jj{
	background-color:#fff ;
	height: 550px;
	
}
.ff{
	background: rgb(67,140,247);
background: linear-gradient(90deg, rgba(67,140,247,1) 0%, rgba(137,180,243,1) 50%, rgba(67,140,247,1) 100%);
}
.gg{
	background: linear-gradient(129deg, #585858 0%, #000000 41%);



}
.ss{
	box-shadow: -21px -5px 26px -3px rgba(0,0,0,0.54);
-webkit-box-shadow: -21px -5px 26px -3px rgba(0,0,0,0.54);
-moz-box-shadow: -21px -5px 26px -3px rgba(0,0,0,0.54);
}
/*#email,#Name,#Company,#Phone,#Service{

	background-color: #363636;
	padding: 15px 5px;
	color: white;
	padding-left: 30px;
	border: none;
}*/
/*#email::placeholder,#Name::placeholder,#Company::placeholder, #Phone::placeholder ,#Service::placeholder{
	color: white;
}*/
.hlast{
	background-color:gray ;
	padding: 0;
	margin: 0;
	color:#fff ;
}
.header-title{
	color:black;
}
p{
	color: #7e7e7e;
}
         
         .btn-grad {
            background-color: white;
            margin: 10px;
            padding: 15px 45px;
            text-align: center;
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: black;            
/*            box-shadow: 0 0 20px #eee;*/
            border-radius: 10px;
            display: block;
          }

          .btn-grad:hover {
            background-position: right center; /* change the direction of the change here */
            color: blueviolet;
            text-decoration: none;
          }

         
         .btn-gradw {
            background-image: linear-gradient(to right, #215f00 0%, #e4e4d9  51%, #215f00  100%);
            margin: 10px;
            padding: 30px 45px;
            text-align: center;
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;            
/*            box-shadow: 0 0 20px #eee;*/
            border-radius: 40px;
            display: block;
          }

          .btn-gradw:hover {
            background-position: right center; /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
          }
         

/*@media (min-width:320px)   /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */ 
/*@media (min-width:480px)   /* smartphones, Android phones, landscape iPhone */
/*@media (min-width:600px)   /* portrait tablets, portrait iPad, e-readers (Nook/Kindle), landscape 800x480 phones (Android) */ 
/*@media (min-width:801px)   /* tablet, landscape iPad, lo-res laptops ands desktops */ 
/*@media (min-width:1025px)  /* big landscape tablets, laptops, and desktops */ 
/*@media (min-width:1281px)  /* hi-res laptops and desktops */


@media (min-width:320px){
	.sdf .fffh,#q {
		font-weight: 700; 
	  font-size: 3em;
	  padding-left: 0px;

	 
	}
	.jj{
		display: none;
	}
	.gio{
		font-weight: 400; 
	  font-size: 1em;
	  padding-left: px;
	}
}
@media (min-width:768px){
	.jj{
	display: none;
	
}
.mkig{
	text-align: center;
}
}
@media(max-width:2200px){
  .loim{
    width: 160px;
    padding-left: 30px;
  }
@media(max-width:1500px){
  .loim{
    width: 140px;
    padding-left: 30px;
  }
@media(max-width:1200px){
  .loim{
    width: 120px;
    padding-left: 20px;
  }
@media(max-width:992px){
  .loim{
    width: 100px;
    padding-left: 10px;
  }
}
@media (max-width:768px){
	.loim{
		width: 80px;
	}
.kjhu{
	
	margin-left: -4em;
	margin-right: auto;
}
.kjhus{
	margin-left: auto;
	margin-right: auto;
}
.mn{
	height: auto;
}
}
@media (min-width:480px) {

	.sdf .fffh,,#q {
		font-weight: 700; 
	  font-size: 1em;
	  padding-left: 10px;

	  margin: 0;
	  padding: 0;
	}
	
	
}


@media (min-width:600px){

.sdf .fffh,#q{
		font-weight: 700; 
	  font-size: 5em;
	  
	}
}

@media (min-width:801px){
.sdf .fffh,#q{
		font-weight: 700; 
	  font-size: 3em;
	}
	#q{
		font-weight: 700; 
	  font-size: 3em;
	}
}


@media (min-width:1025px){

.sdf .fffh,#q{
		font-weight: 700; 
	  font-size: 4em;
	}
	#q{
		font-weight: 700; 
	  font-size: 4em;
	}
	.vfr{
		font-weight: 950; 
		font-size: 1em;
	}
	.pl{
		font-weight: 950; 
		font-size: 1em;
	}
}
@media (max-width:991px){
  .rio{
    background-color: black;
    padding-bottom: 20px;
  }
}

@media (min-width:1281px){
	.sdf .fffh{
		font-weight: 700; 
	  font-size: 5em;
	}
	#q{
		font-weight: 700; 
	  font-size: 5em;
	}
}