.cat_section { display: flex; align-content: center; justify-content: space-between; padding-bottom: 100px; position: relative; }
.img_box {position: relative; flex: 0.45; display: flex; align-items: center; z-index: 1; justify-content: center; min-height: 250px; }
.img_box a { position:absolute; width:100%; height:100%; }
.cat_content { flex: 0.45; display: flex; justify-content: center; flex-direction: column; z-index: 1; }
.cat_icon { height: 100px; text-align: left; border-radius: 10px; box-shadow: 2px 5px 10px 2px #aaa; overflow: hidden; display: inline-block; }
.cat_icon img { max-height: 100%; }
.cat_img { text-align: center; position: relative; margin: 0px; opacity: 1; transition: all 500ms linear; width: 100%; }
.cat_img.right { margin-right: -500px; opacity: 0; }
.cat_img.left { margin-left: -500px; opacity: 0; }
.cat_img img { width: 80%; max-width:300px; }
.cat_img_bg { position: absolute; left: calc(50% - 175px); top: calc(50% - 175px); width: 350px; height: 350px; border-radius: 50%; background: #81cdff; z-index: -1; }
.cat_title { font-size: 75px; padding: 25px 0; line-height: 1; }
.sub_title { font-size: 25px; line-height: 29px; color: #545454; margin-bottom: 20px; }
.cat_description { font-size: 18px; line-height: 21px; color: #545454; text-align: justify; }
.btn_box { margin-top: 35px; display: flex; justify-content: flex-end; }
.more_btn { background: #545454; box-sizing: border-box; border-radius: 26px; color: #ffff; width: 135px; height: 45px; display: flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition: color 300ms; transition: color 300ms; -webkit-transform: translateZ(0); transform: translateZ(0); text-decoration: none !important; transition: background 400ms linear; }
.more_btn:hover { color: #000; background: transparent; border: 1px solid #000; }

.section_box { position: relative; overflow: hidden; }
.section_bg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; }
.section_bg video { width: 100%; height: 100%; object-fit: cover; object-position: center; }

canvas { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100% !important; }

.sponsors-carousel .owl-stage { display: flex !important; flex-direction: row; align-items: center; }
.sponsors-section li img { max-height: 100px; }
.banner_background { position: absolute; left: 0%; top: 0%; background: rgba(0,0,0,0.5); margin-top: 50px; }

@media only screen and (max-width: 767px) {
  .section_box:nth-child(even) .cat_section { flex-flow: column-reverse; }
  .section_box:nth-child(odd) .cat_section { flex-direction: column; }

  .icon_box { margin: auto; }
  .img_box { margin: 50px auto; }
  .cat_title { font-size: 40px; text-align: center; }
  .cat_content { margin-top: 50px; }
}

@media (min-width: 1440px) {
  .container { width: 85%; min-width: 1170px; }
}

.logo_box { margin: 5px; padding: 10px; box-shadow: 1px 0px 5px 2px #ccc; width: calc(100% - 10px); height: 120px; display: flex; align-items: center; justify-content: center; }

.demo_box { display: block; text-align: center; margin-top: 100px; transition: margin 500ms ease-in-out; }
.demo_box.deactive { margin-top: -100px; display: none; }
.demo_btn { display: inline-block; padding: 15px 36px 11px; background: #8baad6; color: #fff; font-weight: bold; border-radius: 30px; font-size: 16px; border: 2px solid #8baad6; cursor: pointer; transition: all 300ms ease; }
.demo_btn:hover { background: transparent; color: #8baad6; }
.demo_btn i { float: right; margin-top: -2px; margin-left: 20px; }
.demo_form { height: 500px; margin-top: -600px; opacity: 0; background-position: center; background-size: cover; transition: margin 500ms ease-in-out; }
.demo_form.active { opacity: 1; margin-top: 0px; }

.demo_step { margin: 0px; width: 100%; display: flex; justify-content: space-around; }
.demo_step li { display: inline-block; width: 25px; height: 25px; background: #eee; color: #000; border-radius: 50%; text-align: center; line-height: 25px; }

.cat_icon_box { display: flex; align-items: center; justify-content: center; padding: 20px 0; }
.cat_icon_checkbox { color: green; width:40px; }
.cat_icon_img { width:100px; padding: 0 15px; }
.cat_icon_text { font-size: 16px; font-weight: bold; font-family: arial; flex: 1; line-height:1.5; }


@media only screen and (max-width: 500px) {
  .cat_icon_checkbox { width:30px; }
  .cat_icon_text { font-size:12px; }
  .cat_icon_img { padding:0 2px; width:50px; }
}

.cat_icon_box .cat_icon_checkbox, .cat_icon_box .cat_icon_text { opacity: 0; animation-duration: 10s; animation-timing-function:linear; animation-iteration-count:infinite; }

.cat_icon_box.a1 .cat_icon_checkbox, .cat_icon_box.a1 .cat_icon_text { animation-name: fadeIn1; }
.cat_icon_box.a2 .cat_icon_checkbox, .cat_icon_box.a2 .cat_icon_text { animation-name: fadeIn2; animation-delay:0.5s; }
.cat_icon_box.a3 .cat_icon_checkbox, .cat_icon_box.a3 .cat_icon_text { animation-name: fadeIn3; animation-delay:1s; }
.cat_icon_box.a4 .cat_icon_checkbox, .cat_icon_box.a4 .cat_icon_text { animation-name: fadeIn4; animation-delay:1.5s; }
.cat_icon_box.a5 .cat_icon_checkbox, .cat_icon_box.a5 .cat_icon_text { animation-name: fadeIn5; animation-delay:2s; }
.cat_icon_box.a6 .cat_icon_checkbox, .cat_icon_box.a6 .cat_icon_text { animation-name: fadeIn6; animation-delay:2.5s; }


@keyframes fadeIn1 {
  0% { opacity:0; }
  10% { opacity:0; }
  30% { opacity:1; }
  100% { opacity: 1; }
}

@keyframes fadeIn2 {
  0% { opacity:0; }
  10% { opacity:0; }
  30% { opacity:1; }
  95% { opacity: 1; }
  95.1% { opacity: 0; }
}

@keyframes fadeIn3 {
  0% { opacity:0; }
  10% { opacity:0; }
  30% { opacity:1; }
  90% { opacity: 1; }
  90.1% { opacity: 0; }
}

@keyframes fadeIn4 {
  0% { opacity:0; }
  10% { opacity:0; }
  30% { opacity:1; }
  85% { opacity: 1; }
  85.1% { opacity: 0; }
}

@keyframes fadeIn5 {
  0% { opacity:0; }
  10% { opacity:0; }
  30% { opacity:1; }
  80% { opacity: 1; }
  80.1% { opacity: 0; }
}

@keyframes fadeIn6 {
  0% { opacity:0; }
  10% { opacity:0; }
  30% { opacity:1; }
  75% { opacity: 1; }
  75.1% { opacity: 0; }
}






