@charset "utf-8";
/* Allgemein */
#wmap_top {width:100%; height:auto; margin:0px; padding:0px; position:relative !important}
#back {width:100%; height:auto; left:15px; top:15px; margin:0px; padding:0px; z-index:10000000; position:fixed !important}
#back img {width:50px;}
#back a:hover {zoom:1; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter:alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity:0.6; opacity:0.6;}
/* Places Overview */
#wmap {width:80%; height:auto; margin:0px; padding:0px; padding-left:10%; padding-right:10%; position:relative !important}
#wmap_box {width:33.33%; height:auto; margin:0px; padding:0px; margin-bottom:-5px; float:left; position:relative !important}
#wmap_box_hover {display:none;}
#wmap_box:hover #wmap_box_hover {width:100%; height:auto; left:0px; top:0px; margin:0px; padding:0px; z-index:10; display:block; position:absolute !important}
/* Places Detail */
#places_left {width:40%; height:auto; margin:0px; padding:0px; float:left; position:relative !important}
#places_left img {width:500px;}
#places_center {width:27%; height:auto; font-size:16px; margin:0px; padding:0px; padding-top:0px; padding-left:3%; float:left; position:relative !important}
#places_right {width:27%; height:auto; font-size:16px; margin:0px; padding:0px; padding-top:0px; padding-left:3%; float:left; position:relative !important}
#place {width:auto; height:auto; min-height:34px; font-size:16px; line-height:1.1; margin:0px; padding:0px; padding-left:60px; margin-bottom:8px; background-size:50px, auto;
	    position:relative !important}
.australia {background:url(../img_flags/australia.png) no-repeat left top;}
.austria {background:url(../img_flags/austria.png) no-repeat left top;}
.azores {background:url(../img_flags/azores.png) no-repeat left top;}
.canary_islands {background:url(../img_flags/canary_islands.png) no-repeat left top;}
.catalonia {background:url(../img_flags/catalonia.png) no-repeat left top;}
.cuba {background:url(../img_flags/cuba.png) no-repeat left top;}
.czech_republic {background:url(../img_flags/czech_republic.png) no-repeat left top;}
.egypt {background:url(../img_flags/egypt.png) no-repeat left top;}
.england {background:url(../img_flags/england.png) no-repeat left top;}
.fiji {background:url(../img_flags/fiji.png) no-repeat left top;}
.france {background:url(../img_flags/france.png) no-repeat left top;}
.hong_kong {background:url(../img_flags/hong_kong.png) no-repeat left top;}
.hungary {background:url(../img_flags/hungary.png) no-repeat left top;}
.indonesia {background:url(../img_flags/indonesia.png) no-repeat left top;}
.italy {background:url(../img_flags/italy.png) no-repeat left top;}
.malaysia {background:url(../img_flags/malaysia.png) no-repeat left top;}
.maldives {background:url(../img_flags/maldives.png) no-repeat left top;}
.malta {background:url(../img_flags/malta.png) no-repeat left top;}
.netherlands {background:url(../img_flags/netherlands.png) no-repeat left top;}
.new_zealand {background:url(../img_flags/new_zealand.png) no-repeat left top;}
.poland {background:url(../img_flags/poland.png) no-repeat left top;}
.scotland {background:url(../img_flags/scotland.png) no-repeat left top;}
.sicily {background:url(../img_flags/sicily.png) no-repeat left top;}
.singapore {background:url(../img_flags/singapore.png) no-repeat left top;}
.soviet_union {background:url(../img_flags/soviet_union.png) no-repeat left top;}
.sweden {background:url(../img_flags/sweden.png) no-repeat left top;}
.usa {background:url(../img_flags/usa.png) no-repeat left top;}
/* Sharks */
#sharkmap_wrapper {width:80%; height:auto; margin:0px; padding:0 10% 0 10%; overflow-x:hidden; position:relative !important}
#sharkmap {width:100%; height:auto; margin:0px; padding:0; position:relative !important}
#map_01 {width:2.5%; height:auto; left:25%; top:44.4%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:1; position:absolute !important}
#map_02 {width:2.5%; height:auto; left:55.5%; top:40%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:10; position:absolute !important}
#map_03 {width:2.5%; height:auto; left:56.6%; top:44%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:1; position:absolute !important}
#map_04 {width:2.5%; height:auto; left:65.8%; top:54.2%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:1; position:absolute !important}
#map_05 {width:2.5%; height:auto; left:88.5%; top:73%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:10; position:absolute !important}
#map_06 {width:2.5%; height:auto; left:86.9%; top:78%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:1; position:absolute !important}
#map_07 {width:2.5%; height:auto; left:82.7%; top:78.5%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:1; position:absolute !important}
#map_08 {width:2.5%; height:auto; left:95.6%; top:70%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:10; position:absolute !important}
#map_09 {width:2.5%; height:auto; left:37.9%; top:34.9%; margin:0px; padding:0; transition:all .2s ease-in-out; z-index:1; position:absolute !important}
#map_01 [data-title]:hover::before, #map_02 [data-title]:hover::before, #map_03 [data-title]:hover::before, #map_04 [data-title]:hover::before, #map_05 [data-title]:hover::before, 
#map_06 [data-title]:hover::before, #map_07 [data-title]:hover::before, #map_08 [data-title]:hover::before, #map_09 [data-title]:hover::before {content:attr(data-title); position:absolute; 
bottom:-25px; left:-60px; display:inline-block; padding:4px 6px; border-radius:4px; background:#ffffff; color:#000000; border:1px solid #000000; font-size:11px; font-family:'Lato-Regular'; 
white-space:nowrap; z-index:100;}
#map_01 [data-title]:hover::after, #map_02 [data-title]:hover::after, #map_03 [data-title]:hover::after, #map_04 [data-title]:hover::after, #map_05 [data-title]:hover::after, 
#map_06 [data-title]:hover::after, #map_07 [data-title]:hover::after, #map_08 [data-title]:hover::after, #map_09 [data-title]:hover::after {content:''; position:absolute; 
bottom:-25px; left:-60px; display:inline-block; color:#466d8f;}
#map_01:hover, #map_02:hover, #map_03:hover, #map_04:hover, #map_05:hover, #map_06:hover, #map_07:hover, #map_08:hover, #map_09:hover {transform:scale(1.1);}
.desc_box {width:100%; height:83%; left:0px; top:90px; margin:0px; padding:0; background:url(../img_map/bg.png) repeat left top; display:none; z-index:10; position:absolute !important}
#inhbox {font-size:13px; margin:0px; padding:10px; border:1px solid #777777; background:#ffffff; z-index:1; position:absolute !important}
.box01 {width:400px; height:auto; left:10%; top:100px;}
.box03 {width:600px; height:auto; left:10%; top:100px;}
.box02 {width:700px; height:auto; left:10%; top:10px;}
#box_float {width:50%; height:auto; margin:0px; padding:0; float:left; position:relative !important}
#desc_left {width:70%; height:auto; margin:0px; padding:0; float:left; position:relative !important}
#desc_right {width:30%; height:auto; margin:0px; padding:0; transition:all .2s ease-in-out; float:left; position:relative !important}
#desc_right img {width:30px;}
#desc_right:hover {transform:scale(1.1);}
#cpright_sharks {width:100%; height:auto; font-size:12px; color:#777777; margin:4px 0 0 0; display:inline-block;}
#inhbox_location {width:80%; height:auto; margin:0px; padding:0; float:left; position:relative !important}
#inhbox_close {width:20%; height:auto; text-align:right; margin:0px; padding:0; float:left; position:relative !important}
#inhbox_close img {width:30px;}
#inhbox_close a:hover {zoom:1; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter:alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity:0.6; opacity:0.6;}
#inhbox_ab {width:100%; height:10px; margin:0px; padding:0; clear:left; position:relative !important}
.vdo_box {width:100%; height:83%; left:0px; top:90px; margin:0px; padding:0; background:url(../img_map/bg.png) repeat left top; display:none; z-index:100; position:absolute !important}
#vdobox {width:400px; height:auto; left:10%; top:100px; font-size:13px; margin:0px; padding:10px; border:1px solid #777777; background:#ffffff; z-index:1; position:absolute !important}
video {width:100%;}
#blende1 {width:auto; height:auto; right:-50px; top:70%; margin:0px; padding:0; z-index:10; position:absolute !important}
#blende2 {width:auto; height:auto; right:-50px; top:75%; margin:0px; padding:0; z-index:10; position:absolute !important}
#blende1 img, #blende2 img {width:40%;}
/* Login */
#login {width:100%; height:auto; font-size:16px; margin:0px; padding:0px; margin-top:30px; position:relative !important}
#login_left {width:153px; height:auto; text-align:right; margin:0px; padding:0px; margin-bottom:20px; padding-top:3px; float:left; position:relative !important}
#login_right {width:auto; height:auto; margin:0px; padding:0px; padding-left:10px; margin-bottom:20px; float:left; position:relative !important}
#login_error {width:auto; height:auto; color:#ae1010; margin:0px; padding:0px; margin-bottom:4px; padding-left:163px; position:relative !important}
.form {width:400px; background:#ffffff; color:#000000; padding:4px; border:1px solid #777777; border-radius:5px; font-size:16px; font-family:'Lato-Regular';}
.btn {font-family:'Lato-Regular'; font-size:16px; font-weight:normal; text-transform:uppercase; color:#ffffff; width:140px; line-height:1; border:1px solid #0a4587;
	  border-radius:5px; padding:8px; background:#0a4587; cursor:pointer;}
@media (max-width:1640px) {
/* Allgemein */
#wmap_top, #sharkmap_wrapper {width:94%; padding:0 3% 0 3%;}
/* Places Detail */
#places_left {width:37%; padding-left:3%;}
#places_center {width:25%; padding-right:3%;}
#places_right {width:26%; padding-left:0px; padding-right:3%;}
/* Login */
#login {width:94%; padding-left:3%; padding-right:3%;}
}
@media (max-width:1350px) {
/* Places Overview */
#wmap, #sharkmap_wrapper {width:98%; padding:0 1% 0 1%;}
}
@media (max-width:1250px) {
/* Places Detail */
#place {min-height:30px; font-size:15px; padding-left:55px; background-size:45px, auto;}
#places_center, #places_right {font-size:15px;}
}
@media (max-width:1120px) {
/* Places Detail */
#places_left {width:94%; padding-left:3%; padding-right:3%;}
#places_left img {width:414px;}
#places_center {width:47%; font-size:14px; padding-top:20px; padding-right:0px;}
#places_right {width:47%; font-size:14px; padding-top:20px;}
#place {min-height:27px; font-size:14px; padding-left:50px; background-size:40px, auto;}
}
@media (max-width:1000px) {
/* Login */
#login, .form, .btn {font-size:15px;}
}
@media (max-width:910px) {
/* Sharks */
.box02 {width:89.5%; left:3%; top:0px;}
.vdo_box {position:fixed !important}
#vdobox {top:50px; left:10%;}
}
@media (max-width:900px) {
/* Sharks */
#sharkmap_wrapper {overflow-x:scroll; white-space:nowrap;}
#sharkmap {width:900px;}
#map_01 [data-title]:hover::before, #map_02 [data-title]:hover::before, #map_03 [data-title]:hover::before, #map_04 [data-title]:hover::before, #map_05 [data-title]:hover::before, 
#map_06 [data-title]:hover::before, #map_07 [data-title]:hover::before, #map_08 [data-title]:hover::before  {font-size:9px;}
}
@media (max-width:800px) {
/* Sharks */
.box03 {width:89.5%; left:3%; top:80px;}
}
@media (max-width:740px) {
/* Places Detail */
#places_center {width:94%; padding-left:3%; padding-right:3%;}
#places_right {width:94%; padding-left:3%; padding-right:3%; padding-top:0px;}
}
@media (max-width:650px) {
/* Sharks */
.desc_box {top:85px;}
#box_float {width:100%;}
.vdo_box {top:85px;}
#vdobox {width:89.5%; left:3%; top:45px;}
/* Login */
#login_left {width:100%; text-align:left; margin-bottom:2px; padding-top:0px;}
#login_right {width:100%; padding-left:0px; margin-bottom:15px;}
#login_error {width:100%; padding-left:0px; margin-bottom:15px;}
.form {width:95.8%; padding:2%;}
}
@media (max-width:630px) {
/* Allgemein */
#back {left:10px; top:15px;}
#back img {width:40px;}
}
@media (max-width:540px) {
/* Sharks */
.box01 {width:89.5%; left:3%; top:80px;}
}
@media (max-width:450px) {
/* Login */
#login, .form, .btn {font-size:14px;}
}
@media (max-width:370px) {
/* Allgemein */
#back {left:6px; top:12px;}
#back img {width:36px;}
}