/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

/* features */
.fbox-media {
    margin-bottom: 1.5rem;
}
.fbox-content .boxes {
    min-width: 100%;
}
.fbox-content h3.lead  {
    font-size: 1.25rem;
    color: #444;
    line-height: 1.5;
    margin: 0 0 30px 0;
}

.fbox-content span {
    font-size: 1.0rem;
}

/* fbox icon fix for Canvas7 */
.fbox-color1 .fbox-icon i {
    background-color: var(--cnvs-themecolor);;
}
.fbox-color2 .fbox-icon i {
    background-color: var(--cnvs-supportcolor);;
}
/*
.fbox-solid.fbox-color1 .fbox-icon i {
    background-color: var(--cnvs-themecolor);;
}
.fbox-solid.fbox-color2 .fbox-icon i {
    background-color: var(--cnvs-supportcolor);;
}
*/
.fbox-outline.fbox-color2 .fbox-icon i,   {
    background-color: var(--cnvs-supportcolor);
    border-outline-color: var(--cnvs-supportcolor);
}
.fbox-border.fbox-color2 .fbox-icon i {
    border-color: var(--cnvs-supportcolor);
    color: var(--cnvs-supportcolor);;
}
.fbox-plain.fbox-color1 .fbox-icon i {
    color: var(--cnvs-themecolor);;
}
.fbox-plain.fbox-color2 .fbox-icon i {
    color: var(--cnvs-supportcolor);;
}

.fbox-plain .fbox-icon i {
    font-size: var(--cnvs-featured-box-plain-font-size);
    line-height: inherit;
}




/* paragraph */

.columns_2 {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
}

.columns_3 {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
}

.columns_4 {
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 40px;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
}

/* Overrule image path canvas styles for bolt
-----------------------------------------------------------------*/
.side-panel-open:not(.device-xs):not(.device-sm):not(.device-md) .body-overlay:hover { cursor: url('assets/img/icons/close.png') 15 15, default; }

.video-overlay,
.video-placeholder {
    background: transparent url('../img/grid.png') repeat;
}

video.centered{
    width:100%;
    margin:auto;
    display: block;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    object-fit: cover;
}
.page-title-pattern {
    background-image: url('../img/default/pattern.png');
}
.page-title-pattern1 {
    background-image: url('../img/default/pattern1.png');
}
.page-title-pattern2 {
    background-image: url('../img/default/pattern2.png');
}

.fbox-border.fbox-effect .fbox-icon i::after {
    background-image: url('../img/icons/iconalt.svg');
}

.owl-carousel .owl-video-play-icon {
    background: url("../img/icons/play.png") no-repeat;
}

.team-list.team-list-bg {
    background-color: #FFF;
}

.dark .team-list.team-list-bg {
    background-color: rgba(0,0,0,0.2);
}

.menu-link i:not(.icon-angle-down) {
    display:none;
}


.style-5 .menu-container {
    border-right: none;
}

/* .slider-caption, .flex-caption { */
.slider-caption:not(.slider-caption-center) {
    max-width:100%;
}
/* default slider */
.slider-caption h1 {
    font-size: 4rem;
    letter-spacing: 2px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 0;
}

.slider-caption h2 {
    text-transform: none;
    line-height: 1.25;
}
.slider-caption p {
    margin-top: 1.25rem;
}

#slider .container .slider-image {
    /* full-width slider can have larger images */
    max-width: 200%;
}

/* full width half height slider page */
.vh-20 {
    height: 20vh !important;
}

.min-vh-40 {
    height: 40vh !important;
    min-height: 500px !important
}



/* landing slider */
.slider-element {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/*
@media (max-width: 1600px) {

    .slide-imgs .iphone-img {
        width: 250px;
    }

}
*/
@media (max-width: 1000px) {

    .slide-imgs .iphone-img {
        width: 250px;
    }

}

@media (max-height: 800px) {
    .slide-imgs .iphone-img {
        height: 450px;
    }
}


.slide-imgs .iphone-img {
    position: relative;
    z-index: 1;
    max-width: 330px;
    -webkit-transform: perspective(1400px) rotateY(-20deg) rotateX(10deg) rotateZ(6deg) scale(0.8) translateX(50%) translateY(6%);
    transform: perspective(1400px) rotateY(-20deg) rotateX(10deg) rotateZ(6deg) scale(0.8) translateX(50%) translateY(6%);
    transition: transform 0.45s cubic-bezier(0.2, 0.7, .3, 1);
}

.slide-imgs:hover .iphone-img {
    -webkit-transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(0.95) translateX(40%) translateY(8%);
    transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(0.95) translateX(40%) translateY(8%);
}

.geolocation-field-iframe {
    height: 500px; /* or what height you need */
    width: 100%;
}
.geolocation-field-iframe {
    height: 100%;
    width: 100%;
}

#logo img {
    max-height: 75px;
}

img.footer-logo {
    max-width: 250px;
    max-height: 50px;
}

/* fix path in magnific-popus.css */
.mfp-preloader {
    background: url('../img/preloader-dark.gif') center center no-repeat;
}

#contactbar abbr[title] {
    text-decoration: none;
    font-weight: bold;
}
#footer abbr[title] {
    text-decoration: none;
}

ul {
    margin-left: 1em;
}

/* fix news entry - canvas 6&7  */
#content .entry-content li {
  line-height:1.65;
}

a.more-link {
    font-family: inherit;
    display: inline-block;
    font-style: italic;
    text-decoration: none;
}

/*
.entry-title h2 {
    font-size: 1.8rem;
}
*/
.entry-title h3 {
    font-size: 1.0rem;
}

/*
.entry-content h3 {
    font-size: 1.1rem;
}
*/


.block-video {
    overflow: visible;
    display:block;
    height:auto;
    position:relative;
}

/* fix for white background sections in dark modus canvas7 */
.bg-white {
    /*background-color: var(--cnvs-white), var(--cnvs-contrast-0) !important;*/
}

.text-color1  {
    color: var(--cnvs-themecolor) !important;
}
.text-color2  {
    color: var(--cnvs-supportcolor) !important;
}

/* fix buttons in themecolor for call to action element and more - canvas 6&7 */
.bg-color1  {
background-color: var(--cnvs-themecolor);
}
.bg-color2  {
background-color: var(--cnvs-supportcolor);
}

.btn-color1  {
    border:1px solid;
    border-color: var(--cnvs-themecolor);
    background-color: var(--cnvs-themecolor);
}
.btn-color1:hover  {
    border:1px solid;
    /*background-color: transparent;*/
    background-color: var(--cnvs-supportcolor);
}
.btn-outline-color1  {
    background-color: transparent;
    border-color: var(--cnvs-themecolor);
    color: var(--cnvs-themecolor);
}
.btn-outline-color1:hover  {
    background-color: var(--cnvs-themecolor);
    border-color: var(--cnvs-themecolor);
}

.btn-color2  {
    border:1px solid;
    border-color: var(--cnvs-supportcolor);
    background-color: var(--cnvs-supportcolor);
}
.btn-color2:hover  {
    border:1px solid;
    /*background-color: transparent;*/
    background-color: var(--cnvs-themecolor);
}
.btn-outline-color2  {
    background-color: transparent;
    border-color: var(--cnvs-supportcolor);
    color:var(--cnvs-supportcolor);
}
.btn-outline-color2:hover  {
    background-color: var(--cnvs-supportcolor);
    border-color: var(--cnvs-supportcolor);
}

/* fix for parallax non full-width */
.promo.parallax {
    padding: var(--cnvs-promo-parallax-padding) !important;  /* removed 0 */
}

/* custom grayscale option for logo carousel */
img.grayscale {
    background-color: transparent;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
}
img.grayscale:hover {
    filter: none;
    -webkit-filter: none;
}

/* fix for Canvas7 to have white sections in pricing-advanced like we had in Canvas6 */
.pricing-advanced .pricing-price, .pricing-advanced .pricing-action {
    background-color: var(--cnvs-pricing-minimal-bg);
    border-bottom: var(--cnvs-pricing-border-size) solid var(--cnvs-pricing-border-color);
}
/* fix buttons in themecolor for call to action element and more - canvas 6&7 */
.border-color1  {
    border-color: var(--cnvs-themecolor) !important;
}
.border-color2  {
    border-color: var(--cnvs-supportcolor) !important;
}

/* fix for clients carousel flipcard prevent default square */
.oc-item .flip-card .flip-card-front, .oc-item .flip-card .flip-card-back {
    height: auto;
}

/* fix for em in canvas7 not using the secondary font */
em {
    font-family: var(--cnvs-primary-font);
}
em.secondary {
    font-family: var(--cnvs-secondary-font);
}
/* fix for em in canvas7 all ul and ol (news, paragraph etc) */
ul {
    padding-left:0.5rem;
}
ol {
    padding-left:1.5rem;
}

/* paragraph sections should have smaller padding */
section[name="paragraph"].section {
    padding-bottom:2rem;
}


/* the droxy.ai chatbot */
#smart-assistant-container, #welcome-message, #bubble {
    z-index:99;
}

/* for creditable only ? */

@media screen and (max-width:1920px) {
    html {
        zoom: 100%;
    }
}
@media screen and (min-width:1920px) {
    html {
        zoom: 110%;
    }
}

@media screen and (min-width:2560px) {
    html {
        zoom: 125%;
    }
}
@media screen and (min-width:2880px) {
    html {
        zoom: 150%;
    }
}
@media screen and (min-width:3200px) {
    html {
        zoom: 150%;
    }
}

/* Copied from source creditable, we might need it


section.bg-color1 h3 > span:not(.nocolor)  {
    color: #fb6504;
}

.btn-color1:hover, .button-color:hover {
    border-color: #ffffff}
.btn-color2:hover {
    border-color: #ffffff !important;
}

.btn-black, .btn-outline-black:hover, .btn-white:hover
{
    background-color: #000000;
    color: #ffffff;
}
.btn-white, .btn-outline-white:hover, .btn-black:hover
{
    background-color: #ffffff;
    color: #000000;
}
.btn-light:hover, .btn-dark:hover{
    background-color:#6c757d
}
.btn-outline-black {
    border-color: #000000;
}
.btn-outline-white {
    border-color: #ffffff;
}

.btn-circle {
    border-radius: 20px;
}



.hover {
    opacity: .5;
}


*/

/* the digital signage player iframe for wachtkamerschermen */
.iframe-preview-container {
    display: flex;
    width: 100%;
    aspect-ratio: 16/9;
    flex-direction: column;
    overflow: hidden;
    background-size: contain;
    background-repeat: no-repeat;
}

#preview-player {
    display: block;
    border: none;
    flex-grow: 1;
    border: none;
    margin: 0;
    padding: 0;
}

/* costiomised footer like canvas6 */
.dark .footer-widgets-wrap a {
    color: rgba(255, 255, 255, 0.75);
}
.dark .footer-widgets-wrap a:hover {
    color: rgba(255, 255, 255);
}