/* 
	ALGEMEEN
				*/

/* kleuren */
.donkerblauw { color: #222E50; }
.blauw { color: #0C8AFF; }
.roze { color: #E73A63 !important; }
.wit { color: #fff; }
.opacity { color: #989DAC; }
.groen { color: #27B01E; }
.bg-donkerblauw { background-color: #222E50; }
.bg-blauw { background-color: #0C8AFF; }
.bg-roze { background-color: #E73A63; }
.bg-lichtgrijs { background-color: #F1F2F2; }
.bg-groen { background-color: #27B01E; }
.tablet-a a { font-weight: bold; }
.tablet-a li a { font-weight: normal; }
.dik { font-weight: bold; }
.br-5 { border-radius: 5px; }
body { font-size: 12px; color: #222E50; }
p, .card-body p { line-height: 24px; }
img { border-radius: 5px; }
h1 { font-size: 22px; font-family: 'core_sans_c55_medium', Arial, sans-serif; }
h2, h3, h4, h5, h6 { font-size: 16px; font-family: 'core_sans_c55_medium', Arial, sans-serif; }
table { font-size: 12px; border-radius: 5px; }
a:hover { cursor: pointer !important; }

ul.menu { list-style: none; padding: 0; margin: 0; }
ul.menu li { display: block; position: relative; float: left; font-family: 'core_sans_c65_bold', Arial, sans-serif; font-size: 12px; border-right: 1px #ebebeb solid; }
ul.menu li:last-child { border-right: none; }
ul.menu li:hover { background-color: #e7e7e7; }
ul.menu li:first-child { border-top-left-radius: 5px; border-bottom-left-radius: 5px; }
ul.menu li:first-child a { padding-top: 16px; }
ul.menu li a { color: #222E50; margin: 0; display: block; padding: 13px 20px 13px 20px; }
ul.menu li a:hover { text-decoration: none; }
ul.menu li .submenu { display: none; position: absolute; border: 1px #F1F2F2 solid; border-bottom: 3px #D8D8D8 solid; background-color: #fff; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; padding: 0; width: 215px; z-index: 99; }
ul.menu li .submenu li { border-bottom: 1px #f0f0f0 solid; padding: 0; width: 100%; border-right: none; position: relative; }
ul.menu li .submenu li:last-child { border-bottom: none; }
ul.menu li .submenu li:hover { background-color: #fff; }
ul.menu li .submenu li a { color: #222E50; margin: 0; display: block; padding: 13px 20px 13px 20px; width: 100%; font-family: 'core_sans_c45_bold', Arial, sans-serif; }
ul.menu li .submenu li a:hover { text-decoration: underline; }
ul.menu li:hover .submenu { display: none; }
ul.menu li .submenu li .submenu { display: none; position: absolute; left: 100%; top: 0; }
ul.menu li .submenu li:hover .submenu { display: block; }
ul.menu li .submenu li.has-children { border-right: 3px #f0f0f0 solid; }

ul.mobile-menu { list-style: none; padding: 0; margin: 0; width: 100%; }
ul.mobile-menu li { display: block; padding: 10px 30px 10px 30px; }
ul.mobile-menu li:hover { background-color: #e7e7e7; }
ul.mobile-menu li a { color: #222e50; }

ul.usps { margin: 0; padding: 0; }
ul.usps li { padding: 5px 0px 5px 0px; list-style: none; }
ul.usps li::before { content: url('img/roze-vinkje.png'); margin-right: 7px; }

.afspraak-maken { cursor: pointer; border-bottom: 3px #9f1b3b solid; }
.afspraak-maken:hover { cursor: pointer; border-bottom: 1px #9f1b3b solid; }

.footer ul { list-style: none; padding: 0px; margin: 0px; }
.footer ul li { padding-bottom: 4px; }
.footer ul li:last-child { padding-bottom: 0px; }
.footer ul li a { color: #222e50; }

.select-repair tr td, .select-repair tr th { padding: 8px 10px 8px 10px; }
.select-repair { border-radius: 5px; }

.c45 { font-family: 'core_sans_c45_regular', Arial, sans-serif; }
.c55 { font-family: 'core_sans_c55_medium', Arial, sans-serif; }
.c65 { font-family: 'core_sans_c65_bold', Arial, sans-serif; }
.c75 { font-family: 'core_sans_c75_extrabold', Arial, sans-serif; }
.c85 { font-family: 'core_sans_c85_heavy', Arial, sans-serif; }

.copy-screen-table { width: 100%; border-top: 2px #f8f9fa solid; }
.copy-screen-table tr th, .copy-screen-table tr td { padding-top: 12px; padding-bottom: 12px; }
.copy-screen-table tr:nth-of-type(odd) td { background-color: #fafafa; }

.phone-model { width: 206px; }
.form-control { font-size: 12px; }
.btn { font-size: 12px; }
.reparatie-duur, .reparatie-prijs { font-size: 20px; }
.sidebar-titel { font-size: 16px; }
.reparatie-description p { padding: 10px 0px 10px 0px; }
.reparatie-description h1, .reparatie-description h2, .reparatie-description h3, .reparatie-description h4, .reparatie-description h5, .reparatie-description h6 { font-size: 16px; font-family: 'core_sans_c55_medium', Arial, sans-serif; }

ul.green-check, ul.cross-check, .reparatie-description ul { padding: 0px; list-style: none; }
ul.green-check li, .reparatie-description ul li { padding: 0px; background: url('https://upload.wikimedia.org/wikipedia/commons/e/e0/Check_green_icon.svg') no-repeat; background-position-y: center; background-size: 15px 15px; padding: 2px 0px 0px 30px; margin: 0px 0px 10px 0px; }
ul.cross-check li { padding: 0px; background: url('https://upload.wikimedia.org/wikipedia/commons/c/cc/Cross_red_circle.svg') no-repeat; background-position-y: center; background-size: 15px 15px; padding: 2px 0px 0px 30px; margin: 0px 0px 10px 0px; }
.reparatie-description ul { padding: 10px 0px 10px 0px; }

@media only screen and (max-width: 575px) {
    .container { width: 85%; margin: 0px auto 0px auto; }
}

@font-face {
    font-family: 'core_sans_c45_regular';
    src: url('fonts/coresansc-45regular-webfont.woff2') format('woff2'),
         url('fonts/coresansc-45regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'core_sans_c55_medium';
    src: url('fonts/coresansc-55medium-webfont.woff2') format('woff2'),
         url('fonts/coresansc-55medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'core_sans_c65_bold';
    src: url('fonts/coresansc-65bold-webfont.woff2') format('woff2'),
         url('fonts/coresansc-65bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'core_sans_c75_extrabold';
    src: url('fonts/coresansc-75extrabold-webfont.woff2') format('woff2'),
         url('fonts/coresansc-75extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

@font-face {
    font-family: 'core_sans_c85_heavy';
    src: url('fonts/coresansc-85heavy-webfont.woff2') format('woff2'),
         url('fonts/coresansc-85heavy-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}