/* RESET */

body,h1,h2,h3,h4,h5,h6,form,fieldset,img,td,th,table,ul,p {margin:0;padding:0;border:0;}
body {font-size: 0.625em; font-family: 'Roboto', sans-serif;}

/* FOR ALL */
html {background: #70572F;}
.clear {clear: both;}
.fl {float: left;}
.fr {float: right;}
.ftl {text-align: left;}
.ftr {text-align: right;}
.fb {font-weight: 900;}
.ft {font-weight: 100;}
.center {margin: 0 auto;}
.wrapper {max-width: 1024px; margin: 0 auto; text-align: center; position: relative;}
img {max-width: 100%;}
h1 {font-size: 4em; font-weight: 900;}

/* CONTENT */

.scroll-it {display: block; position: absolute; width: 107px; height: 74px; background: url('/media/images/scroll-it.png') left top no-repeat; cursor: pointer; right: 10%; top: 40%;}

.container-1 {width: 100%; padding: 27px 0 85px; background: #E7F2F6 url('/media/images/cloud-bg.png') center top no-repeat; position: relative;}
.container-1 .energy {background: url('/media/images/light-1.png') center top no-repeat; min-height: 300px; padding-top: 110px; margin-top:-37px;}
.container-1 .energy span.first {font-size: 9.2em; color: #B1C635; line-height: 110px;}
.container-1 .energy span.secound {font-size: 8.5em; color: #3E8540; line-height: 102px;} 
.container-1 .text {font-size: 4em; color: #136C8C;}

.container-2 {width: 100%; background: #B1C635 url('/media/images/triangle-1.png') center top no-repeat; padding-bottom: 92px; color: #3F8540;}
.container-2 .wrapper {background: url('/media/images/question-mark.png') right 97px top no-repeat;}
.container-2 h1 {padding: 147px 0 63px;}
.container-2 p {font-size: 2.5em;}
.container-2 img {margin: 30px 0;}

.container-3 {width: 100%; background: #3E8540 url('/media/images/triangle-2.png') center top no-repeat; padding: 148px 0 105px;}
.container-3 h1 {color: #265126; padding-bottom: 54px;}
.container-3 .cloud {font-size: 8em; color: #fff; background: url('/media/images/cloud.png') center top no-repeat; line-height: 80px; padding: 84px 52px 166px 54px;}
.container-3 p {font-size: 4em; color: #B1C533; padding-top: 30px;}

.container-4 {width: 100%; background: #146D8D url('/media/images/cieszyn-bg.jpg') center top no-repeat; padding: 151px 0 270px; color: #fff;}
.container-4 .wrapper {max-width: 1037px;}
.container-4 p {font-size: 3em; padding-top: 50px;}
.container-4 .apostrof {font-size: 3em; font-style: italic; position: relative; padding: 117px 0 36px 146px; text-shadow: 4px 4px 20px rgba(0, 0, 0, 1);}
.container-4 .apostrof img {position: absolute; left: -22px; top: 0;}

.container-5 {width: 100%; background: #146D8D; padding: 52px 0 120px;}
.container-5 h1 {color: #0C3B4D;}
.container-5 ul {list-style: none; font-size: 2.5em; color: #E6F2F6; padding-top: 70px; font-weight: 700;}
.container-5 ul li {background: url('/media/images/li-green.png') left center no-repeat; padding: 30px 0 30px 126px;}

.container-6 {width: 100%; background: #E7F2F6 url('/media/images/triangle-4.png') center top no-repeat; padding: 60px 0 134px;}
.container-6 .text {padding: 119px 0 40px; background: url('/media/images/sick-leaf.png') left top no-repeat;}
.container-6 h1 {max-width: 580px; color: #136C8C;}
.container-6 .old-building {position: relative; padding-top: 138px;}
.container-6 .blue-cloud {padding: 50px 28px; position: absolute; top: -3px; right: 22px; background: url('/media/images/blue-cloud.png') center top no-repeat; font-size: 3em; color: #B1C533; line-height: 45px;}
.container-6 .list {background: url('/media/images/sick-leaf-2.png') right bottom 31px no-repeat;}
.container-6 p {font-size: 2.5em; color: #146D8D; padding: 30px 0;}
.container-6 ul {list-style: none; color: #136C8C; font-size: 3em; max-width: 400px;}
.container-6 ul li {background: url('/media/images/li-green.png') left center no-repeat; background-size: 53px 43px; padding: 0 0 20px 68px;}

.container-7 {width: 100%; background: #3E8540 url('/media/images/baszta-bg.jpg') center top no-repeat; padding: 243px 0 170px; text-shadow: 4px 4px 20px rgba(0, 0, 0, 1)}
.container-7 h1 {color: #B1C534;}
.container-7 ul {list-style: none; font-weight: 700; font-size: 2.5em; color: #fff; line-height: 38px; padding-top: 60px;}
.container-7 ul li {background: url('/media/images/li-green-glow.png') left center no-repeat; padding: 25px 0 25px 152px;}

.container-8 {width: 100%; background: #3E8540; padding: 80px 0 92px;}
.container-8 h1 {color: #265126;}
.container-8 .text {font-size: 2.5em; color: #fff; padding: 66px 0;}
.container-8 .anchor {font-size: 2.5em; color: #B1C533; max-width: 510px;}
.container-8 .anchor a {color: #fff; display: block; background: url('/media/images/anchor-bg.png') center top no-repeat; padding: 56px 102px 37px 62px; text-decoration: none; margin-top: 47px;}

.container-9 {width: 100%; background: url('/media/images/triangle-6.png') center top no-repeat, #fff url('/media/images/grass.png') left bottom repeat-x; padding: 137px 0;}
.container-9 p {font-size: 2em; color: #009746; padding-bottom: 40px;}
.container-9 img.kato-mobile {display: none;}

.footer {width: 100%; padding: 30px 0; font-family: 'Open Sans', sans-serif; color: #432D12; font-size: 1.5em;}
.footer .wrapper .block-1 {width: 36%; padding-right: 10%;}
.footer .wrapper .block-2, .footer .wrapper .block-3 {width: 27%}
.footer a {color: #432D12;}




/* RESPONSIVE */

@media only screen and (max-width: 1100px) {
	.scroll-it {display: none;}
}

@media only screen and (max-width: 800px) {
	.wrapper {width: 98%;}
	.container-2 .wrapper {background-position: right top;}
	.container-4 {padding: 100px 0 200px;}
	.container-7 {padding: 150px 0 170px;}
	.footer .wrapper .block-1 {width: 40%; padding-right: 6%;}
	
}

@media only screen and (max-width: 620px) {
	h1 {font-size: 3em;}
	.wrapper {width: 96%;}	
	.container-1 {padding-bottom: 40px;}
	.container-1 .energy {background-size: 330px 247px; min-height: 100px; margin-top: -16px; padding: 53px 0 40px;}
	.container-1 .energy span.first {font-size: 5.2em; line-height: normal;}
	.container-1 .energy span.secound {font-size: 4.8em; color: #3E8540; line-height: 51px;} 
	.container-1 .text {font-size: 4em; color: #136C8C;}
	.container-1 .text {font-size: 3em; width: 90%; margin: 0 auto;}	
	.container-2 {padding-bottom: 50px;}
	.container-2 .wrapper {background: none;}
	.container-2 h1 {padding: 100px 0 40px;}
	.container-2 p {font-size: 2em;}	
	.container-3 {padding: 100px 0 50px;}
	.container-3 p {font-size: 3em;}
	.container-4 {min-height: 645px;}
	.container-4 .apostrof {padding: 180px 0 36px 0px; font-size: 2.5em;}
	.container-4 .apostrof img {position: absolute; left: -22px; top: 0;}
	.container-4 p {font-size: 2em; padding-top: 50px;}
	.container-4 img {max-width: 240px;}	
	.container-5 {padding: 0 0 20px;}
	.container-5 img {max-width: 145px; padding-bottom: 15px;}
	.container-5 ul {padding-top: 25px; font-size: 2.2em;}
	.container-5 ul li {background-size: 53px 43px; background-position: left 15px center; padding: 20px 0 20px 100px;}	
	.container-6 {padding-bottom: 30px;}
	.container-6 .text {padding: 165px 0 40px;}
	.container-6 .list {background-position: right bottom; padding-bottom: 120px;}
	.container-6 p {text-align: left;}
	.container-6 ul {font-size: 2.2em; max-width: 400px;}
	.container-6 ul li {padding: 0 0 40px 68px; background-position: left top;}	
	.container-7 h1 {padding: 0 10%;}
	.container-7 {padding: 100px 0 110px; }
	.container-7 ul {font-size: 2em; color: #fff; line-height: 30px; padding-top: 60px;}
	.container-7 ul li {background-size: 73px 63px; padding: 20px 0 20px 100px;}		
	.container-8 {padding: 40px 0 80px;}
	.container-8 .text {font-size: 2em; line-height: 30px;}
	.container-8 .anchor {font-size: 2em;}
	.container-8 .anchor a {background-size: 100%; padding: 46px 87px 37px 62px; margin-top: 27px;}	
	.container-9 {padding: 100px 0;}
	.container-9 img.kato {display: none;}
	.container-9 img.kato-mobile {display: block;}	
	.footer {padding: 20px 0 0;}
	.footer .wrapper .block-1, .footer .wrapper .block-2, .footer .wrapper .block-3 {width: 100%; padding: 0 0 30px; text-align: left;}

}

@media only screen and (max-width: 480px) {
	
	.wrapper {width: 94%;}
	.container-4 {background-image: url('/media/images/cieszyn-bg-mobile.jpg'); padding-bottom: 150px; }
	.container-3 .cloud {font-size: 6em;}
	.container-7 {background-image: url('/media/images/baszta-bg-mobile.jpg'); min-height: 915px;}
}

@media only screen and (max-width: 470px) {
	.container-3 .cloud {background-size: 100%; line-height: 70px; padding: 55px 20px 105px 15px;}
	.container-6 .old-building {padding-top: 0;}
	.container-6 .old-building img {margin-top: -53px;}
	.container-6 .blue-cloud {padding: 27px 0px 80px; position: relative; top: auto; right: auto; background-size: 100%; font-size: 2.5em; line-height: 38px;}
}

@media only screen and (max-width: 330px) {
	h1 {font-size: 2.5em;}
	.container-1 .energy {background-size: 100%; padding: 53px 0 40px;}
	.container-1 .energy span.first {font-size: 4.2em;}
	.container-1 .energy span.secound {font-size: 3.8em;} 
	.container-3 .cloud {font-size: 5em; line-height: 60px;}
	.container-6 ul {font-size: 2em;}
	.container-7 ul {padding-top: 20px;}
	.container-8 .anchor a {padding: 40px 30px 37px 0; margin-top: 27px;}	

	
	

}