@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'Josefin Sans';
    src: url('../fonts/JosefinSans-Regular.woff2') format('woff2'),
        url('../fonts/JosefinSans-Regular.woff') format('woff'),
        url('../fonts/JosefinSans-Regular.ttf') format('truetype'),
        url('../fonts/JosefinSans-Regular.svg#JosefinSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Josefin Sans';
    src: url('../fonts/JosefinSans-SemiBold.woff2') format('woff2'),
        url('../fonts/JosefinSans-SemiBold.woff') format('woff'),
        url('../fonts/JosefinSans-SemiBold.ttf') format('truetype'),
        url('../fonts/JosefinSans-SemiBold.svg#JosefinSans-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Josefin Sans';
    src: url('../fonts/JosefinSans-Bold.woff2') format('woff2'),
        url('../fonts/JosefinSans-Bold.woff') format('woff'),
        url('../fonts/JosefinSans-Bold.ttf') format('truetype'),
        url('../fonts/JosefinSans-Bold.svg#JosefinSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



body{ 
    font-family: 'Josefin Sans';
    font-weight: normal;
    font-style: normal;
background-image:url(../images/bakground.svg);
background-position:top; background-repeat:no-repeat;
background-size: contain;
font-size:17px;
}
h1{ 
    font-family: 'Josefin Sans';
    font-weight: bold;
}


/* #Navigation
================================================== */

.start-header {
	opacity: 1;
	transform: translateY(0);


	-webkit-transition : all 0.3s ease-out;
	transition : all 0.3s ease-out;
}
.start-header.scroll-on {
	box-shadow: 0 5px 10px 0 rgba(138, 155, 165, 0.15);
	    background: white !important;
	-webkit-transition : all 0.3s ease-out;
	transition : all 0.3s ease-out;
}
.start-header .navbar-brand-items-center img{
	width:234px;
	-webkit-transition : all 0.3s ease-out;
	transition : all 0.3s ease-out;
}

.start-header.scroll-on .navbar-brand-items-center img{
	width:180px;
	-webkit-transition : all 0.3s ease-out;
	transition : all 0.3s ease-out;
}
.bg-header{
	background-color:transparent;
	
}
.start-header.scroll-on.bg-header {
	background-color:#fff;
}
.navigation-wrap{
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 1000;
	-webkit-transition : all 0.3s ease-out;
	transition : all 0.3s ease-out;padding-left: 30px;
    padding-right: 40px;
}
.top-p{
	padding-top:8rem;
}

.nav-hover{
	position:relative;
}
.nav-hover:hover:after{
	    bottom: 0;
    opacity: 1;
	
}
.nav-hover:hover:after{
content:"";
	position:absolute;
	background-image:url(../images/navbarline-new.svg);
	top:35px;
	background-repeat:no-repeat;
	transition: all 200ms linear;
	height: 2px;
    width: 100%;
    left: 16px;
}

.nav-link{
color:#3e0205;}

.nav-link::after{
  color:#3e0205;}

.theme-color{
color:#b72b28;
}
.gray-color{
color:#7C8087;
}
.theme-btn{
background-color:#b72b28;
border-color:#b72b28;}
.theme-btn:hover{
background-color:#ff6b86 ;
border-color:#ff6b86;}

.card-size{
height:180px;}

.lms-box{
background-color:#b72b28;
border-radius:20px;
color:#ffffff;
background-image:url(../images/lms-bg.svg);
background-repeat:no-repeat;
background-position: left;
background-position-y: bottom;
background-size: 80px;
    width: 55%;
    float: left;
}
.lxp-box{
background-color:#fff;
border-radius:20px;
color:#b72b28;
background-image:url(../images/lxp-bg.png);
background-repeat:no-repeat;
background-position: left;
background-position-y: bottom;
background-size: 80px;
    width: 55%;
    float: right;
    position: absolute;
    right: 0;
    top: 30%;
}

.lms-cont .lms-des{
width:75%;
}


#myCarousel2 .carousel-control-next, .carousel-control-prev {
    top:auto;
    bottom: -26px;
	    width: 85%;
  
}
.card-cover{ border-radius:14px;}
.card-hover{
 cursor: pointer;
}
.card-hover:hover .f-icons .icon-bg{
 background-color:#b72b28;
 cursor: pointer;
}
.card-hover:hover .key-icons .icon-bg{
 background-color:#b72b28;
 cursor: pointer;
}
.card-hover:hover .key-icons .filter-green img{
        filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(10000%) contrast(119%);
    }
.card-hover:hover .key-icons .change-color h5{
 color:#370f16;
}
.card-hover:hover .key-icons .change-color ul{
 color:#7C8087;
}
.card-hover:hover .f-icons .filter-green img{
        filter: invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(10000%) contrast(119%);
    }
.card-hover:hover .text-secondary{
 color:#b72b28!important;
}
.f-icons .icon-bg{
    background-color: #FFFFFF;
    padding: 30px 14px 14px;
    border-radius: 0 0 20px 20px;
	display: inline-block;
	cursor: pointer;

}
.f-icons .icon-bg img{
height:46px;
width:36px;
}
.key-icons .icon-bg{
    background-color: #FFFFFF;
    padding: 30px 14px 14px;
    border-radius: 0 0 20px 20px;
	display: inline-block;
	cursor: pointer;
	float:left;

}
.key-icons .icon-bg img{
height:46px;
width:36px;
}
.key-fun li{
line-height:2.5;
}
.key-fun ul li{
list-style-image:url(../images/point.svg);
background-repeat:no-repeat;
}
/*
.box-fd{
width:31.33333333%;
float:left;
margin:1%;
height:200px;}

.bd-highlight{
height:174px;}

.box-fd{
height:210px;}
*/

#keyfunctionalities .card{
background: #FFFFFF;
box-shadow: 0px 8px 40px rgba(0, 0, 0, 0.05);
border-radius: 15px;
}
/*--------Industries section--------*/

.container .title{
  color: #1a1a1a;
  text-align: center;
  margin-bottom: 10px;
}

.content {
  position: relative;
  max-width: 400px;
  height:280px;
  margin: auto;
  overflow: hidden;
}

.content .content-overlay {
  background: #b72b28;
      border-radius: 14px;
  position: absolute;
    height: 92%;
    width: 94%;
    left: 6px;
    top: 12px;
  bottom: 0;
  right: 0;
  opacity: 0;
  -webkit-transition: all 0.4s ease-in-out 0s;
  -moz-transition: all 0.4s ease-in-out 0s;
  transition: all 0.4s ease-in-out 0s;
}

.content:hover .content-overlay{
  opacity: 1;
}

.content-image{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content-details {
  position: absolute;
  text-align: center;
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.content:hover .content-details{
  top: 50%;
  left: 50%;
  opacity: 1;
}



.fadeIn-bottom{
  top: 80%;
}

.fadeIn-top{
  top: 20%;
}

.fadeIn-left{
  left: 20%;
}

.fadeIn-right{
  left: 80%;
}

@media only screen and (max-width: 768px) {
.nav-hover:hover:after{
    left: 44%;
}
.content .content-overlay {
  background: #b72b28;
      border-radius: 14px;
  position: absolute;
    height: 92%;
    width: 96%;
    left: 6px;
    top: 12px;
  bottom: 0;
  right: 0;
  opacity: 0;
  -webkit-transition: all 0.4s ease-in-out 0s;
  -moz-transition: all 0.4s ease-in-out 0s;
  transition: all 0.4s ease-in-out 0s;
}

.content .content-overlay{
  opacity: 1;
}


.content-details {
  position: absolute;
  text-align: center;
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.content .content-details{
  top: 50%;
  left: 50%;
  opacity: 1;
}

  .container-scroll {
    overflow-x: auto;
  }
  .container-scroll .columns-16 {
    width: 133.33333333vw;  /* = 100vw * 16/12 */
  }
  .container-scroll .columns-24 {
    width: 440vw;  /* = 100vw * 24/12 */
  }
  .container-scroll .col {
    width: 86.66666667vw !important;
  }

}


/*--------contact section--------*/

.contact-bg{
background-color:#F3F3F3;
}
.front img{
position:absolute;
top:44%;
right: 24px;
height: 30px;
}
.contact-bg-white{
width:82%;}
.contact-bg-back{
    height: 400px;
    background-color: #fff!important;
}
.note-bg{
    background-color: #D3E2FF;
    color: #b72b28;
    position: absolute;
    top: 40%;
    width: 580px;
    left: 25%;
    text-align: center;
	line-height: 2;
}
.food-note{
width:75%}
.cnt-flip{
 height:500px;
    position: relative;
    -ms-perspective: 800px;
    perspective: 800px;
    border-radius: 4px;
}
.clickflip{
  width: 100%;
  height: 100%;
  position: absolute;
  transform-style: preserve-3d;
  transition: transform 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
 /* cursor: pointer;*/
}
.clickflip .contact-bg{
background-color:#F3F3F3;
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 16px;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -o-box-pack: center;
  justify-content: center;
  -o-box-align: center;
  -webkit-font-smoothing: antialiased;
  color: #47525d;
}
.clickflip .back {
  transform: rotateY(180deg);
}
.clickflip.flipped {
  transform: rotateY(180deg);
}
.name input, .email input, .comment textarea{
background: #FFFFFF;
box-shadow: 0px 8px 40px rgba(0, 0, 0, 0.05);
border-radius: 10px;
border:none;
}
.comment textarea{
height:220px!important;
}
.back img{
position: absolute;
    top: 0;
    right: 0;
    width: 55px;

}
.click{
	cursor: pointer;
}
.footerline{
box-shadow: 0px -4px 6px 0px rgba(233,233,233,0.75);
-webkit-box-shadow: 0px -4px 6px 0px rgba(233,233,233,0.75);
-moz-box-shadow: 0px -4px 6px 0px rgba(233,233,233,0.75);
border-radius: 20px;
}
.getintouch{
    position: absolute;
    top: 20px;
}

@media only screen and (max-width: 768px) {
.note-cn{display:none;}
.py-xs-0{ padding-top:90px!important; padding-bottom:0px!important;}
.navigation-wrap{
	padding-left: 10px;
    padding-right: 10px;
}
.lms-box {

    background-position: unset;
    background-position-y: bottom;
    background-size: auto;
    width: 100%;
    float: none;
}
.lxp-box {
    width: 100%;
    float: none;
    position: relative;
    right: 0;
    top: 20px;
}
.lms-cont .lms-des{
width:100%;
margin-top:40px;
}
.lms-cont .lxp-des{
width:100%;
margin-top:40px;
}
.contact-bg img {
    right: -2px;
}
.lms-box h4, .lxp-box h4{
height:50px;}


.f-icons .icon-bg {
    padding: 10px 14px 14px;
    margin-left: 10px;
}
.f-icons .icon-bg img{
height:38px;
}
.box-fd h5{
font-size:18px;
}
.box-fd {
    height: 160px;
}
.food-note{
width:100%}

.comment textarea {
    height: 170px!important;
}
.contact-img{
display:none;}

}

@media only screen and (max-width: 425px) {

    }
@media (min-width: 768px) and (max-width: 1024px){
.mutlicarousel h5{font-size:14px;}
/* #myCarousel .carousel-inner .carousel-item .col-md-2{width:60%;} */
.contact-img{
display:block;}
.navbar-expand-sm .navbar-nav .nav-link {
    font-size: 13px;
}
.py-xs-0 {
    padding-top: 140px!important;

}
.start-header .navbar-brand-items-center img {
    width: 164px;
}
.start-header.scroll-on .navbar-brand-items-center img {
    width: 140px;
}
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
.mutlicarousel h5{font-size:14px;}

.contact-img{
display:block;}
.navbar-expand-sm .navbar-nav .nav-link {
    font-size: 13px;
}
.container-scroll .col {
    width: 55.666667vw !important;
}


}
@media (min-width: 640px) and (max-width: 768px) and (orientation: landscape) {

.py-xs-0 {
    padding-top: 140px!important;

}
.start-header .navbar-brand-items-center img {
    width: 154px;
}
.start-header.scroll-on .navbar-brand-items-center img {
    width: 130px;
}
.container-scroll .col {
    width: 55.666667vw !important;
}
.navbar-expand-sm .navbar-nav .nav-link {
    font-size: 13px;
}
}