:root {

    /* Główne */
    --blue:      #102768;
    --darkBlue:  #00103E;
    --darkGrey:  #333333;
	--grey: 	 #666666;
	--lightGrey: #F0F0F0;
	--white: 	 #ffffff;
}

/* Style dla dużych ekranów */
/* Style ogólne */
.flex { display: flex; }
.column { flex-direction: column; }
.row { flex-direction: row; }
.transition { transition: all 0.7s ease !important; }
.wrap { flex-wrap: nowrap;}
a {
	cursor: url('/wp-content/themes/nota/img/cursorBlue.svg') 10 10, pointer !important;
}
.blue { color: var(--blue) !important; }
.darkBlue {color: var(--darkBlue) !important; }
.darkGrey {color: var(--darkGrey) !important; }
.grey {color: var(--grey) !important; }
.lightGrey {color: var(--lightGrey)  !important; }
.white {color: var(--white) !important; }
.mt-100 { margin-top: 100px !important; }
.mt-50 { margin-top: 50px !important; }
.mt-30 { margin-top: 30px !important; }
.mb-30 { margin-bottom: 30px !important; }
.full {width: 100% !important;}
.hWidth {width: 50% !important;}
.o-t-Width {width: 33% !important;}
.t-t-Width {width: 66% !important;}
.button {
	padding: 0px !important;
}
.button a {
	padding: 13px 60px 13px 18px !important;
	white-space: nowrap;
}

.textM {font-size: 18px !important;}
.bold {font-weight: 700 !important;}
.fullScreen {
	width: 100vw !Important;
}
.left { align-items: flex-start; }

.tresc p {
	margin-bottom: 20px !important;
}

/* Style nagłówka */
.head.elementor-sticky--active {
    background-color: #F0F0F0 !important;
    height: 90px !important;
}
.head.logo img {
    width: 80px !important;
	height: auto;
}
.head.elementor-sticky--active .logo img {
    width: 50px !important;
    height: auto !important;
}

.head.elementor-sticky--active .titilePage {
    display: none;
}

/* Style formularza */
.formularz {
    background-color: #F0F0F0;
    padding: 20px
}
.form-row {
    gap: 20px;
}
.f-width {
    width: 100%;
}
.h-width { 
    flex-direction: row;
    width: 50%; 
    position: relative;
}
.formularz label {
    color: #666666;
}
.formularz placeholder{
    color: #666666;
}
.formularz select{
    color: #666666;
}
.formularz .wpcf7-spinner {
	margin: 0 -50px 0 24px;
}

.formularz input[type="text"], input[type="number"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type=reset], input[type=tel], input[type=date], select, textarea {
    background: transparent;
    border-radius: 0px !important;
    border: solid 0px #666666 !important;
    border-bottom: solid 1px #666666 !important;
    margin-bottom: 20px !important;
}

.formularz input:focus-visible + label {
	color: #102768 !important;
}

.formularz input[type=date]:focus, input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=url]:focus, select:focus, textarea:focus {
    border-radius: 0px;
    border: solid 0px #102768 !important;
    border-bottom: solid 1px #102768;
}
.submit {
	margin-top: 30px;
    justify-content: flex-end;
}
.formularz input[type=submit] {
    border-radius: 0px;
    padding: 12px 69px 12px 18px !important;
    background: #102768 url('/wp-content/themes/nota/img/zapytanie-o-oferte.svg') no-repeat right center !important;
	background-size: contain;
    transition: all 0.7s ease-out;
    color: #fff !important;
}

.formularz [type=submit]:disabled {
	opacity: 0.8;
}

.formularz input[type=submit]:hover {
    background: #fff url('/wp-content/themes/nota/img/zapytanie-o-oferte.svg') no-repeat right center !important;
    color: #102768 !important;
    transition: all 0.7s ease-out;
	cursor: url('/wp-content/themes/nota/img/cursorBlue.svg') 10 10, pointer !important;
}

.formularz input:hover,
.formularz textarea:hover,
.formularz select:hover {
  cursor: url('/wp-content/themes/nota/img/cursorBlue.svg') 10 10, pointer;
}

.formularz .wpcf7 form.invalid .wpcf7-response-output {
	color: #102768;
}


/* Style przycisków */
.btnPhone a{
    background: url('/wp-content/themes/nota/img/Phone.svg') no-repeat right center;
}

.btnPhone a:hover {
    padding-right: 79px;
}

.btnMail a{
    background: url('/wp-content/themes/nota/img/Mail.svg') no-repeat right center;
}

.btnMail a:hover {
    padding-right: 79px;
}

.btnOfferWhite a{
    background: #00103E url('/wp-content/themes/nota/img/zapytanie-o-oferte.svg') no-repeat right top !important;
}

.btnOfferWhite a:hover {
    background: #fff url('/wp-content/themes/nota/img/zapytanie-o-oferte.svg') no-repeat right center !important;
    color: #102768 !important;
}

.btnOfferBlue a{
    background: #F0F0F0 url('/wp-content/themes/nota/img/offerBlue.svg') no-repeat right top !important;
}

.btnOfferBlue a:hover {
    background: #102768 url('/wp-content/themes/nota/img/offerBlue.svg') no-repeat right center !important;
    color: #fff !important;
}

.btnDwnld a{
    background: #F0F0F0 url('/wp-content/themes/nota/img/dwonload.svg') no-repeat right top !important;
}

.btnDwnld a:hover {
    background: #102768 url('/wp-content/themes/nota/img/dwonload.svg') no-repeat right center !important;
    color: #fff !important;
}

.btnArrow a{
    background: url('/wp-content/themes/nota/img/arrowRight.svg') no-repeat right center;
}

.btnArrowKafel {
	display: inline-block;
	width: 65px; 
	height: 65px;
	background: url('/wp-content/themes/nota/img/ButtonArrow.svg') no-repeat center;
	background-size: cover;
}

.btnArrowKafel:hover {
	background-image: url('/wp-content/themes/nota/img/ButtonArrowHover.svg');
	width: 75px;
}

.kafle {
    width: 100%;
    justify-content: space-between;
}

.singleKafel {
    align-items: center;
    gap: 8px;
}
.kafelTekst {
    gap: 0;
}

.kafelTekst .duzaLitera {
    font-size: 36px;
    font-weight: 700;
    margin-right: -4px;
}

.kafelTekst {
    font-weight: 800;
}


/* Style akordeonu FAQ */
.faq-accordion {
    margin: 0 auto;
    border-top: 2px solid #F0F0F0;
}

.faq-button  {
    padding: 10px 0px !important;
}

.faq-item {
    border-bottom: 2px solid #F0F0F0;
    max-
}

.faq-header {
    max-width: 100%;
}

.faq-button p {
    margin: 0;
    font-size: 1.1em;
    font-weight: 600;
    max-width: 90%;
}

button.faq-button {
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    outline: none;
    cursor: url('/wp-content/themes/nota/img/cursorBlue.svg') 10 10, pointer !important;
    color: #1a1a1a;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    white-space: wrap;
}

.faq-number {
    color: #102768;
    font-weight: 600;
    margin-right: 8px;
}

.faq-arrow {
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease;
}

.faq-button.active .faq-arrow {
    transform: rotate(180deg);
}

.faq-body {
    padding: 0 20px 20px 20px;
    color: #444;
    line-height: 1.6;
    font-size: 15px;
}

.faq-collapse {
    display: none;
}

.faq-collapse.active {
    display: block;
}

.faq-body p:last-child {
    margin-bottom: 0;
}

/* kafel produktu */
.additional {
    display: none !important;
}

.produktyGrid {
	gap: 20px;
	justify-content: space-between;
}

.produktLink {
	max-width: 30%;
	flex: 1;
}

.kafelProdukt img {
	width: 80% !important;
	aspect-ratio: 1/1;
	object-fit: cover;
	align-self: center;
}

.OpisProduktu {
	gap: 20px;
	flex: 1 80px;
}

.kafelProdukt:hover .additional {
    display: block !important;
}

.btnArrowKafel {
	display: inline-block !important;
	width: 65px !important;
	height: 65px !important;
	background: url('/wp-content/themes/nota/img/ButtonArrow.svg') no-repeat center !important;
	background-size: cover !important;
}

.kafelProdukt:hover .btnArrowKafel {
	background-image: url('/wp-content/themes/nota/img/ButtonArrowHover.svg') !important;
	height: 65px !important;
	width: 75px !important;
}

/* Kafel wpisa na blogu */
.wpisBlog:hover .divData {
    background-color: #fff !important;
}

.wpisBlog:hover time {
    color: #102768 !important;
}

.wpisBlog:hover .divTresc {
    background-color: #102768 !important;
}

.wpisBlog:hover .divTresc h3, .wpisBlog:hover .divTresc p {
    color: #fff !important;
}

.wpisBlog:hover .divTresc h3::after {
    content: "➞";
    margin-left: 5px;
}

/* Kafel kategorii */
.kafelKategoria:hover .btnArrow a {
    background-color: #102768 !important;
    color: #fff !important;
}

/* Kafel Kategorii Home */
.productCategoriesGrid {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 30px;
    position: relative;
    justify-content: space-between;
    flex: 1;
}

.productCategoryBox {
    position: relative;
    width: 31%;
    filter: drop-shadow(2px 8px 10px rgba(0, 0, 0, 0.25));
}

.productCategoryBox:hover {
    filter: none;
}

.productCategoryImage img {
    width: 100% !important;
    height: 295px !important;
    object-fit: cover !important;
}

.productCategoryContent {
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 100%;
    text-align: left;
}

.productCategoryContent h3 {
    font-size: 16px !important;
    line-height: 1em !important;
    margin-block-start: 0;
    margin-block-end: 0;
    text-align: left;
    background: #F0F0F0 url('/wp-content/themes/nota/img/arrowRight.svg') no-repeat right center;
    padding: 13px 60px 13px 10px;
    width: 100% !important;
    white-space: wrap;
}

.productCategoryBox:hover h3 {
    background: #102768 url('/wp-content/themes/nota/img/arrowRight.svg') no-repeat right center;
    color: #fff;
}

/* Stowarzyszenia */
.associations {
    justify-content: center;
    align-content: center;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.home .association {
	width: 45%;
	
}

.association {
    background: var(--lightGrey);
    padding: 10px;
    width: 70%;
	align-items: center;
}

.association:hover {
    transform: translate(-2px,-2px);
    
}


/* Style treści elastycznej */

.trescTekstowa>div {
	gap: 20px;
}
.ColTresc {
	justify-content: space-between;
	gap: 20px;
}

.buttons {
	gap: 40px;
}

.tabelka {
	gap: 20px;
	align-items: center;
	padding: 20px;
	background: #F0F0F0;
	filter: drop-shadow(4px 8px 8.4px rgba(0,0,0,0.25));
	box-sizing: content-box !important;
	align-items: flex-start !important;
	overflow-x: scroll !important;
}

.tabelka table, tbody, thead, th, tr, td {
	border-width: 0px !important;
	border-color: transparent !important;
}

.tabelka table tbody>tr:nth-child(odd)>td {
	background-color: #fff !important;
}

.tabelka th {
	text-align: left;
}

.tabelka .TableRys {
	margin-top: 20px;
}

.backG {
	position: absolute; 
	width: 100vw;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	height: 300px !important;
}


.blokIkonek {
	z-index: 1;
	padding: 50px 0;
}

.kafle {
	justify-content: space-between;
	gap: 40px;
}

.kafelek {
	background: #fff;
	filter: drop-shadow(4px 8px 8.4px rgba(0,0,0,0.25));
	max-width: 30%;
	padding: 40px 20px;
}

.kafelek:hover {
	filter: none;
}

.kafelTitle {
	gap: 20px;
	align-items: flex-start;
	width: 50%;
}

.kafelTitle h3 {
	font-weight: 600 !important;
	margin-top: -10px !important;
}

.formSide p {
	width: 70%;
	font-weight: 500;
	margin-bottom: 20px !important;
}

.BlokTaelka {
	overflow-x: scroll;
}

/* style paginacji Blog */
.blogPagination .page-numbers {
    padding: 10px 15px !important;
    background-color: #19306e !important;
    filter: drop-shadow(2px 2px 2px rgba(0,0,0,0.5)) !important;
    transition: all 0.7s ease !important;
}

.blogPagination .page-numbers:hover {
    filter: drop-shadow(2px 2px 2px rgba(0,0,0,0)) !important;
    transition: all 0.7s ease !important;
}

.blogPagination .page-numbers.current {
	background-color: #333333 !important;
}

.ColImg {
	padding: 30px;
}

.ColImg img {
	padding: 30px;
}

/* --- Responsywność --- */
@media only screen and (max-width: 1440px) {
	.formSide p {
		width: 90%;
	}
}
@media only screen and (max-width: 1140px) {
    .productCategoryBox {
        position: relative;
        width: 47%;
        filter: drop-shadow(2px 8px 10px rgba(0, 0, 0, 0.25));
    }
	.formSide p {
		width: 100%;
	}
	.trescFormularz>div {
		flex-wrap: wrap;
		gap: 50px;
	}
	.trescFormularz .hWidth {
		width: 100% !important;
	}
	.produktLink {
	max-width: 47%;
	flex: 1;
}
	.ColImg {
		padding: 0;
	}
}