/***FORM***/
#main-container  .formControls .btn { padding: 11px 11px; font-size: 16px; margin-top: 10px; margin-bottom: 10px; background: #0055A0; margin-left: 21px;}
#main-container  .btn-primary {background-color: #0055A0;font-weight: 400;font-size: 15px;padding: 15px 15px;}
.formControls {background: none!important; }

/* Formuliervelden naast elkaar – alleen het offerte-formulier, op elke pagina waar het staat */
.subsection-flevo-kozijnenfabriek-vakmanschap-sinds-dag-een .documentFirstHeading {
    text-align: center;
}
form#form[action*="uw-offerte-gratis-en-geheel-vrijblijvend"].row {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

form#form[action*="uw-offerte-gratis-en-geheel-vrijblijvend"] .field {
  flex: 1 1 calc(50% - 0.5rem);
  min-width: 200px;
}

/* Aanvullende informatie (textarea) en verzendknop op volledige breedte */
form#form[action*="uw-offerte-gratis-en-geheel-vrijblijvend"] #formfield-form-widgets-comments,
form#form[action*="uw-offerte-gratis-en-geheel-vrijblijvend"] .formControls {
  flex: 1 1 100%;
}

button[name="form.buttons.submit"],
input[name="form.buttons.submit"] {
    background: #808080 !important;
    background-color: #808080 !important;
    background-image: none !important;
    border: 1px solid #6e6e6e !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

button[name="form.buttons.submit"]:hover,
input[name="form.buttons.submit"]:hover {
    background: #6e6e6e !important;
    background-color: #6e6e6e !important;
    border-color: #5c5c5c !important;
}

.btn,
.btn-primary,
a.btn,
a.phonebutton,
a.margin-10-0.grey-background.btn {
  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.post-info {display: none!important; }

/**** BACIC ****/

. outer-wrapper div.container, #content-header div.container, #content-header {max-width: 1320px  !important;}
body #portal-globalnav-wrapper .container { --bs-gutter-x: 0 !important; padding-right: 0 !important; margin-right: 0 !important} 
body #mainnavigation-wrapper #portal-globalnav a { font-size: 0.9em ; }
body #mainnavigation-wrapper #portal-globalnav a:hover { border-bottom: 2px solid silver; }
body #content div.mosaic-grid-row.mosaic-grid-row-fluid,
.mosaic-grid-row-fluid {right: 0; position: relative; width: 100vw !important; margin-left: calc(-50vw + 50%) !important; }


/***MIS***/
.portaltype-easyform div.pat-modal {z-index:999; }
#global_statusmessage {display: none; }
.mosaic-grid-row-dark { background: #0055A0 !important; color: #ffffff; }
a { text-decoration: none !important;}


/***FONT***/
#content .mosaic-tile-content  h1.documentFirstHeading {font-weight: 700; margin-top: 10px; line-height: 160%; color: #3b566e; }
body { --bs-body-font-size: 1rem; color: #3b566e !important; }
.documentDescription { border-bottom: none !important; color:  #2b5d9f !important;	padding-bottom: 0.5em;	margin-bottom: 1em;    font-weight: 500 !important; }
#fragment-2e7bf0c9a33742978d29ac09336ab9c7 .documentFirstHeading {color: #FFFFFF !important; }
h2 a {color:#0055A0; text-decoration: none;}
h3 a, h3.card-title { color:#0055A0 !important; }
.card-block a { text-decoration: none; }
div.image_banner_text h1 { font-size: 3.0em !important; padding-top: 3.0em !important; margin-bottom: 0.8em !important;}
.mosaic-tile-content h1:first-child {font-weight: 700; margin-top: 10px; line-height: 160%; color: #3b566e; }
.features4 h4 { color:  black;	font-size: 1.3em! important; }




/***NAV***/ 
.navbar-nav {text-transform: uppercase;}
.navbar .offcanvas {background: #ffffff !important; }
.navbar-barceloneta {background: #ffffff !important; }
#portal-globalnav li.current a, #portal-globalnav a:hover, #portal-globalnav a.selected {background: #ffffff !important; color: #0055A0 !important;}
#portal-globalnav-wrapper {margin-bottom: 50px;}



/***BUTTON***/
.btn:hover, .btn:focus { color: #6CAF48 !important; text-decoration: none; }
.btn-primary { color: #fff; background-color: #0055A0 !important; }

.mosaic-grid-row  {max-width: 1320px !important}
body .mosaic-grid-row.mosaic-grid-row-fluid { width: calc(100vw + 30px) !important; max-width: calc(100vw + 30px) !important; margin-left: -15px !important; margin-right: -15px !important} 
bod.mosaic-grid-row.mosaic-grid-row-fluid { width: calc(100vw + 30px)   !important; max-width: calc(100vw + 30px) !important; margin-left: -15px; margin-right: -15px}
body .mosaic-grid-row.mosaic-grid-row-fluid .mosaic-grid-row>*  { padding-left: 0; padding-right: 0}

@media (min-width: 1400px) {.mosaic-grid-row  {max-width: 1320px !important} }
@media (min-width: 1200px) {h4, .h4 {font-size: 1.5rem; line-height: 2rem !important; color:#0055A0 } }




#portal-siteactions a,
.colophonWrapper a { color: #0055A0;   text-align: center; }
#portal-siteactions,
#portal-siteactions li { display:  inline-block !important;	padding: 0;	text-align: center; }
#portal-siteactions li a {text-decoration: none !important;margin: 0 0.5rem;text-transform: uppercase; font-weight: 100; font-size: 12px;}
#portal-siteactions {display: block !important; margin: 2em auto; text-align: center; }


#portal-footer-wrapper h2 { --bs-heading-color: white; color: white !important; }
footer#portal-footer-wrapper {background: ##0055A0 !important; color: #FFFFFF ; display: none;}
#below-portlets-wrapper table.listing { --bs-body-color: white !important; }
#below-portlets-wrapper-div  {background: #0055a0; margin-top: 2rem ;}
#below-portlets-wrapper { padding: 1rem; display: flex; flex-wrap: wrap; justify-content:  space-between; margin-top: 1rem ; color: white; }
#below-portlets-wrapper a { color: #FFFFFF; }
#below-portlets-wrapper a:hover { color: #72AF54;}

div.colophonWrapper,
div.colophonWrapper ul, 
div.colophonWrapper li { width: 100%; text-align: center; opacity: 0.8 }


#content-header,
.doormat.row,
.doormat.row .col-xs-12,
.doormat h2 {color: white;text-align: left;font-size: 1.2rem; margin-bottom: 1em;}
.doormat.row {margin: auto; width: 100%; }