@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800&family=Roboto:wght@300;400;500;700;900&display=swap');


body,html{
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    line-height: 24px;
    color: #636363; font-weight: 400;

}
h1, h2, h3, h4, h5, h6 {}

h1 { font-size: 30px; font-weight: 600; color: #00463B; text-transform: uppercase;  }

.text-primary {
    color: #3399d3 !important
}
a { color: #3a9385; }
a:hover { text-decoration:none; color: #3a9385; }
:focus{ outline: none !important; }

/* Learn with expert*/
.learn_with_expert .container { position: relative; padding: 0px; }
.learn_with_expert { padding: 40px 25px; position: relative; 
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e8fbf8+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(232,251,248,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(232,251,248,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(232,251,248,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e8fbf8',GradientType=0 ); /* IE6-9 */
 }
.learn_with_expert h1 { color: #00463B; } 

.learn_with_expert_bg { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: #E7F7F4; /* background: url(../images/expert_bg.png) 100% 0px no-repeat; background-size: 100% auto;*/ }
.learn_with_expert_bg:before { content: ""; position: absolute; left: 0px; bottom: 0px; background: url(../images/expert_left_bg.png) 0px 100% no-repeat;width: 421px; height: 382px;  }

.learn_with_expert_bg:after { content: ""; position: absolute; right: 0px; top: 0px;background: url(../images/expert_right_bg.png) 100% 0px no-repeat; width: 398px; height: 362px;  }

.learn_with_expert iframe { width: 100%; height: 386px; border-radius: 20px; }
.learn_with_expert video { width: 100%; border-radius: 20px; }


.learn_with_expert .slick-dots li button {
    width: 30px;
    height: 5px;
    padding: 0px;
    background: #7eafa7; border-radius: 30px;  text-indent: -9999px;
}
.learn_with_expert .slick-dots li.slick-active button { width: 30px; background: #E9C21C; }

.slick-arrow {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    z-index: 1;
    display: block;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: #fff;
    border: none;
    outline: none;
    background:rgba(0,0,0,0.8);
    border-radius: 100%;
    font-size: 18px;
}
.slick-arrow.next {
    right: -25px;
}
.slick-arrow.prev {
    left: -25px;
}

.slick-dots li {
    margin: 0 8px;
}

/* Learn with expert*/

.how_to_play { background: #00463B; padding: 40px 25px; }
.how_to_play h1 { color: #FFCB05;}
.how_to_play p { font-size: 15px; color: #fff; text-align: center;}

.our_journey { background: #fff; padding: 40px 25px; }

.review { background: #fff; padding: 40px 25px; }

.download_app { padding: 40px 25px; background: url(../images/download_app.png) 50% 0px no-repeat #CBEAE5;}
.download_app_btn  { padding: 15px; position: sticky; bottom: 0px; background: #CBEAE5; }
.android-btn { margin-right: 15px; }

.footer { background: #000000; text-align: center; padding: 25px 15px; font-size: 14px; color: #fff; text-align: center; } 

.learn_with_expert_bg {
    overflow: hidden;
}