/*----------GOOGLE MAP---------------*/
.google_map {width:100%;display:block;position:relative;overflow:hidden;}
.google_map #map_canvas{width: 100%;height:400px;}

.google_map #google_message{display:none;position:absolute;left:0px;top:0px;width:100%;height:100%;z-index:9;}
.google_map #google_message div{background:#FFFFFF; width:250px;height:100px;padding:9px; border-radius:6px; box-shadow:1px 1px 4px rgba(0,0,0,0.5);border:1px solid #a2a2a2; position:relative;left:0px;top:130px;margin:auto;}

/**/
.google_map #summary {position:absolute;left:28px;top:75px;z-index:11; background:#fff; border: 5px solid #fff; padding: 1em 2em; max-width: 306px; margin-right: 30px;
background: linear-gradient(to bottom,  rgba(160,214,0,1) 9%,rgba(62,170,0,1) 100%); /* W3C */
border-radius: 10px;
box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
}
.google_map #summary > div > span {line-height:24px;}
.google_map #summary span.value {/*color: #FF8000;*/font-size: 25px; font-family: "Bree Serif", serif;}
.google_map #summary span.label {/*color: #838c95;*/font-size: 17px; line-height: 35px;}
.google_map #summary span.label:after {content: '\A'; white-space: pre;}
.google_map #summary span {color: #fff;}



/* summary ergebnis */
.summary .title {font-family: "Bree Serif", serif; color: #fff; margin-bottom: 0.5em; padding-bottom: 0.5em; border-bottom: 1px solid #fff; font-size: 1.2em;}

.summary .gold,
.summary .silber,
.summary .bronze {line-height: 33px; padding-left: 44px; background-repeat: no-repeat; background-position: left center;}

.summary .gold {background-image: url(../Images/small_gold.png);}
.summary .silber {background-image: url(../Images/small_silber.png);}
.summary .bronze {background-image: url(../Images/small_bronze.png);}


.google_map .map_controls{position:absolute; left:10px; top:15px; z-index:11;}
.google_map .map_controls > div {float: left;}
@media (min-width: 400px) {
	.google_map .map_controls{ left: 18px;}
	.google_map .map_controls > div {margin-left: 10px;}
}
@media (max-width: 400px) {
	input#map_plz {border-radius: 0;}
}


.map_zoom_controls {border:1px solid #999;}
.map_zoom_controls > div {width:22px; height:22px; line-height: 22px; background: #fff;cursor:pointer; text-align: center; font-family: "icons"; font-size: 0.8em;}
.map_zoom_controls > div:first-child {border-bottom: 1px solid #999;}
#zoom_in_control:before {content:'\e841';}
#zoom_out_control:before {content:'\e842'; }

.map_searchbox_controls {width:170px; background-color: transparent; height: 44px;}
.map_searchbox_controls form { display: block; width: 100%; height: 100%; position: relative;}
.map_searchbox_controls form:before {font-family: "icons"; content: '\e819'; position: absolute; right: 0;top: 0; display: block; width: 30px; height: 44px; line-height: 44px; text-align: center; color: #ccc;}
input#map_plz {font-size:18px;line-height:20px;padding:5px; border:none; margin: 0; padding-right: 30px; border: 1px solid #999; color: #999; background: #fff;}

.map_switch_controls {border: 1px solid #999;}
.map_switch_controls > div {float: left; width:45px;height:44px; background: #ccc no-repeat center center; cursor:pointer;}
.map_switch_controls > div:first-child {border-right: 1px solid #999;}
#switch_active_control {background-image: url(../Images/Map/school-active.png);}
#switch_active_control.act {background-color: #FF8000;}
#switch_all_control {background-image: url(../Images/Map/school-all.png);}
#switch_all_control.act {background-color: #99cc00;}

.google_map .infoBox {width:188px;height:260px; position:relative; background: #fff;box-shadow: 3px 3px 4px #999;}


/*close image*/
.google_map .infoBox > img {position: absolute !important; right: -10px !important; top: -10px !important; z-index: 4;}

.google_map .infoBox > div {padding:10px; overflow: hidden; text-align: center; height: 100%;}
.google_map .infoBox:after { border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #fff; bottom: -10px; content:''; height: 0; width: 0; position: absolute;
left: 85px;}
.google_map .infoBox a.link{display:block;}
.google_map .infoBox span {display:block;}

.google_map .infoBox .attended { background: #FF8000; text-align: center; display: block; width: 50px; position: absolute; left: 0; top: 70px; z-index: 5; font-family: "Bree Serif", serif; text-transform: uppercase; padding: 4px 5px; line-height: 1em; font-size: 1.3em; color: #fff;}
.google_map .infoBox .attended:after {display: block; content:'dabei'; font-size: 0.8em;}

.google_map .infoBox .namebox {position: absolute; left: 0; top: 0; padding: 0 10px; background: #fff; z-index: 3;}
.google_map .infoBox .name { height: 70px; width: 100%; text-align: center; display: table; table-layout: fixed; text-overflow: ellipsis;}
.google_map .infoBox .name span {font-family: "Bree Serif", serif; text-transform: uppercase; font-size: 20px; display: table-cell; vertical-align: middle; word-wrap: break-word;}

.google_map .infoBox .image {background: url(../Images/Map/school-nofoto.jpg) center center no-repeat; display: block; width: 168px; height: 105px; position: absolute; top: 70px; z-index: 1;}

.google_map .infoBox .detailbox {color: #333; position: absolute; bottom: 5px; left: 10px; background: #fff; padding-right: 10px; z-index: 2; width: 178px;}
.google_map .infoBox .address{ font-size: 1.2em; line-height: 1em; margin-top: 10px; font-family: "Maven pro", sans-serif; }
.google_map .infoBox .schoolClasses {margin-top: 10px; border-top: 1px solid #FF8000; padding: 5px 0; display: block;}
.google_map .infoBox .schoolClasses:before {content:'Klassen, die mitspielen: ';}


.infoBox .inactive .attended { display: none;}
.infoBox .inactive .name span {color: #69C102;}
.infoBox .inactive .schoolClasses {border-top: 1px solid #69C102;}

@media (max-width: 768px) {
	.google_map #summary {position: relative; top: 0; left: 0; margin-right: 0; max-width: 100%; margin: 10px;}
	.google_map #summary span.label {line-height: inherit;}
	.google_map .map_controls {top: auto; left: auto; bottom: 20px;}
}