body { background-color: #f2f2f2; font-family: 'Quicksand', sans-serif; margin: 0; padding: 0;}

#content { width: 100%; max-width: 800px; margin: 20px auto;  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); }

h1 { color: #00b0e4; font-size: 30px; text-align: center; font-weight: 100; margin: 0; padding: 10px; }
h1 b { font-weight: bold; }

h2 { color: #194571; font-size: 23px; text-align: center; font-weight: 100; margin: 0; padding: 0; }

#div1 { width: 100%; max-width: 800px; height: 400px; background-image: url("../images/europe.png"); margin-top: 20px; font-size: 17px;}
#div1text1 { width: 380px; margin-right: 40px; background-color: #00b0e4; border-radius: 20px; color: white; padding: 10px; text-align: center; float: right; clear: both;}
#div1text2 { width: 380px; margin-right: 20px; background-color: #00cac3; border-radius: 20px; color: white; padding: 10px; text-align: center; float: right; clear: both; margin-top: 18px;}
#div1text3 { width: 380px; margin-right: 40px; background-color: #00b0e4; border-radius: 20px; color: white; padding: 10px; text-align: center; float: right; clear: both; margin-top: 18px;}

#div2 { width: 100%; max-width: 800px; height: 400px; background-image: url("../images/background.png"); margin-top: 20px; font-size: 17px;}
#div2text1 { width: 200px; background-color: #00b0e4; border-bottom-right-radius: 20px; border-top-right-radius: 20px; color: white; padding: 10px; text-align: left;}
#div2text2 { width: 300px; float: left; margin: 30px 0 0 50px; background-color: white; border-radius: 20px; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); padding: 5px; font-size: 16px; text-align: center;}
#div2text3 { width: 300px; float: right; margin: 30px 50px 0 0; background-color: white; border-radius: 20px; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); padding: 5px; font-size: 16px; text-align: center;}
.oben { text-align: center; background-color: #00b0e4; color: white; width: 100px; height: 100px;  margin: -25px auto 0;  /*border-top-left-radius: 20px; border-top-right-radius: 20px;*/ border-radius: 50%; }
.obentext { padding-top: 33px; }
#bilder { width: 100%; max-width: 800px; height: 400px;  margin-top: 20px; font-size: 17px; }

#div3 { width: 100%; max-width: 800px; background-color: #00b0e4; color:white; margin-top: 20px; font-size: 17px; text-align: center; padding: 5px 0px; font-weight: bold;}
#div4 { width: 100%; max-width: 800px;  color:#00b0e4; margin-top: 20px; font-size: 15px; text-align: center; padding: 5px 0px; }
#div5 { width: 100%; max-width: 800px;  color:#00cac3; margin-top: 20px; font-size: 15px; text-align: center; padding: 20px 0px 5px; border-top: 3px dashed #00cac3; }
#div5a { width: 90%;  margin: 20px auto 40px;display:flex; justify-content:space-between; }
.oben2 { text-align: center; background-color: #00cac3; color: white; width: 240px; padding: 5px 0; font-size: 17px; border-bottom-right-radius: 20px; border-top-right-radius: 20px; }
.div5text { width: 200px; margin: 0; /*float: left; margin: 30px 0 0 30px;*/ background-color: white; border: 2px solid #00cac3; color: #00cac3; border-radius: 20px; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); padding: 10px; font-size: 16px; text-align: center;}
#div6 { width: 100%; max-width: 800px; background-color: #00cac3; color:white; margin-top: 20px; font-size: 17px; text-align: center; padding: 5px 0px; font-weight: bold;}

#lang{margin-top:10px;margin-right:20px; color: #9ea7b3; font-size: 13px; float: right;}
.es{padding-right:5px;margin-right:5px;border-right:1px solid rgba(255,255,255,.4)}
.en{padding-right:5px;margin-right:5px;border-right:1px solid rgba(255,255,255,.4)}

#footer {  width: 100%; margin: 0 auto; /*background-color:#194571;*/ height: 30px; z-index: 99998; color: #194571; text-align: center; font-size: 12px; line-height: 30px;}
#footer a { text-decoration: none; color: #194571;}


@media only screen and (max-width: 740px) {	

	#div2text2 { margin: 30px 0 0 20px; }
	#div2text3 { margin: 30px 20px 0 0 ; }
	#div5a { width: 100%; }
	.div5text { margin: 0 5px; }
}

@media only screen and (max-width: 680px) {	
	#div2 { height: auto;}
	#div2text2 { width: 90%; float: none; margin: 30px auto; }
	#div2text3 { width: 90%; float: none; margin: 30px auto 10px ; }
	#div2 {height: auto; }	
	
}

@media only screen and (max-width: 500px) {	
	#div5a { width: 90%;  margin: 20px auto 40px;display:block; justify-content:space-between; }
    .div5text { width: 90%; margin: 10px auto; }
	#div1 {height: auto; }	
#div1text1 { width: 90%; margin: 10px auto; float: none; }
#div1text2 { width: 90%; margin: 10px auto; float: none; }
#div1text3 { width: 90%; margin: 10px auto; float: none; }

}