// <uniquifier>: Use a uniquifier for the class name
// <weight>: Use a value from 100 to 900

.work-sans-<uniquifier> {
  font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight:  500;
  font-style: normal;
}
		


/* default color: #b6d54b  */
.bg-color,
section.bg-color,
section.call-to-action,
#mainmenu li li a:hover,
#mainmenu ul li:hover > a,
.price-row,
.slider-info .text1,
.btn-primary,
.bg-id-color,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.dropcap,
.fullwidthbanner-container a.btn,
.feature-box-big-icon i,
#testimonial-full,
.icon-deco i,
.feature-box-small-icon .border,
.small-border,
#jpreBar,
.date-post,
.team-list .small-border,
.de-team-list .small-border,
.btn-line:hover,a.btn-line:hover,
.btn-line.hover,a.btn-line.hover,
.owl-arrow span,
.de-progress .progress-bar,
#btn-close-x:hover,
.box-fx .info,
.btn-more,
.widget .small-border,
.product img:hover,
#btn-search,
.de_tab.timeline li.active .dot,
.btn-id,
.tiny-border,
#back-to-top,
#subheader .small-border-deco span,
#services-list li a:hover,
.timeline .tl-block .tl-line,
.de_tab.tab_style_2 .de_nav li.active span,
.de_tab.tab_steps.style-2 .de_nav li.active span,
.feature-box-small-icon.style-2 .number.bg-color,
a.btn-custom,.btn-custom,
span.overlay,
.owl-custom-nav .btn-next:before,
.owl-custom-nav .btn-prev:before,
.timeline > li > .timeline-badge,
.de_light  .de_tab.tab_style_3 .de_nav li.active span,
.de_tab.tab_style_4 .de_nav li.active span,
.circle,
.social-icons-sm i:hover,
.btn-rsvp,
.btn-close,
.pricing-s1 .ribbon,
.de_tab.tab_style_4 .de_nav li.active,
#preloader .s1 span,
header.smaller #mainmenu a span
{
	background-color:#b6d54b ;
}

.feature-box i,
#mainmenu li:hover > ul,
header.smaller #mainmenu li:hover > a,
.date-box .day,
.slider_text h1,
.id-color,
h1.id-color,h2.id-color,h3.id-color,h4.id-color,
.pricing-box li h1,
.title span,
i.large:hover,
.feature-box-small-icon-2 i,
address span i,
.pricing-dark .pricing-box li.price-row,
.ratings i,
header.smaller #mainmenu a.active,
.pricing-dark .pricing-box li.price-row,
.dark .feature-box-small-icon i,
a.btn-slider:after,
.box-icon-simple i,
a.btn-line:after,
.team-list .social a,
.de_contact_info i,
.dark .btn-line:hover:after, .dark a.btn-line:hover:after, .dark a.btn-line.hover:after,
a.btn-text:after,
.separator span  i,
address span strong,
.de_tab.tab_steps .de_nav li span:hover,
.de_testi_by,
.widget_tags li a,
.dark .btn-line:after, .dark  a.btn-line:after,
.crumb a,
.btn-right:after,
.btn-left:before,
#mainmenu li a:after,
header .info .social i:hover,
#back-to-top:hover:before,
#services-list li.active,
#services-list li.active a:after,
.testimonial-list:before,
span.deco-big,
h2.hs1 span,
.wm,.wm2,
.blog-list .date-box .day,
.social-icons-sm i,
.pricing-s1 .top .price .currency,
.de_tab.tab_style_4 .de_nav li span,
.schedule-item .sc-name,
.de_testi.opt-2 blockquote:before,
.pricing-s1 .bottom i,
.profile_pic .subtitle,
.countdown-s3 .countdown-period,
.countdown-s4 .countdown-period,
.social-icons i:hover
{
	color:#b6d54b;
}

.feature-box i,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus
.feature-box-big-icon i:after,
.btn-line:hover,a.btn-line:hover,
.btn-line.hover,a.btn-line.hover,
.product img:hover,
#contact_form input[type=text]:focus,#contact_form textarea:focus, #search:focus,
#contact_form .de_light input[type=text]:focus, #contact_form .de_lighttextarea:focus, #contact_form .de_light #search:focus,
.form-transparent input[type=text]:focus, .form-transparent textarea:focus, .form-transparent input[type=email]:focus,
.de_tab.tab_steps.style-2 .de_nav li.active span,
#filters a.selected,
.social-icons-sm i,
.box-border,
.de_tab.tab_style_4 .de_nav,
.exp-box h5,
.social-icons i:hover
{

	border-color:#b6d54b ;
}
.exp-box p
{

font-size: 17px}

.box-fx .inner,
.dark .box-fx .inner,
.blog-list img,
.arrow-up,
.de_light  .de_tab.tab_style_2 .de_nav li.active span,
.timeline > li > .timeline-panel,
.separator span:before,
.separator span:after,
.de_light .separator span:before,
.de_light .separator span:after,
.text-light .separator span:before,
.text-light .separator span:after ,
.form-underline input[type=text]:focus, .form-underline textarea:focus, .form-underline input[type=email]:focus, .form-underline select:focus
{
	border-bottom-color:#b6d54b ;
}

.arrow-down,
.preloader1{
	border-top-color:#b6d54b ;
}

.callbacks_nav {
	background-color:#b6d54b ;
}


.de_tab .de_nav li span {
border-top: 3px solid #b6d54b ;
}

.feature-box-big-icon i:after {
border-color: #b6d54b  transparent; /*same colour as the lower of the bubble's gradient*/
}

.de_review li.active img{
	border:solid 4px #b6d54b ;
}

.de_tab.tab_style_4 .de_nav li{
border-right-color:#b6d54b ;
}

blockquote{
border-left-color:#b6d54b;
}


span.overlay,
.feature-box:hover .inner,
.btn-custom.color-2,
a.btn-custom.color-2{
	background:#084b95;
	font-family: Arial, Helvetica, sans-serif;
}


// <uniquifier>: Use a uniquifier for the class name
// <weight>: Use a value from 100 to 900

.work-sans-<uniquifier> {
  font-family: "Work Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight:  500;
  font-style: normal;
}
		
:root {
  --primary-color: #09294c;
text-align: center;
}

#lvideo-wrap {
  position: fixed;
  height: 100dvh;
  z-index: 9991;
  opacity: 0;
  visibility: hidden;
	
	
	

  &,
  &:after,
  .lvideo-overlay {
    left: 0;
    top: 0;
    width: 100%;
    transition: all 0.3s ease-in-out;
    box-sizing: border-box;

  }

  &:after,
  .lvideo-overlay {
    height: 100%;
    position: absolute;
  }

  &:after {
    content: "";
    display: block;
    background-color: var(--primary-color);
    opacity: 0;
    z-index: -1;
  }

  .lvideo-container {
    height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  video,
  iframe {
    border-radius: 12px;
    position: relative;
    box-sizing: border-box;
    background-color: #134b94;

    z-index: 10;
    box-shadow: 0 0 19px rgba(0, 0, 0, 0.16);
    display: block;
    max-width: 1280px;
    height: auto;
    width: 90%;
    aspect-ratio: 16 / 9;
  }

  video {
    object-fit: cover;
  }

  .lvideo-close {
    background-color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 5%;
    top: 5%;
    width: 42px;
    height: 42px;
    border-radius: 100%;
    border: solid 2px var(--primary-color);
    padding: 0;
    transition: all 0.3s ease-in-out;
    z-index: 150;
    &:before,
    &:after {
      content: "";
      width: 60%;
      height: 3px;
      background-color: var(--primary-color);
      position: absolute;
      transition: all 0.3s ease-in-out;
    }
    &:before {
      transform: rotate(42deg);
    }
    &:after {
      transform: rotate(-42deg);
    }
    &:focus {
      outline: none;
    }

    &:hover {
      background-color: var(--primary-color);
      &:before,
      &:after {
        background-color: #b6d54b;
      }
    }
  }

  &.active {
    opacity: 1;
    visibility: visible;

    &:after {
      opacity: 0.5;
    }
  }
}


.play-btn-animated {
  width: 100px;
  height: 100px;
  margin-left: auto;
  margin-right: auto;
  background-color: #b6d54b;
  border-radius: 100px;
  transition: all 0.3s ease;
  line-height: 100px;
  position: relative;
  padding: 0;
  cursor: pointer;
  border: 0;
		  align: center;

  &:before,
  &:after {
    content: "";
    border: 1px solid;
    border-color: #b6d54b;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1;
    animation: 1s it-zoom linear infinite;
	  align: center;
  }

  &:before {
    animation-delay: 0.5s;
  }

  &:hover {
    transform: scale(1.1);
  }
  i {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 0 15px 15px;
    border-color: transparent transparent transparent #333;
    margin: auto;
  }
}

@keyframes it-zoom {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}
video {
  top: 0;
  left: 0;
   width: 100%;
    height: auto;

}