@font-face {
    font-family: 'CircularStdBook';
    src: url('/assets/css/fonts/CircularStd-Book.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CircularStdBold';
    src: url('/assets/css/fonts/CircularStd-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CircularStdBlack';
    src: url('/assets/css/fonts/CircularStd-Black.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CircularStdBookItalic';
    src: url('/assets/css/fonts/CircularStd-BookItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CircularStdMedium';
    src: url('/assets/css/fonts/CircularStd-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'CircularStdMediumItalic';
    src: url('/assets/css/fonts/CircularStd-MediumItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


/*General Styles*/
html, body{margin: 0; padding: 0; height: 100%; font-family: 'CircularStdBook', Helvetica, Arial, sans-serif}
body.no-scroll{overflow: hidden}
ul{list-style: none}
ul, li{margin: 0; padding: 0}
a{text-decoration: none; color: inherit; transition: .35s; outline: none}
*{margin: 0; padding: 0; box-sizing: border-box; letter-spacing: 0; -webkit-font-smoothing: antialiased}
h1, h2, h3, h4{font-weight: normal}
input, select:focus, textarea{font-size: 16px; resize: none; overflow: hidden}
input[type=number]{-moz-appearance: textfield}
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0}
p{line-height: 24px}
.hidden{display: none !important}
.clear{clear: both}
.mobile{display: none !important}
.desktop{display: block}
.uppercase{text-transform: uppercase}
.capitalize{text-transform: capitalize}
.underline{text-decoration: underline}
.text_center{text-align: center}
.light_green{background-color: #C3E3E9}
.rich_green{background-color: #53B8A7}
.white_textcolor{color: white}
.verdigris_textcolor{color: #53B8A7}
.sherpa_blue_textcolor{color: #004651}
.sherpa_background_color{background-color: #004651}
.white_background{background-color: white}
.btn_padding{padding: 16px 24px}
a.download_brochure{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px; margin-top: 30px; width: 225px; display: inline-block}
.blur{filter: blur(8px); background-color: rgba(0,0,0,0.3);}
a.light_green:hover{color: #53B8A7}
a.rich_green:hover{color: #013220}
.section-wrapper{display: flex; width: 90%; max-width: 1200px; margin: auto; padding: 0 20px; font-size: 0; transition: .35s}
a.checkout_submit{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px; margin-top: 30px; width: 225px; display: inline-block}
input::placeholder, input::-ms-input-placeholder{color: #53B8A7 !important;}

/* Header */
header{width: 100%; position: relative}
header:after{content: ""; background: url('/assets/images/homepage_banner.png') no-repeat; background-size: cover; height: 770px; max-width: 1135px; width: 100%; position: absolute; top: 0; z-index: -1}
header .section-wrapper{align-items: end; flex-direction: row; justify-content: space-between; padding-top: 50px}
header .section-wrapper .header_nav ul{display: flex;justify-content: flex-start; padding-top: 24px}
header .section-wrapper .header_nav li{display: inline-flex}
header .section-wrapper .header_nav li:not(:last-of-type){margin-right: 16px}
header .section-wrapper .header_nav li a{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px; padding: 16px 24px}
header .section-wrapper a.toggle_menu{font-size: 22px; color: white}
header:not(.homepage){background-color: #004651}
header:not(.homepage):after{display: none}
header:not(.homepage) .section-wrapper{padding-bottom: 40px}
header.checkout nav{display: none}
header.checkout .course_header_title{display: flex; align-self: flex-end}
header.checkout .course_header_title h1{font-family: 'CircularStdBlack', Helvetica, Arial, sans-serif; font-size: 35px; color: white; text-transform: uppercase}
header.checkout .course_header_title h1 span{color: #53B8A7; display: block}
/* Header */

/* Footer */
footer{width: 100%}
footer .section-wrapper{flex-direction: column}
footer .section-wrapper .top{display: flex;flex-direction: row;align-items: center;justify-content: space-between; padding: 35px 0 48px 0}
footer .section-wrapper .top .footer_nav ul{display: flex;justify-content: flex-start}
footer .section-wrapper .top .footer_nav ul li:not(:last-of-type){margin-right: 55px}
footer .section-wrapper .top .footer_nav ul li span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px}
footer .section-wrapper .top .footer_nav ul li p{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 15px}
footer .section-wrapper .top .footer_nav ul li a{font-family: 'CircularStdBookItalic', Helvetica, Arial, sans-serif; font-size: 15px; display: block}
footer .section-wrapper .top .footer_nav ul li .social_media{margin-top: 5px}
footer .section-wrapper .top .footer_nav ul li .social_media a{display: inline-block; margin-right: 5px}
footer .section-wrapper .top .footer_nav ul li .social_media a img{object-fit: contain}
footer .section-wrapper .bottom{border-top: 1px solid white; padding: 25px 25px}
footer .section-wrapper .bottom p{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 11px}
/* Footer */

/* Brochure Download Modal */
.brochure_download_modal{display: none; position: fixed;z-index:999;left: 50%;top: 50%; transform: translate(-50%,-50%);width: 470px; height: auto; overflow: auto; background-color: white; border-radius: 10px; padding: 25px 55px}
.brochure_download_modal .close_btn{position: absolute; top: 17px; right: 17px}
.brochure_download_modal .content h1{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17.5px; margin-bottom: 5px}
.brochure_download_modal .content p{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 17.5px}
.brochure_download_modal .content form{margin-top: 20px}
.brochure_download_modal .content form{display: flex; flex-wrap: wrap;justify-content: space-between;}
.brochure_download_modal .content form input{outline: none; border: none; padding: 14px 21px; border-radius: 10px; font-family: 'CircularStdBookItalic', Helvetica, Arial, sans-serif; font-size: 11px; color: #53B8A7; background-color: #C3E3E9}
.brochure_download_modal .content form input::placeholder{font-family: 'CircularStdBookItalic', Helvetica, Arial, sans-serif; font-size: 11px; color: #004651}
.brochure_download_modal .content form input.full{width: 100%; margin-bottom: 10px}
.brochure_download_modal .content form input.half{width: calc(50% - 5px)}
.brochure_download_modal .content a.btn_submit{width: 110px; padding: 8px 27px; margin-top: 20px}
.brochure_download_modal p.message.error{color: red; font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 13px;}
.brochure_download_modal div.success_message{text-align: center;}
.brochure_download_modal div.success_message h2{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 22px; color: #004651; margin-bottom: 10px}
.brochure_download_modal div.success_message p{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 22px; color: #53B8A7}
/* Brochure Download Modal */

/* Homepage */
div.homepage .hero-section .section-wrapper{align-items: center; justify-content: space-between}
div.homepage .hero-section .section-wrapper .left h1, div.homepage .hero-section .section-wrapper .left h1 span{font-family: 'CircularStdBlack', Helvetica, Arial, sans-serif; font-size: 38px}
div.homepage .hero-section .section-wrapper .left h1 span{display: block}
div.homepage .hero-section .section-wrapper .right img{max-width: 100%; width: 100%; height: auto; object-fit: cover}

div.homepage .ja_method{margin-top: 183px}
div.homepage .ja_method .section-wrapper{align-items: center; justify-content: space-between}
div.homepage .ja_method .section-wrapper .left{flex-basis: 45%}
div.homepage .ja_method .section-wrapper .left .description h1{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 35px; margin-bottom: 35px}
div.homepage .ja_method .section-wrapper .left .description h1 span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 35px; display: inline-flex; padding: 5px 10px 0 10px}
div.homepage .ja_method .section-wrapper .left .description p{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px}
div.homepage .ja_method .section-wrapper .left .description p:not(:last-of-type){margin-bottom: 35px}
div.homepage .ja_method .section-wrapper .left .description a.download_brochure{margin-top: 40px}
div.homepage .ja_method .section-wrapper .right{flex-basis: 42%}
div.homepage .ja_method .section-wrapper .right p:first-of-type{font-family: 'CircularStdMediumItalic', Helvetica, Arial, sans-serif; font-size: 22px}
div.homepage .ja_method .section-wrapper .right p:nth-child(2){font-family: 'CircularStdBookItalic', Helvetica, Arial, sans-serif; font-size: 17px}
div.homepage .ja_method .section-wrapper .right p:last-of-type{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 22px}
div.homepage .ja_method .section-wrapper .right p:not(:last-of-type){margin-bottom: 35px}

div.homepage .ja_program{margin-top: 95px}
div.homepage .ja_program .section-wrapper{align-items: center; flex-direction: row; position: relative}
div.homepage .ja_program .section-wrapper .left{width: 465px; height: 527px}
div.homepage .ja_program .section-wrapper .left img{max-width: 100%; width: 100%; height: 100%; object-fit: contain}
div.homepage .ja_program .section-wrapper .right{width: calc(100% - 465px); background-color: #C3E3E9; height: 100%}
div.homepage .ja_program .section-wrapper .right .content{padding: 45px 45px}
div.homepage .ja_program .section-wrapper .right .content h1{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 35px; margin-bottom: 45px}
div.homepage .ja_program .section-wrapper .right .content h1 span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 35px; display: inline-block; padding: 5px 10px 3px 10px}
div.homepage .ja_program .section-wrapper .right .content p:first-of-type{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px; margin-bottom: 25px}
div.homepage .ja_program .section-wrapper .right .content p:last-of-type{font-family: 'CircularStdBookItalic', Helvetica, Arial, sans-serif; font-size: 17px}

div.homepage .ja_program_details{margin-top: 95px}
div.homepage .ja_program_details .section-wrapper{flex-direction: column; max-width: 1300px}
div.homepage .ja_program_details .section-wrapper h1.title{font-family: 'CircularStdMediumItalic', Helvetica,Arial, sans-serif; font-size: 30px; max-width: 1100px; margin: 0 auto 105px auto}
div.homepage .ja_program_details .section-wrapper .details-wrapper{padding: 55px 100px}
div.homepage .ja_program_details .section-wrapper .details-wrapper h2{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 35px; margin-bottom: 50px}
div.homepage .ja_program_details .section-wrapper .details-wrapper h2 span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 35px; display: block; width: max-content; padding: 5px 10px 0 10px}
div.homepage .ja_program_details .section-wrapper .details-wrapper ul{display: flex;flex-wrap: wrap;  justify-content: space-between}
div.homepage .ja_program_details .section-wrapper .details-wrapper ul li{display: flex; justify-content: flex-start;align-items: center; flex-basis: calc(33.33% - 20px); margin-bottom: 60px}
div.homepage .ja_program_details .section-wrapper .details-wrapper ul li span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 30px; width: 49px; height: 47px; padding: 8px 8px 5px 8px; margin-right: 20px; display: flex; justify-content: center; align-items: center}
div.homepage .ja_program_details .section-wrapper .details-wrapper ul li p{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px}
div.homepage .ja_program_details .section-wrapper .details-wrapper a.download_brochure{margin: 0}

div.homepage .ja_method_journey{margin-top: 95px}
div.homepage .ja_method_journey .section-wrapper{flex-direction: column; max-width: 100%; width: 100%; padding: 0}
div.homepage .ja_method_journey .section-wrapper .head{max-width: 1200px; width: 90%; padding: 0 20px; margin: 0 auto 45px auto}
div.homepage .ja_method_journey .section-wrapper .head h1.title{font-family: 'CircularStdBook', Helvetica,Arial, sans-serif; font-size: 35px; margin-bottom: 75px}
div.homepage .ja_method_journey .section-wrapper .head h1 span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 35px; display: block; width: max-content; padding: 5px 10px 0 10px}
div.homepage .ja_method_journey .section-wrapper .head p{font-family: 'CircularStdMediumItalic', Helvetica, Arial, sans-serif; font-size: 20px; max-width: 390px }
div.homepage .ja_method_journey .section-wrapper .journey_wrapper{width: 100%; background-color: #C3E3E9; padding: 75px 0}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content{display: flex; flex-direction: row; justify-content: space-between; max-width: 1200px; width: 90%; margin: 0 auto; padding: 0 20px}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left{flex-basis: 35%}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left p:first-of-type, div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left p:nth-child(2){font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px; margin-bottom: 25px}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left p:last-of-type{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 20px}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right{flex-basis: 65%; position: relative}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right img{object-fit: contain; position: absolute; right: 0; bottom: 190px}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right .description{max-width: 495px;margin: 0 0 0 auto;position: absolute;bottom: 0;right: 0}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right .description p:first-of-type{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px; margin-bottom: 25px}
div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right .description p:last-of-type{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 20px}

div.homepage .how_program_works{margin-top: 95px}
div.homepage .how_program_works .section-wrapper{flex-direction: column}
div.homepage .how_program_works .section-wrapper h1.title{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 35px; margin-bottom: 80px}
div.homepage .how_program_works .section-wrapper h1 span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 35px; display: block; width: max-content; padding: 5px 10px 0 10px}
div.homepage .how_program_works .section-wrapper ul{display: flex;flex-wrap: wrap;justify-content: space-between;position: relative}
div.homepage .how_program_works .section-wrapper ul:after{content: '';background: url('/assets/images/path_line.png') no-repeat; background-size: contain; width: 100%;position: absolute;height: 5px;top: 75px;z-index: -1}
div.homepage .how_program_works .section-wrapper ul li h3{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif;font-size: 22px; background-color: #C3E3E9; border-radius: 50%; width: 151px; height: 151px; display: flex; align-items: center; text-align: center; margin-bottom: 15px}
div.homepage .how_program_works .section-wrapper ul li h3 span{display: block; max-width: 100px; margin: 0 auto}
div.homepage .how_program_works .section-wrapper ul li p{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px; max-width: 125px; margin: 0 auto}
div.homepage .how_program_works .section-wrapper .obesity{padding: 15px 66px 10px 66px; margin-top: 80px}
div.homepage .how_program_works .section-wrapper .obesity p{font-family: 'CircularStdMediumItalic', Helvetica, Arial, sans-serif; font-size: 25px}

div.homepage .courses{margin-top: 95px}
div.homepage .courses .section-wrapper{flex-direction: column}
div.homepage .courses .section-wrapper .head{display: flex; align-items: flex-end; margin-bottom: 60px}
div.homepage .courses .section-wrapper .head h1{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 28px; flex-basis: 50%}
div.homepage .courses .section-wrapper .head h1 span{display: block}
div.homepage .courses .section-wrapper .head h2{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 20px; max-width: 425px; flex-basis: 50%; padding: 0 0 0 53px}
div.homepage .courses .section-wrapper .course{width: 100%; display: flex; box-shadow: rgb(0 0 0 / 9%) 4.95px 4.95px 3.6px}
div.homepage .courses .section-wrapper .course .left{flex-basis: 50%}
div.homepage .courses .section-wrapper .course .left figure{height: 100%}
div.homepage .courses .section-wrapper .course .right{flex-basis: 50%; height: 100%; padding: 38px 53px}
div.homepage .courses .section-wrapper .course .right h3.course_number{font-family: 'CircularStdBold', Arial, Helvetica, sans-serif; font-size: 24px}
div.homepage .courses .section-wrapper .course .right h4.course_title{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 24px; margin-bottom: 32px}
div.homepage .courses .section-wrapper .course .right p.course_description{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 17px}

div.homepage .get_in_touch{margin-top: 100px; width: 100%; height: 475px}
div.homepage .get_in_touch .section-wrapper{align-items: flex-start; justify-content: space-between; padding: 80px 20px}
div.homepage .get_in_touch .section-wrapper.center{justify-content: center}
div.homepage .get_in_touch .section-wrapper .touch_title{flex-basis: calc(100% - 25px)}
div.homepage .get_in_touch .section-wrapper .touch_title h1.title{font-family: 'CircularStdBold', Arial, Helvetica, sans-serif; font-size: 35px}
div.homepage .get_in_touch .section-wrapper .touch_title h1.title span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 35px; display: block; width: max-content; padding: 5px 10px 0 10px}
div.homepage .get_in_touch .section-wrapper .contact_form{flex-basis: calc(100% - 25px)}
div.homepage .get_in_touch .section-wrapper .contact_form form{display: flex; flex-wrap: wrap;justify-content: space-between;}
div.homepage .get_in_touch .section-wrapper .contact_form input, div.homepage .get_in_touch .section-wrapper .contact_form textarea{outline: none; border: none; padding: 14px 21px; border-radius: 10px; font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 14px; color: #53B8A7}
div.homepage .get_in_touch .section-wrapper .contact_form input{margin-bottom: 16px}
div.homepage .get_in_touch .section-wrapper .contact_form input::placeholder, div.homepage .get_in_touch .section-wrapper .contact_form textarea::placeholder{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 14px; color: #004651}
div.homepage .get_in_touch .section-wrapper .contact_form input.full-width{width: 100%}
div.homepage .get_in_touch .section-wrapper .contact_form input.half{width: calc(50% - 10px)}
div.homepage .get_in_touch .section-wrapper .contact_form textarea{width: 100%}
div.homepage .get_in_touch .section-wrapper .contact_form p.message{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif;font-size: 17px;color: #004651;margin-top: 15px}
div.homepage .get_in_touch .section-wrapper .contact_form p.message.error{color: red}
div.homepage .get_in_touch .section-wrapper div.success_message{text-align: center; margin-top: 100px}
div.homepage .get_in_touch .section-wrapper div.success_message h2{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 32px; color: #004651; margin-bottom: 20px}
div.homepage .get_in_touch .section-wrapper div.success_message p{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 32px; color: #53B8A7}
/* Homepage */

/* Checkout */
div.checkout{background-color: rgba(195, 227, 233, 0.6);}
div.checkout .course_resgistration{padding: 75px 0}
div.checkout .course_resgistration .section-wrapper{flex-direction: column}
div.checkout .course_resgistration .course_wrapper{width: 50%; margin: 0 auto}
div.checkout .course_resgistration .course_wrapper .course_details{display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 25px}
div.checkout .course_resgistration .course_wrapper .course_details .title h1{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 25px; color: #004651; margin-bottom: 5px}
div.checkout .course_resgistration .course_wrapper .course_details .title h2{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 23px; color: #004651}
div.checkout .course_resgistration .course_wrapper .course_details .price span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 25px; color: #004651}
div.checkout .course_resgistration .course_wrapper form input{outline: none;border: none;padding: 14px 21px;border-radius: 10px;margin-bottom: 15px; font-family: 'CircularStdBook', Helvetica, Arial, sans-serif;font-size: 14px;color: #53B8A7;width: 100%}
div.checkout .course_resgistration .course_wrapper form input::placeholder{font-family: 'CircularStdBookItalic', Helvetica, Arial, sans-serif; font-size: 14px; color: #004651}
div.checkout .course_resgistration .course_wrapper form a.checkout_submit{display: flex; justify-content: center; margin: 30px auto 0 auto}
div.checkout .course_resgistration .course_wrapper form input[type="submit"]{width: auto;border-radius: 0;color: white;cursor: pointer;}
div.checkout .course_resgistration .course_wrapper form p.message{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif;font-size: 17px;color: #004651;margin-top: 10px; text-align: center}
div.checkout .course_resgistration .course_wrapper form p.message.error{color: red}
div.checkout .course_resgistration .bottom{border-top: 1px solid #004651; padding: 20px 0; margin-top: 60px; text-align: center}
div.checkout .course_resgistration .bottom p{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px; color: #004651}
div.checkout .course_resgistration .bottom p a{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 15px;}
/* checkout */

/* Pay */
div.pay .course_resgistration .section-wrapper .course_wrapper .user_details{width: 100%}
div.pay .course_resgistration .section-wrapper .course_wrapper .user_details .user_info{display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px}
div.pay .course_resgistration .section-wrapper .course_wrapper .user_details .user_info p{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 22px; color: #004651}
div.pay .course_resgistration .section-wrapper .course_wrapper .user_details .user_info span{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 20px; color: #004651}
div.pay .course_resgistration .section-wrapper .course_wrapper .user_details .user_info:last-child{margin-bottom: 0}
div.pay .course_resgistration .section-wrapper iframe{width: 50%; margin: 0 auto; height: 450px; border: none}
div.pay .course_resgistration .successful_purchase{text-align: center; margin: 150px 0}
div.pay .course_resgistration .successful_purchase h3{margin-bottom: 10px}
div.pay .course_resgistration .successful_purchase h3, div.checkout .course_resgistration .successful_purchase h4{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 30px; color: #004651}
div.pay .course_resgistration .successful_purchase .social_media_wrapper{margin-top: 55px; display: flex; align-items: center; justify-content: center}
div.pay .course_resgistration .successful_purchase .social_media_wrapper span{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px; color: #004651; margin-right: 5px}
div.pay .course_resgistration .successful_purchase .social_media_wrapper .social_media a:first-child{margin-right: 5px}
div.pay .course_resgistration .failed_purchase{text-align: center; margin: 150px 0}
div.pay .course_resgistration .failed_purchase h3{font-family: 'CircularStdBook', Helvetica, Arial, sans-serif; font-size: 30px;margin-bottom: 10px}
div.pay .course_resgistration .failed_purchase h4{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 30px; color: #53B8A7}


.error-page {font-family: 'CircularStdBlack', Helvetica, Arial, sans-serif}
.error-page .main-container {width: 80%; margin: auto; padding: 100px 0; text-align: center;}
.error-page .main-container h1 {color: #004651; margin-bottom: 20px}
.error-page .main-container h2, .error-page .main-container p {color: #53B8A7}
.error-page .main-container a {font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 15px; margin-top: 30px; width: 225px; display: inline-block;}

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

    /* Header */
    header .section-wrapper a#logo{flex-basis: 25%}
    header .section-wrapper .header_nav{flex-basis: 70%}
    header .section-wrapper .header_nav ul{justify-content: space-between}
    header .section-wrapper .header_nav li a{font-size: 13px}

    /* Homepage */
    div.homepage .hero-section .section-wrapper .left{flex-basis: 25%}
    div.homepage .hero-section .section-wrapper .right{flex-basis: 70%}
    div.homepage .hero-section .section-wrapper .left h1, div.homepage .hero-section .section-wrapper .left h1 span{font-size: 30px}
    div.homepage .ja_method .section-wrapper .left .description h1, div.homepage .ja_method .section-wrapper .left .description h1 span{font-size: 27px}
    div.homepage .ja_program .section-wrapper .right .content h1, div.homepage .ja_program .section-wrapper .right .content h1 span{font-size: 27px}
    div.homepage .ja_program_details .section-wrapper h1.title{font-size: 27px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper{padding: 55px 55px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper h2, div.homepage .ja_program_details .section-wrapper .details-wrapper h2 span{font-size: 27px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper ul li span{font-size: 25px; width: 49px; height: 43px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper ul li p{font-size: 15px}
    div.homepage .ja_method_journey .section-wrapper .head h1.title, div.homepage .ja_method_journey .section-wrapper .head h1.title span{font-size: 27px}
    div.homepage .how_program_works .section-wrapper h1.title, div.homepage .how_program_works .section-wrapper h1.title span{font-size: 27px}
    div.homepage .how_program_works .section-wrapper ul li h3{font-size: 20px}
    div.homepage .how_program_works .section-wrapper .obesity p{font-size: 22px}
    div.homepage .courses .section-wrapper .head h1{font-size: 23px}
    div.homepage .courses .section-wrapper .head h2{font-size: 20px}
    div.homepage .get_in_touch .section-wrapper .touch_title h1.title, div.homepage .get_in_touch .section-wrapper .touch_title h1.title span{font-size: 27px}
}

@media only screen and (max-width: 1024px){
    .section-wrapper{width: 100%; flex-direction: column !important;}
    a.download_brochure{width: 190px; display: inline-block; font-size: 12px; margin-top: 20px}
    .mobile{display: block !important;}
    .desktop{display: none !important;}

    /* Header */
    header:after{height: 625px}
    header .section-wrapper{padding-top: 20px}
    header .section-wrapper .content{display: flex; justify-content: space-between; align-items: center; width: 100%}
    header .section-wrapper a#logo{flex-basis: 0}
    header .section-wrapper .content a#logo img{width: 100px; height: auto}
    header .section-wrapper .content a.app_download{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 12px; padding: 12px 12px; height: 100%}
    header .section-wrapper .header_nav{flex-basis: 100%;margin: 30px auto 0 auto; display: none}
    header .section-wrapper .header_nav ul{padding: 0; flex-direction: column}
    header .section-wrapper .header_nav li{justify-content: space-around}
    header .section-wrapper .header_nav li a{font-size: 12px; padding: 12px 12px}
    header .section-wrapper .header_nav li:not(:last-of-type){margin-right: 0; margin-bottom: 5px}
    /* Header */

    /* Footer */
    footer .section-wrapper .top{flex-direction: column; padding: 30px 0}
    footer .section-wrapper .top #logo img{width: 137px;height: auto;}
    footer .section-wrapper .top .footer_nav{margin-top: 30px}
    footer .section-wrapper .top .footer_nav ul{flex-direction: column}
    footer .section-wrapper .top .footer_nav ul li{text-align: center}
    footer .section-wrapper .top .footer_nav ul li:not(:last-of-type){margin-right: 0; margin-bottom: 15px}
    footer .section-wrapper .top .footer_nav ul li a.buttons{margin-bottom: 10px; font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 12px; margin-top: 0; width: 190px; background-color: #53B8A7; text-decoration: none; padding: 16px 24px}
    footer .section-wrapper .top .footer_nav ul li a.buttons:last-child{margin-bottom: 0}
    /* Footer */

    /* Mobile Menu */
    .mobile_menu{display: block !important;width: 100%;position: fixed;top: 0;left: 0;height: 100%;background-color: #004651;font-size: 0;z-index: 99999;transition: .35s;overflow: auto;padding: 20px 0 0 0;}
    .mobile_menu.closed{top: -1000px}
    .mobile_menu .close_menu{display: flex; justify-content: flex-end; padding: 0 20px; margin-top: 30px}
    .mobile_menu .logo{margin-bottom: 50px; display: block}
    .mobile_menu .logo img{width: 120px;height: auto;display: block;margin: 0 auto;}
    .mobile_menu nav{display: block; margin-top: 30px; padding: 0 20px}
    .mobile_menu nav ul{display: flex; flex-direction: column; align-items: center}
    .mobile_menu nav ul li{height: 50px}
    .mobile_menu nav ul li a{font-family: 'CircularStdBold', Helvetica, Arial, sans-serif; font-size: 12px; padding: 12px 12px}


    /* Brochure Download Modal */
    .brochure_download_modal{width: 345px; padding: 25px 25px; height: 315px}
    .brochure_download_modal .close_btn{top: 10px; right: 10px}
    .brochure_download_modal .content h1{font-size: 15px}
    .brochure_download_modal .content p{font-size: 14px}
    .brochure_download_modal .content form input.half{width: 100%; margin-bottom: 10px}
    .brochure_download_modal .content a.btn_submit{margin-top: 15px}
    .brochure_download_modal div.success_message h2{font-size: 16px;}
    .brochure_download_modal div.success_message p{font-size: 16px}


    .page_container.homepage{margin-top: 30px}

    div.homepage .hero-section{margin-bottom: 70px}
    div.homepage .hero-section .section-wrapper{align-items: end}
    div.homepage .hero-section .section-wrapper .left{margin-top: 20px}
    div.homepage .hero-section .section-wrapper .left, div.homepage .hero-section .section-wrapper .right{flex-basis: 100%; width: 100%; text-align: center}
    div.homepage .hero-section .section-wrapper .left h1, div.homepage .hero-section .section-wrapper .left h1 span{font-size: 20px; text-align: center}
    div.homepage .hero-section .section-wrapper .left h1 span{display: inline-flex}
    div.homepage .hero-section .section-wrapper .right{text-align: center}
    div.homepage .hero-section .section-wrapper .right img{height: 350px}
    div.homepage .hero-section .section-wrapper .left a.download_brochure{margin-bottom: 0; margin-top: 24px}

    div.homepage .ja_method{margin-top: 0}
    div.homepage .ja_method .section-wrapper .left{margin-bottom: 20px}
    div.homepage .ja_method .section-wrapper .left, div.homepage .ja_method .section-wrapper .right{flex-basis: 100%; width: 100%}
    div.homepage .ja_method .section-wrapper .left .description h1{margin-bottom: 20px}
    div.homepage .ja_method .section-wrapper .left .description h1, div.homepage .ja_method .section-wrapper .left .description h1 span{font-size: 22px}
    div.homepage .ja_method .section-wrapper .left .description p{font-size: 14px;}
    div.homepage .ja_method .section-wrapper .left .description p:not(:last-of-type){margin-bottom: 20px}
    div.homepage .ja_method .section-wrapper .left .description a.download_brochure{margin-top: 20px}
    div.homepage .ja_method .section-wrapper .right p{font-size: 14px !important;}
    div.homepage .ja_method .section-wrapper .right p:not(:last-of-type){margin-bottom: 20px}

    div.homepage .ja_program{margin-top: 40px}
    div.homepage .ja_program .section-wrapper{align-items: initial}
    div.homepage .ja_program .section-wrapper .left{width: 100%; height: 350px}
    div.homepage .ja_program .section-wrapper .left img{object-fit: cover}
    div.homepage .ja_program .section-wrapper .right{width: 100%}
    div.homepage .ja_program .section-wrapper .right .content{padding: 20px 20px}
    div.homepage .ja_program .section-wrapper .right .content h1{margin-bottom: 20px}
    div.homepage .ja_program .section-wrapper .right .content h1, div.homepage .ja_program .section-wrapper .right .content h1 span{font-size: 22px}
    div.homepage .ja_program .section-wrapper .right .content p{font-size: 14px !important}
    div.homepage .ja_program .section-wrapper .right .content p:not(:last-of-type){margin-bottom: 20px !important;}

    div.homepage .ja_program_details{margin-top: 40px}
    div.homepage .ja_program_details .section-wrapper{max-width: 100%; padding: 0}
    div.homepage .ja_program_details .section-wrapper h1.title{font-size: 16px; margin-bottom: 40px; padding: 0 20px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper{padding: 20px 20px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper h2{margin-bottom: 20px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper h2, div.homepage .ja_program_details .section-wrapper .details-wrapper h2 span{font-size: 22px; text-align: center}
    div.homepage .ja_program_details .section-wrapper .details-wrapper h2 span{margin: 5px auto 10px auto}
    div.homepage .ja_program_details .section-wrapper .details-wrapper ul{flex-wrap: nowrap; flex-direction: column}
    div.homepage .ja_program_details .section-wrapper .details-wrapper ul li{width: 100%; margin-bottom: 30px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper ul li p{font-size: 14px;line-height: 16px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper ul li span{font-size: 18px; width: 36px; height: 36px; margin-right: 10px}
    div.homepage .ja_program_details .section-wrapper .details-wrapper a.download_brochure{display: flex;justify-content: center;margin: 0 auto 20px auto;}

    div.homepage .ja_method_journey{margin-top: 40px}
    div.homepage .ja_method_journey .section-wrapper .head{padding: 0; margin: 0 auto 25px auto}
    div.homepage .ja_method_journey .section-wrapper .head h1.title{margin-bottom: 20px}
    div.homepage .ja_method_journey .section-wrapper .head h1.title, div.homepage .ja_method_journey .section-wrapper .head h1.title span{font-size: 22px}
    div.homepage .ja_method_journey .section-wrapper .head p{font-size: 16px}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper{padding: 25px 0}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content{padding: 0; flex-direction: column}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left{flex-basis: 100%}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left p:first-of-type, div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left p:nth-child(2){margin-bottom: 20px; font-size: 14px}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .left p:last-of-type{font-size: 14px;}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right{flex-basis: 100%; margin-top: 30px; text-align: center}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right img{position: relative; max-width: 100%; height: auto; bottom: 0}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right .description{position: relative; margin: 20px 0 0 0;text-align: initial;}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right .description p:first-of-type{font-size: 14px; margin-bottom: 20px}
    div.homepage .ja_method_journey .section-wrapper .journey_wrapper .content .right .description p:last-of-type{font-size: 14px}

    div.homepage .how_program_works{margin-top: 40px}
    div.homepage .how_program_works .section-wrapper h1.title{margin-bottom: 25px}
    div.homepage .how_program_works .section-wrapper h1.title, div.homepage .how_program_works .section-wrapper h1.title span{font-size: 22px; text-align: center}
    div.homepage .how_program_works .section-wrapper h1.title span{margin: 0 auto}
    div.homepage .how_program_works .section-wrapper ul:after{display: none}
    div.homepage .how_program_works .section-wrapper ul li{margin-bottom: 15px}
    div.homepage .how_program_works .section-wrapper ul li:nth-child(odd){margin-right: 15px}
    div.homepage .how_program_works .section-wrapper ul li:last-of-type{margin-right: 0}
    div.homepage .how_program_works .section-wrapper ul li h3{font-size: 14px; width: 124px; height: 124px; margin-bottom: 10px}
    div.homepage .how_program_works .section-wrapper ul li p{font-size: 14px; line-height: 14px}
    div.homepage .how_program_works .section-wrapper ul li:last-of-type{flex-basis: 100%; text-align: center}
    div.homepage .how_program_works .section-wrapper ul li:last-of-type h3{margin: 0 auto 10px auto}
    div.homepage .how_program_works .section-wrapper .obesity{padding: 10px; margin-top: 25px}
    div.homepage .how_program_works .section-wrapper .obesity p{font-size: 14px}

    div.homepage .courses{margin-top: 40px}
    div.homepage .courses .section-wrapper .head{flex-direction: column; margin-bottom: 25px; align-items: flex-start; text-align: center}
    div.homepage .courses .section-wrapper .head h1{font-size: 17px; margin: 0 auto 20px auto; flex-basis: 100%}
    div.homepage .courses .section-wrapper .head h2{font-size: 17px;flex-basis: 100%; padding: 0}
    div.homepage .courses .section-wrapper .course{flex-direction: column}
    div.homepage .courses .section-wrapper .course .left{flex-basis: initial; height: 180px}
    div.homepage .courses .section-wrapper .course .left figure{height: 100%}
    div.homepage .courses .section-wrapper .course .right{flex-basis: 100%; padding: 20px 20px; text-align: center}
    div.homepage .courses .section-wrapper .course .right h3.course_number{font-size: 18px}
    div.homepage .courses .section-wrapper .course .right h4.course_title{font-size: 16px; margin-bottom: 15px}
    div.homepage .courses .section-wrapper .course .right p.course_description{font-size: 14px}

    div.homepage .get_in_touch{margin-top: 40px; height:auto}
    div.homepage .get_in_touch .section-wrapper{padding: 30px 20px; text-align: center; align-items: center}
    div.homepage .get_in_touch .section-wrapper .touch_title h1.title, div.homepage .get_in_touch .section-wrapper .touch_title h1.title span{font-size: 22px}
    div.homepage .get_in_touch .section-wrapper .contact_form{margin-top: 30px}
    div.homepage .get_in_touch .section-wrapper .contact_form input.half{width: 100%}
    div.homepage .get_in_touch .section-wrapper div.success_message{margin-top: 0;}
    div.homepage .get_in_touch .section-wrapper div.success_message h2{font-size: 20px}
    div.homepage .get_in_touch .section-wrapper div.success_message p{font-size: 20px}

    /*  checkout  */
    div.checkout .course_resgistration{padding: 30px 0}
    div.checkout .course_resgistration .course_wrapper{width: 100%}
    div.checkout .course_resgistration .course_wrapper .course_details{margin-bottom: 20px}
    div.checkout .course_resgistration .course_wrapper .course_details .title h1{font-size: 18px}
    div.checkout .course_resgistration .course_wrapper .course_details .title h2{font-size: 17px}
    div.checkout .course_resgistration .course_wrapper .course_details .price span{font-size: 17px}
    div.checkout .course_resgistration .course_wrapper form a.checkout_submit{margin-top: 20px; font-size: 12px;width: 190px}
    div.checkout .course_resgistration .bottom{padding: 15px 0; margin-top: 35px}
    header.checkout .course_header_title{display: none}
    div.checkout .course_resgistration .course_wrapper form p.message{font-size: 14px}
    /* Checkout */

    /* Pay */
    div.pay .course_resgistration .section-wrapper .course_wrapper .user_details .user_info p{font-size: 17px}
    div.pay .course_resgistration .section-wrapper .course_wrapper .user_details .user_info span{font-size: 16px}
    div.pay .course_resgistration .section-wrapper iframe{width: 100%}


    div.pay .course_resgistration .successful_purchase{margin: 75px 0}
    div.pay .course_resgistration .successful_purchase h3, div.checkout .course_resgistration .successful_purchase h4{font-size: 22px}
    div.pay .course_resgistration .failed_purchase{margin: 75px 0}
    div.pay .course_resgistration .failed_purchase h3, div.checkout .course_resgistration .failed_purchase h4{font-size: 22px}
}

@media only screen and (max-width: 685px){
    header:after{height: 650px}
    div.homepage .hero-section{margin-bottom: 65px}
}