/*
Theme Name: K&K Building Contractors Ltd
Author: Łukasz Krawczyk
Author URI: mailto:lukasz.krawczyk.lublin@gmail.com
Template: wp-bootstrap-starter
Version: 1.0.0
Text Domain: kandk
*/

@import url('https://fonts.googleapis.com/css2?family=Philosopher:wght@400;700&display=swap');

:root {
    scroll-behavior: smooth;
    --first: #2c2d83;
    --second: #009fe3;
    --second-text: #35bfef;
    --second-light: #a6ddf5;
    --text: #231f20;
    --muted: #c7c8ca;
    --muted-bg: #ebebeb;
    --muted-text: #abadb0;
    --bg: #fff;
    --error: red;
    --error-light: #fff2f2;
    --success: green;
}

body { font-family: 'Philosopher', sans-serif; }

*, *:hover { transition: all .4s; }

a:hover { text-decoration: none; }

.entry-content a { color: var(--second); }

.entry-content a:hover { color: var(--first); }

.navbar-brand { margin-bottom: 2.5rem; }

.navbar-brand img { width: 112px; height: auto; }

.entry-title { font-size: 2.375rem; line-height: 1.25; font-weight: bold; text-align: center; color: var(--first); }

.entry-title span { color: var(--second); }

.entry-subtitle { font-weight: bold; color: var(--first); }

.entry-subtitle span { color: var(--second); }

.subheading { font-weight: bold; text-align: center; color: var(--text); }

h1 { line-height: 1.25; }

h2:not(.entry-title) { font-size: 1.5rem; line-height: 1.25; }

h3 { font-size: 1.25rem; color: var(--first); line-height: 1.25; }

.navbar-toggler { position: absolute; right: 0; top: 0; z-index: 99; background-color: var(--bg); }

header#masthead, .navbar-light .navbar-nav { position: absolute; z-index: 98; }

header#masthead { background: linear-gradient(var(--text), transparent); }

header#masthead .contact-us { font-size: 1rem; color: var(--bg); }

header#masthead .contact-us a { color: var(--bg); }

header#masthead .contact-us a:hover { opacity: .65; }

.navbar-light .navbar-nav { width: 100%; border-bottom: 3px solid var(--bg); background-color: var(--first); background-color: rgba(45,46,131,.875); }

.navbar-light .navbar-nav li .nav-link { font-size: 1.125rem; color: var(--bg); padding: 0; display: inline; }

.navbar-light .navbar-nav li .nav-link:hover { color: var(--second-text); }

.navbar-light .navbar-nav li { margin-left: 3rem; }

.navbar-light .navbar-nav li:first-child { margin-left: 0; }

#carousel { border-bottom: 3px solid var(--second); }

#carousel .carousel-item { background-color: var(--text); text-align: center; }

#carousel img { opacity: .575; width: 100%; height: 100vh; }

#carousel .carousel-caption .scroll-down { width: 1rem; height: auto; position: absolute; bottom: -.5rem; opacity: 1; animation: scroll-down 1.2s infinite; }

.muted-bg { background-color: var(--muted-bg); }

.second { background-color: var(--second); color: var(--bg); }

.my-card { background-color: transparent; border: none; }

.my-card.services { background-color: var(--bg); border-bottom: 3px solid var(--first) !important; border-radius: 0; }

.my-card .card-header { font-size: 1.125rem; padding: 0; background-color: transparent; border: none; }

.my-card .card-header a { color: var(--text); }

.my-card .card-header a:hover, .my-card .card-header a[aria-expanded="true"] { color: var(--second); text-decoration: none; }

.my-card .card-body h2 { color: var(--first); }

.my-card .card-body .icon i { color: var(--muted); font-size: 2.25rem; margin-bottom: .75rem; }

.my-card .card-body .navigation a { color: var(--first); }

.my-card .card-body .navigation a:hover { color: var(--second); border: none; }

#call-to-action h3 { color: var(--bg); }

.my-btn { padding: .75rem 3.25rem; font-weight: bold; }

.my-btn.btn-light { background-color: transparent; border: 2px solid var(--bg); color: var(--bg); }

.my-btn.btn-light:hover { background-color: var(--bg) !important; color: var(--second) !important; }

#cookie-policy .my-btn.btn-light,
#cookie-settings .my-btn.btn-light { border: 1px solid var(--text); color: var(--text); }

#cookie-policy .my-btn.btn-light:hover,
#cookie-settings .my-btn.btn-light:hover { background-color: transparent !important; border-color: var(--muted-text); color: var(--muted-text) !important; }

.above { position: relative; z-index: 1; }

.shadow { position: relative; z-index: 0; box-shadow: 0 .25rem 1.5rem var(--muted) !important; }

#our-projects { background-color: var(--muted-bg); }

.features .description { font-size: .875rem; }

.features i { font-size: 2.25rem; color: var(--muted); }

.slick-slide img { width: 100%; border-left: .25rem solid var(--muted-bg); border-right: .25rem solid var(--muted-bg); }

.slick-prev { left: 40px; z-index: 1; }

.slick-next { right: 40px; z-index: 1; }

.slick-dots { bottom: -35px; }

.slick-dots li { margin: 0 .25rem; }

.slick-dots li button { display: flex; height: 0; }

.slick-dots li button:before { font-size: .875rem; line-height: 1.5; opacity: 1; color: var(--muted); }

.slick-dots li.slick-active button:before { opacity: 1; color: var(--second); }

#contact-us img { width: 110px; height: auto; }

#contact-us { background: fixed no-repeat left top / cover; background-blend-mode: multiply; }

.wpcf7 .wpcf7-form-control.form-control { border-radius: 0; border-color: var(--second); color: var(--text); font-weight: bold; padding-top: .75rem; padding-bottom: .75rem; height: auto; }

.wpcf7 .wpcf7-form-control.form-control::placeholder { color: var(--muted-text); font-weight: normal; }

.wpcf7 textarea.wpcf7-form-control.form-control { height: 145px; }

.wpcf7 span.wpcf7-list-item { margin-left: 0; }

.wpcf7 .wpcf7-list-item-label { font-size: .75rem; padding-left: 1.75rem; }

.wpcf7 .wpcf7-form-control.wpcf7-submit,
.my-btn.btn-primary { padding: .75rem 3.25rem; font-weight: bold; background-color: var(--second); border-color: var(--second); }

.wpcf7 .wpcf7-form-control.wpcf7-submit:hover,
.my-btn.btn-primary:hover { background-color: var(--second-text); border-color: var(--second-text); }

.wpcf7 .wpcf7-form-control.wpcf7-submit:disabled,
.wpcf7 .wpcf7-form-control.wpcf7-submit:disabled:hover { background-color: var(--second-light); border-color: var(--second-light); opacity: 1; }

.wpcf7 .checkbox-radio-container { display: flex; position: relative; margin-bottom: 0; cursor: pointer; user-select: none; }

.wpcf7 .checkbox-radio-container input { position: absolute; opacity: 0; cursor: pointer; }

.wpcf7 .checkbox-radio-container input + .checkmark,
.wpcf7 .checkbox-radio-container input ~ .checkmark { position: absolute; left: 0; top: 0; width: 19px; height: 18px; border: 1px solid var(--second); background-color: var(--bg); }

.wpcf7 .checkbox-radio-container input:checked ~ .checkmark { border-color: transparent; background-color: var(--second); }

.wpcf7 .checkbox-radio-container input + .checkmark::after,
.wpcf7 .checkbox-radio-container input ~ .checkmark::after { content: ''; position: absolute; display: none; left: 5px; top: 0; width: 7px; height: 13px; border: solid var(--bg); border-width: 0 3px 3px 0; transform: rotate(45deg); }

.wpcf7 .checkbox-radio-container input:checked ~ .checkmark::after { display: block; }

div.wpcf7 .ajax-loader { margin-left: .75rem; background-repeat: no-repeat; }

.wpcf7 .wpcf7-form-control.form-control.wpcf7-not-valid { border-color: var(--error); background: var(--error-light) url('./img/exclamation-circle-solid.svg') no-repeat top .9444rem right .9444rem / 1.125rem; }

.wpcf7-not-valid-tip { font-size: .75rem; font-weight: bold; color: var(--error); }

.wpcf7 form .wpcf7-response-output { border: none !important; color: var(--error); margin: 0; padding: 0; margin-top: 1rem !important; text-align: center; font-weight: bold; }

.wpcf7 form.sent .wpcf7-response-output { color: var(--success); }

p { line-height: 1.5; }

.description > :last-child { margin-bottom: 0; }

#colophon { background-color: var(--first); color: var(--bg); border-bottom: 3px solid var(--second); }

#colophon p { line-height: 1.75; }

#colophon a { color: var(--bg); }

#colophon a:hover { color: var(--second-text); text-decoration: none; }

#colophon .site-info { opacity: .35; }

iframe { display: flex; }

.go-top { position: fixed; bottom: 1.625rem; right: 1.625rem; width: 3rem; height: 3rem; border-radius: 1.5rem; border: 3px solid var(--bg); box-shadow: 0 0 1rem var(--muted-text); background-color: var(--second); background-color: rgba(0,159,227,.875); }

.go-top:hover { background-color: var(--second); }

.go-top a { color: var(--bg); display: flex; justify-content: center; align-items: center; height: 100%; }

.grecaptcha-badge { display: none; }

#cookie-policy h6,
#cookie-settings h6 { font-size: 1rem; line-height: 1.5; font-weight: bold; text-transform: uppercase; letter-spacing: .25rem; }

#cookie-policy,
#cookie-settings,
#icon-cookie-settings { position: fixed; background-color: rgba(255,255,255,.95); color: var(--text); font-size: .75rem; text-align: center; box-shadow: 0 0 1rem var(--muted-text); z-index: 98; }

#cookie-policy:not(.visible),
#cookie-settings:not(.visible),
#icon-cookie-settings:not(.visible) { bottom: -200%; }

#cookie-policy.visible,
#cookie-settings.visible,
#icon-cookie-settings.visible { animation: visible 1.2s; animation-fill-mode: forwards; }

#cookie-policy.hide,
#cookie-settings.hide,
#icon-cookie-settings.hide { animation: hide 3s; animation-fill-mode: forwards; }

#icon-cookie-settings { right: 0; }

#icon-cookie-settings a { color: var(--text); }

#icon-cookie-settings a:hover { color: var(--muted-text); }

@keyframes visible {
    from { bottom: -200%; }
    to { bottom: 0; }
}

@keyframes hide {
    from { bottom: 0; }
    to { bottom: -200%; }
}

@keyframes scroll-down {
    from { bottom: -.5rem; opacity: 1; }
    to { bottom: -1.5rem; opacity: 0; }
}

@media (max-width: 767.98px) {
    :root { font-size: 18px; }
    .navbar { position: absolute; width: 100%; top: 0; }
    .navbar-light .navbar-nav li { margin-left: 0; margin-top: 1rem; text-align: center; }
    .navbar-light .navbar-nav li:first-child { margin-top: 0; }
    h1.slogan { font-size: 1.5rem; }
}

@media (max-width: 575.98px) {
    #carousel img { height: auto; }
}

@media (max-width: 374.98px) {
    header#masthead .contact-us { display: none !important; }
}