#historia {
    height: 43vw;
    position: relative;
        margin-top: 13vw;
    z-index: 30;
    background-image: url(../images/historia2.jpg);
}
#historia .contentBox{margin-top:40px;}
#historia .contentBox p{
	font-size:1.3em;
		margin-top:15px;
}

#mapaSwiat .contentBox p{
	font-size:1.1em;
	color: #5e6568;
	margin-top:15px;
}

#mapaSwiat img{margin-top: 98px;}

.text{z-index:100; position:relative;}
.text p{color:#211c25; font-size:1.2em; text-align:center;}

.txt1{
	margin-top:50px;
}



.text .contentBox{
	display: flex;
    justify-content: space-between;
    align-items: center;	
}
.text .box{padding:0 10px; margin-right:80px;}

.text .contentBox.txt1 img{    width: 45%}
.text .contentBox.txt2 img{    width: 55%}

@media only screen and (max-width:1199px){
	.text .box{ margin-right:0;}
}

@media only screen and (min-width:992px) and (max-width:1100px){
	#historia .contentBox p{font-size:1.2em;}
}

@media only screen and (min-width:767px) and (max-width:992px){
	#historia{
		margin-top: 23vw;
	}
	section.menu nav li > a{font-size:.9em}
	#historia .contentBox p{font-size:1em;}
	#historia .contentBox{margin-top:20px;}
	.txt1 p{font-size:1.1em;}
	.txt2 p{font-size:1em;}
	.text .contentBox.txt2 {margin-top:30px;}
	.text .contentBox.txt2 img{width:50%;}
}

@media (max-width:767px){
	#historia{height:auto; padding-bottom:30px;}
	.text .contentBox{flex-direction:column;}
	.text .contentBox.txt2 img,
	.text .contentBox.txt1 img{width:100%; margin-bottom:30px;}
	.txt2 .box{order:2;}
	.txt1 p{font-size:1.2em; margin-bottom:20px;}
}

@media (max-width: 549px) and (min-width: 351px){
	#historia {	background-size:500%; margin-top:20vw}
}