:root { 
  --blue-munsell: #0097A7; 
  --dark-aqua: #2499A4;
  --dark-gunmetal-grey: #1E242E;
  --angora-white: #f5f6f8;
  --yellow-glitter: #fce057;
  --shiny-yellow: #f8ef1d;
  --trout: #495057;  
  --admiral: #1e1b56;
  --blued: #0b1769;
  --patrick-blue: #0d0255;
  --neo-pearl: #f7f5ee;
  --dahlia-white: #f6f5ef;
  --deep-cove: #020d40;
  --comfort-granite: #4a5658;
  --oswald-font: 'Oswald'; 
  --oswald-bold-font: 'Oswald-Bold'; 
  --oswald-regular-font: 'Oswald-Regular'; 
  --ubuntu-font: 'Ubuntu';
  --proxima-nova-font: 'proxima-nova', sans-serif;
}
/* font-family: proxima-nova, sans-serif; */

@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Extrabld.eot'); src: url('/css/fonts/ProximaNovaA-Extrabld.eot?#iefix') format('embedded-opentype'), url('/css/fonts/ProximaNovaA-Extrabld.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Extrabld.woff') format('woff'), url('/css/fonts/ProximaNovaA-Extrabld.ttf') format('truetype'); font-weight: 800; font-style: normal; }
@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Thin.eot'); src: url('/css/fonts/ProximaNovaA-Thin.eot?#iefix') format('embedded-opentype'), url('/css/fonts/ProximaNovaA-Thin.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Thin.woff') format('woff'), url('/css/fonts/ProximaNovaA-Thin.ttf') format('truetype'); font-weight: 100; font-style: normal; } 
@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Bold.eot'); src: url('/css/fonts/ProximaNovaA-Bold.eot?#iefix') format('embedded-opentype'), url('/css/fonts/fonts/ProximaNovaA-Bold.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Bold.woff') format('woff'), url('/css/fonts/ProximaNovaA-Bold.ttf') format('truetype'); font-weight: 700; font-style: normal; }
@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Black.eot'); src: url('/css/fonts/ProximaNovaA-Black.eot?#iefix') format('embedded-opentype'), url('/css/fonts/ProximaNovaA-Black.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Black.woff') format('woff'), url('/css/fonts/ProximaNovaA-Black.ttf') format('truetype'); font-weight: 900; font-style: normal; }
@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Light.eot'); src: url('/css/fonts/ProximaNovaA-Light.eot?#iefix') format('embedded-opentype'), url('/css/fonts/ProximaNovaA-Light.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Light.woff') format('woff'), url('/css/fonts/ProximaNovaA-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; }
@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Semibold.eot'); src: url('/css/fonts/ProximaNovaA-Semibold.eot?#iefix') format('embedded-opentype'), url('/css/fonts/ProximaNovaA-Semibold.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Semibold.woff') format('woff'), url('/css/fonts/ProximaNovaA-Semibold.ttf') format('truetype'); font-weight: 600; font-style: normal; } 
@font-face { font-family: 'Proxima'; src: url('/css/fonts/ProximaNovaA-Regular.eot'); src: url('/css/fonts/ProximaNovaA-Regular.eot?#iefix') format('embedded-opentype'), url('/css/fonts/ProximaNovaA-Regular.woff2') format('woff2'), url('/css/fonts/ProximaNovaA-Regular.woff') format('woff'), url('/css/fonts/ProximaNovaA-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Oswald'; src: url('/css/fonts/Oswald-Regular.ttf'); font-weight: 600; font-style: normal; }
@font-face { font-family: 'Oswald-Bold'; src: url('/css/fonts/Oswald-Bold.ttf'); font-weight: 600; font-style: normal; }
@font-face { font-family: 'Oswald-Regular'; src: url('/css/fonts/Oswald-Regular.ttf'); font-weight: 600; font-style: normal; }
@font-face { font-family: 'Ubuntu'; src: url('/css/fonts/Ubuntu-Regular.ttf'); font-weight: 400; font-style: normal; } 


/* common css rule ------------- */
* { margin: 0; padding: 0; text-decoration: none;font-family: var(--ubuntu-font); }
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html { margin: 0; -webkit-text-size-adjust: none; } 
body{ scroll-behavior: smooth; }
ol, ul { list-style: none; }
img { display: block;width: 100%;max-width: 100%;margin: 0 auto; }
table { width: 100%; border-collapse: collapse; } 

.swal2-popup .swal2-content { justify-content: center;margin: 0;padding: 0;color: #545454;font-size: 1.125em;font-weight: 300;line-height: normal;z-index: 1;word-wrap: break-word; }
.swal2-popup .swal2-styled.swal2-confirm{ background-color: var(--blue-munsell) !important ;border-color:  var(--blue-munsell)  !important ;}
.swal2-popup .swal2-styled.swal2-cancel{background-color: var(--comfort-granite) !important ;border-color:  var(--comfort-granite)  !important ;}
.swal2-popup .swal2-title{text-transform: initial;font-weight: 400 !important;font-size: 24px !important;}
body .swal-wide { width: 100%; max-width: 850px !important; }
.admin-header-links{ display: block;position: sticky;top: 0px;left: 0px;right: 0px;width: 100%;background-color: #333;text-align: center;z-index: 99; }
.admin-header-links * { display: inline-block;color: var(--blue-munsell); text-decoration: none; margin: 0 10px; line-height: 35px; font-size: 12px; font-weight: 700; }
.custom-container{ display: block; width: 100%;max-width: 1380px;margin: 0 auto;padding: 0px 15px; }
.custom-row{ display: flex;flex-wrap: wrap; margin: 0px -15px; padding: 0px 15px; }
div[data-row-type].input-validation-error{ border-color: none !important;box-shadow: none !important;background-color: transparent !important; } 
body{ font-family: var(--ubuntu-font) }

.fs-7, label.fs-7, span.fs-7, label.fs-7, .radio-question .radio.fs-7{ font-size: 14px; }
.fs-8, label.fs-8, span.fs-8, label.fs-8, .radio-question .radio.fs-8{ font-size: 12px; }

.fm-proxima{ font-family: var(--proxima-nova-font); }
.fm-oswald{ font-family: var(--oswald-font); }
.fm-oswald-bold{ font-family: var(--oswald-bold-font); }
.fm-oswald-regular{ font-family: var(--oswald-regular-font); }
.fm-ubuntu{ font-family: var(--ubuntu-font); }
.lh-normal{ line-height: normal; }  

.field-validation-error{ color: red; }

.validation-summary-errors {font-size: 13px;font-family: var(--ubuntu-font);text-transform: uppercase;text-align: center;line-height: normal; margin: 0px 0px 10px;}
.validation-summary-errors.message-error{ color: #e4434b; }
.validation-summary-errors ul, .validation-summary-errors ul li{ display: block;text-align: center; padding: 0px;margin: 0px;}

.required-label{ color: red; }

/* custom spacing */
.spacing-x-3{ padding: 0px 0.938rem; }
 
/* Background Colors -------------------------- */
.blue-munsell-bg { background-color: var(--blue-munsell);color: #fff; }
.dark-aqua-bg { background-color: var(--dark-aqua);color: #fff; }
.dark-gunmetal-grey-bg { background-color: var(--dark-gunmetal-grey);color: #fff; }
.angora-white-bg { background-color: var(--angora-white);color: #fff; }
.yellow-glitter-bg { background-color: var(--yellow-glitter);color: #fff; }
.shiny-yellow-bg { background-color: var(--shiny-yellow);color: #fff; }
.trout-bg { background-color: var(--trout);color: #fff; }
.admiral-bg { background-color: var(--admiral);color: #fff; }
.blued-bg { background-color: var(--blued);color: #fff; }
.patrick-blue-bg { background-color: var(--patrick-blue);color: #fff; }
.neo-pearl-bg { background-color: var(--neo-pearl);color: #fff; } 
.dahlia-white-bg { background-color: var(--dahlia-white);color: var(--blued); }  
.deep-cove-bg { background-color: var(--deep-cove);color: #fff; }   

div.dark-aqua-bg .heading, div.dark-aqua-bg .subheading, div.dark-aqua-bg .title, div.dark-aqua-bg .subtitle,
.dark-aqua-bg .heading,.dark-aqua-bg .subheading, .dark-aqua-bg .title,.dark-aqua-bg .subtitle,
.dark-aqua-bg h1, .dark-aqua-bg h2,.dark-aqua-bg h3,.dark-aqua-bg h4,.dark-aqua-bg h5,.dark-aqua-bg h6,.dark-aqua-bg p{color: #fff;}
div.blued-bg .heading, div.blued-bg .subheading, div.blued-bg .title, div.blued-bg .subtitle,
.blued-bg .heading,.blued-bg .subheading, .blued-bg .title,.blued-bg .subtitle,
.blued-bg h1, .blued-bg h2,.blued-bg h3,.blued-bg h4,.blued-bg h5,.blued-bg h6,.blued-bg p{color: #fff;}

/* Text Colors -------------------------- */
.blue-munsell-text { color: var(--blue-munsell); }
.dark-aqua-text { color: var(--dark-aqua); }
.dark-gunmetal-grey-text, p.dark-gunmetal-grey-text, body .dark-gunmetal-grey-text { color: var(--dark-gunmetal-grey); }
.angora-white-text { color: var(--angora-white); }
.yellow-glitter-text { color: var(--yellow-glitter); }
.shiny-yellow-text { color: var(--shiny-yellow); }
.trout-text { color: var(--trout); }
.admiral-text { color: var(--admiral); }
.blued-text { color: var(--blued); }
.neo-pearl-text { color: var(--neo-pearl); }
.dahlia-white-text { color: var(--dahlia-white); }
.deep-cove-text { color: var(--deep-cove); }

/* Border Colors -------------------------- */
.blue-munsell-border { border-color: var(--blue-munsell); }
.dark-aqua-border { border-color: var(--dark-aqua); }
.dark-gunmetal-grey-border { border-color: var(--dark-gunmetal-grey); }
.angora-white-border { border-color: var(--angora-white); }
.yellow-glitter-border { border-color: var(--yellow-glitter); }
.shiny-yellow-border { border-color: var(--shiny-yellow); }
.trout-border { border-color: var(--trout); }
.admiral-border { border-color: var(--admiral); }
.blued-border { border-color: var(--blued); }
.neo-pearl-border { border-color: var(--neo-pearl); } 
.dahlia-white-border { border-color: var(--dahlia-white); }
.deep-cove-border { border-color: var(--deep-cove); } 


/* custom-btn */
.custom-btn{ display: inline-block;text-decoration: none; padding: 20px 35px; border-radius: 7px;border: none; font-size: 18px; transition: 0.3s; font-weight: 600;  }
.custom-btn.btn-blued{ background-color: var(--blued);color: #fff; }
.custom-btn.btn-blued.hover-yellow-glitter:hover{ background-color: var(--yellow-glitter);color: var(--blued); }
.custom-btn.btn-dark-aqua{ background-color: var(--dark-aqua);color: #fff; }
.custom-btn.btn-dark-aqua.hover-yellow-glitter:hover, .hover-yellow-glitter:hover{ background-color: var(--yellow-glitter);color: var(--blued); }
.custom-btn.btn-deep-cove{ background-color: var(--deep-cove);color: #fff; }
.custom-btn.btn-deep-cove.hover-yellow-glitter:hover{ background-color: var(--yellow-glitter);color: var(--blued); }


.btn-lg,.btn.btn-lg{ padding: .5rem 1rem; font-size: 1.25rem;font-family: var(--proxima-nova-font); line-height: 1.5;font-weight: normal;text-transform: none; }

/* blink css rules */
.blink { animation: glowing 1000ms infinite; }
@keyframes glowing { 0% { background-color: var(--blue-munsell); box-shadow: 0 0 10px #0096a760; } 50% { background-color: #0caec0; box-shadow: 0 0 30px #0caec0a9; } 100% { background-color: var(--blue-munsell); box-shadow: 0 0 10px #0096a765; } }


/* header css rule ------------- */
.header{ width: 100%; padding: 35px 0px;background-color: #fff; }
.header .header-logo{ margin: 0px;padding-bottom: 0px;max-width: 319px;width: 100%; } 
.header .header-logo a img{ display: block;width: 100%; max-width: 320px;}
.header .header-menu{ display: flex;align-items: center;justify-content: flex-end;width: 100%; }
.header .header-menu .menu{ justify-content: flex-end;font: normal 17px var(--ubuntu-font); }
.header .header-menu .menu > .menu__item{ width: auto; }
.header .header-menu, .menu > .menu__item, .menu>.menu__item:not(:last-child){ border: none;border-right: none;padding: 0px; }
.header .header-menu .menu a, .header .header-menu .menu button.menu__link{ font: normal 17px var(--ubuntu-font); text-decoration: none; color: #111; font-size: 17px; white-space: nowrap; line-height: 50px; display: block; padding: 0 15px; }
.header .header-menu .menu button.menu__link{ border: 0; background: transparent; text-align: left; cursor: pointer; }
.menu-block .menu a:hover{ background-color: var(--yellow-glitter); }
.menu-block .menu{ position: relative;display: flex;align-items: center;width: 100%;  }
.menu-block .menu .menu-dropdown{ position: relative; }
.menu-block .menu .menu-dropdown .menu__list-view { position: absolute; display: none; right: 0; min-width: 223px; width: 100%;padding: 20px 0px;background-color: #fff; box-shadow: 0 8px 15px #0000002e;z-index: 99; }
.menu-block .menu .menu-dropdown .menu__list-view  a { display: block;  white-space: normal; color: #000; font-size: 0.938rem;  line-height: 20px;  padding: 10px 15px; transition: 0.3s; }
.menu-block .menu .menu-dropdown:hover .menu__item-toggle a, .menu-block .menu .account-menu > button[aria-expanded="true"]{ background-color: var(--yellow-glitter); }
.menu-block .menu .menu-dropdown:not(.account-menu):hover .menu__list-view{ display: block; }
.menu-block .menu .account-menu.menu-dropdown--active > .menu__list-view{ display: block; opacity: 1; visibility: visible; transform: none; }
.menu-block .menu .account-menu:not(.menu-dropdown--active) > .menu__list-view{ display: none; }
.menu-block .menu__toggle{ display: inline-block; width: auto; }
.menu-block .list-menu-toggle{ display: none; }

/* footer css rule ------------- */
footer, footer.footer{ background-color: #2d3643;color: #fff; margin-top: 30px; }
footer .footer-lower{ padding: 20px 50px;max-width: 100%;width: 100%; }
footer .footer-info{ float: unset;line-height: normal; }
footer .footer-info span{ font-size: 13px; }
footer .r-foot-email{ float: unset;font-size: 13px;font-weight: bold; }
footer .r-foot-email .fot-address{ color: #fff;font-size: 13px;font-weight: 400; }
footer .footer-info .footer-bottom-link { display: inline-block; }
footer .footer-info .footer-bottom-link ul{ list-style: none;padding: 0px;margin: 0px; }
footer .footer-info .footer-bottom-link ul a{color: #fff;text-decoration: none;font-size: 13px; }

/* form css rules --------------- */
form .input, form .inputs{ position: relative;width: 100%; }
form .input input, form .input select, form .input textarea{ font-size: 0.875rem; border-color: transparent; }
form .required{ position: absolute;top: 5px;right: 10px;color: red; }
form input, form select, form textarea{ min-height: 40px;border: 1px solid #ddd;border-radius: 8px; padding: 0 8px; vertical-align: middle; }
form textarea{ padding: 5px 8px; }

/* common-layout-wrapper css rules --------------- */
.common-layout-page .footer{ margin-top: 0px; }
.common-layout-page .footer-lower{ max-width: 1380px;margin: 0px auto; padding: 20px 10px; }
.common-layout-wrapper{ position: relative;transition: 0.3s; display: block;width: 100%; }


/* banner css rules */
.banner{ display: block;width: 100%;min-height: 500px;padding-bottom: 90px;padding-top: 50px; }
.banner h1, .banner h2, .banner h3,
.banner h4, .banner h5, .banner h6,
.banner .banner-info h1, .banner .banner-info h2, .banner .banner-info h3,
.banner .banner-info h4, .banner .banner-info h5, .banner .banner-info h6{ color: #ffffff; word-spacing: 7px;font-family: var(--oswald-regular-font); }
.banner h1{ font-size: 55px; }
.banner p { font-size: 22px; line-height: 40px; color: #ffffff; font-weight: 600; }

.banner .banner-time, .banner-price{ background: var(--neo-pearl);width: 100px;height: 100px;border-radius: 50%;position: absolute;display: flex;align-items: center;justify-content: center;flex-direction: column;box-shadow: 5px 5px var(--admiral);}
.banner .banner-time{ left: 26.5%;top: 13px; }
.banner .banner-price{ right: 18%;top: 7px }
.banner .banner-time span, .banner .banner-price span{ display: block; font-family: var(--oswald-bold-font); color: var(--admiral); font-weight: 600;line-height: 1.2;  text-align: center; }
.banner .banner-time span{ font-size: 24px; }
.banner .banner-price span{ font-size: 30px; }
.banner .banner-price .old-price{ font-size: 16px;text-decoration: line-through;text-align: left;min-width: 55%; }
.banner .banner-btn { display: inline-block; padding: 18px 35px; color: #fff; background: var(--blued); border-radius: 7px; font-size: 1.25rem;line-height: 1.1; transition: 0.3s; }
.banner .banner-btn:hover{ background-color: var(--yellow-glitter);color: var(--blued); }

.banner .arrow.bottom-arrow{ position: relative; padding-bottom: 80px; }
.banner .arrow:after{ content:"";display: inline-block;position: absolute;top: 0px; background-image: url("/Themes/DefaultClean/Content/images/icons/arrow-yellow.png");background-position: center;background-repeat: no-repeat;background-size: contain; width: 80px;height: 97px; }
.banner .arrow.bottom-arrow:after{ top: auto; bottom: -5px; }

/* banner-home ------------------ */
.banner-home{ background-color: var(--dark-aqua); }
.banner-home .banner-info{ max-width: 540px;  }

/* online-wills ------------------ */
.online-wills p{ font-weight: normal;font-size: 1.125rem; }

/* banner secondary-banner ------------------ */
.banner.secondary-banner{ min-height: 433px;padding: 40px 0; }
.secondary-banner .banner-image-block{ margin-bottom: 3px; }
.secondary-banner .banner-image-block img{ height: 350px;object-fit: contain; }
.secondary-banner .title{ font-size: 48px; }

/* section css rules -------------- */
.section { padding: 70px 0px; }
.section .heading { font-family: var(--oswald-regular-font);font-size: 3.75rem;} 
.section .subheading { font-family: var(--oswald-regular-font);font-size: 3.125rem;} 
.section .title { font-family: var(--oswald-regular-font);font-size: 2.188rem;} 
.section .subtitle{ font-family: var(--ubuntu-font);font-weight: 600;font-size: 1.125rem; }

/* how-it-works css rules ------ */ 
.how-it-works .step-img{ max-width: 586px;margin: 0 auto; }
.how-it-works .step-content{ display: block;width: 100%;max-width: 420px;margin: 0 auto; } 
.how-it-works .how-it-works-columns .image-col:first-child.how-it-work-col:after{ content: "";position: absolute;bottom: -120px;right: -80px; background-image: url("/Themes/DefaultClean/Content/images/icons/arrow-1.webp");background-position: center;background-repeat: no-repeat;background-size: contain; width: 120px;height: 120px; }
.how-it-works .how-it-works-columns .image-col:last-child.how-it-work-col:after{ content: "";position: absolute;bottom:-100px;left: -50px; background-image: url("/Themes/DefaultClean/Content/images/icons/arrow-2.webp");background-position: center;background-repeat: no-repeat;background-size: contain; width: 120px;height: 120px; }
.how-it-works .how-it-works-columns:last-child .image-col:after{display: none !important;}

/* online-will css rules */
.online-will .subheading{ color: #fff; }
.online-will-card{ padding: 20px 28px;background-color: #fff;border-radius: 20px; }
.online-will-card img { max-width: 121px; width: 100%; height: 240px; object-fit: contain; }
.online-will .online-will-card .title{ color: var(--blued);font-size: 34px; }
.will-cards .will-card-col:nth-child(n+2):nth-child(-n+3) .online-will-card .title{ color: var(--blue-munsell) }
.online-will-card p{ font-size: 1.25rem;color: var(--blued);font-weight: 600;line-height: 40px; }

/* estateplanningexplained css rule */
.estateplanningexplained .subheading, .estateplanningexplained  .desc{ color: #fff; }
.estateplanningexplained  .desc{ font-size: 1.25rem;line-height: 34px; }

/* whywriteyourwillnow css rule */
.why-write-will-card{ border-radius: 35px; background-color: var(--dark-aqua); }
.why-write-will-card .why-write-will-image{ min-height: 250px; }
.why-write-will-card .why-write-will-content{ border-radius: 35px 35px 0px 0px; background-color: #fff; }
.why-write-will-card .will-icon { width: 190px; height: 120px; object-fit: contain; }
.why-write-will-card .title{ font-size: 34px;min-height: 80px; }

/* our-services css rule */
.our-services .desc{ font-size: 1.25rem;line-height: 34px; }
.our-service-card{ background-color: var(--dark-aqua);color: #fff;text-decoration: none;border-radius: 20px;cursor: pointer; transition: 0.2s; }
.our-service-card .title, .our-service-card .subtitle{ transition: 0.2s; }
.our-service-card .title{ font-size: 28px; }
.our-service-card span.subtitle{ font-size: 24px;font-weight: normal; color: var(--shiny-yellow); }
.our-service-card:hover{ background-color: var(--shiny-yellow); }
.our-service-card:hover .title{ color: var(--dark-aqua); }
.our-service-card:hover .subtitle{ color: #000; }

/* need-some-help css rules */
.need-some-help .need-some-help-img{ max-width: 575px; }
.need-some-help .desc, .need-some-help .desc a{ font-size: 22px;line-height: 34px;color: #fff;text-decoration: none; }

/* online-wills-draft css rules */
.online-wills-grid .online-will-card { border-radius: 25px; }
.online-will-card .title{ font-size: 1.5rem;word-spacing: normal; }
.online-will-card .pricing{ word-spacing: normal;font-size: 45px; }
.online-will-card .pricing span{color: #aaa;}
.online-will-card .pricing.old-price{ font-size: 14px;min-height: 21px; }
.online-will-card ul{ list-style: none;color: #222;font-size: 1.063rem;padding: 0px; }
.online-will-card ul li {padding: 8px 0 8px 35px;background: url(/Themes/DefaultClean/Content/images/icons/tick.png); background-repeat: no-repeat; background-size: 19px; background-position: left center;}
.online-will-card .buy-now-btn{ font-size: 0.875rem; }

/* online-wills page: vertical spacing of the legacy page (scoped, _HowItWorks is shared with the home page) */
.online-will-page .banner.online-wills{ padding-top: 70px;padding-bottom: 70px; }
.online-will-page .banner.online-wills p{ line-height: 28px; }
.online-will-page .online-will-card ul{ margin-bottom: 0px; }
.online-will-page .online-will-card ul li{ line-height: normal; }
.online-will-page .online-wills-draft{ padding-bottom: 40px; }
.online-will-page .how-it-works{ padding-bottom: 54px; }
.online-will-page .how-it-works .custom-container > .row:not(.how-it-works-columns){ margin-bottom: 16px !important; }
.online-will-page .how-it-works .how-it-works-columns{ margin-bottom: 28px !important; }
.online-will-page .how-it-works .how-it-works-columns:last-child{ margin-bottom: 0px !important; }


/* blog-posts css rules --------------- */
.blog-posts .post{ background-color: var(--dark-aqua); }
.blog-posts .post .post-title{ color: #fff;text-decoration: none; }
.blog-posts .post .post-title:hover{ text-decoration: underline; }
.blogpost-page .page-title h1{ font-family: 'Vollkorn-Black';font-size: 50px; }

/* testimonial css rules --------------- */
.testimonialSwiper .testimonial-info *{color: var(--dark-gunmetal-grey);}
.testimonial-info{text-align:center;min-height: 200px;}
.testimonial-info h2{margin-bottom: 10px;} 
.testimonialSwiper .swiper-pagination{margin-top: 20px;bottom: 0;position: relative;}
.testimonialSwiper .swiper-pagination .swiper-pagination-bullet{ width: 14px; height: 14px; border-radius: 50px; background-color: var(--dark-aqua); margin: 0 4px;}
.testimonialSwiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ background-color: #056e78; }

.companies-slider-bg{background-color: #f0f0f0;}
.company-logo{max-width: 160px; height: auto; object-fit: contain;}
.company-names .item{display: flex;justify-content: center;}
.company-names .swiper-slide{display: flex;justify-content: center;align-items: center;}

/* topic-section css rules --------------- */
.topic-section h1, .topic-section h2, .topic-section h3, .topic-section h4, .topic-section h5, .topic-section h6{ color: var(--blued);font-family: var(--oswald-regular-font);font-weight: 400;margin-bottom: 1rem; }
.topic-section h1{ font-size: 3.5rem; } .topic-section h2{ font-size: 3rem; }
.topic-section h3{ font-size: 2.5rem; } .topic-section h4{ font-size: 2rem; }
.topic-section h5{ font-size: 1.5rem; } .topic-section h6{ font-size: 1rem; }
.topic-section p{ display: block; font-size: 1rem; font-family: var(--ubuntu-font); color: var(--dark-gunmetal-grey); line-height: 1.875rem;  }
.topic-section ol{ list-style: auto; }


/* broucherdownload-section css rules --------------- */
.html-broucherdownload-page .footer{ margin-top: 0px; }
.html-broucherdownload-page .footer .footer-lower{ max-width: 1380px;margin: 0px auto; padding: 20px 10px; }
.broucherdownload-section{ min-height: calc(100vh - 180px); }
.broucherdownload-section .list{ list-style: none; }
.broucherdownload-section .list li{ font-family: var(--ubuntu-font);  }
.broucherdownload-section .list li svg{ width: 22px;height: 22px; }
.broucherdownload-section .list li svg path{ fill: #fff; }
.broucher-form-block .broucher-form-fields{ max-width: 380px; }
.broucher-form-block img{ max-width: 200px; height: 100%; object-fit: contain; }
.broucher-form-block .custom-btn{ padding: 10px 20px;font-weight: normal;font-family: "Helvetica", sans-serif; text-align: center;font-size: 1rem;  min-height: 40px; }
.broucher-form-block .privacy-policy-text{ font-size: 12px; }

/* login-page css rules */
.html-login-page body{ background-color: #f7f7f7;min-height: 100vh; }
.login-page .page-block{ max-width: 360px; }
.login-page .customer-blocks{ border-radius: 15px; }
.login-page .customer-blocks form label{ display: none; }
.login-page .customer-blocks .inputs input, .login-page .customer-blocks .inputs select, .login-page .customer-blocks .inputs textarea{ border: 1px solid #ddd;border-radius: 8px; padding: 0 8px; vertical-align: middle; }
.login-page input:-webkit-autofill { -webkit-box-shadow: inset 0 0 0 1000px #fff; }
.login-page .forgot-password a{ font-size: 14px;color: var(--dark-aqua);text-decoration: none; }

/* _RootForms.cshtml css rules ------------ */ 
.form-layout-wrapper .form-layout-header{ padding: 0px 15px; }   
.form-layout-wrapper .back-to-clients{ white-space: nowrap; font-size: 17px; white-space: nowrap; line-height: 50px; display: block; padding: 0 15px;font-size: 17px;font-weight: 600;font-family: var(--proxima-nova-font);color: #4e4c4c; }
.form-layout-wrapper .breadcrumb{ margin: 3px 0px 10px 0px; padding: 5px 10px; }
.form-layout-wrapper .breadcrumb, .form-layout-wrapper .breadcrumb a, .form-layout-wrapper .breadcrumb b{ font-family: var(--proxima-nova-font);font-size: 14px;color: gray; }
.form-layout-wrapper .breadcrumb a{ color: var(--dark-aqua);text-decoration: none; }
.form-layout-wrapper .breadcrumb .bread-box span{ margin-top: -2px; }
.form-layout-wrapper  .step-overview-block span{ display: none; }
.form-layout-wrapper .overviewBox button{ white-space: nowrap;font-weight: 600;font-size: 13px;font-family: var(--proxima-nova-font);padding: 9px; }
/* Match the legacy forms: teal Submit actions and bright green sidebar Submit buttons. */
.form-layout-wrapper :is(button[form$="-submit-form"], button[data-submit-after-save], button.SubmitAll, button[id="btnSubmit"], form[data-endpoint="submit"] button[type="submit"]) {
    background: #0097a7 !important;
    border-color: #0097a7 !important;
    color: #fff !important;
}
.form-layout-wrapper .will-form-nav .overviewBox .btn-submit {
    background: #13d213 !important;
    border-color: #13d213 !important;
    color: #fff !important;
}
.form-layout-wrapper :is(button[form$="-submit-form"], button[data-submit-after-save], button.SubmitAll, button[id="btnSubmit"], form[data-endpoint="submit"] button[type="submit"]):disabled {
    background: #aaa !important;
    border-color: #aaa !important;
    color: #fff !important;
}
.form-layout-wrapper .will-form-nav .overviewBox .btn-submit:disabled{
    background-color: #aaa !important;
    border-color: #aaa !important;
    color: #fff !important;
    opacity: 1;
    cursor: not-allowed;
}
.admin-login .form-layout-wrapper .will-message{ top: 40px; }
.form-layout-html.admin-login .admin-header-links *{ font-family: var(--proxima-nova-font); }
.form-layout-html body{background: var(--angora-white);color: var(--dark-gunmetal-grey);  font-family: var(--proxima-nova-font);font-size: 14px; }
.form-layout-wrapper .custom-container{  max-width: 980px; }  
.form-layout-wrapper{ display: block;width: 100%; } 
.form-layout-wrapper .header-logo{ display:flex;align-items: center;min-height: 50px;padding: 30px 0px;margin: 0px; }
.form-layout-wrapper .header-logo a img { max-width: 319.89px; }
.form-layout-wrapper input, .form-layout-wrapper select, 
.form-layout-wrapper .will-fields input, .form-layout-wrapper .will-fields select, .form-layout-wrapper .will-fields textarea, 
.form-layout-wrapper .will-row-form input, .form-layout-wrapper .will-row-form select, .form-layout-wrapper .will-row-form textarea{ border-radius: 8px;color: var(--trout);font-size: 16px; }
.form-layout-wrapper .will-message{ position: sticky;top: 0px;width: 100%; }
.form-layout-wrapper h1, .form-layout-wrapper h2, .form-layout-wrapper h3{ font-family: var(--oswald-regular-font); font-style: normal; font-weight: 400; } 
.form-layout-wrapper h3 { font-size:18px; }

.form-layout-wrapper header, .form-layout-wrapper footer {width: 100%;}
.form-layout-wrapper footer{ min-height: 59px; }
.form-layout-wrapper main {display: flex;flex-direction: column;min-height: calc(100vh - 260px);width: 100%;align-items: flex-start;padding-bottom: 30px;}

/* postcode_lookup-wrapper css */
body .postcode-field .postcode_lookup-wrapper {display: grid; grid-template-columns: 1fr auto;gap: 0px; row-gap: 10px;width: 100%; }
body .postcode-field .postcode_lookup-wrapper input{ max-width: 100%; }
body .postcode-field .postcode_lookup-wrapper button{ border-radius: 0px 5px 5px 0px; }
body .postcode-field .postcode_lookup-wrapper select, body .postcode-field .postcode_lookup-wrapper p, body .postcode-field .postcode_lookup-wrapper p.postcode-lookup-error{margin: 0px;grid-column: 1 / -1;}
.postcode-field .postcode_lookup-wrapper p, .postcode-field .postcode_lookup-wrapper p.postcode-lookup-error{ color: red; }
body .lpa-address-grid{ align-items: flex-start; }

/* ui-datepicker css */
.ui-datepicker{width:280px;box-shadow:0 0 3px rgba(0,0,0,0.15);background-color:#fff;text-align:center;border:none;border-radius:0;padding:0;font:normal 14px Proxima,Arial,sans-serif;color:#777}
.ui-datepicker-header{position:relative;height:32px;background-color:var(--dark-aqua);color:#fff;border:none;border-radius:0;background-image:none;padding:0!important;font-weight:400}
.ui-datepicker-header a{position:absolute;top:0;z-index:1;width:32px;height:32px;line-height:32px;font-size:0;top:0!important;width:32px!important;height:32px!important;border:none!important}
.ui-datepicker-header a.ui-datepicker-prev{left:0;background:url(../images/calendar-prev.png) center no-repeat}
.ui-datepicker-header a.ui-datepicker-next{right:0;background:url(../images/calendar-next.png) center no-repeat}
.ui-datepicker-header a span{display:none!important}
.ui-datepicker .ui-datepicker-title select{ font-size: 1em;font-family: Arial, Helvetica, sans-serif;border-radius: 8px;padding: 0 5px;    color: #777; }
.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{height: 24px;}
.ui-datepicker select.ui-datepicker-month{ margin-right: 5px; }
.ui-datepicker-title{position:relative;z-index:0;line-height:32px;font-weight:700;text-transform:uppercase;line-height:32px!important}
.ui-datepicker-calendar{margin:0!important;font-size:14px!important}
.ui-datepicker-calendar th{background-color:#eee}
.ui-datepicker-calendar th,.ui-datepicker-calendar td{width:14.285%;border:1px solid #ddd;padding:0}
.ui-datepicker-calendar th span,.ui-datepicker-calendar td a{display:block;min-height:32px;line-height:32px;color:#444}
.ui-datepicker-calendar td a{border:none!important;background:none!important;padding:0;text-align:center;color:#444!important}
.ui-datepicker-calendar .ui-state-active{outline:2px solid var(--dark-aqua);font-weight:700; color:var(--dark-aqua)!important}




/* Extra extra large ---------------------------------------*/
@media(max-width: 1440px){
    
    /* common css rule ------------- */
    .custom-container, .common-layout-page .footer-lower{ max-width: 1200px; }
    
    /* banner secondary-banner ------------------ */
    .secondary-banner .custom-container{max-width: 1200px;}
    
    .common-layout-page .footer-lower{padding: 20px 25px;}
}
/* Extra large ---------------------------------------*/
@media(max-width: 1200px){

  /* how-it-works css rule ------------- */
  .how-it-works .step-img{ max-width: 400px; }
  .how-it-works .how-it-works-columns .image-col:last-child.how-it-work-col:after{ bottom: -90px; left: -40px; height: 100px; width: 100px; }

}
/* Large ---------------------------------------------*/
@media(max-width: 992px){

    /* _RootForms.cshtml css rules ------------ */  
    .form-layout-wrapper .header-logo{ width: 100%; }
    .form-layout-wrapper .header-logo a img { max-width: 230px; }
     


    /* header css rule ------------- */
    .header{ box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2); }
    .header .custom-container{ max-width: 95%; }
    .header .header-logo a img{ min-width: 240px; }
    .header-menu .menu {position: fixed;display: block;max-width: 350px;height: 100vh; top: 0px; bottom: 0px; right: -400px; transition: 0.2s; background-color: #fff; box-shadow: 0 2px 3px rgba(0,0,0,0.3);z-index: 99; }
    .header-menu-active .header-menu .menu{ right: 0px;overflow-y: auto; }
    .header-menu-active .common-layout-wrapper{ margin-left: -350px; }
    .header-menu-active .common-layout-wrapper:after{ content:"";position: fixed;top: 0px;left: 0px;bottom: 0px;right: 0px; width: 100%;height: 100%;background-color: rgba(0,0,0,0.5); }
    /* .admin-login .header-menu .menu{ height: calc(100vh - 40px);top: 40px; } */
    .menu-block .list-menu-toggle { position: relative; display: flex;flex-direction: column;align-items: center;height: 32px;min-width: 35px;justify-content: center; padding: 1px; background-color: var(--blue-munsell); border-radius: 4px; z-index: 101; }
    .menu-block .list-menu-toggle span{ position: relative;transition: 0.7s; display: block;width: 24px;height: 2px;margin-bottom: 4px; background-color: #fff; }
    .menu-block .list-menu-toggle span:last-child{ margin-bottom: 0px; }
    .header-menu-active .menu-block .list-menu-toggle{ position: relative; }
    .header-menu-active .menu-block .list-menu-toggle span:not(:first-child):not(:last-child){display: none;}
    .header-menu-active .menu-block .list-menu-toggle span:first-child{ top: 7px;left: 3px; transform: rotate(40deg) translate(-5px, -1px); }
    .header-menu-active .menu-block .list-menu-toggle span:last-child{ top: 0px;left: 5px; transform: rotate(-40deg) translate(-2px, -5px); }

    /* .custom-btn css rule */
    .custom-btn{padding: 20px;}

    /* banner css rule -------------- */
    .banner .arrow.bottom-arrow{ padding-bottom: 0px; }
    .banner .arrow:after{ display: none; } 
    .banner .banner-footer .banner-btn{ max-width: 48%;width: 100%;padding: 18px 35px;font-size: 1rem; }
    .banner .banner-info h1{ font-size: 2.5rem; }
    .banner .banner-info p{ max-width: 100%; }
    .banner .banner-info h1 br{ display: none; }

    
    /* section css rules */
    .section .subheading{ font-size: 2.5rem; }
    .section .title, .section.online-will .title { font-size: 1.5rem }
    .section .desc, .section p, .section p a, .section.online-will .desc, .section.need-some-help .desc,  .section.need-some-help a { font-size: 1.1rem;line-height: 1.5; }
    
    

}
/* Medium --------------------------------------------*/
@media(max-width: 768px){
  
  /* banner css rule -------------- */
  .banner .banner-footer .banner-btn{ max-width: 100%; }

  /* secondary-banner css rules -------------- */
  .secondary-banner .banner-image-block img{ max-width: 400px;  height: auto; }

  /* how-it-works css rule ------------- */
  .how-it-works .how-it-works-columns .image-col.how-it-work-col:after{ display: none; }
  .how-it-works-columns:nth-child(odd){ flex-direction: column-reverse; }

  /* section css rules */ 
  .section .title, .section.online-will .title { font-size: 1.6rem } 
  .online-will-card img{ height: 100%; }

  /* estateplanningexplained css rule */
  .estateplanningexplained video{width: 100%;max-width: 400px;height: 100%;}

  /* whywriteyourwillnow css rule */
  .why-write-will-card .why-write-will-image{ min-height: 200px; }

  /* footer css rule ---------- */
  .common-layout-page .footer-lower{ padding: 20px;}

}
/* Small ---------------------------------------------*/
@media(max-width: 576px){

  /* _RootForms.cshtml css rules ------------ */   
  .form-layout-wrapper .header-logo a img { max-width: 300px; }

}
/* Extra Small ---------------------------------------*/
@media(max-width: 476px){

}

/* home page: legacy font sizes (old theme responsive.css steps them down from 1440px) */
@media(min-width: 992.02px){
  .home-page .how-it-works h2.subheading{ font-size: 60px; }
  .home-page .how-it-works .step-content h3.title{ font-size: 38px; }
}
@media(min-width: 992.02px) and (max-width: 1024px){
  .home-page .how-it-works .step-content h3.title{ font-size: 30px; }
}
@media(min-width: 1440.02px){
  .home-page .whywriteyourwillnow h2.subheading{ font-size: 40px; }
  .home-page .why-write-will-card h2.title{ font-size: 35px; }
  .home-page .why-write-will-card p.desc{ line-height: 28px; }
  .home-page .need-some-help h2.subheading{ font-size: 60px; }
  .home-page .need-some-help p.desc, .home-page .need-some-help p.desc a{ line-height: 40px; }
}
@media(max-width: 1440px){
  .home-page .banner .banner-info h1{ font-size: 42px; }
  .home-page .banner .banner-info p{ font-size: 18px; }
  .home-page .banner .banner-footer .banner-btn{ font-size: 16px; }
  .home-page .online-will h2.subheading,
  .home-page .whywriteyourwillnow h2.subheading,
  .home-page .need-some-help h2.subheading{ font-size: 32px; }
  .home-page .online-will .online-will-card p.desc{ font-size: 14px;line-height: 20px; }
  .home-page .why-write-will-card h2.title{ font-size: 24px; }
  .home-page .why-write-will-card p.desc{ font-size: 12px;line-height: 20px; }
  .home-page .need-some-help p.desc, .home-page .need-some-help p.desc a{ font-size: 16px;line-height: 30px; }
}
@media(min-width: 992.02px) and (max-width: 1440px){
  .home-page .online-will .online-will-card h2.title{ font-size: 28px; }
  .home-page .our-service-card h2.title{ font-size: 25px; }
}
@media(max-width: 992px){
  .home-page .banner .banner-info h1{ font-size: 32px; }
}
@media(max-width: 768px){
  .home-page .how-it-works .step-content h4.subtitle{ font-size: 15px; }
}