/* COLORS

sötétkék - #3d69b1
világosabbkék - #b7bfe2
sötétzöld - #95c45a
világosabbzöld - c0da9d

*/
a:hover { cursor: pointer !important; }

html {
  height: 100%;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}
h1, h2, h3 { font-family: "Poppins", sans-serif;}
h4, h5, p, a { font-family: "Noto-sans", sans-serif; }

#shady-background { background-color: #333; opacity: 0.8; display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100vh; z-index: 15; }
#shady-background #loading { display: none; position: absolute; left: 50%; top: 50%; transform: translate3d(-50%, -50%, 0); }
.lds-roller { display: inline-block; position: relative; width: 64px; height: 64px; }
.lds-roller div { animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; transform-origin: 32px 32px; }
.lds-roller div:after { content: " "; display: block; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #fff; margin: -3px 0 0 -3px; }
.lds-roller div:nth-child(1) { animation-delay: -0.036s; }
.lds-roller div:nth-child(1):after { top: 50px; left: 50px; }
.lds-roller div:nth-child(2) { animation-delay: -0.072s; }
.lds-roller div:nth-child(2):after { top: 54px; left: 45px; }
.lds-roller div:nth-child(3) { animation-delay: -0.108s; }
.lds-roller div:nth-child(3):after { top: 57px; left: 39px; }
.lds-roller div:nth-child(4) { animation-delay: -0.144s; }
.lds-roller div:nth-child(4):after { top: 58px; left: 32px; }
.lds-roller div:nth-child(5) { animation-delay: -0.18s; }
.lds-roller div:nth-child(5):after { top: 57px; left: 25px; }
.lds-roller div:nth-child(6) { animation-delay: -0.216s; }
.lds-roller div:nth-child(6):after { top: 54px; left: 19px; }
.lds-roller div:nth-child(7) { animation-delay: -0.252s; }
.lds-roller div:nth-child(7):after { top: 50px; left: 14px; }
.lds-roller div:nth-child(8) { animation-delay: -0.288s; }
.lds-roller div:nth-child(8):after { top: 45px; left: 10px; }
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* CLASSES */
.anim-03s { transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in-out; }
.anim-05s { transition: all 0.5s ease-in; -webkit-transition: all 0.5s ease-in-out; }
.anim-1s { transition: all 1s ease-in; -webkit-transition: all 1s ease-in-out; }

.mar-top-menu { margin-top: 70px; }
.mar-top-25 { margin-top: 25px !important; }
.mar-top-50 { margin-top: 50px !important; }
.mar-top-100 { margin-top: 100px !important; }
.mar-top-150 { margin-top: 150px !important; }
.mar-bot-25 { margin-bottom: 25px !important; }
.mar-bot-50 { margin-bottom: 50px !important; }
.mar-bot-100 { margin-bottom: 100px !important; }
.mar-100 { margin-top: 100px; margin-bottom: 100px; }
.mar-50 { margin-top: 50px; margin-bottom: 50px; }
.mar-25 { margin-top: 25px; margin-bottom: 25px; }
.mar-15 { margin-top: 15px; margin-bottom: 15px; }

.image-bg { background-position: 50%; background-size: cover; background-repeat: no-repeat; }
.parallax-bg { position: relative; overflow: hidden; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; height: 500px; width: 100%; margin: 70px 0 0 0; }

.inp-textarea { width: 100%; height: 100%; padding: 10px; }
input[type="text"] { width: 100%; padding: 10px; }

.hibas-adat { color: red; }

/*a, a:hover {text-decoration: none; color: #000;}*/

.flex-div { display: flex; }

.section-title h2 { display: inline-block; font-size: 3em; color: #713787; font-weight: 600; padding: 0 25px 25px 25px; border-bottom: 2px solid #713787; }
p { font-size: 1.2em; }

.divider-purple { background-color: #713787; height: 300px; box-shadow: 0 0 6px 0px #000; }
.ft-purple { color: #713787; }

.circles, .circle { position: absolute; }

.circles1-wrapper { top: 10%; left: 0; }
.circle1 { left: -50px; top: -50px; width: 150px; height: 150px; border-radius: 75px; background-color: #713787; }
.circle2 { left: 0px; top: 25px; width: 150px; height: 150px; border-radius: 75px; background-color: #9f66b5; }
.circle3 { left: -75px; top: 75px; width: 150px; height: 150px; border-radius: 75px; background-color: #c16de0; }

.circles2-wrapper { top: 42%; right: 0; }
.circle4 { right: 20px; top: -25px; width: 150px; height: 150px; border-radius: 75px; background-color: #713787; }
.circle5 { right: -50px; top: 25px; width: 150px; height: 150px; border-radius: 75px; background-color: #9f66b5; }
.circle6 { right: 25px; top: 75px; width: 150px; height: 150px; border-radius: 75px; background-color: #c16de0; }

.circles3-wrapper { top: 75%; left: 0; }
.circle7 { left: -125px; top: -25px; width: 250px; height: 250px; border-radius: 125px; background-color: #713787; }
.circle8 { left: -50px; top: 125px; width: 150px; height: 150px; border-radius: 75px; background-color: #9f66b5; }
.circle9 { left: 25px; top: 75px; width: 150px; height: 150px; border-radius: 75px; background-color: #c16de0; }

.circles4-wrapper { top: 90%; right: 0; }
.circle10 { right: -125px; top: -25px; width: 250px; height: 250px; border-radius: 125px; background-color: #713787; }
.circle11 { right: -50px; top: 125px; width: 150px; height: 150px; border-radius: 75px; background-color: #9f66b5; }
.circle12 { right: 25px; top: 75px; width: 150px; height: 150px; border-radius: 75px; background-color: #c16de0; }

/* MENU */

.navbar.anchor { background-color: rgba(133, 105, 138, 0.8); }
.navbar.anchor h1 { margin-top: 10px; color: #fff; }
.navbar.anchor ul { margin-top: 20px; }
.navbar.anchor ul li a { color: #fff; }

.navbar h1 { float: left; transition: margin 0.3s ease-in; color: #fff; }
.navbar ul { float: right; list-style-type: none; margin-top: 30px; }
.navbar ul li { display: inline-flex; padding-right: 25px; font-size: 1.3em; }
.navbar ul li a { color: #fff; }
.navbar ul li a:hover { color: #713787; text-decoration: none; }
.navbar ul li ul { display: none; width: auto; position: absolute; top: 40px; right: 120px; height: auto; background-color: rgba(133, 105, 138, 0.8); padding: 10px; }
.navbar ul li ul li { display: block; font-size: 0.8em; padding: 5px 10px; text-align: right; }

/* SLIDER */

#slider .swiper-slide { height: 60vh; position: relative; }
#slider .swiper-slide img { height: 100%; width: 100%; object-fit: cover; }
#slider .swiper-slide h2 { position: absolute; left: 10%; bottom: 10%; color: #713787; }

#slider .swiper-pagination .swiper-pagination-bullet { height: 15px; width: 15px; }
#slider .swiper-pagination .swiper-pagination-bullet-active { background-color: #713787; }

/* ABOUT US*/

#aboutUs { padding: 100px 0 200px 0; }
#aboutUs .icon-wrapper { display: flex; align-items: center; }
#aboutUs .icon-wrapper .text-icon { width: 150px; margin: 0px auto; }
#aboutUs p { font-size: 1.6em; line-height: 40px; }

#products { position: relative; overflow: hidden; }
#products .product-row { height: 400px; }
#products .product-row img { height: 100%; width: 100%; object-fit: contain; }
#products .product-row .text-wrapper { display: flex; align-items: center; }
#products .product-row .text-wrapper ul { list-style-type: none; }
#products .product-row .text-wrapper ul li { font-size: 1.2em; line-height: 30px; }

#products #otherProducts .text-wrapper { align-items: center; }
#products #otherProducts .text-wrapper ul { list-style-type: disc; }
#products #otherProducts .text-wrapper ul li { font-size: 1.2em; line-height: 30px; }
#products #otherProducts .text-wrapper ul li a { color: #000; }
#products #otherProducts .text-wrapper ul li a:hover, #products #otherProducts .text-wrapper ul li a.selected { color: #713787; text-decoration: none; }

#products #otherProducts .spec-wrapper { display: flex; align-items: center; }
#products #otherProducts .spec-wrapper img { max-width: 500px; max-height: 350px; object-fit: contain; margin: 0px auto; }
#products #otherProducts .spec-wrapper div { display: none; width: 100%; }
#products #otherProducts .spec-wrapper div:first-of-type { display: block; }
#products #otherProducts .spec-wrapper div p { margin: 0px auto; margin-top: 50px; }

/* CONTACT */

#contact .contact-wrapper { background-color: #777; color: #fff; padding: 50px 0; }
#contact .contact-wrapper .address-box { display: flex; align-items: center; }
#contact .contact-wrapper .address-box span { font-weight: 600; }
#contact .contact-wrapper .address-box a { color: #fff; }
#contact .contact-wrapper .address-box a:hover { color: #713787; text-decoration: none; }
#contact .contact-wrapper input[type="text"] { color: #000; }
#contact .contact-wrapper textarea { width: 100%; height: 150px; padding: 15px; color: #000; }
.submit { font-size: 1.3em; padding: 15px; border: none; background-color: #713787; color: #fff; float: right; transition: all 0.3s ease-in; -webkit-transition: all 0.3s ease-in; }
.submit:hover { opacity: 0.8; }

/* FOOTER */

footer {  background-color: #333; }
footer p { margin: 0; padding: 15px; color: #fff; font-size: 1em; }


/*LG*/
@media all and (max-width: 1440px) {

}
/*MD*/

@media all and (max-width: 1024px) {

}
/*SM*/
@media all and (max-width: 768px) {

}
/*XS*/
@media all and (max-width: 426px) {

}
@media all and (max-width: 375px) {

}
@media all and (max-width: 325px) {

}