@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cantarell:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Balsamiq+Sans:wght@700&display=swap');
body{
  margin: 0;
  padding: 0; 
  box-sizing: border-box;
}
.class1{
	background: #e3010f;
	height: 5px;
	position: relative;
	z-index: 1;
}
.class2{
	background: #e3010f;
	position: absolute;
	right: 50;
	padding: 5px 10px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	color: #fff;
	font-weight: 600;
	z-index: 200;
}
.class2
span
a{
	color: #fff;
	text-decoration: none;
	  transition: all 300ms linear;
}
.class2
span a:hover {
	color: #000;
}
 
#slider{
	z-index: 1;
	margin-top: -190px;
}

#bottombg{
	background:#f5f5f5;
	z-index: 0;
	position: relative;
}

.class3
img{
	width: 90%;
	position: relative;
	z-index: -1;
}
.class4{
	padding-top: 50px;
}
.class5{
text-align: center;
}
.class5
h1{
	font-weight: 700;
	line-height: 1.58em;
	color: #e3010f;
	font-family: 'Impact';
}
.class5
h1
span{
	color: #e5e5e5;
	font-size: 2.8em;
	font-weight: 700;
}
.class5 p{
	color: #393939;
	font-weight: 600;
	line-height: 22px;
}
.class5
button{
	background: #ffda5c;
	border: none;
	border-radius: 10px;
	padding: 5px 20px;
	font-weight: 600;
	color: #0768a8;
	font-size: 35px;
	font-family: 'Bebas Kai';
}
.class5
button a{
	text-decoration: none;
		color: #e3010f;
		   transition: all 300ms linear;
}
.class5
button a:hover{
	color: #000;
}
.class5
button
img{
	margin-left: 10px;
}

#bottomfooterbg {
    background: #0768a8;
    margin-top: -5px; 
}

.class6{
	position: relative;
}
.class7{
	position: absolute;
	top: -50;
	right: 0;
}
.class8{
	position: absolute;
	right: 0;
	top: 100;
	left:170;
}
.class9{
	position: absolute;
	right: 0;
	bottom: 120;
	left:170;
}
.class10{
	position: relative;
	z-index: 1;
  animation: product 4s infinite;
   transition: all 300ms linear;
}
@keyframes product {
  0% {
  top: 0;
}
 
 50% {
  top: 20;
}
 
  100% {
  top: 0;
}
 
}
.class11{
	position: relative;
 	padding: 25px 20px 35px 15px;
}
.class12{
	position: absolute;
	right: 0;
	bottom: 25;
	right: 0;
}

.class13{
	text-align: center;
	margin-top: 100px;
}

.class14{
	position: relative;
	text-align: right;
	top: 0;
}

.class15{
	position: relative;
	left: 0;
}
.class16{
	position: relative;
	left: 20;
	top: 10;
}
.class17{
	position: relative;
	left: 20;
	top: 10;
}
.class18{
	position: absolute;
	bottom: 25;
	right: 0;
}
.class19{
	padding: 80px 0;
	background: #d87782;
}
.class20{
	text-align: center;
}
.class21{
	padding: 0;
}
.bx-wrapper .bx-pager {
    display: none;
    text-align: center;
    font-size: .85em;
    font-family: Arial;
    font-weight: bold;
    color: #666;
    padding-top: 20px;
}
.bx-wrapper {
    position: relative;
    margin-bottom: 0!important;
    padding: 0;
    *: ;
    zoom: 1;
}
.bx-wrapper {
    -moz-box-shadow: 0 0 0px #ccc!important;
    -webkit-box-shadow: 0 0 0px #ccc!important;
    box-shadow: 0 0 0px #ccc!important;
    border: 0px solid #fff8f8!important;
    background: transparent!important;
}
.cardimg img{
	text-align: center;
	margin: auto;
	padding: 15px 0 0 0;
}
.pro1bg{
	background:#fff990;
}

.pro2bg{
	background: #82e582;
}
.pro3bg{
	background: #d8453e;
}
.pro4bg{
	background: #7bd7ff;
}
.pro5bg{
	background:#ffdf9a;
}
.pro6bg{
	background: #bff266;
}
.pro7bg{
	background: #5ed579;
}
.pro8bg{
	background: #8b8ded;
}
.pro9bg{
	background: #68f1dc;
}
.pro10bg{
	background:#58b6f7;
}
.pro11bg{
	background: #ff8686;
}
.pro12bg{
	background:#4bd392;
}
.pro13bg{
	background: #fdd675;
}
.pro14bg{
	background:#45b5ff;
}
.pro15bg{
	background:#fd7de5;
}
.pro16bg{
	background: #8ed9ff;
}
.pro17bg{
	background: #e9a157;
}
.pro18bg{
	background: #bff266;
}
#footer{
	background: #f5f5f5;
}
.class22
p{
	text-align: center;
	padding-top:25px;
	font-weight: 500;
	color: #000;
}
.class22
p span{
	font-weight: bold;
	color: #f60009;
}

.class23{
	margin-top: 25px;
	margin-bottom: 25px;
}
.class25{
	position: absolute;
	top: 5px;
}
.class25
i{
	font-size: 35px;
	color: #f60009;
}
.class26{
	margin-left: 45px;
}
.class26 p{
	font-family: 'Rubik';
	font-weight: 600;
	color: #f60009;
}
.class26 h2{
	margin-top: -15px;
	color: #000;
	font-size: 18px;
}
.class26 h2 a{
	color: #000;
	transition: all 300ms linear;
	text-decoration: none;
}
.class26 h2 a:hover{
	color: #363636;
}


.class27{
	margin-top: 25px;
	margin-bottom: 25px;
}
.class28{
	position: absolute;
	top: 2px;
}
.class28
i{
	font-size: 45px;
	color: #f60009;
}
.class29{
	margin-left: 55px;
}
.class29 p{
	font-family: 'Rubik';
	font-weight: 600;
	color: #f60009;
}
.class29 h2{
	margin-top: -15px;
	color: #000;
	font-size: 18px;
}
.class29 h2 a{
	color: #000;
	transition: all 300ms linear;
	text-decoration: none;
}
.class29 h2 a:hover{
	color: #363636;
}

.class30{
	margin-top: 25px;
	margin-bottom: 25px;
}
.class31{
	position: absolute;
	top: 2px;
}
.class31
i{
	font-size: 45px;
	color: #f60009;
}
.class32{
	margin-left: 55px;
}
.class32 p{
	font-family: 'Rubik';
	font-weight: 600;
	color: #f60009;
}
.class32 h2{
	margin-top: -15px;
	color: #000;
	font-size: 18px;
}
 

.class33{
	background: #0768a8;
	padding-top: 10px;
	text-align: center;
	padding-bottom: 5px;

}
.class33
p{
	font-weight: 600;
	color: #fff;
}
.class33
p span{
	color: #ffdd20;
}
.class33
p span a{
	color: #ffdd20;
	text-decoration: none;
	transition: all 300ms linear;
}
.class33
p span a:hover{
	color: #000;
}


/*******about us************/
.innerbg{
	margin-top: -200px;
	height: 350px;
	position: relative;
	text-align: center;
}
.innerbg
h1{ 
	position: absolute;
	left: 30%;
	font-family: 'Balsamiq Sans', cursive;
	right: 30%;
	font-size: 55px;
	bottom: 50;
	font-weight: bold;
}
.innerbg
h1 span{
	font-size: 55px;
	color: #e3000f;
	position: relative;
	z-index: 1000000;
	font-family: 'Balsamiq Sans', cursive;
}
.innerbg
h1 span::before{
	content: " ";
	position: absolute;
	height: 15px;
	width: 15px;
	background: red;
	border-radius: 50%;
	z-index: -1;
	left: 0;
	background: #0274ba; 
background: -moz-radial-gradient(center, ellipse cover,  #ff0000 0%, #ff0000 100%); 
background: -webkit-radial-gradient(center, ellipse cover,  #ff0000 0%,#ff0000 100%); 
background: radial-gradient(ellipse at center,  #ff0000 0%,#ff0000 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0000', endColorstr='#ff0000',GradientType=1 ); 

  animation:innerani 3s ease-in-out infinite;;
   transition: all 300ms linear;
}
@keyframes innerani {
  0% {
  transform: scale(1.0);
}
 
 50% {  
  transform: scale(1.3);
}
 
 
}
.innerbg
h1 span::before:hover{
}
.class35{
	text-align: center;
	z-index: -1;
}
.class35
img{
	width: 80%;
}
.class36{
	margin-top: 50px;
}
.class37 h1{
	text-transform: uppercase;
	font-weight: bold;
	color: #0768a8;
}
.class37 p{
	color: #393939;
    font-weight: 600;
    line-height: 22px;
}
.class38{
	margin-top: 50px;
	text-align: right;
	border-right: 1px solid gray;
	border-bottom: 1px solid gray;
}

.class39 h1{
		color: #0768a8;
	text-transform: uppercase;
	font-weight: bold;
}
.class39 p{
	color: #393939;
    font-weight: 600;
    line-height: 22px;
}

.class40{
	margin-top: 50px;
	text-align: left;
	border-bottom: 1px solid gray;
}
.class41 h1{
		color: #0768a8;
	text-transform: uppercase;
	font-weight: bold;
}
.class41 p{
	color: #393939;
    font-weight: 600;
    line-height: 22px;
}

/*******distributor form*********/
.class44{
	margin-top: 50px;
margin-bottom: 50px;
}
.class45
h1{
color: #0768a8;
	text-transform: uppercase;
	font-weight: bold;
	text-align: center;
	margin-bottom: 50px;
}
.class45
form
input{
	border-radius: 0;
	border: 0; 
	border-bottom: 1px solid #606060;
	outline: none;
}
 .class45
form input:focus { 
    outline: none !important;
    border-color: #719ECE;
    box-shadow: 0 0 10px #719ECE;
 }

 .class46
button{
	background: red;
}

 .class46 button{
  position: relative;
  background:#0768a8;
  border: none;color: #fff;
  padding: 10px 50px;
  font-weight: bold;border-radius: 50px;
     transition: all 300ms linear;
}
 .class46 button:hover{color: #000;
 	background: transparent;
 }
 .class46 button::before {  
  transform: scaleX(0);

  transform-origin: bottom right;
}
 .class46 button:hover::before {
  transform: scaleX(1);
  transform-origin: bottom left;
}

 .class46 button::before {
  content: "";
  display: block;
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  inset: 0 0 0 0;
  border-radius: 50px;
  background: #fdd12d;
  z-index: -1; 
  transition: transform .3s ease;
}


/*********product************/

.class51{
	margin-bottom: 50px;
}
.class52{
	border-radius: 25px;
	text-align: center;
	padding-top: 35px;
  background: #fcfcfc;  
 background: -moz-radial-gradient(center, ellipse cover,  #fcfcfc 14%, #e0e0e0 100%); 
 background: -webkit-radial-gradient(center, ellipse cover,  #fcfcfc 14%,#e0e0e0 100%);  
 background: radial-gradient(ellipse at center,  #fcfcfc 14%,#e0e0e0 100%);  
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#e0e0e0',GradientType=1 ); 

}
.class52 img{
	width: 220px;
}
.class52:hover img{
  animation:imghoverani 3s ease-in-out 1;
   transition: all 300ms linear;
}
@keyframes imghoverani {
  0% {
  transform: scale(0.8);
}
25%{ 
	transform:scale3d(0.0, 0.5, 1.5);
}
 
 50% {  
  transform: scale(1);
}
}
 
.class52
h1{
	color: #fff;
	font-size: 25px;
	font-family: Bebas Kai;
	background: #cc2525;
	border-radius: 25px;
	padding: 10px 0;
}
.class52 h1 span{
	font-size: 20px;
}
#baguetteBox-overlay .full-image img {
    display: inline-block;
    width: auto;
    height: auto;
    max-height: 100%;
    background: #fff;
    padding: 25px;
    vertical-align: middle;
    -moz-box-shadow: 0 0 8px rgba(0,0,0,.6);
    box-shadow: 0 0 8px rgb(0 0 0 / 60%);
}


/************contact us***********/

.class61{
	margin-top: 50px;
	text-align: center;
	padding: 0 100px;
}
.class62
h1{
	font-size: 25px;
	color: #0768a8;
	text-transform: uppercase;
	font-weight: bold;
}
.class62 i{
	color: #fdd12d;
}
.class62:hover i{ 
	color: #000;
  animation:contaicon 3s ease-in-out 1;
   transition: all 300ms linear;
}
@keyframes contaicon {
  0% {
  		color: #fdd12d;
  transform: scale(0.8);
}
25%{ 

	transform:scale3d(0.0, 0.5, 1.5);
}
 
 50% {  
  transform: scale(1);
}
}




.class62 hr{
	width: 5%;
	margin-left: 0;
	height: 3px;
	background: red;
	margin-top: -5px;
}
 
 

.class62 p{
	margin-top: -5px;
	color: #393939;
    font-weight: 600;
    line-height: 22px;
}
.class62
p
a{
	color: #000;
	text-decoration: none;
}

.class63
h1{
	text-align: center;
	margin-top: 50px;
	color: #0768a8;
	text-transform: uppercase;
	font-weight: bold;
	text-align: center;
}

.class65
form
input{
	border-radius: 0;
	border: 0; 
	border-bottom: 1px solid #606060;
	outline: none;
}
 .class65
form input:focus { 
    outline: none !important;
    border-color: #719ECE;
    box-shadow: 0 0 10px #719ECE;
 }
.class65
form
textarea{
	border-radius: 0;
	border: 0; 
	border-bottom: 1px solid #606060;
	outline: none;
}
 .class65
form textarea:focus { 
    outline: none !important;
    border-color: #719ECE;
    box-shadow: 0 0 10px #719ECE;
 }

 .class66
button{
	background: red;
}

 .class66 button{
  position: relative;
  background:#0768a8;
  border: none;color: #fff;
  padding: 10px 50px;
  font-weight: bold;border-radius: 50px;
     transition: all 300ms linear;
}
 .class66 button:hover{color: #000;
 	background: transparent;
 }
 .class66 button::before {  
  transform: scaleX(0);

  transform-origin: bottom right;
}
 .class66 button:hover::before {
  transform: scaleX(1);
  transform-origin: bottom left;
}

 .class66 button::before {
  content: "";
  display: block;
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  inset: 0 0 0 0;
  border-radius: 50px;
  background: #fdd12d;
  z-index: -1; 
  transition: transform .3s ease;
}


/**********video*********/
.class75{
	margin-bottom: 50px;
}







/**********social icon****************/
/* fixed social*/
#fixed-social {
   position: fixed;
   top: 50%;z-index: 1000000;
}
#fixed-social i{
  padding-top: 10px;
}
#fixed-social a {
   color: #fff;
   display: block;
   height: 40px;
   position: relative;
   text-align: center;
    line-height: 40px;
   width: 40px;
   margin-bottom: 1px;
   z-index: 200000!important;
}
#fixed-social a:hover>span{
  visibility: visible;
  left: 41px;
  opacity: 1;
} 
#fixed-social a span {
  line-height: 40px;
    left: 60px;
    position: absolute;
    text-align: center;
    width: 120px;
    visibility: hidden;
    transition-duration: 0.5s;
    z-index: 10000;
    opacity: 0;
}
 .fixed-facebook{
  background-color: #4267B2;
 }
 .fixed-facebook span{
  background-color: #4267B2;
 }
 .fixed-insta{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8a3ab9+0,e95950+50,fccc63+100 */
background: rgb(138,58,185); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(138,58,185,1) 0%, rgba(233,89,80,1) 50%, rgba(252,204,99,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(138,58,185,1) 0%,rgba(233,89,80,1) 50%,rgba(252,204,99,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(138,58,185,1) 0%,rgba(233,89,80,1) 50%,rgba(252,204,99,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a3ab9', endColorstr='#fccc63',GradientType=0 ); /* IE6-9 */


 }
 .fixed-insta span{
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8a3ab9+0,e95950+50,fccc63+100 */
background: rgb(138,58,185); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(138,58,185,1) 0%, rgba(233,89,80,1) 50%, rgba(252,204,99,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(138,58,185,1) 0%,rgba(233,89,80,1) 50%,rgba(252,204,99,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(138,58,185,1) 0%,rgba(233,89,80,1) 50%,rgba(252,204,99,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8a3ab9', endColorstr='#fccc63',GradientType=0 ); /* IE6-9 */

 }
 .fixed-twitter{
  background-color: #1C9CEA;
 }
 .fixed-twitter span{
  background-color: #1C9CEA;
 }
 .fixed-youtube{
  background-color: red;

 }

 .fixed-youtube span{
  background-color: red;
 }
 .fixed-whatsapp {
  background-color: green;

 }
 .fixed-whatsapp span{
  background-color: green;
 }