/* Layout DubbelGlas.nu (c) */

/* 
    Document   : style
    Created on : juli-2014
    Authors    : Reinier Gombert, Jordy Beerling
    Description:
        1209+ toegevoegd layout glas
*/

/* Styling of elements */
@import url('/style/cubes.css');
@import url('/style/huisstijl.css');
@import url('/style/footer.css');


/* Some overall styling */
* {
    margin: 0px;
    padding: 0px;
}

*:focus {
    outline: 0; /* prevent the focus-borders around buttons and anchors from the browsers like Chrome and Safari */
}

html {
    font-size: 62.5%; /* prepare rem units, defining a base font-size of 62.5% to have the convenience of sizing rems in a way that is similar to using px. */
}

body {
    font-family: "UniversLTW01-57Condense 723821","Helvetica Neue Condensed","Helvetica Neue",Arial,sans-serif;
    -webkit-font-smoothing: antialiased !important;
    font-size: 1.5rem;
}

p {
    margin: 10px 0px;
    line-height: 2rem;
}

.unselectable {
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    cursor: default;
}

/* Typography */

.bold {
    font-weight: bold;
}

/* Back to Top */
.back-to-top {
    cursor: pointer;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
}

/* font color decoration */
.fa.blue {
    color: #013d9f;
}
.fa.orange {
    color: #ff7518;
}
.fa.red {
    color: #cc002e;
}
.fa.green {
    color: #3fb618;
}
.fa.yellow {
    color: yellow;
}
.fa.purple {
    color: purple;
}

.red {
    color: #cc002e;
}

.blue {
    color: #0ba3db;
}

.green {
    color: #38d010;
}

.grey {
    color: #f5f5f5;
}

/* color picker */
.color-wheel img {
    height: 21px;
}
.color-wheel .input-group-addon {
    cursor: pointer;
}
@media (min-width: 992px) {
    .modal-lg {
        width: 90%;
    }
    .colorpicker.pre-scrollable {
        max-height: 700px;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}

#colorpicker-loading {
    height: 13px;
}

#colorpicker-loading .progress-bar {
    height: 13px;
    font-size: 11px;
    line-height: 13px;
}

.colorpicker-content {

}

.colorpicker-content .thumbnail {
    position: relative;
    height: 95px;
    /* shadow */
    -webkit-box-shadow: 0 3px 2px rgba(0,0,0,.15), 0 0 1px rgba(0,0,0,.15);
    box-shadow: 0 3px 2px rgba(0,0,0,.15), 0 0 1px rgba(0,0,0,.15);
    -webkit-border-radius: 4px;
    border-radius: 4px;
}
.colorpicker-content .thumbnail:hover {
    cursor: pointer;
}
.colorpicker-content .thumbnail .inner:after {
    content: attr(alt);
    text-align: center;
    position:absolute;
    font-size: 15px;
    padding-top: 60px;
    width:calc(100% - 10px); height:calc(100% - 10px); /* minus padding */
    top:5px; left:5px; /* plus padding */
    background:rgba(0,0,0,0.2);
    opacity:0;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
}
.colorpicker-content .thumbnail .inner:hover:after {
    opacity: 1;
}

.colorpicker-content .thumbnail .inner {
    color: #fff;
    text-shadow: #000 0px 0px 1px;
    -webkit-font-smoothing: antialiased;
    padding: 5px;
    height: 100%;    
    overflow: hidden;
    white-space: nowrap;
}

/* Datetimepicker positioning */
.bootstrap-datetimepicker-widget{
    z-index:9999 !important;
}


/*links header*/
.table-striped a:link {
    text-decoration: none;
}

.header-links {
    font-weight: bold;
}

/*Homepage*/
.homepage-h1 {
    font-size: 26px;
    padding: 5px;
}

.homepage-h2 {
    font-size: 24px;
}

/*Over ons page*/
.over-ons-thumbnails img {
    max-height: 140px;
}

/* Glas & Service page */
.glas-en-service-text {
    margin-bottom: 50px;
}

/*Onze merken page*/
.onze-merken-thumbnails img {
    height: 50px;
}

/*Assortiment page*/
.verf-assortiment-thumbnails img {
    max-height: 150px;
}

/* Referenties*/
.referenties-images img {
    height: 307px;
}

/* Contact page */
.contact-items {
    font-size: 17px;
    line-height: 35px;
}

.contact-items i,
.contact-items .glyphicon{
    font-size: 30px;
    margin-right: 10px;
}

.contact-phone-icon {
    font-size: inherit;
}

/* for small screens, smaller margin */
@media (max-width: 991px) {
    .adresmap {
        margin-top: 30px;
    }
}


/* Containers */
.header {
    margin: -5px 0 0;
    padding: 5px;
}

.logo {
    margin-top: 0px;
    margin-bottom: 0px;
}
.logo .img-responsive{
    max-height: 100px;
    width: auto;
}
.logo img:hover {
    cursor: pointer;
}
div.otherWebshopLogo {
    margin-top: 20px;
}
li.otherWebshopLogo {
    margin: 5px 0;
}
.otherWebshopLogo .img-responsive {
    max-height: 65px;
    width: auto;
}
.otherWebshopLogo img {
    /* set opacity */
    opacity: 0.8;
    filter: alpha(opacity=50); /* For IE8 and earlier */
}
.otherWebshopLogo img:hover {
    cursor: pointer;
    /* set opacity */
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

ul {
    list-style-type: none;
}

[data-toggle="collapse"] {
    cursor: pointer;
}

.top-bar {
    width: 100%;
    margin: 0;
    height: 25px;
}


/* top bar customization*/
.well-top-bar {
    background-color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 0px;
    border-bottom: none;
}

.padding-lg {
    padding-right: 20px;
}

/*Customize well-top-bar on xs screens*/
.empty-column-padding {
    padding-bottom: 25px;
}

.top-bar-text {
    font-size: 12px;
}

.well-top-bar a {
    color: black;
    text-decoration: none;
}

.well-top-bar a:hover {
    color: blue;
}

.header-klantenservice {
    margin-right: 5px;
}

.topbar-dropdown {
    left: -55px;
    min-width: 125px;
}

/**/


.hidden {
    display: none;
}

/* White color */
.white {
    color: #fff !important;
}

/*Header NavBar*/
.navbar {
    font-size: 15px;
    letter-spacing: 1px;
}

.navbar-inverse {
    margin-bottom: 0px;
}

.xs-head-column {
    padding-left: 0px;
    padding-right: 0px;
}

.xs-navbar {
    background-color: #013d9f;
    margin: 0px;
}

.xs-nav-icon {
    background-color: #fff;
    width: 15px !important;
}

.xs-badge {
    background-color: #FF8A00;
    padding: 2px 5px;
    vertical-align: top;
    font-size: 12px;
    margin-top: -11px;
    margin-right: -3px
}

/*Homepage slider*/
.parti-slider {
    border: 1px solid #d4d4d4;
}

/*Infopages well top-margin*/
.custom-margin {
    margin-top: 0px;
    margin-bottom: 0px;
}

/* Carousel bootstrap center images */
.carousel-inner > .item > img {
    margin: 0 auto;
}

.carousel-indicators {
    bottom: -35px;
}
.carousel-indicators li {
    border-color: #d4d4d4;
}

#homeCarousel img {
    width: 100%;
    max-height: 250px;
}

.content {
    margin-top: 0px;
}
/*Well next to slider*/

.underline {
    border-bottom: 0.5px solid #d6d6d6;
}

/* center pills */
.center-pills {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

/* Equal height rows */
.equal {
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
}

.equal .thumbnail {
    height: calc(100%);
}

/* subHeader */

.subImage {
    margin: 20px 10px;
}
.subImage img {
    height: 150px;
}

/*spouw klein*/

.spouw-klein
{
    height: 90px;
}

/*no padding/margin */
.nopadding {
    padding: 0 !important;
}
.nomargin {
    margin: 0 !important;
}

/* small padding/margin */
.small-padding {
    padding: 5px !important;
}
.small-margin {
    margin: 5px !important;
}

/* responsive text aligning*/
.text-left-not-xs, .text-left-not-sm, .text-left-not-md, .text-left-not-lg {
    text-align: left;
}
.text-center-not-xs, .text-center-not-sm, .text-center-not-md, .text-center-not-lg {
    text-align: center;
}
.text-right-not-xs, .text-right-not-sm, .text-right-not-md, .text-right-not-lg {
    text-align: right;
}
.text-justify-not-xs, .text-justify-not-sm, .text-justify-not-md, .text-justify-not-lg {
    text-align: justify;
}

@media (max-width: 767px) {
    .text-left-not-xs, .text-center-not-xs, .text-right-not-xs, .text-justify-not-xs {
        text-align: inherit;
    }
    .text-left-xs {
        text-align: left;
    }
    .text-center-xs {
        text-align: center;
    }
    .text-right-xs {
        text-align: right;
    }
    .text-justify-xs {
        text-align: justify;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .text-left-not-sm, .text-center-not-sm, .text-right-not-sm, .text-justify-not-sm {
        text-align: inherit;
    }
    .text-left-sm {
        text-align: left;
    }
    .text-center-sm {
        text-align: center;
    }
    .text-right-sm {
        text-align: right;
    }
    .text-justify-sm {
        text-align: justify;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .text-left-not-md, .text-center-not-md, .text-right-not-md, .text-justify-not-md {
        text-align: inherit;
    }
    .text-left-md {
        text-align: left;
    }
    .text-center-md {
        text-align: center;
    }
    .text-right-md {
        text-align: right;
    }
    .text-justify-md {
        text-align: justify;
    }
}
@media (min-width: 1200px) {
    .text-left-not-lg, .text-center-not-lg, .text-right-not-lg, .text-justify-not-lg {
        text-align: inherit;
    }
    .text-left-lg {
        text-align: left;
    }
    .text-center-lg {
        text-align: center;
    }
    .text-right-lg {
        text-align: right;
    }
    .text-justify-lg {
        text-align: justify;
    }
}

/*overwrite bootstrap*/

.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
    z-index: 2;
}

.transparent {
    filter: alpha(opacity=30); /* for IE */
    -khtml-opacity: 0.3;      /* khtml, old safari */
    -moz-opacity: 0.3;       /* old mozilla, netscape */
    opacity: 0.3;           /* good browsers: FF, safari, opera */
}

/* nested list groups */

.list-group.list-group-root {
    padding: 0;
    overflow: hidden;
}

.list-group.list-group-root .list-group {
    margin-bottom: 0;
}

.list-group.list-group-root .list-group-item {
    border-radius: 0;
    border-width: 1px 0 0 0;
}

.list-group.list-group-root > .list-group-item:first-child {
    border-top-width: 0;
}

.list-group.list-group-root > .list-group > .list-group-item {
    padding-left: 30px;
}

.list-group.list-group-root > .list-group > .list-group > .list-group-item {
    padding-left: 45px;
}

/* bootstrap carousel */

#modelCarousel {
    margin: 20px 0;
}

#homeCarousel .carousel-indicators {
    bottom: -35px;
}
#modelCarousel .carousel-indicators{
    bottom: -55px;
}
#spouwCarousel .carousel-indicators {
    bottom: -35px;
}
#roosterCarousel .carousel-indicators {
    bottom: -35px;
}

#homeCarousel .carousel-indicators li,
#spouwCarousel .carousel-indicators li,
#modelCarousel .carousel-indicators li,
#roosterCarousel .carousel-indicators li {
    background-color: #999;
    background-color: rgba(70,70,70,.25);
}

#homeCarousel .carousel-indicators .active,
#spouwCarousel .carousel-indicators .active,
#modelCarousel .carousel-indicators .active,
#roosterCarousel .carousel-indicators .active {
    background-color: #444;
}

#roosterCarousel .carousel-control {
    width: 10%;
}

#roosterCarousel .carousel-inner .item {
    padding: 0 7%;
}

/*OrderForm*/

#Totaalprijs {
    font-size: 3rem;
}

.fa.fa-eur.big {
    font-size: 2.5rem;
}

/*spouw select*/

.spouw-select:hover {
    background-color: #e6e6e6;
    cursor: pointer;
}

.spouw-select.active {
    color: #ffffff;
    background-color: #013d9f;
    border-color: #dddddd;
}

/*model select*/

.model-select.active img {
    color: #ffffff;
    background-color: #013d9f;
    border-color: #dddddd;
}

.model-select:hover {
    background-color: #e6e6e6;
    cursor: pointer;
}

#modelPager {
    margin-top: 20px;
}

/*left alginment labels forms*/
.form-horizontal .control-label.text-left{
    text-align: left;
}

/*rooster select*/

.rooster-select {
    padding: 10px;
    margin-bottom: 0;
    white-space: nowrap;
}

.rooster-select i {
    font-size: 125px;
    color: #999;
}

.rooster-select:hover {
    background-color: #e6e6e6;
    cursor: pointer;
}

.rooster-select.active {
    color: #ffffff;
    background-color: #013d9f;
    border-color: #dddddd;
}

.rooster-select.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

#roosterSelectSubArea {
    margin-top: 10px;
}

.hierarchy-select {
    display: block;
}

.hierarchy-select li a {
    line-height: 25px;
}

.hierarchy-select li a span,
span.color-preview {
    width: 25px;
    height: 25px;
    display: inline-block;
}

#slijpenArea legend,
#vakverdelingArea legend,
#roosterSelectSubArea legend {
    font-size: 18px;
}

/*partition select*/

.partition-select {
    padding: 10px;
    margin-bottom: 0;
    white-space: nowrap;
}

.partition-select i {
    font-size: 125px;
    color: #999;
}

.partition-select:hover {
    background-color: #e6e6e6;
    cursor: pointer;
}

.partition-select.active {
    color: #ffffff;
    background-color: #013d9f;
    border-color: #dddddd;
}

.partition-select.disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

#vakverdelingSelectSubArea {
    margin-top: 10px;
}


/* Shopcart */

#shopcart .media > .pull-left {
    margin-right: 10px;
}
#shopcart .media > .pull-left img {
    height: 72px;
    max-width: 72px;
}

#shopcart .media .margin-image {
    padding-left: 98px;
}

.shopcart-btn {
    padding-right: 10px;
}

.xs-btn-shopcart {
    padding: 5px 8px;
}

/* universal box */
.box {
    margin: 0 0 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px 0;
    border-left: none;
    border-right: none;
}
.box .box-header {
    margin: -20px 0 20px;
    padding: 20px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.box .box-header:before,
.box .box-header:after {
    content: " ";
    display: table;
}
.box .box-header:after {
    clear: both;
}
.box .box-header:before,
.box .box-header:after {
    content: " ";
    display: table;
}
.box .box-header:after {
    clear: both;
}
.box .box-footer {
    margin: 30px 0 -20px;
    padding: 20px;
}
.box .box-footer:before,
.box .box-footer:after {
    content: " ";
    display: table;
}
.box .box-footer:after {
    clear: both;
}
.box .box-footer:before,
.box .box-footer:after {
    content: " ";
    display: table;
}
.box .box-footer:after {
    clear: both;
}
@media (max-width: 991px) {
    .box .box-footer .btn {
        margin-bottom: 20px;
    }
}

.klantenservice-footer {
    color: #fff !important;
}

.box.no-border {
    border: none;
}

/* Preloader icon */

.preloader {
    height: 17px;
}

.shopcart-and-login {
    margin-top: 10px;
}

/* Garantie */
.garantie:hover {
    background-color: #e6e6e6;
    cursor: pointer;
}

.garantie.active {
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/* link color */
.garantie .link {
    text-decoration: underline;
}
.garantie.active .link {
    color: #fff;
    text-decoration: underline;
}
.garantie .link:hover {
    cursor: pointer;
}

/* active background */
.garantie.active, .garantie.active:hover, .garantie.active:focus {
    z-index: 2;
    background-color: #013d9f;
    cursor: default;
}

/* caption text color */
.garantie.active .caption {
    color: #fff;
}
.garantie.active .caption .text-muted {
    color: #f1f1f1;
}

/* check-icon */
.garantie .check-icon {
    display: none;
}
.garantie.active .check-icon {
    display: inline-block;
}

/* kenmerken */
ul.kenmerken {
    list-style: none;
    padding: 0;
}
ul.kenmerken li {
    padding-left: 1.3em;
}
ul.kenmerken li:before {
    content: "\f00c"; /* FontAwesome Unicode */
    font-family: FontAwesome;
    display: inline-block;
    margin-left: -1.3em; /* same as padding-left set on li */
    width: 1.3em; /* same as padding-left set on li */
}

/* bottom alignment */
@media (min-width: 768px ) {
    .row {
        position: relative;
    }

    .bottom-align-text {
        position: absolute;
        bottom: 0;
        right: 0;
    }
}

.datepicker-days .day {
    background: #d2ffff;
}

ol.alphabetic {
    list-style-type: lower-alpha;
    margin-left: 2rem;
    font-size: 1.5rem;
    line-height: 2rem;
}

/* register content */

.zakelijk-content {
    display: none;
}

/* h2 cube customize*/
.name {
    font-size: 24px;
}

.list-name {
    font-size: 19px;
}

.cube-name {
    margin-top: 0px;
    padding-left: 10px;
    padding-top: 5px;
}