/* FONTS ############################################################################ */

/* MAIN ############################################################################ */
	html, body{

		margin:0px;
		padding:0px;
		
	}
	html{
		overflow-y:auto!important;
	}
	.hidden{
		position:fixed;
		left:-9999px;
		top:-9999px;
	}
	
	body{
		overflow:hidden!important;
		font-family:Verdana, Geneva, sans-serif;
		color:#474747; /*DARK GRAY*/
		background-repeat: no-repeat;
		background-position:center center; 
		background-attachment:fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		text-align:center;
	}
	body.bg_home{
		background-image: url(../images/backgound.jpg);
	}

	
	
	body.bg_page{
		background-image: url(../images/background2.jpg);
	}
	
	@media all and (max-width:641px) {
		body.bg_home{
			padding-bottom: 30px;
		}
		body.bg_page{
			padding-bottom: 70px;
		}
	}
	
	
	#kredki_left{
		position:absolute;
		left:0px;
		bottom: 0px;
		width: 23%;
		top: 0;
margin: auto;
	}
	#kredki_right{
		position:absolute;
		right:0px;
		bottom: 0px;
		width: 23%;
		top: 0;
margin: auto;
	}
	.kredki{
		
	}
	@media all and (max-width:1044px) {
		.kredki{
			display: none;
		}
	}
	#logo{
		  -webkit-filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.5));
		filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.5));
	}
	.flag{
		-webkit-filter: drop-shadow(0px 0px 7px rgba(0,0,0,0.6));
		filter: drop-shadow(0px 0px 7px rgba(0,0,0,0.6));
		margin-top:40px;
		cursor:hand;
		cursor:pointer;
		width:100%;
		
		
	}
	.flag.pl{
		
	}
	.flag.pl:hover{

		-ms-transform: rotate(-360deg);
		-webkit-transform: rotate(-360deg);
		transform: rotate(-360deg);
		-webkit-transition: all 0.5s;
		-moz-transition:    all 0.5s;
		-ms-transition:     all 0.5s;
		-o-transition:      all 0.5s;
		transition:         all 0.5s;
	}
	.flag.en{
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	.flag.en:hover{
		-ms-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
		 -webkit-transition: all 0.5s;
		-moz-transition:    all 0.5s;
		-ms-transition:     all 0.5s;
		-o-transition:      all 0.5s;
		transition:         all 0.5s;
	}
	
	
	
	.flags{
		display: inline-block;
		text-align: center;
		color: #00bdff;
		font-size: 25px;
		font-weight: 600;
		max-width:300px;
		width:20%;
	}
	
	@media all and (max-width: 991px)  {
		.flags{
			font-size: 20px;
		}
	}
	@media all and (max-width:575px) {
		.flags {
			font-size: 14px;
			width: 50%;
			left: 0;
			right: 0;
			margin: 0px !important;
		}
	}

	#flag_left{
		margin-right:30px;
	}
	#flag_right{
		margin-left:30px;
	}

	#bottom{
		position: fixed;
		bottom: -4px;
		left: 0px;
		right: 0px;
		margin: 0px auto;
		padding: 0px;
	}
	#bottom img{
		width: 15%;
	}
	@media all and (max-width:575px) {
		#bottom img{
			width: 48%;
		}
	}
	
	
	.number{
		display:inline-block;
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: all 0.5s;
		-moz-transition:    all 0.5s;
		-ms-transition:     all 0.5s;
		-o-transition:      all 0.5s;
		transition:         all 0.5s;		
		width:20%;
		
	}
	.number img{
		
	}
	
	#numbers{
		position:relative;
		top:-20px;
	}
	
	
	#number_1{
		margin-right:10px;
		position:relative;
		top:-30px;
		text-align:right;
	}
	#number_2{
		margin-left:10px;
		margin-right:10px;
		position:relative;
	}
	#number_3{
		margin-left:10px;
		position:relative;
		top:-30px;
		text-align:left;
	}

	#number_1:hover{
		-ms-transform: rotate(10deg);
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	#number_2:hover{
		-ms-transform: rotate(-10deg);
		-webkit-transform: rotate(-10deg);
		transform: rotate(-10deg);
	}
	#number_3:hover{
		-ms-transform: rotate(10deg);
		-webkit-transform: rotate(10deg);
		transform: rotate(10deg);
	}
	
	
	.button{
		display:inline-block;
		-ms-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
		-webkit-transition: all 0.5s;
		-moz-transition:    all 0.5s;
		-ms-transition:     all 0.5s;
		-o-transition:      all 0.5s;
		transition:         all 0.5s;		
	}
	


	
	#button_left{
		margin-right:30px;
		
	}
	#button_center{
		margin-left:30px;
		margin-right:30px;
	}
	#button_right{
		margin-left:30px;
	}
	
	
	
	
	
	
	@media all and (max-width:  840px) {
		.button{
			width:100%;
			margin:0px;
			margin: 0px !important;
		}
		#numbers{
			top:0px;
		}
	}
	
	@media all and (max-width:575px) {
		.number{
			width: 100% !important;
			text-align: center !important;
			display: block;
			top: 0px !important;
			margin:0px!important;
		}
		.number img{
			width:50%;
		}
		
		#number_1{
			margin-top:40px!important;
			right: 17px !important;
		}
		#number_3{
			margin-bottom:40px!important;
		}
		
	}
	
	#text{
		width:55%;
		left:0px;
		right:0px;
		margin:0px auto;
		color:#002b53;
		font-weight:600;
	}
	@media all and (max-width:1044px) {
		#text{
			width:80%;
		}
	}
	#close{
		text-align:right;
		padding-right:40px;
		padding-bottom:5px;
	}
	#boxes{
		margin-top:20px;
		
	}
	.box4{
		width: 25%;
		float: left;
		font-size:14px;
		font-weight:100;
		margin-bottom:60px;
	}
	
	@media all and (max-width:840px) {
		.box4{
			width:100%;
		}
	}
	
	
	.box2{
		width: 50%;
		float: left;
		font-size:14px;
		font-weight:100;
		margin-bottom:60px;
	}
	@media all and (max-width:840px) {
		.box2{
			width:100%;
			text-align:center;
		}
	}
	
	.box2.left{
		text-align:right;
		padding-right:10px;
	}
	.box2.right{
		text-align:left;
		padding-left:10px;
	}
	
	.area{
		padding: 10px;
	}
	
	
	
	#contact{
		width:35%;
		left:0px;
		right:0px;
		margin:0px auto;
		color:#002b53;
		font-weight:600;
	}
	@media all and (max-width:1044px) {
		#contact{
			width:80%;
		}
	}
	#contact input, #contact textarea{
		width: 100%;
		margin-bottom: 15px;
		font-family:Verdana, Geneva, sans-serif;
		background-image: url(../images/input_bcg.png);
		background-repeat: repeat-y;
		background-position: center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		color:#002b53;
		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		border-radius: 15px;
		border:5px solid white;
		padding:10px;
		font-size:25px;
		font-weight:600;
	}
	#contact #close{
		padding-right:0px;
	}
	#contact_buttons{
		
	}
	
	#contact button{
		width: 50%;
		margin-bottom: 20px;
		font-family:Verdana, Geneva, sans-serif;
		background-image: url(../images/input_bcg.png);
		background-repeat: repeat-y;
		background-position: center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		color:#fff;
		-webkit-border-radius: 15px;
		-moz-border-radius: 15px;
		border-radius: 15px;
		border:5px solid white;
		padding:10px;
		font-size:25px;
		font-weight:600;
		cursor:hand;
		cursor:pointer;
		margin-bottom:50px;
	}
	
	
	#contact button.left{
		float:left;
	}
	#contact button.right{
		float:right;
	}
	@media all and (max-width:840px) {
		#contact input, #contact textarea, #contact button{
			font-size:16px;
		}
	}
	@media all and (max-width:550px) {
		#contact input, #contact textarea, #contact button{
			font-size:14px;
		}
	}