@import url('https://fonts.googleapis.com/css2?family=Cabin+Condensed:wght@400;700&family=Work+Sans:ital,wght@0,400;0,700;1,400&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap');

* { margin: 0; padding: 0; box-sizing: border-box }
html { font-size: 30px }
body { font-family: 'Work Sans', sans-serif; }
.wrapper { max-width: 1000px; margin: 0 auto }
.fc { display: flex; flex-flow: row wrap }
.content-padding { padding: 0 20px }
.mt-0 { margin-top: 0 }

figure { margin: 1.5rem auto }
figcaption { text-align: center; font-size: .8rem; margin: .5rem 0 }
.fullwidth img { width: 100% }


header { background-image: url('ozonosfertotlenites/header-kek.jpg'); background-repeat: repeat; background-attachment: fixed;}
header .wrapper { align-items: center; justify-content: space-evenly }
header img { margin: 0 10px 0 0 }
h1 { font-family: 'Roboto', sans-serif; font-size: 2rem;  color: #63c6da; text-shadow: .1rem .1rem #3750a3;  text-align:center }
h1 span { display: block; font-weight: 400; font-size: 2.3rem; text-shadow: .1rem .1rem #3750a3; text-align:center }

main { padding: 2rem 0 }
main a { display: inline-block; color: #51a2db; text-decoration: none; }

h2 {  font-size: 2.3rem; }
h3 { font-size: 2rem; text-shadow: .05rem .05rem #3750a3 }
h2, h3 { color: #51a2db; text-align: center; font-family: 'Roboto', sans-serif; margin: 3rem 0 1rem 0; }
.blog { margin-top: 200px; }
p { margin: 1.5rem 0; line-height: 1.7; }
.center { text-align: center }
dd { margin: 0.3rem 0rem 0rem 0.6rem; }
dt { margin-top: 1rem; }


span.red { color: red }
span.green { color: green }
span.braun { color: #A0522D }
span.orange { color: orange }
span.blue { color: #51a2db }



.price-box { background: #e6f7ff; padding: 1rem 2rem; margin: 0 0 .5rem 0; align-items: flex-start; }
.price-box .left { flex: 1 }
.price-box .right { flex-basis: 40%; text-align: right; line-height: 0 }
.price-box .right p { margin-top: 0; font-size: 1.2rem }
.price-box .right img { width: 100% }
.price-box .left p:first-of-type { margin-top: 0; font-size: 1.2rem }

.box { border: 10px solid #63c6da; border-radius: 0px 70px 0 70px; margin: 0 0 2rem 0 }
.box h3 { margin-top: 0; text-align: left; font-size: 1.5rem }
.box .left { flex: 1; padding: 1rem }
.box .right { flex-basis: 40%; text-align: right; line-height: 0; padding-top: 2rem; align-self: flex-end; }
.box .right img { width: 100% }

address { margin: 100px 0; }
.icon-link { font-size: 2.5rem; display: flex; align-items: center; justify-content: center; height: 400px }
.icon-link a { color: #000; text-shadow: none; display: block }
.icon-link a:hover { color: grey; transform: none }
.icon-link.phone { height: 200px; background: url('lakas-fertotlenites-ozonnal/telefon.jpg') center center no-repeat }


.fb-like { width: 260px; margin: 0 auto; display: block !important }
.fb-page { width: 260px; margin: 0 auto; display: block !important }


footer { background-image: url('ozonosfertotlenites/footer-kek.jpg'); background-repeat: repeat; background-size: auto 100%; background-attachment: fixed; height: 150px; padding-top: 20px; }
footer .wrapper { align-items: center; justify-content: space-evenly }
footer img { margin: 0 10px 0 0; max-height: 100px; }
footer p { font-size: .8rem;  color: #ffffff; text-align:center }


@media(max-width:999px) {
	
	header img 	   { margin: 0 .5rem 0 0; max-width: 220px; }
	h1 { font-size: 1.8rem; }
	h1 span { font-size: 1.6rem; }
	h2 { font-size: 1.6rem; }
	h3 { font-size: 1.4rem; }
	.content-padding { padding: 0 10px }
}

@media(max-width:800px) {
	.icon-link.mail { font-size: 1.3rem; }
	.content-padding { padding: 0 6px; }
	.box { border-bottom-left-radius: 0; }
	.box .left,
	.box .right { flex-basis: 100%; }
	.box .left { padding-bottom: 0; }
	.box .right { padding: 0; }
	
	html { font-size: 22px; }
	header img { max-width: 200px; }
}
@media(max-width:500px) {
	
	html { font-size: 20px; }
	
}