/*create by Clean Style*/
/* ================================= MAIN =================================*/
html, body { height:100%;}
body { background:#ffffff; margin:0; padding:0; font-size:16px; font-family: 'Ubuntu', sans-serif; color:#212529; min-height:100%; height:auto!important; height:100%; position:relative; line-height: 30px;}
img {border:none; outline:none;}
a {outline-style: none; color:#212529;}
a:hover {color:#212529;}
.clear { clear:both; font-size:0; line-height:0;}

/*font-family: 'Oranienbaum', serif;
font-family: 'Ubuntu', sans-serif;*/

h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 28px;}
h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 24px;}
h3 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 20px; font-weight: 700;}
h4 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 18px; font-weight: 700;}
h5 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 16px; font-weight: 700;}
h6 {}

#container {margin:0 auto; padding:0; position: relative; overflow:hidden;}

/* ================================= header =================================*/
.top {position: fixed; width: 100%; top: 0px; left: 0px; z-index: 1000; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1); /*background: #2A4B6D;*/}
.top .logo {height: 70px; margin: 5px 0;}
.top .contacts {line-height: 40px; margin: 20px 0;}
.top .contacts a {text-decoration: none; font-size: 16px; color: #fff;}
.top .contacts i {font-size: 16px; display: inline-block; width: 40px; text-align: center; line-height: 38px; height: 40px; border: 1px solid #B8B8B8; border-radius: 5px; margin: 0 5px;}

.menu {display: none; position: fixed; left: 0px; top: 80px; width: 100%; z-index: 1001; background: #ffffff; box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);}
.menu li {display: inline-block; width: 100%;}
.menu a {color: #2A4B6D; text-decoration: none; font-family: 'Oranienbaum', serif; font-size: 22px; line-height: 60px; padding:0 15px; display: block; transition: background .3s, color .3s;}
.menu a:hover {background: #2A4B6D; color: #ffffff;}
.menu a.active {background: #2A4B6D; color: #ffffff;}

/* ================================= content ================================*/
.btn {display: inline-block; font-weight: 700; line-height: 50px; color: #ffffff; text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; background-color: transparent; padding:0 30px; font-size: 1rem; border-radius: 5px; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; text-transform: uppercase;}
.btn-primary {color: #fff; background-color: #2A4B6D; border-color: #2A4B6D;}
.btn-primary:hover {color: #fff; background-color: #114c8a; border-color: #075db8;}
.btn-check:active + .btn-primary, .btn-check:checked + .btn-primary, .btn-primary.active, .btn-primary:active {color: #fff; background-color: #075db8; border-color: #066ad4; box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}
.btn-check:focus + .btn-primary, .btn-primary:focus {color: #fff; background-color: #114c8a; border-color: #075db8; box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}
.btn-primary.active:focus, .btn-primary:active:focus {box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}

.btn-secondary {color: #fff; background-color: #9D9D9D; border-color: #9D9D9D;}
.btn-secondary:hover {color: #fff; background-color: #646464; border-color: #646464;}
.btn-secondary:active + .btn-secondary, .btn-check:checked + .btn-secondary, .btn-secondary.active, .btn-secondary:active, .show > .btn-secondary.dropdown-toggle {color: #fff; background-color: #373737; border-color: #373737;}
.btn-check:focus + .btn-secondary, .btn-secondary:focus {color: #fff; background-color: #646464; border-color: #646464; box-shadow: 0 0 0 .25rem rgba(9,15,36,.5);}
.btn-check:active + .btn-secondary:focus, .btn-check:checked + .btn-secondary:focus, .btn-secondary.active:focus, .btn-secondary:active:focus, .show > .btn-secondary.dropdown-toggle:focus {box-shadow: 0 0 0 .25rem rgba(9,15,36,.5);}

.btn-online {color: #2A4B6D; background-color: #ffffff; border-color: #2A4B6D;}
.btn-online:hover {color: #2A4B6D; background-color: #f8f9fa; border-color: #f8f9fa;}
.btn-check:active + .btn-online, .btn-check:checked + .btn-online, .btn-online.active, .btn-online:active {color: #fff; background-color: #075db8; border-color: #066ad4; box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}
.btn-check:focus + .btn-online, .btn-online:focus {color: #fff; background-color: #114c8a; border-color: #075db8; box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}
.btn-online.active:focus, .btn-online:active:focus {box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}

.btn-question {color: #fff; border-color: #f8f9fa;}
.btn-question:hover {color: #2A4B6D; background-color: #f8f9fa; border-color: #f8f9fa;}
.btn-check:active + .btn-question, .btn-check:checked + .btn-question, .btn-question.active, .btn-question:active {color: #fff; background-color: #075db8; border-color: #066ad4; box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}
.btn-check:focus + .btn-question, .btn-question:focus {color: #fff; background-color: #114c8a; border-color: #075db8; box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}
.btn-question.active:focus, .btn-question:active:focus {box-shadow: 0 0 0 .25rem rgba(7, 93, 184, .5);}

.navButton {line-height: 80px; font-size: 24px; cursor: pointer; color:#fff;}

.breadcrumb {margin-top: 80px;}
.breadcrumb ul {padding: 15px 0;}
.breadcrumb li {display: inline-block; list-style: none; line-height: 30px; }
.breadcrumb li a {text-decoration: none; transition: color .3s;}
.breadcrumb li a:hover {color: #55A630;}
.breadcrumb .fa-solid {color: #9c9c9c;}

.checkbox input[type="checkbox"] {display: none; opacity: 0;}
.checkbox input[type="checkbox"] + label {font-size: 16px; transition: color .3s;}
.checkbox input[type="checkbox"] + label:hover {color: #2A4B6D; cursor: pointer; text-decoration: underline;}
.checkbox input[type="checkbox"] + label:before {content: '\f0c8'; font-family: "Font Awesome 6 Free"; font-weight: 400; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; margin-right: 10px;}
.checkbox input[type="checkbox"]:checked + label {color: #2A4B6D; font-weight: 700;}
.checkbox input[type="checkbox"]:checked + label:before {content: '\f14a'; color: #2A4B6D;}

.categories .data {border-radius: 5px; border: 1px solid #B8B8B8; text-align: center; width: 100%; min-height: 190px; position: relative; z-index: 300;}
.categories .data .text {font-size: 15px; position: absolute; left: 0px; width: 100%; bottom: 5px; transition: color .3s; line-height: 16px;}

.categories .layer_1 {position: absolute; width: 100%; height: 190px; border-radius: 8px; border: 1px solid rgba(184, 184, 184, 0.0); background: #ffffff; left: 0px; top: 0px; z-index: 100; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.0); transition: left .4s, top .4s, width .4s, height .4s, box-shadow .5s, border .5s;}
.categories .layer_2 {position: absolute; width: 100%; height: 190px; border-radius: 6px; border: 1px solid rgba(184, 184, 184, 0.0); background: #ffffff; left: 0px; top: 0px; z-index: 101; transition: left .2s, top .2s, width .2s, height .2s, border .2s;}

.categories .item:hover .layer_1 {left: -6px; top: -6px; width: calc(100% + 12px); height: 202px; box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15); border: 1px solid rgba(184, 184, 184, 0.3)}
.categories .item:hover .layer_2 {left: -3px; top: -3px; width: calc(100% + 6px); height: 196px; border: 1px solid rgba(184, 184, 184, 0.6);}

.categories .item:hover .text {color: #2A4B6D;}
.categories a {text-decoration: none; display: inline-block;}

.slideshow .container {box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.3);}
.slideshow .carousel-control-prev i, .carousel-control-next i {background: #212529; width: 40px; height: 40px; line-height: 40px; border-radius: 5px;}
.slideshow .carousel-indicators {margin-bottom: 10px;}
.slideshow .carousel-indicators [data-bs-target] {width: 16px; height: 16px; border-radius: 8px; background:#D9D9D9; border: none;}
.slideshow .carousel-inner .caption {width: 100%; position: absolute; left: 0px; bottom: -90px; height: 90px; background: rgba(232, 232, 232, 1); color:#212529; font-family: 'Oranienbaum', serif; font-size: 20px; text-align: center; padding-top: 10px;}
.slideshow {overflow: hidden; margin-top: 80px; min-height: 300px;}
.slideshow .carousel-item {background-size: cover; background-position: center center; background-repeat: no-repeat; min-height: 300px;}
.slideshow .carousel-inner {/*filter: drop-shadow(0px 0px 100px #000000);*/ padding-bottom: 90px;}

.calculator {}
.calculator .title {font-family: 'Oranienbaum', serif; font-size: 24px; color: #2A4B6D;}
.calculator .subtitle {font-size: 16px; color: #2A4B6D; font-weight: bold;}
.calculator	.select {overflow: hidden; border: 1px solid rgba(184, 184, 184, 0.6); border-radius: 5px; background: #ffffff; line-height: 40px; padding: 0 10px; position: relative; cursor: pointer;}
.calculator	.select:after {content: '\f0d7'; font-family: "Font Awesome 6 Free"; font-weight: 900; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 40px; margin-right: 10px; position: absolute; right: 10px; top: 0px;}
.calculator	.select select {width: calc(100% + 40px); border: none; background: none; cursor: pointer; height: 40px; line-height: 40px;}
.calculator .total {color: #2A4B6D; font-size: 24px; font-weight: bold; line-height: 54px;}
.calculator .help {font-size: 16px; font-style: italic; color: #2A4B6D; line-height: 18px;}

.services {}
.services .item {position: relative; transition: box-shadow .4s; border-radius: 5px; overflow: hidden;}
.services .item img {position: relative; z-index: 100;}
.services .item .text {position: absolute; left: 0px; bottom: 10px; width: calc(100% - 20px); z-index: 200; color: #ffffff; text-align: center; line-height: 40px; background: rgba(0, 0, 0, .5); margin-left: 10px; margin-right: 10px; border-radius: 5px;}
.services .item:hover {box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.2)}

.list {}
.list .item {}
.list .item .image {position: relative;}
.list .item .description a {color: #2A4B6D; line-height: 24px; height: 72px; display: inline-block; text-decoration: none;}
.list .item .price {font-size: 20px; font-weight: bold; line-height: 50px;}
.list .item .link {width: 0; height: 0; position: absolute; left: 50%; top: 50%; background: rgba(42, 75, 109, 0.5); border-radius: 50%; overflow: hidden; transition: width .3s, height .3s, left .3s, top .3s, border-radius .3s;}
.list .item .link a {color: #ffffff; font-size: 30px; display: inline-block; width: 100%; height: 100%; text-align: center; padding-top: calc(75%/2 - 15px); opacity: 0; transition: opacity .3s;}
.list .item:hover .link a {opacity: 1;}
.list .item:hover .link {width: 100%; height: 100%; left: 0px; top: 0px; border-radius: 0.375rem;}

.productImages {margin-top: 95px;}

.topCategories {}
.topCategories .item {}
.topCategories .image {transform: scale(0.9); transition: transform .3s;}
.topCategories .text {text-align: center;}
.topCategories .text a {text-decoration: none; color: #2A4B6D; font-size: 18px; font-weight: 300;}
.topCategories .item:hover .image {transform: scale(1.0);}

.information {min-height: 400px;}
.information .contacts {}
.information .contacts label {line-height: 40px;}

.description img {border-radius: 5px; width: auto!important; max-width: 100%;}
.description ul {}
.description ul li {list-style: disc; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);}
.description ul li:last-child {border-bottom: none;}

.mainContacts {}
.mainContacts li {margin-bottom: 15px;}
.mainContacts i {font-size: 16px; display: inline-block; width: 40px; text-align: center; line-height: 38px; height: 40px; border: 1px solid #B8B8B8; border-radius: 5px; margin: 0 5px;}
.mainContacts a {text-decoration: none; color: #2A4B6D;}
.mainContacts span {font-weight: 500; color: #2A4B6D;}

.gallery {}
.gallery .item {}
.gallery .item .image {position: relative;}
.gallery .item .description a {color: #2A4B6D; line-height: 24px; height: 72px; display: inline-block; text-decoration: none;}
.gallery .item .link {width: 0; height: 0; position: absolute; left: 50%; top: 50%; background: rgba(42, 75, 109, 0.5); border-radius: 50%; overflow: hidden; transition: width .3s, height .3s, left .3s, top .3s, border-radius .3s;}
.gallery .item .link a {color: #ffffff; font-size: 30px; display: inline-block; width: 100%; height: 100%; text-align: center; padding-top: calc(75%/2 - 15px); opacity: 0; transition: opacity .3s;}
.gallery .item:hover .link {width: 100%; height: 100%; left: 0px; top: 0px; border-radius: 0.375rem;}
.gallery .item:hover .link a {opacity: 1;}
.gallery .video {position: relative;}
.gallery .video:before {content: '\f167'; font-family: "Font Awesome 6 Brands"; font-weight: 900; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 100%; position: absolute; width: 100%; text-align: center; color: #ff0000; height: 100%; font-size: 50px; top: calc(50% - 25px);}
.gallery ul {}
.gallery ul li {list-style: disc;}

#g_captch > div {margin: 0 auto;}
.g-recaptcha  {width: 100%;}
.g-recaptcha > div {margin: 0 auto;}

.modal-header a {cursor: pointer;}

.options {padding: 15px 0;}
.options .radio {display: inline-block;}
.options .radio input[type="radio"] + label {color:#fff; padding: 0px 15px; border-radius: 20px; border:1px solid #fff; text-decoration: none; line-height: 40px; display: inline-block; cursor: pointer; height: 40px; transition: background .3s, color .3s;}
.options .radio input[type="radio"] + label:hover {background: #fff; color: #212529;}
.options .radio input[type="radio"]:checked + label {background: #fff; color: #212529;}
.options .radio input[type="radio"] {display: none;}

/* ================================= footer =================================*/
.footer {}
.footer img {max-width: 130px;}
.footer ul {margin: 0px; padding: 0px;}
.footer ul li {display: inline-block;}
.footer ul li a {color: #ffffff; display: inline-block; height: 40px; line-height: 40px; border-radius: 5px; border: 1px solid #ffffff; text-align: center; margin: 0 3px; transition: color .3s, background .3s; text-decoration: none; padding: 0 10px;}
.footer ul li a:hover {background: #ffffff; color: #212529;}





@media (min-width: 576px) { 
	h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 30px;}
	h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 26px;}
	h3 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 22px; font-weight: 700;}
	h4 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 20px; font-weight: 700;}
	h5 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 18px; font-weight: 700;}

	.slideshow .carousel-inner .caption {height: 90px; font-size: 20px; padding-top: 15px;}
}

@media (min-width: 768px) {
	h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 32px;}
	h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 28px;}
	h3 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 24px; font-weight: 700;}
	h4 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 22px; font-weight: 700;}
	h5 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 20px; font-weight: 700;}

	.slideshow {min-height: 400px;}
	.slideshow .carousel-item {min-height: 400px;}
	.slideshow .carousel-inner .caption {height: 90px; font-size: 24px; padding-top: 20px;}
}

@media (min-width: 992px) {
	h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 36px;}
	h2 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 32px;}
	h3 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 28px; font-weight: 700;}
	h4 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 26px; font-weight: 700;}
	h5 {color: #2A4B6D; font-family: 'Oranienbaum', serif; font-size: 24px; font-weight: 700;}

	.slideshow {min-height: 500px; margin-top: 0px;}
	.slideshow .carousel-item {min-height: 500px;}

	.top {position: static; box-shadow: none;}

	.menu {display: inline-block; position: static;}
	.menu li {display: inline-block; width: auto;}

	.breadcrumb {margin-top: 0px;}

	.productImages {margin-top: 1rem;}
}

@media (min-width: 1200px) {
	.menu a {padding: 0 30px;}
}

@media (min-width: 1400px) {

}