@font-face { font-family: gMuli; font-style: normal; font-weight: 400; src: url(fonts/Muli/static/Muli-Regular.ttf) format('truetype'); }
@font-face { font-family: gMuli; font-style: normal; font-weight: 700; src: url(fonts/Muli/static/Muli-Bold.ttf) format('truetype'); }
/*@font-face { font-family: 'nexa_lightregular'; font-style: normal; font-weight: normal; src: url('fonts/NexaLight/Nexa-Light.otf') format("opentype"); }
@font-face { font-family: 'nexa_lightregular'; font-style: normal; font-weight: bold; src: url('fonts/NexaLight/Nexa-Bold.otf') format("opentype"); }*/

*{ box-sizing: border-box; }
body { font-family: gMuli, Verdana, serif; margin: 0; font-size: 1em; background-color: white; padding: 4rem 0 0 0; } 
h1 { font-size: 1.8rem; font-weight: bold; margin: 1rem 0; }
h2 { font-size: 2rem; text-align: center; font-weight: 600; margin: 1rem 0; }
h3 { font-size: 1.6rem; text-align: center; font-weight: 600; margin: 1rem 0; }
h4 { font-size: 1.6rem; text-align: center; font-weight: normal; margin: 1rem 0; }
h5 { font-size: 1.3rem; text-align: left; font-weight: 600; margin: 1rem 0; } /*modal windows*/
h6 { font-size: 1.3rem; text-align: center; font-weight: normal; margin: 0.5rem 0; }

.ff-form_in_table input[type='text'],
.ff-form_in_table input[type='number'],
.ff-form_in_table input[type='password'],
.ff-form_in_table input[type='email'],
.ff-form_in_table input[type='date'],
.ff-form_in_table input[type='time'],
.ff-form_in_table textarea,
.ff-form_in_table select,
.ta-add-voters, 
.stand_alone_field{ width: 100%; padding: 12px; margin: 8px 0; display: inline-block; border: 1px solid #33658A; box-sizing: border-box; font-size: 16px; }
.ff-form_in_table input[type=checkbox] { margin-top: 20px; }
.ff-form_in_table input[type=radio] { margin-top: 20px; }

.ff-form_in_table input:disabled, 
.ff-form_in_table input:read-only { background-color: #CCC; }
.ff-form_in_table input:required,
.ff-form_in_table select:required { border-left: 2px solid #F26419; }

.ff-form_in_table input[type=submit],
.stand_alone_button,
form.ff-modal button { background-color: #F26419; color: white; padding: 14px 20px; margin: 8px; border: none; cursor: pointer; float:right; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; }
a { text-decoration: none; color: white; border-radius: 2px; cursor: pointer; padding: 0 4px;}
.short-button { display: inline-block; color: white; padding: 14px 20px; margin: 2px; border: none; cursor: pointer; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; }
.hidden { display: none; }
.inline-block { display: inline-block; }

.topNavContainer{ position: fixed; top: 0; z-index: 10; width: 100%; }
.topNavContainer .container { padding: 0.5rem; height: 100%; overflow: auto;}
.logoLink { float: left; text-decoration: none; color: #797676; border: 1px solid transparent; border-radius: 4px; height: 3rem; display: flex; align-items: center; padding-left: 10px;}
.centered { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }
.bold { font-weight: bold; }
.bigger { font-size: 16pt; }
.underlined { text-decoration: underline; }

nav { float: right; }
nav label { display: none; float: right; cursor: pointer;}
nav label span { height: 3rem; float: left; display: flex; align-items: center; font-size: 1.2rem; margin-right: 1px;}
nav label img { display: block; height: 3rem; float: right;}
nav input { position: absolute; visibility: hidden; }
nav ul { display: table-cell; vertical-align: middle; text-align: right; height: 3rem; margin: 0; clear: both; }
nav li { display: inline-block; margin: 0; }
nav a { text-decoration: none; text-align: center; padding: 10px; margin-left: 0.5rem; color: #fff; border-radius: 4px; border: 1px solid transparent; }
nav a.active { background-color: white; color: #2F4858; }

.color-0 { color: black; }
.color-1 { color: #2F4858; } /*Charcoal*/
.color-2 { color: #33658A; } /*Queen Blue*/
.color-3 { color: #86BBD8; } /*Dark Sky Blue*/
.color-4 { color: #F26419; } /*Safety Orange Blaze Orange*/
.color-5 { color: white; }

.bg-color-0 { background-color: black; }
.bg-color-1 { background-color: #2F4858; } /*Charcoal*/
.bg-color-2 { background-color: #33658A; } /*Queen Blue*/
.bg-color-3 { background-color: #86BBD8; } /*Dark Sky Blue*/
.bg-color-4 { background-color: #F26419; } /*Safety Orange Blaze Orange*/
.bg-color-5 { background-color: white; }
.bg-color-6 { background-color: #97CCE9; } /* lightblue for help modals */

section { display: flex; align-items: center; justify-content: center;}
.container { width: 100%; max-width: 1600px; margin: 0 auto; padding: 2rem 1rem 2rem 1rem; box-sizing: border-box; position: relative; } /*border-radius: 4px;*/
.containerNoPadding { width: 100%; max-width: 1600px; margin: 0 auto; box-sizing: border-box; position: relative;}
a.anchor { display: block; position: relative; top: -4rem; visibility: hidden; }

.flexGroup { display: flex; } 
.flexBox-2x { width: 50%; padding: 1rem; margin: 1rem; }
.flexBox-3x { width: 33%; padding: 1rem; margin: 1rem; }
.column-2x { float: left; width: 50%; }
.column-3x { float: left; width: 33%; }

.advantages { display: flex; flex-wrap: wrap; justify-content: center; }
.advantages div { width: 370px; padding: 2rem; text-align: justify; }
.advantages > div > b { font-weight: normal; color: #F26419; }
.advantages > div > u { font-weight: normal; text-decoration: none; color: black; }
.advantages ul { padding-left: 20px; }
.advantages li { padding-top: 3px;}

.rounded-list { display: flex; flex-wrap: wrap; flex-direction: row; gap: 30px; justify-content: center; align-items: center;}
.rounded-list div { padding: 20px; border-radius: 4px; border: 2px solid rgba(255,255,255,0.5); width: 450px; background-color: rgba(128,128,128,0.1); font-size: 1.1rem; text-align: center;}
.meeting-types-border-right { border-right: 1px solid #2F4858; }
.meeting-types { padding: 20px; margin: 0; }
.meeting-types > li { padding: 15px; background-color: #2F4858; border-radius: 8px; color: white; margin-bottom: 20px; list-style: none; }
/*.meeting-types > li { text-align: left; margin: 0px 0px 5px 20px; }*/

.new-ways { padding: 20px; margin: 0; }
/*.new-ways > li { padding: 15px; background-color: white; border-radius: 8px; color: #33658A; margin-bottom: 20px; list-style: none; }*/
.new-ways > li { text-align: left; margin: 0px 0px 5px 20px; }


.ff-form_in_table { width: 100%; }
.ff-form_in_table td:nth-child(1) { text-align: right; vertical-align: top; }
.ff-form_in_table td:nth-child(1) > div { padding-top: 1rem; margin: 0px 10px; }
.ff-form_in_table td:nth-child(2) { text-align: left; }
.ff-form_in_table input:focus,
.ff-form_in_table textarea:focus { border: 1px solid black; }
.ff-form_in_table input:required:focus { border-left: 2px solid #F26419; }
.ff-form_in_table input[type=date],
.ff-form_in_table input[type=time] { width: 49%; }

.input-upper-case { text-transform: uppercase; }
.input-spaced { letter-spacing: 0.05em; }
.captcha_reload_icon { width: 40px; height: 40px; margin-left: 5px; background-size: 1rem 1rem; background-repeat: no-repeat; background-color: transparent; }
.captcha_image { border: 1px solid #33658A; max-width: 360px; width: 100%; }
.user_message { color: #F26419; font-weight: bold; font-size: 1.5rem; }
.user_message_ok { color: #6ABC6D;; font-weight: bold; font-size: 1.5rem; }

.changelog-version { font-size: 0.9rem; }
.div-find-out-more { width: 100%; text-align: center; background-color: rgba(0,0,0,0.1); padding: 1.5rem 0; clear: both; display: block;}
.span-find-out-more { font-size: 1.2rem; vertical-align: middle; font-weight: bold; }

.pricing-table { border-radius: 4px; border-collapse: collapse; border-style: hidden; font-size: 1.1rem; font-weight: bold;}
.pricing-table td { border: 1px solid white; padding: 5px 10px; }
.pricing-table td.old-price { text-decoration:line-through; font-weight: normal;}
.pricing-table td.new-price { background-color: #F26419; }
.introductory-promotion { float: right; padding: 1rem; border-radius: 4px 0px 0px 4px }

/* new design */
.font-gMuli { font-family: gMuli, Verdana, serif; } 
.font-Nexa { font-family: nexa_lightregular, Verdana, serif; } 
.font-openSans { font-family: openSans, Verdana, serif; } 

.vertical-align-top { vertical-align: top; }
.vertical-align-middle { vertical-align: middle; }
.width-50-percent { width: 50%; }
.width-60-percent { width: 60%; }
.width-70-percent { width: 70%; }
.width-80-percent { width: 80%; }
.margin-0-auto { margin: 0 auto; }
.table-no-spacing { border-collapse: collapse; border-spacing: 0px; }
.table-no-spacing td, .table-no-spacing tr { padding: 0px; }
.display-block { display: block; }
.line-height-1-5 { line-height: 1.5; }

.new-container { width: 100%; max-width: 1600px; margin: 0 auto; box-sizing: border-box; position: relative; } /*border-radius: 4px;*/
.container-standard-padding { padding: 2rem 1rem; }
.container-side-padding { padding: 0rem 1rem; }
.container-headline { padding: 1rem; margin: 2rem 0 1rem 0; }
.logo-in-modal { width: 10rem; display: inline-block; }
.border-radius-16 { border-radius: 16px; }

.topNavContainerBoxShadow { box-shadow: 0 2px 4px 0 rgba(128,128,128, 0.05), 0 3px 8px 0 rgba(128,128,128, 0.09); }

nav#new-design { float: right; }
nav#new-design label { display: none; float: right; cursor: pointer;}
nav#new-design label span { height: 3rem; float: left; display: flex; align-items: center; font-size: 1.2rem; margin-right: 1px;}
nav#new-design label img { display: block; height: 3rem; float: right;}
nav#new-design input { position: absolute; visibility: hidden; }
nav#new-design ul { display: table-cell; vertical-align: middle; text-align: right; height: 3rem; margin: 0; clear: both; }
nav#new-design li { display: inline-block; margin: 0; }
nav#new-design a { text-decoration: none; text-align: center; padding: 5px 10px; margin-left: 0.3rem; color: #000; border-radius: 8px; border: 2px solid #e8e6ff; font-weight: bold; }
nav#new-design a.active { background-color: #e8e6ff; color: #000; }

.color-7 { color: #8373f9; } /*purple highlight color*/
.color-8 { color: #e8e6ff; } /*light purple*/
.color-9 { color: #7b6cea; } /*purple/blue*/
.color-11 { color: #fd916d; } /*ping orange*/
.bg-color-8 { background-color: #e8e6ff; } /*light purple*/
.bg-color-9 { background-color: #7b6cea; } /*purple/blue*/
.bg-color-10 { background-color: #565656; } /* very dark grey, almost black */
.bg-color-pf-gradient { background: rgb(251,125,128); background: linear-gradient(90deg, rgba(251,125,128,1) 0%, rgba(214,112,186,1) 18%, rgba(123,108,234,1) 72%, rgba(102,156,254,1) 100%); }

.column-3x-2 { float: left; width: 66%; }

.flexRow { display: flex; flex-wrap: wrap; flex-direction: row; align-items: flex-start; }
/*h1.h1-new { font-size: 1.8rem; font-weight: bold; margin: 1rem 0; }*/
h2.h2-new { font-size: 1.8rem; font-weight: bold; margin: 0;}
h3.h3-new { font-size: 1.3rem; font-weight: bold; margin: 0.5rem 0; }
h3.media { font-size: 1.3rem; font-weight: bold; }

div.mission { margin: 1rem 0 1rem 0; font-size: 1.6rem; text-align: center; font-weight: bold; width: 100%; }
.img-get-started { max-width: 300px; }
.href-button-get-started { margin-top: 10px; }
.bg-pic-landing { padding-bottom: 150px; background-image: url('../img/graphics/bg-landing.svg'); background-repeat: no-repeat; background-position: center bottom; margin: -1px; }


/* why poeople love PF section */
.flexRow .one-love { width: 33%; padding: 0 5%;}
.flexRow .one-love img { width: 80%; max-width: 250px; }
.flexRow .lower-love { margin-top: 5rem; }
.bg-pic-city { padding-bottom: 300px; background-image: url('../img/graphics/bg-landing-bottom-noround-bkup.svg'); background-repeat: no-repeat; background-position: center bottom; }

/* how PF differs section */
.table-differs { border-collapse: collapse; border-radius: 1em; overflow: hidden; margin: 0 auto; }
.table-differs td { border: 1px solid #e8e6ff; padding: 2px 10px; }
.table-differs td:first-of-type { font-weight: bold; }
.table-differs th { padding: 20px; }
.table-differs img { width: 25px; display: block; margin: 0 auto; }

.table-differs-detailed { border-collapse: collapse; border-radius: 1em; overflow: hidden; margin: 0 auto; }
.table-differs-detailed td { border: 1px solid #e8e6ff; padding: 2px 10px; text-align: left; }
.table-differs-detailed td:first-of-type { font-weight: bold; text-align: center; }
.table-differs-detailed th { padding: 20px; }
.table-differs-detailed img { width: 25px; display: block; margin: 0 auto; }


/* working with PF is easy section */
.img-pf-meetings { display: inline-block; width: 100px; vertical-align: middle; margin-right: 5px; }
.flexRow .working-easy { width: 50%; padding: 2% 7%; } 
.flexRow .working-easy .img-step-number, .div-run-meeting .img-step-number  { width: 50px; } 
.flexRow .working-easy .img-graphic, .flexRow .run-meeting .img-graphic { width: 40%; } 
.div-run-meeting { width: 95%; max-width: 1000px; border-radius: 16px; padding: 20px; position: relative; margin: 0 auto; }
.flexRow .run-meeting { width: 48%; padding: 2%; }


/* meeting options section */
.flexRow .meeting-option { width: 50%; padding: 2% 5%; }
.flexRow .meeting-option .h-self-run { padding: 5px; background-color: #e6ecfd; }
.flexRow .meeting-option .h-assisted { padding: 5px; }
.flexRow .meeting-option .content { width: 90%; margin: 0 auto; }

/* certification program */
.img-pf-certification-program { display: inline-block; width: 100px; vertical-align: middle; margin: -0.6rem 0; }
.div-certification { margin: 0 30%;}

/* feedback section */
.div-feedback-outer { padding: 100px; }
.div-feedback { max-width: 800px; position: relative; border-radius: 16px; padding: 50px; margin: 0 auto; font-weight: bold; font-size: 1.1rem; line-height: 1.5; }
.img-customers-are-saying { display: block; width: 200px; }
.img-customer-feedback-stars { width: 400px; position: absolute; top: -35px; left: -89px; }
.img-customer-feedback-hand { width: 150px; position: absolute; bottom: -10px; right: -90px; }

/* pricing section */
.img-pf-pricing { display: inline-block; width: 90px; vertical-align: middle; margin-right: 5px; }
.div-pricing-background { display: inline-block; padding: 20px; border-radius: 16px; margin: 0 auto; }
.table-pricing { border-collapse: collapse; margin: 0 auto; }
.table-pricing td, .table-pricing th { padding: 7px 20px; }
.table-pricing th { font-weight: bold; }
.table-pricing td { border-top: 1px solid white; border-bottom: 1px solid white; }
/*.table-pricing tr td:first-of-type { border-left: 1px solid white; }*/
.table-pricing tr:last-of-type td { border: none; }
.href-pricing-get-started { padding: 10px; border-radius: 16px; display: inline-block; }

/*about us setion*/
.flexRow .footer-middle { width: 50%; padding: 2% 10%; }
.flexRow .footer-side { width: 25%; padding: 2%;}
.div-contact-wrapper  { display: inline-block; padding: 10px; border-radius: 16px; margin: 5px; }
.img-contact-pf { width: 200px; }
.div-bp-wrapper { display: inline-block; padding: 5px; border-radius: 16px; margin: 5px;}
.img-bp-visoa { width: 150px; }
.img-bp-choa { width: 100px; }
.footer-order-1 { order: 1; }
.footer-order-2 { order: 2; }
.footer-order-3 { order: 3; }
a[href^=tel] { text-decoration: underline; color: inherit; }


.youtube-container { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; }
.youtube-video { position: absolute; top: 0; left: 0; width: 100%; height: 100% }
.video-padding { padding: 0 200px 300px 200px; }

/* partners page */
.partner-card-wrapper { max-width: 700px; margin: 0 auto; }
.partner-card { padding: 0; overflow: hidden; box-shadow: 0 2px 12px rgba(123,108,234,0.10); }
.partner-card-logo-area { padding: 2rem; background-color: white; margin: 1.5rem 1.5rem 0 1.5rem; }
.img-partner-logo { max-width: 220px; width: 100%; }
.partner-card-content { padding: 1.5rem 2rem 2rem 2rem; text-align: left; }

@media (max-width: 1240px) {
    .flexRow .one-love, .flexRow .working-easy { width: 100%; margin: 2%; }
    .flexRow .working-easy .img-graphic { width: 30%; } 
    .flexRow .footer-middle { padding: 2%; width: 100%; }
    .flexRow .footer-side { padding: 2%; width: 50%; }
    .footer-order-1 { order: 3; }
    .footer-order-2 { order: 1; }   
    .footer-order-3 { order: 2; }
    .video-padding { padding: 0 10px 250px 10px; }
    .bg-pic-city { padding-bottom: 270px; }
    .div-certification { margin: 0 23%;}
}

@media (max-width: 900px) {
    nav#new-design { float: none; margin-left: 0; }
    nav#new-design label { display: block; }
    nav#new-design input:checked ~ ul { display: block; }
    nav#new-design ul { display: none; text-align: center; height: auto; padding: 1.5rem 0 0.5rem; }
    nav#new-design li { display: block; margin-bottom: 5px; }
    nav#new-design li:last-of-type { margin-bottom: 20px; }
    nav#new-design a { display: block; margin: 0; padding: 1rem; } 
    .video-padding { padding: 0 10px 200px 10px; }
    .bg-pic-city { padding-bottom: 240px; }
    .div-certification { margin: 0 10%;}
}

@media (max-width: 800px) {
    .flexGroup{ flex-direction: column; padding: 0.5rem; }
    .flexBox-2x,.flexBox-3x { width: 100%; margin: 0px 0px 2rem 0px; box-sizing: border-box; }
    .column-2x { float: none; width: 100%; margin: 0px 0px 2rem 0px; }
    .column-3x { float: none; width: 100%; margin: 0; }
    .column-3x-2 { float: none; width: 100%; margin: 0; }
    
    nav { float: none; margin-left: 0; }
    nav label { display: block; }
    nav input:checked ~ ul { display: block; }
    nav ul { display: none; text-align: center; height: auto; padding: 1.5rem 0 0.5rem; }
    nav li { display: block; margin-bottom: 5px; }
    nav li:last-of-type { margin-bottom: 20px; }
    nav a { display: block; margin: 0; padding: 1rem; } 
    
    .meeting-types-border-right { border: none; }
    
    .introductory-promotion { float: none; padding: 1rem; border-radius: 4px 4px 0px 0px }
    
    .bg-pic-landing { background-size: 150%; }
    
    .table-differs td:last-of-type { display: none; visibility: hidden; }
    .table-differs th:last-of-type { display: none; visibility: hidden; }
    
    .bg-pic-city { padding-bottom: 160px; }
    
    .flexRow .one-love, .flexRow .working-easy, .flexRow .run-meeting, .flexRow .meeting-option { width: 100%; }
    .flexRow .working-easy .img-graphic { width: 50%; } 
    .flexRow .run-meeting .img-graphic { width: 60%; }

    .partner-card-content { padding: 1.5rem; }
    .partner-card-logo-area { margin: 1rem 1rem 0 1rem; padding: 1.5rem; }
    
    .div-feedback-outer { padding: 50px; }
    .img-customers-are-saying { width: 150px; }
    .img-customer-feedback-stars { width: 200px; position: absolute; top: -16px; left: -45px; }
    .img-customer-feedback-hand { width: 80px; position: absolute; bottom: -5px; right: -40px; }
    
    .div-pricing-background { padding: 5px; }
    .table-pricing td, .table-pricing th { padding: 7px; }
    
    .flexRow .footer-middle, .flexRow .footer-side {width: 100%; padding: 2%; }
    
    .div-certification { margin: 0 5%;}
}

@media (max-width: 600px) {
    table.ff-form_in_table > tbody > tr { display: block; } 
    table.ff-form_in_table > tbody > tr > td { display: block; }
    table.ff-form_in_table td:nth-child(1) { text-align: left; }
    table.ff-form_in_table td:nth-child(1) > div { margin: 0px; } 
    
    .advantages div { width: 100%; }
    
    .video-padding { padding: 0 10px 130px 10px; }
    
    .bg-pic-city { padding-bottom: 130px; }
}