/* Ricare on Thruster V2: the look of the previous TheFox site, measured against the old pages at 1440 and 375 px. */

:root {
	--rf-accent: #00aec7;
	--rf-accent-dark: #0193a8;
	--rf-nav: #34495e;
	--rf-line: #ecf0f1;
	--rf-grey: #888888;
	--sb-el-gap: 35px;
}

body { line-height: 24px; }
h1, h2, h3, h4 { color: var(--rf-accent); font-weight: 400; }
h1 { font-size: 34px; line-height: 42px; font-weight: 700; margin: 0 0 10px; }
h2 { font-size: 24px; line-height: 36px; margin: 0; }
h3 { font-size: 20px; line-height: 24px; font-weight: 700; margin: 0 0 10px; }
p { margin: 0 0 24px; }
a { text-decoration: none; transition: color .2s; }
strong { font-weight: 700; }

.rf-grid { max-width: var(--mo-container); margin: 0 auto; }
@media (max-width: 1220px) { .rf-grid { max-width: none; margin: 0 25px; } }
@media (max-width: 767px) { .rf-grid { margin: 0 var(--mo-side-m); } }

.rf-fa { font-family: "rf-fa"; font-style: normal; font-weight: 400; line-height: 1; speak: never; -webkit-font-smoothing: antialiased; }
.rf-accent { color: var(--rf-accent); }

/* ------------------------------------------------------------------ top bar */
.rf-topbar { border-top: 4px solid var(--rf-accent); border-bottom: 1px solid #ebebeb; background: #fff; }
.rf-topbar__inner { display: flex; justify-content: flex-end; }
.rf-topbar__item { display: flex; align-items: center; height: 46px; padding: 0 20px; font-size: 15px; line-height: 24px; color: var(--rf-grey); border-left: 2px solid #ebebeb; }
.rf-topbar__item:last-child { border-right: 2px solid #ebebeb; }
.rf-topbar__item a { color: var(--rf-grey); }
.rf-topbar__item a:hover { color: var(--rf-accent); }
.rf-topbar__item .rf-fa { margin-right: 14px; font-size: 20px; color: var(--rf-accent); }
.rf-topbar__item:nth-child(2) .rf-fa { font-size: 18px; }

/* ------------------------------------------------------------------ header and menu */
.rf-header { border-top: 1px solid var(--rf-line); background: #fff; }
.rf-header__inner { display: flex; align-items: center; justify-content: space-between; height: 100px; }
.rf-logo { display: block; line-height: 0; }
.rf-logo .mo-logo__img { width: 225px; max-height: none; height: auto; }
.rf-nav { align-self: stretch; }
.rf-menu, .rf-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.rf-menu { display: flex; height: 100%; margin-right: -23px; }
.rf-menu > li { position: relative; }
.rf-menu > li > a { display: flex; align-items: center; height: 100%; padding: 0 23px 5px; font-size: 16px; font-weight: 600; line-height: 24px; color: var(--rf-nav); }
.rf-menu > li > a .rf-fa { margin-left: 10px; font-size: 16px; }
/* Only the current page itself lights up, not its parent (as on the previous site). */
.rf-menu > li:hover > a, .rf-menu > .current-menu-item > a { color: var(--rf-accent); }
.rf-menu .sub-menu { position: absolute; top: 100%; left: 0; z-index: 60; min-width: 250px; background: #fff; border-top: 3px solid var(--rf-accent); box-shadow: 0 2px 6px rgba(0, 0, 0, .08); opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; }
.rf-menu .sub-menu .sub-menu { top: -3px; left: 100%; }
.rf-menu li:hover > .sub-menu, .rf-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; }
.rf-menu .sub-menu li { position: relative; padding: 5px 0; border-bottom: 1px solid var(--rf-line); }
.rf-menu .sub-menu li:last-child { border-bottom: 0; }
.rf-menu .sub-menu a { display: block; padding: 11px 14px; font-size: 16px; font-weight: 500; line-height: 14px; color: var(--rf-nav); }
.rf-menu .sub-menu a:hover, .rf-menu .sub-menu .current-menu-item > a { background: var(--rf-line); color: var(--rf-accent); }
.rf-menu .sub-menu .menu-item-has-children > a::after { content: "\f105"; float: right; font-family: "rf-fa"; }

.rf-burger { display: none; width: 44px; height: 44px; margin-right: -10px; padding: 0; border: 0; background: none; color: #555; font-size: 21px; cursor: pointer; }
.rf-burger span { display: inline; height: auto; margin: 0; background: none; }

/* Sticky header on desktop: smaller once the page scrolls, as on the previous site. */
@media (min-width: 1036px) {
	.mo-scrolled .rf-header { position: fixed; top: 0; left: 0; right: 0; z-index: 70; box-shadow: 0 1px 3px rgba(0, 0, 0, .1); animation: rf-drop .3s; }
	.mo-scrolled .rf-header__inner { height: 70px; }
	.mo-scrolled .rf-logo .mo-logo__img { width: 160px; }
	.mo-scrolled .rf-topbar { margin-bottom: 101px; }
}
@keyframes rf-drop { from { transform: translateY(-100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .mo-scrolled .rf-header { animation: none; } }

@media (max-width: 1035px) {
	.rf-topbar, .rf-nav { display: none; }
	.rf-header__inner { height: 50px; }
	.rf-logo .mo-logo__img { width: 112px; }
	.rf-burger { display: block; }
}

/* Mobile menu: full-width turquoise panel under the header. */
.rf-drawer__panel { width: 100%; max-width: none; padding: 50px 0 0; background: var(--rf-accent); color: #fff; }
.rf-drawer .mo-drawer__close { color: #fff; font-size: 22px; }
.rf-mobile-menu, .rf-mobile-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.rf-mobile-menu li { position: relative; border-top: 1px solid rgba(1, 143, 163, .8); border-bottom: 1px solid rgba(1, 143, 163, .8); }
.rf-mobile-menu a { display: block; padding: 10px 20px 13px; color: #fff; font-size: 16px; line-height: 24px; }
.rf-mobile-menu .sub-menu { display: none; }
.rf-mobile-menu .is-open > .sub-menu { display: block; }
.rf-mobile-menu .sub-menu li { background: #018fa3; border-color: rgba(1, 120, 137, .8); }
.rf-mobile-menu .sub-menu a { padding-left: 35px; }
.rf-mobile-menu .sub-menu .sub-menu a { padding-left: 50px; }
.rf-mobile-menu .current-menu-item > a { background: #017889; }
.rf-mobile-menu .rf-sub-toggle { position: absolute; top: 0; right: 0; width: 50px; height: 47px; border: 0; background: none; color: #fff; font-size: 18px; cursor: pointer; }
.rf-mobile-menu .is-open > .rf-sub-toggle .rf-fa { display: inline-block; transform: rotate(180deg); }

/* ------------------------------------------------------------------ slider and title bar */
.rf-slider { position: relative; height: min(550px, calc(100vw * 550 / 1240)); overflow: hidden; background: #222; }
.rf-slider__slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s; }
.rf-slider__slide.is-active { opacity: 1; z-index: 1; }
.rf-slider__img { width: 100%; height: 100%; object-fit: cover; }
.rf-slider__arrow { position: absolute; top: 50%; z-index: 2; width: 40px; height: 40px; margin-top: -20px; border: 0; background: rgba(0, 0, 0, .5); color: #fff; font-size: 20px; cursor: pointer; transition: background .2s; }
.rf-slider__arrow:hover { background: #000; }
.rf-slider__arrow--prev { left: 20px; }
.rf-slider__arrow--next { right: 20px; }
@media (prefers-reduced-motion: reduce) { .rf-slider__slide { transition: none; } }

.rf-titlebar { height: 87px; border-bottom: 1px solid var(--rf-line); background: #f9fafb; }
.rf-titlebar--image { height: 201px; background: #f9fafb top center / cover no-repeat; }

/* ------------------------------------------------------------------ page content */
.entry-content > .sb-section:first-child { padding-top: 100px; }
.entry-content > .sb-section { margin-bottom: 35px; }
.entry-content > .sb-section.rf-row--wide { margin-bottom: 35px; }
.entry-content > .sb-section.rf-row--full:last-child, .entry-content > .sb-section.google-maps:last-child { margin-bottom: -30px; }
.sb-text p:last-child { margin-bottom: 0; }
/* Text outside WPBakery rows (plain page content) had 10 px between paragraphs. */
.mo-row .sb-text p { margin-bottom: 10px; }
/* WPBakery elements kept 35 px between them; the last one in a column none. */
.entry-content .sb-col__inner > .sb-text:not(:last-child) { margin-bottom: 35px; }
.sb-text img { display: block; }
.sb-text img[width="100%"] { width: 100%; }

/* Lists in page text: no bullets, the double arrow of the previous site. */
.rf-layout__main .sb-text ul { padding: 0 0 15px; margin: 0; }
.rf-layout__main .sb-text li { margin-left: 20px; line-height: 30px; list-style: none; }
.rf-layout__main .rf-row .sb-text ul { margin: 0 0 15px 20px; }
.rf-layout__main .rf-row .sb-text li { margin-bottom: 10px; }
.rf-layout__main .sb-text li::before { content: "\f101"; margin-right: 9px; font-family: "rf-fa"; color: var(--rf-accent); }

/* Pages with a sidebar: 270 px sidebar, 50 px gap, the rest for the text. */
.rf-layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); column-gap: 50px; }
.rf-has-sidebar--right .rf-layout { grid-template-columns: minmax(0, 1fr) 270px; }
.rf-has-sidebar--left .rf-layout__sidebar { grid-column: 1; grid-row: 1; }
.rf-has-sidebar--left .rf-layout__main { grid-column: 2; grid-row: 1; }
.rf-layout__main { padding: 50px 0 100px; }
.rf-layout__main > .sb-section:first-child { padding-top: 0; }
.rf-layout__main > .sb-section, .rf-layout__main > .sb-section:last-child { margin-bottom: 0; }
.rf-layout__sidebar { padding-top: 50px; }
@media (max-width: 1220px) and (min-width: 1036px) { .rf-layout { grid-template-columns: 220px minmax(0, 1fr); } }
@media (max-width: 1035px) {
	.rf-layout, .rf-has-sidebar--right .rf-layout { display: block; }
	.rf-layout__main { padding: 20px 0 0; }
	.rf-layout__sidebar { margin-top: 20px; padding: 0 0 50px; }
}
@media (min-width: 768px) and (max-width: 1035px) {
	.rf-layout__main { padding: 50px 0 60px; }
}

/* Sidebar widgets */
.rf-widget { margin-bottom: 50px; }
.rf-widget__title { margin: 0 0 31px; font-size: 25px; line-height: 24px; font-weight: 400; color: var(--rf-accent); }
.rf-side-menu, .rf-side-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.rf-side-menu a { position: relative; display: block; padding: 15px 0 15px 28px; border-bottom: 1px solid var(--rf-line); font-size: 18px; line-height: 19px; color: #555; }
.rf-side-menu a::before { content: "\f0a9"; position: absolute; left: 0; top: 15px; font-family: "rf-fa"; font-size: 18px; color: var(--rf-accent); }
.rf-side-menu .sub-menu a { padding-left: 45px; }
.rf-side-menu .sub-menu a::before { content: "\f105"; left: 23px; }
.rf-side-menu a:hover, .rf-side-menu .current-menu-item > a { color: var(--rf-accent); }

/* Text widget "Zorgverzekering" (kosten) and "Afspraak maken" (over Ricare): blue title strip, white box. */
#titel-widgets { margin-bottom: 0 !important; padding: 20px 20px 10px; background: var(--rf-accent); }
.titel-kop, h2.titel-kop { margin: 0 0 10px; font-size: 23px; line-height: 36px; color: #fff; }
#tekst-widgets { padding: 20px; border: 1px solid #dedede; background: #fff; line-height: 26px; }
#tekst-widgets a { font-size: 16px; }
#tekst-widgets a:hover { font-weight: 700; color: #018295; }

/* Single post */
.rf-single__main { max-width: 850px; padding: 50px 0 100px; }
.rf-single__image { margin-bottom: 25px; line-height: 0; }
.rf-single__image img { width: 100%; height: 400px; object-fit: cover; }
.rf-single__title { margin: 0; font-size: 36px; line-height: 36px; font-weight: 400; }
.rf-single__info { margin: 17px 0 24px; padding-bottom: 28px; border-bottom: 1px solid var(--rf-line); font-size: 13px; line-height: 19px; }
.rf-sep { margin: 0 8px; }
.rf-single__entry > .sb-section, .rf-single__entry > .sb-section:first-child { margin: 0; padding-top: 0; }
.rf-single__entry p { margin-bottom: 10px; }
@media (max-width: 767px) { .rf-single__main { padding: 30px 0 60px; } .rf-single__image img { height: auto; } }

/* ------------------------------------------------------------------ buttons (TheFox sizes) */
.sb-button.rf-btn .sb-btn { display: inline-flex; align-items: center; border: 0; border-radius: 0; font-family: var(--mo-body-font); font-size: 16px; font-weight: 700; line-height: 19px; text-transform: none; letter-spacing: 0; transition: background .2s, color .2s; }
.rf-btn--mediumlarge .sb-btn { padding: 23px 18px 23px 27px; }
.rf-btn--medium .sb-btn { padding: 16px 18px 15px; }
.rf-ico .sb-btn::before { font-family: "rf-fa"; font-weight: 400; line-height: 1; }
.rf-ico--calendar .sb-btn::before { content: "\f073"; margin-right: 15px; font-size: 25px; }
.rf-ico--angle-double-right .sb-btn::before { content: "\f101"; margin-right: 9px; font-size: 18px; }
.rf-btn .sb-btn .sb-icon { display: none; }

/* ------------------------------------------------------------------ homepage */
.rij1 > .sb-section__inner { padding-bottom: 0; }
.welkom-bij-ricare h1 { font-weight: 400; }
.welkom-bij-ricare p { margin-bottom: 30px; font-size: 21px; line-height: 33px; }
.welkom-bij-ricare .sb-text { margin-bottom: 35px; }

.behandelingen-homepage > .sb-col__inner, .klachten-homepage > .sb-col__inner {
	min-height: 320px; margin: -15px 0 30px; padding: 25px;
	background: #f1f1f1; box-shadow: 8px 8px 0 0 #dfdfdf; font-size: 18px; height: auto;
}
.behandelingen-homepage h3, .klachten-homepage h3 { margin-bottom: 15px; font-size: 24px; font-weight: 400; }
.behandelingen-homepage ul, .klachten-homepage ul { margin: 0; padding: 0; }
.behandelingen-homepage li { padding-left: 20px; line-height: 25px; list-style: none; }
.klachten-homepage li { margin-bottom: 10px; padding-left: 20px; line-height: 19px; list-style: none; }
.behandelingen-homepage li::before, .klachten-homepage li::before { content: "\f101"; margin: 0 9px 0 -17px; font-family: "rf-fa"; color: #555; }
.behandelingen-homepage a, .klachten-homepage a { color: #555; }
.behandelingen-homepage a:hover, .klachten-homepage a:hover { color: var(--rf-accent); }
.behandelingen-homepage .sb-col__inner > *, .klachten-homepage .sb-col__inner > * { margin-bottom: 0; }
#some-element { display: none; }
#some-div:hover #some-element { display: block; }

#over-ricare-balk { color: #fff; }
.over-ricare { font-weight: 500; color: #fff; }
.over-ricare h2 { margin-bottom: 15px; font-size: 33px; line-height: 36px; color: #fff; }
.over-ricare p { color: #fff; }

.wrapper-praktijk { overflow: hidden; margin-top: 30px; background: #3f546b url(https://www.ricare.nl/wp-content/uploads/2017/01/Achtergrond-praktijk.jpg); }
.wrapper-praktijk h2 { margin-bottom: 15px; font-size: 33px; line-height: 36px; color: #fff; }
#one { float: left; width: 49%; margin-right: 20px; padding: 20px; line-height: 24px; color: #fff; }
#two { overflow: hidden; min-height: 170px; background: #fff; line-height: 0; }
#two img { display: block; width: 100%; }
#button-praktijk { width: 170px; margin-top: 15px; padding: 10px; background: #fff; transition: background .2s; }
#button-praktijk:hover { background: #f1f1f1; }
#button-praktijk::before { content: "\f1c5"; margin-right: 9px; font-family: "rf-fa"; color: var(--rf-accent); }

.nieuws > .sb-col__inner { margin: 40px 0; }
.laatste-nieuws h2 { margin-bottom: 15px; font-size: 33px; line-height: 36px; }
.nieuws .sb-col__inner > .laatste-nieuws { margin-bottom: 35px; }

/* "Laatste nieuws" card: image, title in capitals, author line, excerpt and an outlined button. */
.rf-posts .sb-posts__grid { grid-template-columns: repeat(auto-fill, minmax(0, 600px)); gap: 0 30px; }
.rf-posts .sb-card { background: none; box-shadow: none; }
.rf-posts .sb-card__media img { aspect-ratio: 600 / 490; }
.rf-posts .sb-card__body, .rf-posts .sb-card--grid .sb-card__body { padding: 26px 0 0; }
.rf-posts .sb-card__title { padding: 0; margin: 0; font-family: var(--mo-body-font); font-size: 16px; line-height: 21px; font-weight: 400; text-transform: uppercase; }
.rf-posts .sb-card__title a { color: var(--rf-accent); }
.rf-posts .rf-post-info { margin: 11px 0 14px; padding-bottom: 18px; border-bottom: 1px solid var(--rf-line); font-size: 13px; line-height: 19px; color: #555; }
.rf-posts .rf-post-info .rf-sep { margin: 0 12px; }
.rf-posts .sb-card__excerpt { margin: 0; font-size: 18px; line-height: 24px; }
.rf-posts .sb-card__more { display: inline-block; margin-top: 24px; padding: 6px 15px; border: 2px solid var(--rf-accent); background: #fff; color: var(--rf-accent); font-size: 14px; font-weight: 700; line-height: 24px; letter-spacing: 1px; text-transform: uppercase; }
.rf-posts .sb-card__more:hover { background: var(--rf-accent); color: #fff; }
.rf-posts .sb-card__more .sb-icon { display: none; }

/* ------------------------------------------------------------------ over Ricare: gallery */
.rf-gallery .sb-gallery__inner, .sb-gallery.rf-gallery { gap: 0; }
.over-ricare-afbeelding img { width: 100%; }

/* ------------------------------------------------------------------ contact form and map */
.mo-form { margin-top: 0; }
.mo-form .sb-field__label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.mo-form .sb-field { margin-top: 0; margin-bottom: 23px; }
.mo-form .sb-field__control { margin-top: 3px; }
.mo-form .sb-field input, .mo-form .sb-field textarea { display: block; width: 100%; margin: 0; min-height: 0; height: 45px; padding: 10px 20px 11px; border: 2px solid #dedede; background: #fff; color: #555; font: 16px/20px var(--mo-body-font); }
.mo-form .sb-field textarea { height: 180px; }
.mo-form .sb-field input::placeholder, .mo-form .sb-field textarea::placeholder { color: #999; opacity: 1; }
.mo-form .sb-field__desc { margin: 33px 0 0; font-size: 18px; line-height: 24px; opacity: 1; color: #555; }
.mo-form .sb-field__req { display: none; }
.mo-form button[type="submit"], .mo-form .sb-btn { min-width: 120px; margin-top: 28px; padding: 11px 15px; border: 0; border-radius: 0; background: var(--rf-accent); color: #fff; font-size: 15px; font-weight: 900; line-height: 18px; letter-spacing: .5px; text-transform: uppercase; cursor: pointer; }
.mo-form button[type="submit"]:hover, .mo-form .sb-btn:hover { background: var(--rf-accent-dark); color: #fff; }
.rf-map { line-height: 0; }
.google-maps .sb-col__inner > * { margin-bottom: 0; }
.entry-content > .sb-section.google-maps:last-child { margin-bottom: -30px; }
.rf-map iframe { display: block; height: 400px; }
.google-maps > .sb-section__inner { max-width: var(--mo-container); }

/* ------------------------------------------------------------------ footer */
.rf-footer__widgets { padding: 96px 0 106px; background: var(--rf-accent) url(https://www.ricare.nl/wp-content/uploads/2017/01/Achtergrond-footer-ricare.jpg) center / cover no-repeat; color: #fff; }
.rf-footer__grid { display: grid; grid-template-columns: repeat(var(--mo-footer-cols, 4), minmax(0, 1fr)); gap: 30px; }
.rf-footer .widget-title, .rf-footer h2 { margin: 0 0 36px; font-size: 25px; line-height: 30px; font-weight: 400; color: #fff; }
.rf-footer p { margin: 0; font-weight: 500; line-height: 24px; }
.rf-footer a { color: #fff; }
.rf-footer a:hover { color: #e5f7fa; }
.rf-bottom { padding: 5px 0 19px; border-top: 1px solid var(--rf-accent); background: #fff; }
.rf-bottom .rf-bottom__message { margin: 15px 0 0; min-height: 50px; font-size: 18px; font-weight: 600; line-height: 22px; color: #555; }
.rf-bottom__message::before { content: ""; display: inline-block; min-width: 133px; min-height: 49px; margin-bottom: -10px; vertical-align: bottom; background: url(ricare-mark.svg) 0 4px / 132px auto no-repeat; }

.rf-to-top { position: fixed; right: 30px; bottom: 20px; z-index: 40; width: 29px; height: 29px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .4); color: #fff; font-size: 12px; opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
.mo-scrolled .rf-to-top { opacity: 1; visibility: visible; }
.rf-to-top:hover { background: rgba(0, 0, 0, .7); color: #fff; }

/* ------------------------------------------------------------------ tablet */
@media (max-width: 1035px) {
	.rf-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ------------------------------------------------------------------ phone */
@media (max-width: 767px) {
	.rf-titlebar { height: 200px; }
	.entry-content > .sb-section.rf-row--full:last-child, .entry-content > .sb-section.google-maps:last-child { margin-bottom: 0; }
	.rf-footer__widgets { padding: 80px 0 30px; }
	.rf-footer__grid { grid-template-columns: 1fr; gap: 0; }
	.rf-footer__col { margin-bottom: 30px; }
	.rf-bottom__message { min-height: 80px; }
	.rf-bottom__message::before { background-position: 0 -2px; margin-bottom: -20px; min-height: 59px; }
	#one { float: none; width: auto; margin-right: 0; border-bottom: 2px solid #000; }
}
@media (max-width: 480px) {
	.welkom-bij-ricare h1 { margin-top: -50px; font-size: 28px; text-align: center; }
	.welkom-bij-ricare p { font-size: 18px; text-align: center; }
	.welkom-bij-ricare .sb-button { text-align: center; margin-top: -20px; padding-bottom: 30px; }
	.rf-btn .sb-btn { min-width: 267px; justify-content: center; }
	.behandelingen-homepage > .sb-col__inner, .klachten-homepage > .sb-col__inner { margin: -15px 0 30px; box-shadow: none; border: 1px solid #dedede; }
	.over-ricare h2 { margin-top: 20px; text-align: center; }
	.over-ricare p, .over-ricare .sb-button { text-align: center; }
	.laatste-nieuws h2 { text-align: center; }
	.over-ricare-afbeelding img { padding-bottom: 20px; }
}

/* Contact form: the note sits 24 px under the message box, the button 28 px under the note (as CF7 laid it out). */
.mo-form .sb-field:last-child { margin-bottom: 0; }
.mo-form .sb-form__footer { margin: 0; padding: 0; }

/* Site Builder rows use -15px gutters (TheFox grid) inside 10px mobile padding: clip the 5px overhang. */
.mo-main { overflow-x: clip; }
