/* Table of Content
==================================================
	#Font-Face
	#Site Styles
	#Media Queries */

/* #Font-Face
================================================== */
html { background-color: #fff; }

/* #Site Styles
================================================== */

/* hero */
.hero { padding-top: 50px; padding-bottom: 50px; position: relative; margin-bottom: 50px; }
.hero .container { max-width: 1450px; }
.hero h1 { text-transform: uppercase; }
.hero-text { position: relative; z-index: 1; }
.hero-title { display: flex; align-items: center; margin-bottom: 20px; }
.hero-title img { width: 150px; }
.hero h2 { margin-bottom: 20px; font-weight: 700; }
.hero h4 { color: #4bb06c; margin-bottom: 40px; }
.hero p { margin-bottom: 20px; }
.hero-btn a { margin-bottom: 10px; }
.hero-btn .btn-success { border-radius: 0; background: linear-gradient(to right, rgba(55, 148, 86, 1) 0%, rgba(119, 220, 97, 1) 100%); }
.hero-btn .btn-white { border: 2px solid #fff; color: #fff; border-radius: 0; }
.hero-btn .btn-white:focus,
.hero-btn .btn-white:hover { background-color: #fff; color: #000; }
.hero-list { padding-left: 0; list-style: none; margin-bottom: 0; }
.hero .text-color { color: #73d5fe; transition: all 0.3s; }
.hero .text-color:focus,
.hero .text-color:hover { color: #4bb06c; text-decoration: none; }
.hero-right { position: relative; }
.hero-image img { width: 100%; }
.hero-play { width: 80px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.hero-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.hero-heading { margin-bottom: 20px; }
.hero-logo { margin-bottom: 15px; }
.hero-logo img { width: 70px; }
.hero.is-alt h2 { margin-bottom: 0; }



/* skill */
.skill { margin-bottom: 100px; }
.skill .container { max-width: 1450px; }
.skill-heading { margin-bottom: 50px; padding: 15px; display: flex; align-items: center; justify-content: center; background-color: #305cac; }
.skill-heading img { margin-right: 15px; width: 50px; }
.skill-heading h2 { font-weight: 700; }
.skill-block { margin-bottom: 40px; color: #000; }
.skill-block img { width: 100%; }
.skill-image { margin-bottom: 20px; }
.skill-info { max-width: 800px; }
.skill-info h2 { color: #000; line-height: 1; }
.skill-info h2 span { color: #2c80ff; }
.skill-list { padding-left: 20px; color: #000; list-style: none; }
.skill-list li { padding-left: 40px;  position: relative; margin-bottom: 20px; }
.skill-list img { position: absolute; top: 0; left: 0; width: 28px; }
.skill.is-alt .skill-info p span { padding-left: 10px; position: relative; }
.skill.is-alt .skill-info p span:before { position: absolute; top: 0; left: 0; content: ''; width: 2px; height: 15px; background-color: #218a37; }
.skill.inner .skill-heading { margin-bottom: 0; }


/* text-image */
.text-image { margin-bottom: 100px; color: #000; }
.text-image .container { max-width: 1450px; }
.text-image h2 { font-weight: 700; margin-bottom: 20px; line-height: 1; }
.text-image h2 span { color: #2c80ff; }
.text-image-info p { margin-bottom: 20px; }
.text-image-info ul { list-style: none; padding-left: 0; }
.text-image-info li { padding-left: 40px; position: relative; margin-bottom: 20px; }
.text-image-info li img { position: absolute; top: -3px; left: 0; width: 28px; }
.text-image-right img { width: 100%; }
.text-image.reverse .text-image-info ol { padding-left: 20px; }
.text-image.reverse .text-image-info ol li { padding-left: 0; margin-bottom: 25px; }
.text-image.reverse .text-image-info ol li::marker,
.text-image.reverse .text-image-info ol li strong { color: #1a747c; font-weight: 700; }
.text-image .gap { margin-bottom: 50px; }

/* feature */
.feature { margin-bottom: 100px; }
.feature .container { max-width: 1450px; }
.feature-block { color: #000; text-align: center; margin-bottom: 40px; }
.feature-block br { display: none; }
.feature-block img { width: 60px; height: 60px; margin-bottom: 20px; object-fit: contain; }


/* enroll */
.enroll { position: relative; padding-top: 30px; padding-bottom: 30px; }
.enroll .container { max-width: 1450px; }
.enroll-content { position: relative; z-index: 1; color: #fff; text-align: center; display: flex; flex-direction: column; }
.enroll-heading { margin-bottom: 50px; }
.enroll-title { font-size: 53px; line-height: 1; color: #15a6a1; text-transform: uppercase; font-weight: 700; }
.enroll-heading h2 { font-weight: 700; }
.enroll-info { margin-top: auto; }
.enroll-info p { font-size: 16px; margin-bottom: 30px; }
.enroll .btn-success { border-radius: 0; font-weight: 700; background: linear-gradient(to right, rgba(55, 148, 86, 1) 0%, rgba(119, 220, 97, 1) 100%); }
.enroll-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
.enroll-bg img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: normal; }
.enroll.is-alt .enroll-content { display: block; }
.enroll.is-alt h2 { margin-bottom: 20px; font-weight: 700; }
.enroll.is-alt p:last-of-type { margin-bottom: 30px; }
.enroll.is-alt h4 { color: #ffaf15; text-transform: uppercase; margin-bottom: 20px; }


@media only screen and (min-width: 768px) {
  .hero-title { margin-bottom: 0; }
  .hero-title img { width: auto; }
  .hero-btn { margin-bottom: 20px; }
  .hero-btn a { margin-bottom: 0 }
  .hero-list { display: flex; }
  .hero-list li:not(:last-of-type):after { display: inline-block; content: ''; width: 4px; height: 4px; vertical-align: middle; margin: 0 7px; background-color: #fff; border-radius: 50%; }
  .hero-heading { display: flex; align-items: center; }
  .hero-logo { flex: 0 0 auto; margin-right: 25px; margin-bottom: 0; }
  .hero-logo img { width: auto; }
  .skill .row { display: flex; align-items: center; }
  .skill-heading { margin-bottom: 100px; }
  .skill-heading img { margin-right: 25px; width: 65px; }
  .skill-block { margin-bottom: 70px; }
  .skill-list { padding-left: 50px; }
  .skill-list li { padding-left: 60px;  margin-bottom: 40px; }
  .skill-list img { width: 35px; top: -7px; }
  .skill-image { margin-bottom: 0; }
  .text-image h2 ,
  .text-image-info p { margin-bottom: 30px; }
  .text-image-info li { margin-bottom: 40px; }
  .text-image.reverse .row { display: flex; align-items: center; flex-direction: row-reverse; }
  .feature-block { margin-bottom: 100px; }
  .feature-block br { display: block; }
  .feature-block img { width: 90px; height: 95px; margin-bottom: 20px; }
  .feature .col-sm-4:nth-last-child(-n+3) .feature-block { margin-bottom: 0; }
  .enroll { padding-top: 50px; padding-bottom: 50px; }
  .enroll-title { font-size: 78px; }
  .enroll-info p,
  .enroll.is-alt p { font-size: 20px; }
  .enroll .btn-success { font-size: 30px; padding: 26px 95px; }
  .enroll.is-alt h4 { font-size: 26px; margin-bottom: 40px; }
}

@media only screen and (min-width: 1441px) {
  .hero .row { display: flex; align-items: center; }
  .hero-play { width: 120px; }
  .skill-holder { padding-left: 100px; padding-right: 100px; }
  .enroll.is-alt .enroll-title { font-size: 105px; }
}

@media only screen and (min-width: 1600px) {
  .hero.is-alt h1 { font-size: 50px; }
  .hero.is-alt h2 { font-size: 26px; }
}
