html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    padding: 0;
    margin: 0;
    font-size: 100%;
 }
* {
	box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    touch-action: manipulation;
}
html {
    font-size: 62.5%; /* Browser default 16px -> 10px; 1=10px */
    min-height:100%;
    height: 100%;
    scroll-behavior: smooth;
 }

/** FONT 1 ** GT-Walsheim Paid Font **/
@font-face {
    font-family: font1;
    src: url('/assets/mpn/com/fonts/GT-Walsheim-Regular.woff?v=1.85.007') format('truetype')
}
@font-face {
    font-family: font1light;
    src: url('/assets/mpn/com/fonts/GT-Walsheim-Light.woff?v=1.85.007') format('truetype')
}
@font-face {
  font-family: font1bold;
    src: url('/assets/mpn/com/fonts/GT-Walsheim-Medium.woff?v=1.85.007') format('truetype')
}

/** FONT 2 ** ROBOTO **/
@font-face {
  font-family: font2;
    src: url('/assets/mpn/com/fonts/Roboto-Regular.woff?v=1.85.007') format('truetype');
}
@font-face {
  font-family: font2light;
    src: url('/assets/mpn/com/fonts/Roboto-Light.woff?v=1.85.007') format('truetype');
}
@font-face {
  font-family: font2bold;
    src: url('/assets/mpn/com/fonts/Roboto-Medium.woff?v=1.85.007') format('truetype');
}

/**
	General typography
**/
body {
	font-family: font1light, font2light;
    font-size: 2rem;
    line-height: normal;
    touch-action: manipulation;/* Disable double tap zoom */
}
strong{
	font-family: font1, font2;
}
em{
	font-style: italic;
}
a {
    color: inherit;
    text-decoration: none;
    font: inherit;
}
/**
	General colors
**/
.bgcolor1, .desktop-bgcolor1{
    border: 2px solid #041C2C;
    color: #041C2C;
    border: none;
}
.bgcolor-tertiary{
	background: #4E008E;
    color: white;
    border: 2px solid white;
    border: none;
}
.bgcolor3 {
    border: 2px solid #041C2C;
    border: none;
}

.bgcolor-dark{
	background: #041C2C;
    color: white;
    border: 2px solid white;
    border: none;
}
.bgcolor-avo{
	background:#66C9BA;
    color: #041C2C;
    border: 2px solid #041C2C;
    border: none;
}
.bgcolor-pine{
	background: #F5EA61;
    color: #041C2C;
    border: 2px solid #041C2C;
    border: none;
}
.bgcolor-gray{
	background: #f3f3f4;
    color: #041C2C;
    border: 2px solid #041C2C;
    border: none;
}

.bgcolor-dark-transparent{
  background: rgba(0, 0, 0, 0.2);
}

.bgcolor-gradient-white-yellow{
    background-image: linear-gradient(#FFFFFF, #FEFDEE)
}
.bgcolor-gradient-yellow{
    background-image: linear-gradient(#FEFDEE 10%, #F6EB61 90%);
}
.bgcolor-gradient-yellow-purple{
    background-image: linear-gradient(#F6EB61, #6D23D0);
    color: white;
}
*.disabled, *:disabled {
    color: #888;
    -webkit-text-fill-color: #888;
    opacity: 1;
}

/**
    Positioning overrides
**/
.text-centered {
	text-align:center;
}

.text-right {
	text-align:right;
}

.text-left {
	text-align:left;
}

.text-bold {
	font-family: font1bold, font2bold;
}

.text-thin {
    font-family: font1light, font2light;
}

/**
 Sizing overrides
**/
.main-title{
    font-size: 6.8rem;
}
.sub-title{
    font-size: 5.8rem;

}
.normal-title{
    font-size: 4.5rem;
}
.message-lg{
    font-size: 3.8rem;
}
.message{
    font-size: 2.5rem;
}
.message-md{
    font-size: 1.8rem;
}
.message-sm{
    font-size: 1.4rem;
}
@media(max-width: 991px){
    .main-title{
        font-size: 5.3rem;
    }
    .sub-title{
        font-size: 3.8rem;
    }
    .normal-title{
        font-size: 3rem;
    }
    .message-lg{
        font-size: 2.5rem;
    }

}
@media(max-width: 550px){
    .main-title{
        font-size: 4rem;
    }
    .sub-title{
        font-size: 2.5rem;
    }
    .normal-title{
        font-size: 3rem;
    }
}
/**
	Helpers
**/
.vishide {
	display: none !important;
}
/**
	position
**/
.float-left{
    float: left;
}
.float-right{
    float: right;
}
.item-centered{
    margin: 0 auto;
    display: block;
}
.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.vertical-centered, .vertical-centered-bottom, .vertical-centered-top{
    top: 50%;
    transform: translate(0, -50%);
}
/**
    error
**/
.field-error{
    font-size: 1.6rem;
    color: #ff3839;
    padding:0;
}
.box.bgcolor2 .field-error, .box.bgcolor-tertiary .field-error, .box.status_box .field-error{
    background: #F5EA61;
    margin-top: 5px;
    padding: 5px 10px;
    border-radius: 5px;
    box-shadow: 0 3px 6px #3E3E3E;
}
.error_msg{
    font-size: 1.6rem;
    color: #ff3839;
    padding:10px;
}
.message.error {
    color: #ff3839;
    padding:10px;
    position: relative;
    top: 50px;
}
@media(min-width: 550px){
    #error_msg{
        position: relative;
        text-align: center;
        padding-top: 10px;
    }
}

/********************************
button
********************************/
.primary_btn,
.secondary_btn{
    border-radius: 10rem;
    border-style: solid;
    border-width: 2px;
    text-decoration: none;
    text-align: center;
    font-size: 2rem;
    display: inline-block;
    height: auto;
    padding: 1rem 3.8rem ;
    margin: 2rem 1rem;
    white-space: normal;
    font-family: font1bold, font2bold;
}
.primary_btn.no-margin-left,
.secondary_btn.no-margin-left{
    margin: 1rem 1rem 1rem 0;
}
.link_btn,
.btn_label{
    text-align: left;
    font-size: 1.4rem;
    display: inline-block;
    height: auto;
    padding: 1rem;
    margin: 1rem 1rem;
    white-space: normal;
    background: transparent;
    border: none;
}
.btn_label{
    padding: 1rem 0;
}
.link_btn{
    text-decoration: underline;
    cursor: pointer;
}

.btn_label .link_btn,
.btn_label a.link_btn,
.link_btn.normal_link {
    padding: 0;
    margin: 0 0.5rem;
    text-align: left;
}

.link_btn.normal_link{
    font-size: inherit;
}

.bgcolor-tertiary.force .primary_btn,
.bgcolor-tertiary .primary_btn {
    border-color: white;
    color: white;
    background: transparent;
}
.bgcolor1.force .primary_btn,
.bgcolor1 .primary_btn {
    border-color: #6E24D0;
    color: #6E24D0;
    background: transparent;
}
.bgcolor2.force .primary_btn,
.bgcolor2 .primary_btn {
    border-color: white;
    color: white;
    background: transparent;
}
.bgcolor-tertiary.force .secondary_btn,
.bgcolor-tertiary .secondary_btn {
    border-color: white;
    color: #6E24D0;
    background: white;
}
.bgcolor1.force .secondary_btn,
.bgcolor1 .secondary_btn {
    border-color: #6E24D0;
    color: white;
    background: #6E24D0;
}
.bgcolor2.force .secondary_btn,
.bgcolor2 .secondary_btn {
    border-color: white;
    color: #6E24D0;
    background: white;
}

.bgcolor-warning .primary_btn, .bgcolor-gray .primary_btn{
    border-color: #041C2C;
    color: #041C2C;
    background: transparent;
}
.bgcolor-warning .secondary_btn{
    border-color: white;
    color: #041C2C;
    background: white;
}
.bgcolor-dark.force .secondary_btn,
.bgcolor-dark .secondary_btn {
    border-color: white;
    color: #041C2C;
    background: white;
}
.bgcolor-dark.force .secondary_btn.purple_btn,
.bgcolor-dark .secondary_btn.purple_btn {
    border-color: #6E24D0;
    color: white;
    background: #6E24D0;
}
.primary_btn.disabled,
.primary_btn:disabled,
.force .primary_btn.disabled,
.force .primary_btn:disabled,
.primary_btn.pine_btn:disabled,
.force .primary_btn.pine_btn:disabled {
    border-color:#aaa;
    color:#aaa;
}
.secondary_btn.disabled,
.secondary_btn:disabled,
.force .secondary_btn.disabled,
.force .secondary_btn:disabled,
.secondary_btn.pine_btn:disabled,
.force .secondary_btn.pine_btn:disabled {
    border-color:#dadada;
    background: #dadada;
    color:rgb(110, 110, 110);
}
.primary_btn.pine_btn {
    border-color: #F5EA61;
    color: #F5EA61;
}
.secondary_btn.pine_btn {
    border-color: #F5EA61;
    background: #F5EA61;
    color: #6E24D0;
}
.primary_btn.dark_purple_btn {
    border-color: #4e008e;
    color: #4e008e;
}
.secondary_btn.dark_purple_btn {
    border-color: #4e008e;
    background: #4e008e;
    color: #ffffff;
}
.primary_btn.purple_btn {
    border-color: #6E24D0;
    color: #6E24D0;
}
.secondary_btn.purple_btn {
    border-color: #6E24D0;
    background: #6E24D0;
    color: #F5EA61;
}
.primary_btn.dark_btn {
    border-color: #041c2c;
    color: #041c2c;
}
.secondary_btn.dark_btn {
    border-color: #041c2c;
    background: #041c2c;
    color: #ffffff;
}
.primary_btn.white_btn {
    border-color: #ffffff;
    color: #ffffff;
}
.secondary_btn.white_btn {
    border-color: #ffffff;
    background: #ffffff;
    color: #041c2c;
}
.btn_label.left {
    float: left;
}
.link_btn.left {
    float: left;
}
/* example: forgot password btn */
.link_btn.field{
    position: absolute;
    right: 0px;
    top: 8px;
    margin: 0;
    z-index:1;
}
.bgcolor-gradient-yellow button {
    color: #F5EA61;
}

/*************************
image
*************************/
.emoji_icon{
    max-width: 70px;
}
/*************************
form element
*************************/
/*
    Form elements - general
*/
input, select, textarea{
    border: none;
    border-bottom-style: solid;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-top: 0.7rem;
    background: transparent;
    width: 100%;
    border-radius: 0;
    position: relative;
    color: inherit;
    filter: none;
}
input, select {
    height: 4rem;
}
select {
    -webkit-appearance:none;
}
select option {
    color: #041C2C;
    font-family: sans-serif; /** To fix firefox bug, not allowing special fonts */
    font-weight: normal;
}
select::-ms-expand {
    display: none;
}
input:focus, select:focus, textarea:focus, a:focus, button:focus {
    outline:none;
}
textarea{
    border: 3px solid rgba(0,0,0,0.1);
    border-bottom: 3px solid #041c2c;
    resize: none;
}
select, a, button {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
input.invalid,
input[type="text"].invalid,
select.invalid,
textarea.invalid{
    border-color: red;
    box-shadow: none;
}
input::placeholder,
select::placeholder,
textarea::placeholder{
    color: #aaa;
    font-style: italic;
}
input::-ms-clear {
    display: none;
}

.labelplaceholder input ~ label ,
.labelplaceholder select ~ label,
.labelplaceholder textarea ~ label  {
    position: absolute;
    left: 1rem;
    top: 1.7rem;
    font-size: 2rem;
    color: #aaa;
    font-family: 'font1';
    transition:  all 0.1s ease;
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    -o-transition: all 0.1s ease;
    -ms-transition: all 0.1s ease;
    z-index: 1;
}
.labelplaceholder input:focus ~ label,
.labelplaceholder select:focus ~ label,
.labelplaceholder textarea:focus ~ label,
.labelplaceholder input.hasdata ~ label,
.labelplaceholder select.hasdata ~ label,
.labelplaceholder textarea.hasdata ~ label{
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.4rem;
    font-style: normal;
    color: inherit;
    transition:  all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    z-index: 0;
}
.labelplaceholder textarea ~ label{
    background: white;
}
.labelplaceholder input:-webkit-autofill ~ label,
.labelplaceholder select:-webkit-autofill ~ label,
.labelplaceholder textarea:-webkit-autofill ~ label {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.4rem;
    font-style: normal;
    color: inherit;
    transition:  all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    z-index: 0;
}
.labelplaceholder input:autofill ~ label,
.labelplaceholder select:autofill ~ label,
.labelplaceholder textarea:autofill ~ label
{
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.4rem;
    font-style: normal;
    color: inherit;
    transition:  all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    z-index: 0;
}

.labelplaceholder input:-moz-autofill ~ label,
.labelplaceholder select:-moz-autofill ~ label,
.labelplaceholder textarea:-moz-autofill ~ label {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.4rem;
    font-style: normal;
    color: inherit;
    transition:  all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    z-index: 0;
}
@media(max-width: 350px){
    .labelplaceholder input ~ label ,
    .labelplaceholder select ~ label,
    .labelplaceholder textarea ~ label  {
        font-size: 1.6rem;
    }
}

.bgcolor2 input:-webkit-autofill, .bgcolor2 select:-webkit-autofill, .bgcolor2 input.force:-webkit-autofill, .bgcolor2 select.force:-webkit-autofill,
.bgcolor2 input:-webkit-autofill:focus, .bgcolor2 select:-webkit-autofill:focus, .bgcolor2 input.force:-webkit-autofill:focus, .bgcolor2 select.force:-webkit-autofill:focus{
    -webkit-box-shadow: 0 0 0 30px #6E24D0 inset!important;
    -webkit-text-fill-color: white;
    border-bottom-color: white;
    background-color: #4E008E !important;
    background-clip: content-box !important;
}

.bgcolor1 input:-webkit-autofill, .bgcolor1 select:-webkit-autofill,
.bgcolor1 input:-webkit-autofill:focus, .bgcolor1 select:-webkit-autofill:focus{
    -webkit-box-shadow: 0 0 0 30px white inset!important;
    -webkit-text-fill-color: #041C2C;
    border-bottom-color: #041C2C;
    background-color: white !important;
    background-clip: content-box !important;
}

.bgcolor-dark input:-webkit-autofill, .bgcolor-dark select:-webkit-autofill,
.bgcolor-dark input:-webkit-autofill:focus, .bgcolor-dark select:-webkit-autofill:focus{
    -webkit-box-shadow: 0 0 0 30px #041c2c inset!important;
    -webkit-text-fill-color: #ffffff;
    border-bottom-color: #ffffff;
    background-color: #041c2c !important;
    background-clip: content-box !important;
}
.form_element{
    text-align: left;
    position: relative;
    /* margin-top: 30px;
    margin-left: 10px;
    margin-right: 20px; */
    margin:15px 20px 2px 10px;
}
.form_element.labelplaceholder {
   padding-top: 10px;    /* Replace the old label sizing */
}

.form_element.full{
	display: inline-block;
	width: 93.5%;
}

.form_element.half{
	display: inline-block;
	width: 45%;
	vertical-align: top;
}
.form_element.half-half{
	display: inline-block;
    width: 46%;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    vertical-align: top;
}
.form_element.half-half label, .form_element.half-half .item label, .form_element.half-half .item select{
    width: 100%;
}
.form_element.half .form_element.half-half:first-of-type{
    margin-right: 1rem;
}
@media (max-width: 690px){
    .form_element.half{
        width: 100%;
    }
}
@media (max-width: 550px){
    .form_element{
        margin-left: 0px;
        margin-right: 0px;
    }
    .form_element.full{
        width: 100%;
    }
    .form_element.half{
        width: 100%;
        margin-left: 0px;
    margin-right: 0px;
    }
    .form_element.half .form_element.half-half:first-of-type {
        margin-right: 5%;
    }
}
/*
    Form elements - title
*/
.form-title{
    font-size: 36px;
    padding-bottom: 60px;
}
input[type="submit"]{
    width: fit-content;
}
.footer_button{
    padding-top: 100px;
}
@media(max-width:991px){
    .form-title{
        padding-bottom: 15px;
    }
    .footer_button{
        padding-top: 30px;
    }
}
/*************************
col
*************************/
.col-10, .col-20, .col-30, .col-40, .col-50, .col-60, .col-70, .col-80, .col-90, .col-100{
    display: inline-block;
    vertical-align: middle;
    position: relative;
}
.col-10{
    width: 10%;
}
.col-20{
    width: 20%;
}
.col-30{
    width: 30%;
}
.col-40{
    width: 40%;
}
.col-50{
    width: 50%;
}
.col-60{
    width: 60%;
}
.col-70{
    width: 70%;
}
.col-80{
    width: 80%;
}
.col-90{
    width: 90%;
}
.col-100{
    width: 100%;
}
.full-box{
    width: 100%;
    position: relative;
}
.box{
  padding: 100px 128.5px;
  position: relative;
  max-width: 1360px;
  margin: 0 auto;
}
@media(max-width: 991px){
    .col-10, .col-20, .col-30, .col-40, .col-50, .col-60, .col-70, .col-80{
        width: 100%;
    }
    .box{
        height: auto;
        padding: 50px 40px;
    }
}
@media(max-width: 550px){
    .box{
        padding: 50px 20px;
    }
}
/***************************
mobile desktop control
***************************/
.mobile-view{
    display: none;
}
.md-mobile-view{
    display: none;
}
.desktop-view{
    display: block;
}
.sm-desktop-view{
    display: block;
}
.desktop-view-inline-block{
    display: inline-block;
}
.tablet-view{
    display: block;
}
@media(max-width: 991px){
    .mobile-view{
        display: block;
    }
    .desktop-view, a.desktop-view, .desktop-view-inline-block, a.desktop-view.button {
        display: none;
    }
}
@media(max-width: 767px){
    .tablet-view{
        display: none;
    }
    .md-mobile-view{
        display: block;
    }
}
@media(max-width: 550px){
    .sm-desktop-view{
        display: none;
    }
}
/********************************
animation
********************************/
@-webkit-keyframes marquee3 {
	from {-webkit-transform: translateX(0%);}
	to {-webkit-transform: translateX(-660%);}
}
@keyframes marquee3 {
	from {transform: translateX(0%);}
	to {transform: translateX(-660%);}
}
@-webkit-keyframes marquee4 {
    from {-webkit-transform: translateX(0%)}
    to {-webkit-transform: translateX(-675%)}
}

@keyframes marquee4 {
    from {transform: translateX(0%)}
    to {transform: translateX(-675%)}
}
@-webkit-keyframes marquee5 {
    from {-webkit-transform: translateX(0%)}
    to {-webkit-transform: translateX(-778%)}
}

@keyframes marquee5 {
    from {transform: translateX(0%)}
    to {transform: translateX(-778%)}
}
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadeInUp {
    0% {opacity: 0;-webkit-transform: translate3d(0, 100%, 0);transform: translate3d(0, 100%, 0)
    }
    to {opacity: 1;-webkit-transform: translateZ(1);transform: translateZ(1)
    }
}
@keyframes fadeInDown {
    0% {opacity: 0;-webkit-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0)
    }
    to {opacity: 1;-webkit-transform: translateZ(0);transform: translateZ(0)
    }
}
@keyframes rotate-right {
    0% {opacity: 0;-webkit-transform: translate3d(0, 100%, 0) rotate(20deg);transform: translate3d(0, 100%, 0) rotate(20deg);
    }
    to {opacity: 1;-webkit-transform: translateZ(1) rotate(0deg);transform: translateZ(1) rotate(0deg);
    }
}
@keyframes slideInRight {
    0% {-webkit-transform: translate3d(100%, 0, 0);transform: translate3d(100%, 0, 0);visibility: visible
    }
    to {-webkit-transform: translateZ(0);transform: translateZ(0)
    }
}
/*************************
loader
*************************/
#loader {
    position: fixed;
    z-index: 20;
    height: 100%;
    width: 100%;
    background: url("/assets/mpn/std/img/loader.gif"), rgba(0, 0, 0, 0.309804);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 120px;
    display: none
}
#loader.loader_on {
    display: block
}

/********************************
modal text style
********************************/

#modal_text ul{
    margin-left: 30px;
    list-style: disc;
}
#modal_text b, #modal_text strong{
    font-weight: bold;
}
#modal_text i, #modal_text em{
    font-style: italic;
}
#modal_text ins, #modal_text u{
    text-decoration: underline;
}

/********************************
Overlay
********************************/
cc-overlay {
    position: fixed;
    display: block;
    z-index: 999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.4);
    border: none;
}
/********************************
dragging
********************************/
.draggable {
    cursor: pointer !important;
    cursor: url('/assets/sys/img/openhand.cur?v=1.85.007'), pointer !important;
    cursor: grab !important;
}

.dragging,
.dragging .draggable {
    cursor: move !important;
    cursor: url('/assets/sys/img/closedhand.cur?v=1.85.007'), move !important;
    cursor: grabbing !important;
}
/********************************
New modal dialog
********************************/
dialog {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	margin: 0;
	z-index: 200;

	flex-direction: column;
	width: intrinsic;
    width: max-content;
    min-width: 20vw;
    max-width: 70vw;

    min-height: 10vh;
    max-height: 90vh;
    padding: 0;

    background-color: rgb(254, 254, 254);
    color: #101619;

    border: 1px solid #d2d2d2;
    border-radius: 10px;
	/* box-shadow: 3px 5px 8px #888; */
	pointer-events: auto;
}
dialog[open] {
	display: flex;
}
dialog > header {
	position: relative;
	vertical-align: top;
	padding: 0.25em 1em;
    border-bottom: 1px solid #d2d2d2;
	text-align: center;
	font-size: 150%;
    font-family: font1, font2, sans-serif;
}
dialog > div {
	overflow: auto;
	padding: 0.5em 1em 0 1em;
	position: relative;
	min-height: 2em;
	max-height: calc(90vh - 6em);	/* IE11 Fix */
}
dialog > button._close {
    position: absolute;
    padding: 0;
    margin: 0;
    top: 0;
    right: 10px;
    height: auto;
    min-height: auto;
    font-weight: bold;
    cursor: pointer;
    background-color: transparent;
    color: rgb(170, 170, 170);
    font-size: 1em;
    line-height: 1em;
    text-align: center;
    width: 1em;
    z-index: 10;
    border: none;
}
dialog > button._close:after {
    content: "\00d7";
    transform: rotate(0deg);
}
button._close:before, button._close:after {
    background-color: rgba(0,0,0,0);
}
dialog > footer {
	display: block;
	padding: 0.5em 1em;
	position: relative;
	text-align: center;
    background-color: rgba(0,0,0,0);
}
dialog > footer button{
    border-radius: 10rem;
    border-style: solid;
    border-width: 2px;
    text-decoration: none;
    text-align: center;
    font-size: 2rem;
    display: inline-block;
    height: auto;
    padding: 0.5rem 1rem;
    margin: 0.5rem 1rem;
    white-space: normal;
    font-family: font1bold, font2bold;
    border-color: #6E24D0;
    color: #6E24D0;
    background: white;
}
dialog > footer button._2nd {
    border-color: white;
    color: white;
    background: #6E24D0;
}
dialog._leftbtns > footer,
dialog[flow="left"] > footer {
	text-align: left;
}
dialog._rightbtns > footer,
dialog[flow="right"] > footer {
	text-align: right;
}
dialog > footer:after { 	/* Required fix for when all buttons are flow="right" */
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

/********************************
cc-imagebox
********************************/
cc-imagebox {
    width: calc((100% - 140px) / 3);
    background: none;
    margin-bottom: 40px;
}
cc-imagebox img {
    height: 350px;
}
cc-imagebox footer {
    background-color: none;
    z-index: 0;
}
cc-imagebox:not(._list) main{
    padding: 20px;
    padding-bottom: 0;
}
cc-imagebox:not(._list) footer {
    padding-bottom: 20px;
}
cc-imagebox header,
cc-imagebox main,
cc-imagebox footer {
    background: #f3f3f4;
}
@media(max-width: 1200px){
    cc-imagebox img {
        height: 250px;
    }
}
.blog_card cc-imagebox {
    padding: 0 20px;
    width: 32%;
    margin-bottom: 40px;
}
@media(max-width: 990px){
    .blog_card cc-imagebox {
        width: 100%;
        padding: 0 0 50px
    }
    cc-imagebox img {
        height: auto;
    }
}
/*************************
header
*************************/
header > div{
  padding: 12px 25px;
}
header .bottom_bar{
  padding: 12px 43px;
}
header a.link{
  padding: 0;
  margin: 0;
  padding: 0 20px;
  text-decoration: none;
  display: inline-block;
}
header .top_bar .link{
  font-size: 17px;
}
header .link, .bgcolor2 header .link {
  color: rgba(255, 255, 255, 0.55);
  transition: all 0.2s;
}
header .link.go_back_btn{
  color: rgba(255, 255, 255);
}
header .link {
    color: rgba(255, 255, 255, 0.55);
    transition: all 0.2s;
}
header .link:hover, header .standard_color_btn,
.bgcolor2 header .standard_color_btn {
  color: rgba(255, 255, 255);
}
header .bottom_bar .link{
  font-size: 21px;
  font-weight: bold;
}
header .bottom_bar .link:hover{
  color: rgba(255, 255, 255);
  font-weight: bold;
}
header .bottom_bar .text-left img {
    vertical-align: middle;
}
header .logo_box img{
    width: 200px;
    max-width: none;
}
header .logo_box .purple_logo, header .menu_box .purple_menu{
    display: none;
}
header .menu_box {
    text-align: right;
}
header .menu_box .button._cset2{
    color: #6E24D0;
    margin: 20px 10px;
}
header .menu_box img{
    width: 35px;
}
header .menu_box #close_menu_btn{
    width: 25px;
}
a.pine_btn.event_get_started, .enquire_btn {
    width: fit-content;
    float: right;
}
header .top_bar span{
    vertical-align: bottom;
    font-size: 35px;
    font-weight: 200;
}
header .selected_link, header a.selected_link, .bgcolor2 header a.selected_link, cc-panel .col-80 a.selected_link,cc-panel.dark_side_menu .col-80 a.selected_link{
    font-family: font1bold;
    color: white;
}
header .bottom_bar .link.selected_link{
    font-family: font1;
}
@media(max-width: 1300px){
    header .bottom_bar .link{
        font-size: 1.6vw;
    }
}
@media(max-width: 1181px) {
    header .bottom_bar .link {
        padding: 0 10px;
    }
}
@media(max-width: 1109px){
    .menu_box #get_started_btn1, .enquire_btn{
        padding: 10px 25px;
    }
}
@media(max-width: 991px){
    header .col-20{
        width: 20%;
    }
    header .col-50{
        width: 50%;
    }
    header .col-60{
        width: 60%;
    }
    a.pine_btn.event_get_started, .enquire_btn {
        float: none;
    }
}
@media(max-width: 767px) {
    header .bottom_bar{
        padding: 20px 20px;
    }
}
#pgloginlanding cc-iconmenu cc-panel {
    background-color: #ECDFFD;
}
/*************************
light color header
*************************/

header.light-color .bgcolor-dark-transparent{
  background: rgba(4, 28, 44, 0.05);
}
header.light-color .link{
  color: rgba(0, 0, 0, 0.4);
}
header.light-color .link:hover, header.light-color .link.standard_color_btn{
  color: rgba(0, 0, 0);
}
header.light-color .logo_box .purple_logo{
    display: block;
}
header.light-color .logo_box .white_logo, header.light-color .menu_box .white_menu, header.light-color .menu_box .purple_menu{
    display: none;
}
header.light-color  .link{
  color: rgba(4, 28, 44, 0.5);
  transition: all 0.2s;
}
header.light-color .link:hover{
  color: rgb(4, 28, 44);
}
header.light-color .link.selected_link{
    color: rgb(4, 28, 44);
}
@media(max-width: 991px){
    header.light-color .menu_box .purple_menu{
        display: block;
    }
}
/*************************
header on top of main
*************************/
header.overlay_on_main{
    position: absolute;
    top: 0;
    z-index: 20;
    width: 100%;
}
/*************************
side_menu
*************************/
cc-iconmenu {
    float: right;
    margin: 0;
}
cc-iconmenu#side_menu > cc-panel {
    box-shadow: -4px 4px 12px rgba(0,0,0,0.16);
    z-index: 70;
}
.bgcolor-dark cc-iconmenu._hamburger {
    background-image: url(/assets/mpn/std/img/icon-hamburger-alt3.svg);
}
.bgcolor-dark cc-panel button._close {
    background-image: url(/assets/mpn/com/img/icon-close.svg);
}
cc-panel button {
    top: 55px;
    right: 40px;
}
cc-panel > div {
    margin-top: 20px;
    overflow: auto;
    height: calc(100vh - 230px);
}
cc-iconmenu#side_menu > cc-panel > footer{
    background: #4E008E;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}
cc-iconmenu#side_menu cc-panel > footer a {
    margin: 20px auto;
    padding: 10px 38px;
    font-size: 17px;
    width: auto;
    display: block;
    max-width: 170px;
}
.bgcolor-dark cc-iconmenu > cc-panel > footer {
    background: none;
}
.bgcolor-dark cc-panel .secondary_btn{
    background: #041C2C;
    color: white;
    border-color: white;
}

/*************************
footer
*************************/
body > footer{
    background: #041c2c;
    color: white;
    position: relative;
    height: auto;
    width: 100%;
    z-index: 4;
}
footer .box{
    padding: 30px;
}
footer .logo{
    width: 40px;
    vertical-align: middle;
    margin-right: 10px;
}
footer .titans-mpn{
    width: auto;
    height: 60px;
}
footer a{
    text-decoration: none;
}
footer .first_bar{
    margin-bottom: 80px;
}
footer .first_bar .col-50{
    vertical-align: top;
}
footer .footer_menu_box div{
    display: inline-block;
    width: 30%;
    vertical-align: top;
    text-align: left;
    font-size: 16px;
}
footer .footer_menu_box div a, footer .footer_menu_box div p{
    margin-bottom: 1.5rem;
    margin-top: 0;
    display: block;
}
.first_level_link{
    font-weight: bold;
}
.terms_links_box a, .mpn_link_box a{
    text-decoration: none;
}
.terms_links_box a {
    font-size: 14px;
    white-space: nowrap;
    display: inline-block;
    margin: 5px 15px;
}
.terms_links_box a + a {
    margin-left: 15px;
}
.personal_business_box a:not(:last-of-type){
    margin-right: 30px;
}
.personal_business_box a{
    color: rgba(255,255,255,0.55);
}
footer .personal_business_box a.link{
    font-size: 25px;
}
footer a.link {
    text-decoration: none;
    font-size: 16px;
}
footer .terms_links_box a.link {
    font-size: 14px;
}
.personal_business_box a.selected_link{
    color: white;
}
.mpn_link_box a span{
    vertical-align: middle;
}
footer .footer_menu_box .show_menu_item{
    display: none;
}
.second_bar .terms_links_box br{
    display: none;
}
@media(max-width: 1277px){
    .second_bar .terms_links_box br{
        display: inline;
    }
}
@media(max-width: 991px){
    .footer_menu_box{
        text-align: left;
        margin-top: 50px;
    }
    .second_bar .col-30{
        width: 30%;
    }
    footer .second_bar > .terms_links_box.desktop-view-inline-block {
        display: inline-block;
        width: 40%;
    }
}
@media(max-width: 768px){
    footer .footer_menu_box .hide_menu_item{
        display: none;
    }
    footer .footer_menu_box .show_menu_item{
        display: block;
    }
    footer .footer_menu_box div{
        width: 100%;
    }
    .copyright .message-sm{
        font-size: 1.2rem;
    }
    .first_level_link{
        font-weight: normal;
    }
    footer .first_bar{
        margin-bottom: 60px;
    }
    .second_bar .col-30{
        width: 50%;
    }
    footer .second_bar > .terms_links_box.desktop-view-inline-block {
        display: none;
    }
}
@media(max-width: 576px){
    footer .footer_menu_box .hide_menu_item{
        display: none;
    }
    footer .footer_menu_box .show_menu_item{
        display: block;
    }
    footer .footer_menu_box div{
        width: 100%;
    }
    .second_bar .col-30{
        width: 100%;
        text-align: left;
    }
    .copyright br{
        display: none;
    }
    .mpn_link_box, .copyright{
        margin-bottom: 20px;
    }
}

/*************************
google recaptcha
*************************/
.grecaptcha-badge{
    z-index: 40;
    bottom: 115px!important;
}
@media(max-width: 991px){
    .grecaptcha-badge{
        display: none!important;
    }
}
/*************************
social media
*************************/
.social_media_btn img{
    display: inline-block;
    max-height: 40px;
    height: 100%;
    width: auto;
    padding-right: 20px;
    margin: 10px 0;
}

.social_media_btn.large{
    height: 55px;
}
@media(max-width:768px){
    .social_media_btn.continue_with_web_btn{
        display: none;
    }
}
@media(max-width: 400px){
    .social_media_btn img{
        max-height: 30px;
        padding-right: 10px;
    }
}
/*************************
youtube_box
*************************/
.youtube_box{
    background: #041c2c;
    height: 100%;
    width: 100%;
    z-index: 30;
    border: none;
    max-width: unset;
    max-height: unset;
    justify-content: center;
}
.youtube_box button._close:before,
.youtube_box button._close:after{
    color: white;
}
.youtube_box div{
    height: 100%;
    min-height: calc(90vh - 1em);
}
.youtube_box header,
.youtube_box footer{
    display: none;
}

.youtube_box iframe#player{
    height: 80%;
    width: 80%;
    position: relative;
}
.youtube_box button._close:before,
.youtube_box button._close:after{
    background-color: white;
    color: rgba(0,0,0,0);
    left: 10px;
    height: 30px;
    width: 3px;
}
.youtube_box button._close:after{
    transform: rotate(-43deg);
}
@media(max-width:550px){
    .youtube_box iframe#player{
        height: 50%;
        width: 100%;
    }
}

/******************************
vertical_slideshow - static
******************************/
.vertical_slideshow img{
    max-width: 350px;
    width: 100%;
}
.vertical_slideshow p{
    font-size: 2.2rem;
    padding-bottom: 4rem;
}
.vertical_slideshow .title{
    font-size: 4.5rem;
    padding-bottom: 4rem;
}
@media(max-width: 991px){
    .vertical_slideshow img{
        margin: 30px 0;
        width: 60%;
    }
    .vertical_slideshow p{
        font-size: 2rem;
        padding-bottom: 1.3rem;
    }
    .vertical_slideshow .title{
        font-size: 2.5rem;
        font-weight: bold;
        padding-bottom: 2rem;
    }
}

/*************************
cc-scrollbox
*************************/
cc-scrollbox {
    margin-bottom: 10rem;
}
cc-scrollbox > div > content {
    font-size: 2rem;
}
cc-scrollbox > div > .rating {
    color: #F5EA61;
    padding-bottom: 10px;
    font-size: 2rem;
}
cc-scrollbox > div > .name {
    font-size: 1.8rem;
    position: absolute;
    bottom: 15px;
    background: none;
    color: unset;
}
@media(min-width: 550px){
    cc-scrollbox:hover {
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }
}
@media(max-width: 550px){
    cc-scrollbox{
        margin-bottom: 5rem;
    }
}

/********************************
expando
********************************/
div[expando] {
    padding: 20px 0;
    font-family: font1bold, font2bold;
    position: relative;
    margin: 0px auto 0;
    width: 100%;
    font-size: 21px;
    text-align: left;
    border-bottom: 1px solid #dedede;
    cursor: pointer;
}

div[expando] span {
    width: 90%;
    display: inline-block;
    word-wrap: break-word;
    font-size: 21px;
}

div[expando].expanded {
    color: #6E24D0;
}

div[expando]+div {
    display: block;
    margin: 0px auto;
    /* width: 100%; */
    text-align: left;
    padding: 20px;
    font-family: font1light, font2light;
}

div.expando > div {
    width: 90%;
    margin: auto;
}

div[expando]:after {
    right: 20px;
    font-size: 30px;
    height: 37px;
}

div[expando]._1st_level {
    background: white;
    color: #041C2C;
}

@media(max-width: 550px){
    div[expando] {
        width: 100%;
    }
    div[expando]:after {
        right: 0;
    }
}
/******************************
img container
******************************/
@media(min-width: 991px){
    .img_card {
        max-height: 550px;
        position: relative;
        overflow: hidden;
        width: 100%;
        height: 100%;
        display: block;
        min-height: 350px;
    }

    .img_card img {
        position: relative;
        height: auto;
        width: auto;
    }
    .img_card img.img_centered {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -40%);
        position: absolute;
    }
    .img_card img.blog_img{
        width: 140%;
        height: auto;
    }
}
.img_card.square_img {
    min-height: unset;
}
.img_card.square_img img.img_centered {
    position: relative;
    transform: translate(-50%, 0);
    top: unset;
}
.img_card img.sm_img{
    width: 100%;
    height: 100%;
    max-width: 400px;
}
@media(max-width: 1230px){
    .img_card {
        min-height: 300px;
    }
}
@media(max-width: 991px){
    .img_card {
        min-height: unset;
    }
    .img_card.square_img img.img_centered {
        position: relative;
        transform: unset;
    }
}

/*************************
main
*************************/
.main{
  height: calc(100vh - 160px);
  min-height: 700px;
  z-index: 5;
}
.main .box{
    padding: 0px 128.5px;
    height: 100%;
}
@media(max-width:1200px){
    .main .box {
        padding: 0px 40px;
    }
}
@media(max-width:991px){
    .main{
        padding-top: 40px;
    }
    .main .vertical-centered-bottom{
        top: unset;
        transform: none;
        max-width: 550px;
        position: absolute;
        bottom: 70px;
        width: 70%;
    }
}
@media(max-width:550px){
    .main .box {
        padding: 0px 20px;
    }
    .main{
        min-height: 600px;
    }
}

/******************************
vertical_slideshow - static - ie
******************************/
.ie_container img{
    max-width: 300px;
}
.ie_box{
    height: 100vh;
}
.ie_box .vertical-centered{
    position: relative;
}
.ie_box .main-title{
    padding-bottom: 20px;
    font-size: 36px;
}
.ie_box .title{
    padding-bottom: 20px;
    font-size: 45px;
    font-weight: bold;
}
.ie_box .message{
    padding-bottom: 20px;
    font-size: 24px;
}

/******************************
3 by 3 boxes
******************************/
.by3 .box{
    padding: 100px 0;
}
.by3 .col-30{
    width: 33%;
    padding: 0 10px;
    margin: 20px 0;
}
.by3 .col-30 p{
    font-size: 26px;
    font-family: font1bold;
}
.by3 span{
    font-size: 18px;
}
@media(max-width: 991px){
    .by3 .col-30{
        width: 100%;
        padding: 0 50px;
        text-align: left;
    }
    .by3 .col-30 img, .by3 .col-30 div.mobile-view, .by3 .col-30 div, .by3 .col-30 span{
        display: inline-block;
        vertical-align: middle;
    }
    .by3 .col-30 img, .by3 .col-30 div.mobile-view{
        width: 20%;
        max-width: 80px;
    }
    .by3 .col-30 span{
        width: 79%;
    }
    .by3 span.param_data{
        width: auto;
    }
}
@media(max-width: 550px){
    .by3 .box{
        padding: 50px 0;
    }
    .by3 .col-30{
        width: 100%;
        padding: 0 20px;
        text-align: left;
    }
    .by3 .col-30 span {
        width: 77%;
    }
    .by3 .col-30 div:not(.mobile-view){
        width: 70%;
    }
    .by3 span.param_data{
        width: auto;
    }
}


/******************************
hidden_bottom_btn
******************************/
.hidden_bottom_btn{
    display: none;
    position: fixed;
    bottom: 0;
    z-index: 60;
    -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
    -moz-box-shadow:    0 4px 16px rgba(0, 0, 0, 0.1);  /* Firefox 3.5 - 3.6 */
    box-shadow:         0 4px 16px rgba(0, 0, 0, 0.1);  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
    transition: all 0.3s;
}
.active_btn .hidden_bottom_btn{
    display: block;
    transition: all 0.3s;
}
.active_youtube .hidden_bottom_btn{
    display: none;
}
.hidden_bottom_btn a.button._cset2{
    width: auto;
    color: #6E24D0;
    margin: 20px 0;
}

/******************************
media blog_card
******************************/
.blog_card .box{
    padding: 40px;
}
.blog_card .col-100{
    padding: 40px 0;
}
.blog_card .col-30 {
    padding: 0 20px;
    width: 32.5%;
}
.blog_card .blog_info{
    padding: 20px;
    margin-bottom: 40px;
}
 .blog_category{
    font-size: 22px;
    padding: 20px 0;
    color: #6E24D0;
}
.blog_title{
    font-size: 35px;
    padding-bottom: 40px;
}
.blog_date, .blog_author, .blog_read_time{
    display: inline;
    font-size: 14px;
    color: rgba(0,0,0,0.4);
}
 .blog_date{
    padding-right: 20px;
}
.blog_bottom{
    padding: 40px;
}
.blog_bottom .col-40{
    padding-left: 30px;
    font-family: 'font1bold';
}
#blog_articles #category_filter {
    overflow: auto;
}
#blog_articles #category_btn_group {
    width: 750px;
    margin: 0 auto;
}
@media(min-width: 991px){
    .blog_title{
        min-height: 150px;
    }
    .blog_card .blog_info{
        min-height: 250px;
    }

}
@media(max-width: 991px){
    .blog_card .box {
        padding: 40px;
    }
    .blog_card .col-50{
        padding: 0 0 50px;
    }
    .blog_card .blog_info{
        margin-bottom: 0;
    }
    .blog_card .col-50{
        width: 100%;
    }
    #blog_articles .col-60{
        padding-bottom:20px
    }
    #blog_articles .col-20{
        font-size:16px
    }
    .blog_bottom .col-40 , .blog_bottom .col-50{
        width: 50%;
        padding: 0 0 50px 0;
    }
    .blog_card .col-30 {
        padding: 0 0 50px;
    }
    .blog_card .col-30 {
        width: 100%;
    }
}
@media(max-width: 550px){
    .blog_card .box{
        padding: 20px;
    }
    .blog_title {
        font-size: 35px;
    }
    .blog_bottom .col-40, .blog_bottom .col-50{
        width: 100%;
    }
    .blog_bottom .col-30 {
        width: 100%;
    }
}
@media (min-width: 991px){
    #media_pg .img_card img.blog_img {
        top: 36%;
    }
}

/******************************
tnc_container
******************************/
.tnc_container h1,
.tnc_container h1 strong {
    font-family: font1bold;
}
.tnc_container h2,.tnc_container h3,.tnc_container h2 strong,.tnc_container h3 strong{
    font-family: font1bold;
}
.tnc_container h1{
    font-size: 44px;
    padding-bottom: 30px;
}
.tnc_container h2{
    font-size: 36px;
    padding-bottom: 10px;
}
.tnc_container h3{
    font-size: 27px;
    padding-bottom: 10px;
}
.tnc_container p, cc-scrolllist a {
    font-size: 18px;
    font-family: font1light;
    margin-bottom: 18px;
    line-height: 22.5px;
}
.tnc_container cc-scrolllist a {
    font-size: 22px;
    color: rgba(0, 0, 0, 0.4);
    padding: 10px 0;
    list-style: none;
    margin-left: 0;
}
.tnc_container ol.decimal > li{
    list-style: decimal;
}
.tnc_container ol.alpha > li{
    list-style: lower-alpha;
}
.tnc_container ol.decimal > li ul > li,
.tnc_container ol.alpha > li ul > li{
    list-style: disc;
}
.tnc_container li {
    font-size: 18px;
}
.tnc_container table._simple > tbody > tr > td {
    padding: 10px;
    font-size: 18px;
}
/******************************
blog blog_post
******************************/
#blog_pg #more_btn{
    font-family: font1bold;
}
#blog_pg #more_btn:hover{
    cursor: pointer;
}
@media(max-width: 991px){
    #blog_pg #more_btn{
        text-decoration: underline;
    }
}
#blog_content #blog_filter{
    padding: 0 0 70px 0;
}

/******************************
blog blog_post
******************************/
#blog_post_pg {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
#blog_post_pg > footer {
    margin-top: auto;
}
.blog_bottom{
    padding-top: 100px;
}
.blog_post h2{
    font-size: 36px;
}
.blog_post .box{
    max-width: 830px;
    padding: 50px 0 100px;
}

.blog_post .blog_date_read_details{
    padding-bottom: 40px;
}

.icon{
    display: inline-block;
    height: 1em;
    width: 0.8em;
    pointer-events: none;
    vertical-align: text-top;
}

.share_media_btns a, .share_media_btns p, .share_media_btns div{
    display: inline-block;
}
.share_media_btns a img.icon, .share_media_btns p img.icon, .share_media_btns di img.icon{
    background-image: none;
}
.share_media_btns a{
    padding: 0 10px;
}
.blog_post .blog_bottom .col-50{
    width: 50%;
}
.blog_post .blog_category{
  font-family: font1

}
.blog_post .blog_title {
    font-family: font1bold;
    padding: 10px 0 20px;
}
.blog_post .blog_bottom {
    padding: 100px 0 50px;
}

.blog_post #editor_content1 p{
    font-size: 22.5px;
    line-height: 28.125px;
    margin-bottom: 20px;
}

.blog_post #editor_content1 h2 {
    font-size: 36px;
    margin-bottom: 20px;
}

.blog_post #editor_content1 ol, .blog_post #editor_content1 ul {
    margin-top: 0;
    margin-bottom: 1rem;
}

.blog_post #editor_content1 ol li, .blog_post #editor_content1 ul li {
    list-style: decimal;
    margin-left: 40px;
    font-size: 22.5px;
    line-height: 28.125px;
}

.blog_post #editor_content1 ul li {
    list-style: disc;
}

.blog_post #editor_content1 a {
    font-size: 22.5px;
    line-height: 28.125px;
    text-decoration: underline
}

.blog_post p img{
    height:  auto;
}

@media (min-width: 991px){
    .blog_post .blog_title {
        min-height: unset;
        font-size: 65px;
    }
}

@media(max-width:991px){
    .blog_post .box{
        padding: 0px 20px;
    }
    .blog_bottom{
        padding: 50px 0 20px 0;
    }
    #mypaynow_pg2 #pay_advance_work .button#sign_up_now_btn {
        padding: 1rem;
    }
    #mypaynow_pg2 #pay_advance_work .slideshow + .box {
        padding: 50px 15px 80px;
    }
}
@media(max-width: 550px){
    .blog_card .blog_bottom {
        padding: 80px 20px;
    }
}

/******************************
blog post table default style in #editor_content1
******************************/
.blog_post #editor_content1 table,
.blog_post #editor_content1 table tr,
.blog_post #editor_content1 table tr td {
    border: 1px solid #041b2c;
}

.blog_post #editor_content1 table tr td {
    padding: 10px;
}

.blog_post #editor_content1 table tr td p {
    margin-bottom: 0;
}
/******************************
error_page
******************************/
.error_page{
    min-height: 600px;
    background-repeat: no-repeat;
    background-position: bottom left 15%;
    background-size: 40%;
}
.error_page.error_page_404{
    background-image: url(/assets/mpn/com/img/slothy-shrugging.png);
    height: 90vh;
    min-height: 600px;
}
@media(max-width: 991px){
    .error_page{
        background-position: bottom center;
        background-size: 55%;
    }
    .error_page .vertical-centered{
        top: unset;
        transform: unset;
    }
}
@media(max-width: 550px){
    .error_page{
        background-size: contain;
    }
}
/******************************
youtube player
******************************/

#player{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/**************************
titans blog
**************************/
#titans_blog_index_pg > div > header {
    height: 100vh;
    background-image: url(/assets/mpn/web/img/titans_blog_header.jpg);
    background-repeat: no-repeat;
    background-position: center top 50px;
    background-size: cover;
    min-height: 550px;
}

#titans_blog_index_pg > div > header > div:last-of-type {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}

.logo.titans-mpn {
    max-height: 100px;
}

@media (max-height: 575px) and (min-width: 767px) {
    #titans_blog_index_pg > div > header > div:last-of-type {
        position: relative;
        left: initial;
        top: initial;
        transform: none;
    }
}

@media (max-width: 767px) {
    #titans_blog_index_pg > div > header {
        background-position: center top;
    }

    #titans_blog_index_pg > div > header > div:last-of-type {
        top: initial;
        bottom: 0;
        transform: translate(-50%, -30%);
    }

    .logo.titans-mpn {
        max-height: 60px;
    }
}

/*******************
blog_articles
*******************/
#titans_blog_index_pg #blog_articles > div.col-30 {
    width: 32.5%;
    padding: 0 20px;
}

@media (max-width: 850px) {
    #titans_blog_index_pg #blog_articles > div.col-30 {
        width: 49%;
        padding: 0 20px 50px;
    }
}

@media (max-width: 650px) {
    #titans_blog_index_pg #blog_articles > div.col-30 {
        width: 100%;
        padding: 0 0 50px;
    }
}

/*******************
override std.css
*******************/
/******* button *******/
button, .button, input[type="button"], input[type="submit"], input[type="reset"]{
    padding: 1rem 3.8rem;
}
button + button, button + .button, button + input[type="button"], button + input[type="submit"], button + input[type="reset"], button + a, button + .link, .button + button, .button + .button, .button + input[type="button"], .button + input[type="submit"], .button + input[type="reset"], .button + a, .button + .link, input[type="button"] + button, input[type="button"] + .button, input[type="button"] + input[type="button"], input[type="button"] + input[type="submit"], input[type="button"] + input[type="reset"], input[type="button"] + a, input[type="button"] + .link, input[type="submit"] + button, input[type="submit"] + .button, input[type="submit"] + input[type="button"], input[type="submit"] + input[type="submit"], input[type="submit"] + input[type="reset"], input[type="submit"] + a, input[type="submit"] + .link, input[type="reset"] + button, input[type="reset"] + .button, input[type="reset"] + input[type="button"], input[type="reset"] + input[type="submit"], input[type="reset"] + input[type="reset"], input[type="reset"] + a, input[type="reset"] + .link, a + button, a + .button, a + input[type="button"], a + input[type="submit"], a + input[type="reset"], a + a, a + .link, .link + button, .link + .button, .link + input[type="button"], .link + input[type="submit"], .link + input[type="reset"], .link + a, .link + .link {
    margin-left: 0;
}

/******* group-2 *******/
@media (min-width: 551px) {
    group-2d > * {
        width: calc(50% - 18px) !important;
    }
    group-2d > *:nth-child(odd) {
        margin-right: 35px;
    }
}
/*******************
refer friend banner
*******************/
#refer_friend_banner  {
    /* background-image: url(/assets/mpn/web/img/pg-refer-banner-bg1.png), url(/assets/mpn/web/img/pg-refer-banner-bg2.png); */
    background-repeat: no-repeat;
    background-position: left top, right top;
    width: 100%;
    padding: 0;
}
#refer_friend_banner > div {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100vw;
    margin: 0 auto;
    cursor: pointer;
}
#refer_friend_banner > div > * {
    padding: 5px 10px;
}
#refer_friend_banner > div > a {
    text-align: center;
    color:#6E24D0;
    z-index: 50;
    line-height: 0.6;
}
#refer_friend_banner > div p {
    color: #6E24D0;
    font-size: 22px;
    font-family: font1bold, font2bold;
}
#refer_friend_banner > div img.desktop {
    margin-right: 30px;
}
#refer_friend_banner > div a span {
    color: #6E24D0;
    font-size: 10px;
    text-align: center;
}

#refer_friend_banner > div img {
    width: 70px;
}

#refer_friend_banner .mobile {
    display: none;
}
@media (max-width: 1500px) {
    #refer_friend_banner > div {
        display: flex;
    }
}
@media (max-width: 1250px) {
    #refer_friend_banner > div p {
        text-align: center;
        font-size: 18px;
    }
}
@media (max-width: 835px) {
    #refer_friend_banner {
        background-image: url(/assets/mpn/com/img/slothy.png);
        background-repeat: no-repeat;
        background-position: left 10px bottom -7px;
        background-size: 95px 55px;
        width: 100%;
    }
    #refer_friend_banner .desktop {
        display: none;
    }
    #refer_friend_banner .mobile {
        display: inline-block;
    }
    #refer_friend_banner > div {
        padding: 5px 0;
        flex-direction: column;
        padding-left: 70px;
        max-width: 440px;
    }
    #refer_friend_banner > div a span{
        padding-left: 0;
    }
    #refer_friend_banner > div > a .mobile {
        text-decoration: underline;
    }
}

#web_notice_banner div.webnotice p {
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    padding: 10px;
    color: #041C2C;
}
#web_notice_banner div.webnotice p span{
    font-size: 28px;
    vertical-align: middle;
}

@media (max-width: 750px) {
    #web_notice_banner > div.webnotice {
        padding: 0;
    }

    #web_notice_banner div.webnotice p {
        font-size: 16px;
    }
    #web_notice_banner div.webnotice p span{
        font-size: 22px;
        vertical-align: middle;
        line-height: 0.5;
    }
}

/*******************
legal document
*******************/
.cc-scroll-doc div.col-40{
    vertical-align: top;
}
.cc-scroll-doc div.col-40 ul.ul_menu{
    padding-right: 50px;
    width: 86%;
}
.cc-scroll-doc div.col-40 ul.ul_menu li{
    font-size: 22px;
    color: rgba(0, 0, 0, 0.4);
    padding: 10px 0;
    list-style: none;
}
.cc-scroll-doc div.documentation_container{
    width: 60%;
    display: inline-block;
}

@media(min-width: 991px){
	.fixed_menu .tnc_container.cc-scroll-doc div.col-40 ul.ul_menu,
    .fixed_menu.tnc_container.cc-scroll-doc div.col-40 ul.ul_menu {
        position: fixed;
        top: 95px;
        width: 36%;
        display: block;
        max-width: 400px;
    }
    #target_marketing_determination_pg.fixed_menu.tnc_container.cc-scroll-doc div.col-40 ul.ul_menu {
        width: 26%;
    }
    .fixed_bottom_menu .tnc_container.cc-scroll-doc div.col-40 ul.ul_menu {
        position: relative;
        top: unset;
        width: 100%;
        display: block;
    }
    .fixed_bottom_menu .tnc_container.cc-scroll-doc div.col-40{
        position: absolute;
        bottom: 65px;
        top: unset;
        width: 32%;
    }
    .fixed_bottom_menu .tnc_container.cc-scroll-doc div.documentation_container{
        margin-left: 40%;
    }
}
@media(max-width: 1300px){
    div.tnc_container.cc-scroll-doc .box {
        padding: 100px 30px;
    }
}
@media(max-width: 991px){
    .cc-scroll-doc div.documentation_container {
        width: 100%;
    }
}
/********************************
legal document styling in modal
********************************/
dialog .documentation_body .documentation_header {
    display: none;
}
dialog .documentation_body {
    font-size: 12px;
    padding: 0 5%;
}
dialog .documentation_body h2 {
    font-size: 16px;
    font-weight: bold;
    padding: 10px 0;
}
dialog .documentation_body p,
dialog .documentation_body ul {
    padding: 0 0 10px;
    font-size: 12px;
}