/******************** Algemeen *********************/
html,body {font-size: 16px; font-family: 'Roboto', sans-serif;}
.m-top-page {margin-top: 137px;}
.m-bottom-page {margin-bottom: 100px;}
h1 {font-size: 24px;}
h2 {font-size: 20px;}
h3 {font-size: 16px; margin-bottom: 5px;}
.form-control {font-size: 16px;}

a.special {color: #ae131e;}
a.special:hover, a.special:focus {color: #970a15;}

.bg-basic {background-color: #46609a;}
.bg-special {background-color: #ae131e;}
.text-special {color: #ae131e;}
.bg-kunststof {background-color: #8da5d6;}
.bg-buiten {background-color: #393939;}

.bg-basic-10 {background-color: rgba(70,96,154,0.1);;}
.bg-special-10 {background-color: rgba(190,21,34,0.1);}

/******************** Nav bar *********************/
.navbar-default {background-color: #FFF; border-bottom: 1px solid #e7e7e7;}
.navbar-default.fixed-top.actie {top: 40px;}
.navbar-default.small.fixed-top.actie {top: 0px;}
.navbar-default.small {box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);}
.navbar-default .navbar-brand {height: 137px; transition: all 0.5s;}
.navbar-default .navbar-brand img {height: 107px; width: auto; transition: width 0.5s, height 0.5s;}
.navbar-default.small .navbar-brand {height: 80px; padding-top: 5px; padding-bottom: 5px;}
.navbar-default.small .navbar-brand img {height: 70px; width: auto;}
.navbar-default.small .navbar-collapse {margin-top: 15px;}
.navbar-default .nav>li>a {color: #374e86; background-color: #FFF; font-size: 16px;}
.navbar-default .navbar-nav .nav-item .nav-link:hover, .navbar-default .navbar-nav .nav-item .nav-link:focus, .navbar-default .navbar-nav .nav-item .nav-link.active {color: #ae141e; background-color: #FFF;}
.navbar-default .navbar-nav .nav-item .nav-link.active:hover {color: #8da5d6;}
.navbar-default .navbar-nav .btn-inmeetafspraak {background-color: #ae131e; color: #FFF;}
.navbar-default .navbar-nav .btn-inmeetafspraak:hover {border: 1px solid #ae131e;}
.navbar-default .navbar-nav>li>a.btn-inmeetafspraak {padding-top: 10px; padding-bottom: 10px; margin-top: 5px;}

.actie-container {background-color: #ae131e; color: #FFF; font-size: 18px; line-height: 20px; padding-top: 10px; padding-bottom: 10px;}

/******************** Pages **********************/
.home_bg {margin-top: 137px; padding-top: 50px;}
.titel {display: inline-block; background: rgb(55,78,134); background: rgba(55,78,134,0.6); margin-left: 15px;}
.titel h1 {display: inline-block; color: #FFF; margin: 20px; font-size: 45px; font-style: italic; font-weight: 400; letter-spacing: 1px;}
.subtitel {display: inline-block; background: rgb(190,21,34); margin-left: 15px; color: #FFF; padding: 2px 20px; font-size: 16px;}
.subtitel a {color: #FFF;}

.actiecontainer {background-color: #FFDC00;}
.actiecontainer h1 {font-size: 45px;}
.actiecontainer p, .actiecontainer .btn-inmeet-row {font-size: 20px;}
@media (max-width: 767px) {
	.actiecontainer h1 {font-size: 35px;}
	.actiecontainer p, .actiecontainer .btn-inmeet-row {font-size: 18px;}
}
.actiecontainer.badge {color: #ae131e;}

.shutters .basic-shutter h2, .shutters .special-shutter h2, .shutters .kunststof-shutter h2, .shutters .buiten-shutter h2  {margin-top: 0px; margin-bottom: 0px;}
.shutters .basic-shutter h2 a, .shutters .special-shutter h2 a, .shutters .kunststof-shutter h2 a, .shutters .buiten-shutter h2 a {color: #FFF; text-decoration: none;}

.shutters {color: #8B8B8B;}
.shutters h3, .shutters h3 a {color: #000; font-weight: 500; letter-spacing: 1px;}
.shutters h3 a:hover {color: #8B8B8B; text-decoration: none;}
.shutters h3 span, .shutters h3 a span {color: #8B8B8B;}
.shutters h3 a:hover span {color: #000; text-decoration: none;}
.shutters p.prijs {color: #000; margin-top: 10px; font-weight: 700;}
.shutters .btn {font-size: 16px; font-weight: 400; margin-top: 0px; margin-bottom: 10px; border-radius: 0px; letter-spacing: 1px; background-color: #FFF;}
.shutters .btn-basic {color: #46609a; border: 1px solid #46609a;}
.shutters .btn-basic:hover {background-color: #46609a; color: #FFF; border: 1px solid #000;}
.shutters .btn-special {color: #ae131e; border: 1px solid #ae131e;}
.shutters .btn-special:hover {background-color: #ae131e; color: #FFF; border: 1px solid #000;}
.shutters .btn-kunststof {color: #8da5d6; border: 1px solid #8da5d6;}
.shutters .btn-kunststof:hover {background-color: #8da5d6; color: #FFF; border: 1px solid #000;}
.shutters .btn-buiten {color: #393939; border: 1px solid #393939;}
.shutters .btn-buiten:hover {background-color: #393939; color: #FFF; border: 1px solid #000;}

.bouwmarkten {margin-top: 15px;}
.bouwmarkten .header {display: block; background-color: #393939; color: #FFF; font-size: 24px; font-weight: 500; letter-spacing: 1px;}
.bouwmarkten .btn-bm {padding: 15px; margin-bottom: 30px; text-align: center; border-color: #CCC; background-color: #FFF;}
.bouwmarkten .btn-bm:hover {border-color: #ae131e;}

.sfeer span {display: block; color: #FFF; font-size: 24px; font-weight: 500; letter-spacing: 1px;}
.sfeer span a, .sfeer span a:hover {color: #FFF; text-decoration: none;}
.sfeer span.basic-shutter {background-color: #46609a;}
.sfeer span.special-shutter {background-color: #ae131e;}
.sfeer span.kunststof-shutter {background-color: #8da5d6;}
.sfeer span.buiten-shutter {background-color: #393939;}

.inmeet-row {display: block; color: #FFF; font-size: 24px; font-weight: 500; letter-spacing: 1px; background-color: #ae131e;}
.btn-inmeet-row {border: 1px solid #ae131e; background-color: #ae131e; color: #FFF; font-size: 16px; border-radius: 0px; padding: 10px; line-height: 20px;}
.btn-inmeet-row:hover {border: 1px solid #ae131e; color: #ae131e; background-color: #FFF;}

.basic-shutter h2 {display: block; background-color: #46609a; color: #FFF; font-size: 18px; font-weight: 500; letter-spacing: 1px;}
.special-shutter h2 {display: block; background-color: #ae131e; color: #FFF; font-size: 18px; font-weight: 500; letter-spacing: 1px;}
.kunststof-shutter h2 {display: block; background-color: #8da5d6; color: #FFF; font-size: 18px; font-weight: 500; letter-spacing: 1px;}
.buiten-shutter h2 {display: block; background-color: #393939; color: #FFF; font-size: 18px; font-weight: 500; letter-spacing: 1px;}

.shutter-page .btn {color: #000; font-weight: 700; margin-top: 15px; border-radius: 0px;}
.shutter-page .btn-basic {background-color: #46609a; color: #FFF; letter-spacing: 1px;}
.shutter-page .btn-special {background-color: #ae131e; color: #FFF; letter-spacing: 1px;}
.shutter-page .btn-kunststof {background-color: #8da5d6; color: #FFF; letter-spacing: 1px;}
.shutter-page .btn-buiten {background-color: #393939; color: #FFF; letter-spacing: 1px;}

.spec-bg ul {padding-left: 1rem;}
.spec-bg .prijs {border: 2px solid #46609a; padding: 3px 7px; margin: 3px 0px; display: inline-block;}

.spec-bg2 {padding-top: 15px; padding-bottom: 15px;}
.spec-bg2 .btn-basic {background-color: #FFF; color: #46609a; letter-spacing: 1px; border-radius: 0px; border: 2px solid #46609a; font-weight: 700;}
.spec-bg2 .btn-basic:hover {background-color: #46609a; color: #FFF; border: 2px solid #000;}
.spec-bg2 .btn-special {background-color: #FFF; color: #ae131e; letter-spacing: 1px; border-radius: 0px; border: 2px solid #ae131e; font-weight: 700;}
.spec-bg2 .btn-special:hover {background-color: #ae131e; color: #FFF; border: 2px solid #000;}
.spec-bg2 .btn-kunststof {background-color: #FFF; color: #8da5d6; letter-spacing: 1px; border-radius: 0px; border: 2px solid #8da5d6; font-weight: 700;}
.spec-bg2 .btn-kunststof:hover {background-color: #8da5d6; color: #FFF; border: 2px solid #000;}
.spec-bg2 .btn-buiten {background-color: #FFF; color: #393939; letter-spacing: 1px; border-radius: 0px; border: 2px solid #393939; font-weight: 700;}
.spec-bg2 .btn-buiten:hover {background-color: #393939; color: #FFF; border: 2px solid #000;}

.basic-shutter .spec-bg, .basic-shutter .spec-bg2 {background-color: #ccd1e6;}
.special-shutter .spec-bg, .special-shutter .spec-bg2 {background-color: #f0cdc1;}
.kunststof-shutter .spec-bg, .kunststof-shutter .spec-bg2 {background-color: #e1e8f5;}
.buiten-shutter .spec-bg, .buiten-shutter .spec-bg2 {background-color: #e6e6e6;}

.spec-bg2.bg-none {background-color: transparent;}

.anchor{display: block; height: 150px; margin-top: -150px; visibility: hidden;}
@media (max-width: 767px) {.anchor {height: 80px; margin-top: -80px;}}

/**************** Shutterwijzer ******************/
.shutterwijzer h2 {display: block; background-color: #8B8B8B; color: #FFF; font-size: 20px; font-weight: 400; letter-spacing: 1px; padding: 7px 15px; margin-bottom: 10px;}
.shutterwijzer-keuze .basic-shutter h3, .shutterwijzer-vragen .basic-shutter h3 {display: block; background-color: #46609a; color: #FFF; font-size: 16px; font-weight: 400; letter-spacing: 1px; padding: 5px 15px; margin-bottom: 0px; text-align: center;}
.shutterwijzer-keuze .special-shutter h3, .shutterwijzer-vragen .special-shutter h3 {display: block; background-color: #ae131e; color: #FFF; font-size: 16px; font-weight: 400; letter-spacing: 1px; padding: 5px 15px; margin-bottom: 0px; text-align: center;}
.shutterwijzer-keuze .kunststof-shutter h3, .shutterwijzer-vragen .kunststof-shutter h3 {display: block; background-color: #8da5d6; color: #FFF; font-size: 16px; font-weight: 400; letter-spacing: 1px; padding: 5px 15px; margin-bottom: 0px; text-align: center;}
.shutterwijzer-keuze .buiten-shutter h3, .shutterwijzer-vragen .buiten-shutter h3 {display: block; background-color: #393939; color: #FFF; font-size: 16px; font-weight: 400; letter-spacing: 1px; padding: 5px 15px; margin-bottom: 0px; text-align: center;}
.shutterwijzer-keuze h3 a, .shutterwijzer-keuze h3 a:hover, .shutterwijzer-vragen h3 a, .shutterwijzer-vragen h3 a:hover {color: #FFF; text-decoration: none;}
.shutterwijzer-vragen .basic-shutter h3, .shutterwijzer-vragen .special-shutter h3, .shutterwijzer-vragen .kunststof-shutter h3, .shutterwijzer-vragen .buiten-shutter h3 {margin-top: 0px;}

.shutterwijzer-vragen h3 {font-size: 18px;}
.shutterwijzer-vragen .btn {color: #000; font-weight: 700; margin-top: 15px; border-radius: 0px;}
.shutterwijzer-vragen .btn.ja {background-color: #bfc5d5;}
.shutterwijzer-vragen .btn.ja:hover, .shutterwijzer-vragen .btn.ja.active {background-color: #46609a; color: #FFF;}
.shutterwijzer-vragen .btn.nee {background-color: #e1b7b9;}
.shutterwijzer-vragen .btn.nee:hover, .shutterwijzer-vragen .btn.nee.active {background-color: #ae131e; color: #FFF;}
.shutterwijzer-vragen .btn-basic {background-color: #46609a; color: #FFF; letter-spacing: 1px;}
.shutterwijzer-vragen .btn-special {background-color: #ae131e; color: #FFF; letter-spacing: 1px;}
.shutterwijzer-vragen .btn-kunststof {background-color: #8da5d6; color: #FFF; letter-spacing: 1px;}
.shutterwijzer-vragen .btn-buiten {background-color: #393939; color: #FFF; letter-spacing: 1px;}

.shutterwijzer-vragen h2 {display: block; color: #000; font-size: 20px; font-weight: 400; letter-spacing: 1px; padding: 7px 15px; margin-bottom: 10px;}
.shutterwijzer-vragen h2.ja {background-color: #bfc5d5;}
.shutterwijzer-vragen h2.nee {background-color: #e1b7b9;}

.shutterwijzer-vragen .uitslag {font-size: 16px;}

ul.triangle {margin: 0 15px 0 0; padding: 0 1em; list-style: none;}
ul.triangle li {line-height: 1;}
ul.triangle li:before {content: ""; border-color: transparent #111; border-style: solid; border-width: 0.35em 0 0.35em 0.45em; display: block; height: 0; width: 0; left: -1em; top: 0.7em;position: relative;}

.calculator.basic-shutter h2, .calculator.special-shutter h2, .calculator.kunststof-shutter h2 {margin-top: 0px;}

.calc-items {margin-top: 25px; margin-bottom: 20px;}
.calc-items label {font-weight: 400;}
.calc-items label.basic {font-size: 13px;}
.calc-items .input-group-addon, .bestel-items .input-group-addon {border-radius: 0px;}
.calc-items .input-group-addon:first-child, .bestel-items .input-group-addon:first-child {border-right: 0;}
.calc-items .input-group-addon:last-child, .bestel-items .input-group-addon:last-child {border-left: 0;}
.calc-items .form-control, .bestel-items .form-control, .bestel-items select {-webkit-border-radius: 0px; border-radius: 0px;}
.bestel-items .has-feedback label~.form-control-feedback {top: 29px;}
.bestel-items .has-feedback label~.form-control-feedback.adresgegevens {top: 25px;}
.bestel-items .form-control + .form-control-feedback.tSelect {right: 10px;}
.bestel-items .form-control + .form-control-feedback.tSelect.tAantal {top: 25px;}
.bestel-items .montagewijze {padding-right: 0px;}

.img-click:hover {cursor: pointer;}

h6.bestelling, h6.bestelling a {color: #46609a; text-decoration: none;}
h6.bestelling.buiten-shutter, h6.bestelling.buiten-shutter a {color: #393939; text-decoration: none;}

.card.bestelling {border-radius: 0px;}
.card.bestelling h5 {color: #FFF; font-weight: 500; letter-spacing: 1px; padding: 7px 15px;}
.card.bestelling h5.basic-bestelling {background-color: #46609a;}
.card.bestelling h5.buiten-bestelling {background-color: #393939;}

.bestel-titel {color: #FFF; font-size: 18px; font-weight: 400; background-color: #8da5d6; padding: 10px;}
label.titelkop {color: #FFF; background-color: #46609a; width: 100%; padding: 2px 5px;}
.buitenshutter label.titelkop {background-color: #393939;}

.calc-items .m2prijs {padding-left: 0px; padding-right: 0px; text-align: right;}

.accordion-item {border-radius: 0px !important; margin-bottom: 0.5rem;}
.accordion-header .accordion-button {color: #FFF; border-radius: 0px !important; font-size: 20px; font-weight: 500; letter-spacing: 1px; padding-top: 0.5rem; padding-bottom: 0.5rem;}
.accordion-header .accordion-button:focus {box-shadow: none;}
.accordion-header.basic .accordion-button {background-color: #46609a;}
.accordion-header.special .accordion-button {background-color: #ae131e;}
.accordion-header.kunststof .accordion-button {background-color: #8da5d6;}
.accordion-header.buiten .accordion-button {background-color: #393939;}

.accordion-button::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}
.accordion-button:not(.collapsed)::after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}

.accordion-item .form-control.prijs {background-color: #f5e7e8; text-align: right;}

.accordion-item .btn-basic-bestellen {background-color: #46609a; color: #FFF; letter-spacing: 1px; font-weight: 700; border-radius: 0px;}
.accordion-item .btn-special-bestellen {background-color: #ae131e; color: #FFF; letter-spacing: 1px; font-weight: 700; border-radius: 0px;}
.accordion-item .btn-kunststof-bestellen {background-color: #8da5d6; color: #FFF; letter-spacing: 1px; font-weight: 700; border-radius: 0px;}
.accordion-item .btn-buiten-bestellen {background-color: #393939; color: #FFF; letter-spacing: 1px; font-weight: 700; border-radius: 0px;}


.calc-items .subtotaal, .calc-items .eindtotaal {margin-top: 15px;}
.calc-items .subtotaal h3, .calc-items .eindtotaal h3 {margin-top: 10px;}
.calc-items .subtotaal .form-control.prijs {border-color: #000;}
.calc-items .eindtotaal .form-control.prijs {border: 2px solid #000; color: #FFF; font-weight: 700;}
.calc-items.basic .eindtotaal .form-control.prijs {background-color: #46609a;}
.calc-items.special .eindtotaal .form-control.prijs {background-color: #ae131e;}
.calc-items.kunststof .eindtotaal .form-control.prijs {background-color: #8da5d6;}
.calc-items.buiten .eindtotaal .form-control.prijs {background-color: #393939;}

.calc-items .kortingsub {margin-top: 15px;}
.calc-items .kortingbedrag {background-color: #FFDC00; margin-top: 0.5rem;}
.calc-items .kortingbedrag a {color: #212529;}
.calc-items .kortingbedrag .form-control.prijs {border-color: #ae131e; color: #ae131e; background-color: #fff6bf;}
.calc-items .kortingsub h3, .calc-items .kortingbedrag h3 {margin-top: 10px;}

.calc-items .inmeetkorting {background-color: #FFDC00;}
.calc-items .inmeetkorting .form-control.prijs {border-color: #ae131e; color: #ae131e; background-color: #fff6bf;}

.has-feedback .form-control.profielT {padding-right: 3px;}

.fv-plugins-bootstrap5-row-invalid .invalid-feedback{display: block;}

.btn-bestellen {background-color: #46609a; color: #FFF; letter-spacing: 1px; font-weight: 700; border-radius: 0px; margin-bottom: 25px;}
.btn-bestellen.disabled, .btn-bestellen[disabled] {background-color: #bfc5d5; color: #000;}
.btn-bestellen:hover {background-color: #FFF; color: #46609a; border: 1px solid #46609a;}
.btn-bestellen-buiten {background-color: #393939; color: #FFF; letter-spacing: 1px; font-weight: 700; border-radius: 0px; margin-bottom: 25px;}
.btn-bestellen-buiten:hover {color: #C0C0C0;}
.btn-bestellen-buiten.disabled, .btn-bestellen-buiten[disabled] {background-color: #C0C0C0; color: #393939;}

.contact-keuze {border: 1px solid #CCC; margin: 0px; padding: 6px 12px; background-color: #FAFAFA;}
.has-error .g-recaptcha iframe {border: 1px solid #a94442;}

h2.bestel-basic {display: block; background-color: #46609a; color: #FFF; font-size: 18px; font-weight: 500; letter-spacing: 1px; padding: 5px 15px; margin-bottom: 0px;}
h2.bestel-buiten {display: block; background-color: #393939; color: #FFF; font-size: 18px; font-weight: 500; letter-spacing: 1px; padding: 5px 15px; margin-bottom: 0px;}
.img-fluid.bestel:hover {cursor: pointer;}

/****************** Prijscontact *****************/
.form-control[readonly] {background-color: #FFF;}
.form-control-feedback.readonly {right: 15px;}
.btn-file {position: relative; width:100%; overflow: hidden; color: #ae131e;}
.btn-file input[type=file] {position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); opacity: 0; outline: none; background: white; cursor: inherit; display: block;}

.cta-button {position: fixed; z-index: 100; right: -95px; bottom: 25px; background-color: rgba(174,19,30,0.5); color: #FFF; padding: 6px 25px 12px; border-radius: 25px 0px 0px 25px; transition: all 1s; animation: in-screen; -webkit-animation: in-screen; border: 1px solid #FFF; box-shadow: 5px 5px 10px #b1b1b1;}
.cta-button:hover {background-color: rgba(174,19,30,1); right: 0px;}
.cta-button a {color: #FFF !important; text-decoration: none; line-height: 25px;}
.cta-button a:hover {color: #C0C0C0 !important; text-decoration: none;}
.cta-button .glyphicon {font-size: 25px; top: 5px;}

/****************** Onderhoudsformulier displays *********************/
.displayform .btn-jn {color: #000; font-weight: 700; border-radius: 0px; width: 100%;}
.displayform .btn-jn.ja {background-color: #eceff5; border: 1px solid #46609a;}
.displayform .btn-jn.ja:hover, .displayform .btn-check:checked+.btn-jn.ja {background-color: #46609a; color: #FFF;}
.displayform .btn-jn.nee {background-color: #f7e7e8; border: 1px solid #ae131e;}
.displayform .btn-jn.nee:hover, .displayform .btn-check:checked+.btn-jn.nee {background-color: #ae131e; color: #FFF;}
.displayform .card:has(> .row > .col-12 > .form-check-inline > .is-invalid) {border: 2px solid #dc3545;}
.displayform .fv-plugins-bootstrap5-row-invalid h6 {color: #dc3545;}

/******************** Fotos **********************/
.masonry {display: block; -webkit-column-gap: 0.25rem; -moz-column-gap: 0.25rem; column-gap: 0.25rem;}
.masonry.masonry-columns-5 {-webkit-column-count: 5; -moz-column-count: 5; column-count: 5;}
.masonry .masonry-item {display: inline-block; width: 100%; padding: 0; border: 1px solid transparent; transition: all 0.4s ease-in-out; }
.masonry .masonry-item:hover {border: 1px solid #f0f0f0;}

/******************** Maps ***********************/
#bouwmarkten-maps {height: 75vh; padding-left: 0px; padding-right: 0px;}

/******************** Footer *********************/
.site_footer {margin-top: 25px; padding: 50px 0; color: #bababa; background-color: #393939;}
.site_footer a {color: #bababa; text-decoration: none;}
.site_footer ul.footer_links {list-style: none; padding-left: 0px; margin: 0px;}
.site_footer ul.footer_links li {padding: 5px 0px; border-bottom: 1px solid #c9c9c9;}

/***************** Row center ***********************/
.row-centered {text-align:center;}
.col-centered {display:inline-block; float:none; text-align:left; margin-right:-4px;}

@media (max-width: 767px) {
    .navbar-default .container {box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);}
	.navbar-default .navbar-brand {height: 80px;}
	.navbar-default .navbar-brand img {height: 70px; width: auto;}
	.navbar-default .navbar-collapse, .navbar-default.small .navbar-collapse {background-color: #FFF;}
       
    .navbar-default .navbar-nav.navbar-right {margin: 0px 0px 25px 0px;}
    .navbar-default .navbar-nav>li>a.btn-inmeetafspraak {padding-top: 10px; padding-bottom: 10px; margin-top: 0px;}
    .navbar-fixed-top .navbar-collapse {max-height: 100vh;}
    
	.home_bg {margin-top: 80px; padding-bottom: 25px; background-size: cover;}
	.home_bg.bg1 {background: url('../pics_site/home_bg1_opt.jpg') no-repeat; background-position: right -250px top; background-size: cover;}
	.home_bg.bg2 {background: url('../pics_site/home_bg2_opt.jpg') no-repeat; background-position: -325px top; background-size: cover;}
	.home_bg.bg3 {background: url('../pics_site/home_bg3_opt.jpg') no-repeat; background-position: right -225px top; background-size: cover;}
	.home_bg.bg4 {background: url('../pics_site/home_bg5_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.home_bg.bg5 {background: url('../pics_site/home_bg6_opt.jpg') no-repeat; background-position: left -550px top; background-size: cover;}
	.home_bg.bg6 {background: url('../pics_site/home_bg7_opt.jpg') no-repeat; background-position: left -360px top; background-size: cover;}
	.home_bg.bg7 {background: url('../pics_site/home_bg8_opt.jpg') no-repeat; background-position: left -360px top; background-size: cover;}
	.home_bg.bg8 {background: url('../pics_site/home_bg9_opt.jpg') no-repeat; background-position: left -340px top; background-size: cover;}
	.home_bg.bg9 {background: url('../pics_site/home_bg10_opt.jpg') no-repeat; background-position: left top; background-size: cover;}
	.home_bg .titel {margin-top: 225px; margin-left: 0px;}
	.bouwmarkten .btn-bm {padding: 15px 50px; margin-bottom: 10px;}
	.titel h1 {font-size: 25px; margin: 10px;}
	.subtitel {padding: 2px 10px; font-size: 14px; margin-bottom: 25px;}
	.shutterwijzer-vragen .btn-basic, .shutterwijzer-vragen .btn-special, .shutterwijzer-vragen .btn-kunststof, .shutterwijzer-vragen .btn-buiten {font-size: 14px; margin-bottom: 15px;}	
	.basic-shutter h2, .special-shutter h2, .kunststof-shutter h2, .buiten-shutter h2 {margin-bottom: 0px;}
	.basic-shutter img, .special-shutter img, .kunststof-shutter img, .buiten-shutter img {margin-bottom: 10px;}
	.m-top-25.no-msm.mxs {margin-top: 15px;}
	.m-top-25.no-mxs {margin-top: 0px;}
	.m-bottom-page.no-mxs {margin-bottom: 0px;}
	.m-top-32.no-msm.mxs {margin-top: 22px;}
	.m-top-25-xs {margin-top: 25px;}
	.masonry.masonry-columns-5 {-webkit-column-count: 2; -moz-column-count: 2; column-count: 2;}
	.site_footer ul.footer_links {margin-top: 25px;}
}
@media(max-width: 540px){ 
  .masonry.masonry-columns-5 {-webkit-column-count: 1; -moz-column-count: 1; column-count: 1;}
}

@media(max-width: 370px){ 
	.titel h1 {font-size: 20px;}
}

@media (max-width: 991px) {
	.m-top-page {margin-top: 80px;}
	.panel-group .panel-shutters .btn-basic-bestellen, .panel-group .panel-shutters .btn-special-bestellen, .panel-group .panel-shutters .btn-kunststof-bestellen, .panel-group .panel-shutters .btn-buiten-bestellen {margin-top: 36px;}
}

@media (min-width: 768px) {
	.navbar-default .navbar-brand {height: 80px; padding-right: 15px;}
	.navbar-default .navbar-brand img {height: 70px; width: auto;}
	.navbar-default.small .navbar-brand {padding-right: 60px;}
    .navbar-default.small .navbar-brand.hubo {padding-right: 15px;}
    .navbar-default .navbar-brand.hubo img {height: 58px; margin-top: 25px;}
    .navbar-default.small .navbar-brand.hubo img {margin-top: 5px;}
	.navbar-default .nav>li>a {font-size: 14px; padding-left: 7px; padding-right: 7px;}
	.home_bg {height: 375px; margin-top: 80px;}
	.home_bg.bg1 {background: url('../pics_site/home_bg1_opt.jpg') no-repeat; background-position: right -125px top; background-size: cover;}
	.home_bg.bg2 {background: url('../pics_site/home_bg2_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.home_bg.bg3 {background: url('../pics_site/home_bg3_opt.jpg') no-repeat; background-position: right -125px top; background-size: cover;}
	.home_bg.bg4 {background: url('../pics_site/home_bg5_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.home_bg.bg5 {background: url('../pics_site/home_bg6_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.home_bg.bg6 {background: url('../pics_site/home_bg7_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.home_bg.bg7 {background: url('../pics_site/home_bg8_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.home_bg.bg8 {background: url('../pics_site/home_bg9_opt.jpg') no-repeat; background-position: left top; background-size: cover;}
	.home_bg.bg9 {background: url('../pics_site/home_bg10_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.titel h1 {font-size: 27px; margin: 15px;}
	.shutter-content-r {padding-right: 30px;}
	.shutters p.info {min-height: 180px;}	
	.masonry.masonry-columns-5 {-webkit-column-count: 3; -moz-column-count: 3; column-count: 3;}
	
	.bestel-tekst {padding-left: 10px;}
	ul.bestel-list {padding-left: 25px;} 
	
	.inline-label {padding-top: 7px;}
	
	.shutterwijzer-vragen p {margin-left: 15px;}
	
	.text-center-sm {text-align: center;}
	.text-right-sm {text-align: right;}
}
@media (min-width: 992px) {
	.navbar-default {height: 137px; transition: height 0.5s}
	.navbar-default .container-sm {padding-top: 16px; transition: all 0.5s;}
	.navbar-default.small {height: 80px;}
	.navbar-default.small .container-sm {padding-top: 0px; transition: all 0.5s;}
	.navbar-default .navbar-brand {padding-right: 60px; height: 137px;}
    .navbar-default .navbar-brand.hubo {padding-right: 30px;}
	.navbar-default.small .navbar-brand {padding-right: 126px;}
    .navbar-default.small .navbar-brand.hubo {padding-right: 96px;}
	.navbar-default .navbar-brand img {height: 107px; width: auto;}
    .navbar-default .navbar-brand.hubo img {height: 107px; width: auto; margin-top: 0px;}
    .navbar-default.small .navbar-brand.hubo img {height: 70px; width: auto; margin-top: 0px;}
	.navbar-default .nav>li>a {font-size: 16px; padding-left: 10px; padding-right: 10px;}
	.home_bg {margin-top: 137px;}
	.home_bg.bg3 {background: url('../pics_site/home_bg3_opt.jpg') no-repeat; background-position: center top; background-size: cover;}
	.titel h1 {font-size: 35px; margin: 20px;}
	.shutters p.info {min-height: 160px;}
	.bouwmarkten .btn-bm {padding: 15px 25px;}
    .bouwmarkten .btn-bm.btn-square {padding: 9px 0px;}
	.masonry.masonry-columns-5 {-webkit-column-count: 4; -moz-column-count: 4; column-count: 4;}
}
@media (min-width: 1200px) {
    .navbar-default .navbar-brand.hubo {padding-right: 100px;}
    .navbar-default.small .navbar-brand.hubo {padding-right: 166px;}
	.home_bg {height: 550px;}
	.titel h1 {font-size: 45px; margin: 20px;}
	.calc-items .m2prijs {padding-right: 5px;}
	.bouwmarkten .btn-bm {padding: 15px 50px;}
    .bouwmarkten .btn-bm.btn-square {padding: 5px 12px;}
	.masonry.masonry-columns-5 {-webkit-column-count: 5; -moz-column-count: 5; column-count: 5;}
	.shutters p.info {min-height: 100px;}
}
@media (min-width: 1900px) {
	.home_bg.bg1 {background: url('../pics_site/home_bg1_opt.jpg') no-repeat; background-position: center center; background-size: cover;}
}

@media print {
	html, body, .form-control {font-size: 12px !important;}
    .navbar-default {display:none!important; height: 0;}
    .m-top-page {margin-top: 0;}
	.print-br {page-break-before: always; page-break-inside: avoid;}
    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {float: left;}
    .col-sm-12 {width: 100%;}
    .col-sm-11 {width: 91.66666667%;}
    .col-sm-10 {width: 83.33333333%;}
    .col-sm-9 {width: 75%;}
    .col-sm-8 {width: 66.66666667%;}
    .col-sm-7 {width: 58.33333333%;}
    .col-sm-6 {width: 50%;}
    .col-sm-5 {width: 41.66666667%;}
    .col-sm-4 {width: 33.33333333%;}
    .col-sm-3 {width: 25%;}
    .col-sm-2 {width: 16.66666667%;}
    .col-sm-1 {width: 8.33333333%;}
    .col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}
    .visible-sm-block {display: block!important;}
    .m-top-25.no-mxs {margin-top: 25px;}
    .knoppen .col-sm-8.col-sm-offset-2 {width: 100%; margin-left: 0;}
}