.clear {display:block; clear:both;}

#map-container {width:100%; height:auto; margin:0 auto; padding:0; margin:0 0 90px 0; position:relative; color:#026548; background:url('../images/bgr.jpg') no-repeat 50% 50% #fec543; background-attachment:fixed; background-size:cover;}
	#map-container #wrapper {border:none; width:100%; height:calc(100vh - 90px); margin:0; position:relative; overflow:hidden; background:none;}

	#map-container #inner {display:block; position:relative; height:100vh;}
	#map-container #inner #cities {height:calc(100vh - 90px); width:calc(100vh * 1.28); margin:0 auto; position:relative; top:50%; transform:translate(0, -55%); background:rgba(0,0,0,0); z-index:10; opacity:0;}
	#map-container #inner #cities .city {display:block; position:absolute; z-index:11;}
	#map-container #inner #cities .city img {display:block; width:100%; height:auto;}
	#map-container #inner #cities .city.aytos {width:3.66%; top:49.4%; left:70.7%;}
	#map-container #inner #cities .city.atiya {width:3.66%; top:56.2%; left:75.3%;}
	#map-container #inner #cities .city.balchik {width:3.66%; top:32.4%; left:81.9%;}
	#map-container #inner #cities .city.batak {width:3.66%; top:67.7%; left:30.9%;}
	#map-container #inner #cities .city.belene {width:3.66%; top:26.2%; left:41.5%;}
	#map-container #inner #cities .city.beloslav {width:3.66%; top:38.9%; left:76.2%;}
	#map-container #inner #cities .city.blagoevgrad {width:5.8%; top:65.4%; left:16.5%;}
	#map-container #inner #cities .city.bratsigovo {width:3.66%; top:67.7%; left:34.4%;}
	#map-container #inner #cities .city.burgas {width:3.66%; top:53.2%; left:73.9%;}
	#map-container #inner #cities .city.byala-slatina {width:5.8%; top:30.8%; left:27.2%;}
	#map-container #inner #cities .city.varna {width:3.66%; top:37.0%; left:79.1%;}
	#map-container #inner #cities .city.veliko-tarnovo {width:5.8%; top:39.8%; left:48.9%;}
	#map-container #inner #cities .city.velingrad {width:3.66%; top:64.6%; left:28.6%;}
	#map-container #inner #cities .city.vetren {width:3.66%; top:53.1%; left:70.6%;}
	#map-container #inner #cities .city.devnya {width:3.66%; top:35.4%; left:75.0%;}
	#map-container #inner #cities .city.dimitrovgrad {width:5.8%; top:63.8%; left:49.0%;}
	#map-container #inner #cities .city.dobrich {width:3.66%; top:28.6%; left:78.1%;}
	#map-container #inner #cities .city.dolni-dabnik {width:3.66%; top:32.0%; left:34.3%;}
	#map-container #inner #cities .city.dulovo {width:3.66%; top:22.7%; left:70.2%;}
	#map-container #inner #cities .city.isperih {width:3.66%; top:24.6%; left:65.5%;}
	#map-container #inner #cities .city.karlovo {width:3.66%; top:50.5%; left:39.5%;}
	#map-container #inner #cities .city.karnobat {width:3.66%; top:50.0%; left:66.9%;}
	#map-container #inner #cities .city.kozlodui {width:3.66%; top:23.5%; left:24.9%;}
	#map-container #inner #cities .city.kostenets {width:3.66%; top:58.3%; left:27.7%;}
	#map-container #inner #cities .city.krichim {width:3.66%; top:64.1%; left:35.8%;}
	#map-container #inner #cities .city.kardzhali {width:3.66%; top:74.0%; left:46.7%;}
	#map-container #inner #cities .city.levski {width:3.66%; top:32.8%; left:44.0%;}
	#map-container #inner #cities .city.lovech {width:3.66%; top:38.8%; left:38.4%;}
	#map-container #inner #cities .city.lyubimets {width:3.66%; top:68.8%; left:55.7%;}
	#map-container #inner #cities .city.miziya {width:3.66%; top:28.3%; left:32.6%;}
	#map-container #inner #cities .city.nesebar {width:3.66%; top:49.9%; left:74.4%;}
	#map-container #inner #cities .city.novi-pazar {width:3.66%; top:32.7%; left:70.5%;}
	#map-container #inner #cities .city.pazardzhik {width:3.75%; top:60.4%; left:33.7%;}
	#map-container #inner #cities .city.panagyurishte {width:5.8%; top:53.7%; left:30.8%;}
	#map-container #inner #cities .city.peshtera {width:3.66%; top:64.1%; left:32.8%;}
	#map-container #inner #cities .city.pleven {width:3.66%; top:32.4%; left:37.2%;}
	#map-container #inner #cities .city.plovdiv {width:3.66%; top:62.3%; left:38.9%;}
	#map-container #inner #cities .city.popovo {width:3.66%; top:33.6%; left:57.8%;}
	#map-container #inner #cities .city.primorsko {width:3.75%; top:58.9%; left:77.3%;}
	#map-container #inner #cities .city.rakovski {width:3.66%; top:58.4%; left:41.0%;}
	#map-container #inner #cities .city.ruse {width:3.66%; top:22.6%; left:54.3%;}
	#map-container #inner #cities .city.svishtov {width:3.66%; top:27.5%; left:46.4%;}
	#map-container #inner #cities .city.silistra {width:3.66%; top:16.4%; left:70.4%;}
	#map-container #inner #cities .city.sliven {width:3.66%; top:50.0%; left:58.8%;}
	#map-container #inner #cities .city.slanchev-bryag {width:5.8%; top:45.7%; left:77.5%;}
	#map-container #inner #cities .city.sofia {width:3.66%; top:49.0%; left:20.5%;}
	#map-container #inner #cities .city.stara-zagora {width:5.8%; top:55.2%; left:48.9%;}
	#map-container #inner #cities .city.troyan {width:3.66%; top:44.5%; left:38.1%;}
	#map-container #inner #cities .city.targovishte {width:3.7%; top:35.8%; left:62.0%;}
	#map-container #inner #cities .city.haskovo {width:3.66%; top:67.3%; left:49.2%;}
	#map-container #inner #cities .city.tsarevo {width:3.66%; top:62.2%; left:78.0%;}
	#map-container #inner #cities .city.cherven-bryag {width:3.7%; top:35.7%; left:30.3%;}
	#map-container #inner #cities .city.shumen {width:3.66%; top:35.6%; left:67.0%;}
	#map-container #inner #cities .city.yambol {width:3.66%; top:54.3%; left:61.3%;}

	#map-container #inner #map {display:block; height:calc(100vh - 90px); width:calc(100vh * 1.28); margin:0 auto;}

	#map-container #cities-list {display:none; width:100%; min-height:calc(100vh - 90px); position:relative; padding:25px; box-sizing:border-box;} 
	#map-container #cities-list h2 {font-weight:normal; text-align:center; margin:0 0 15px 0; font-size:30px;}
	#map-container #cities-list a {display:block; float:left; width:45%; margin:0 2%; padding:16px 0 13px; line-height:110%; text-transform:uppercase; text-align:center; text-decoration:none; font-size:18px; font-weight:normal; color:#026548; border-bottom:2px solid #8ac441; box-sizing:border-box;}
	#map-container #cities-list .list-separator {display:none;}

	#map-container #stores {display:none; width:100%; height:100%; position:fixed; top:0; left:0; z-index:9999;}
	#map-container #stores .stores-list {display:none; width:90%; max-width:500px; height:80vh; background:url('../images/gradient.png') repeat-x 0 0 #fec543; background-size:auto 100%; border-radius:35px; padding:40px 30px 40px 80px; box-sizing:border-box; margin:10vh auto 0; position:relative; z-index:10;}
	#map-container #stores .stores-list.visible {display:block;}
	#map-container #stores .stores-list h2 {text-transform:uppercase; font-size:30px; height:30px; line-height:30px; padding-right:61px; margin:0 0 30px 0; text-align:center;}
	#map-container #stores .stores-list .btn-close {display:block; width:32px; height:32px; position:absolute; top:-10px; right:-10px; background:url('../images/btn-close.png') no-repeat 50% 50%; background-size:100% 100%;}
	#map-container #stores .scroll-pane {height:500px;}
	#map-container #stores .scroll-pane .table-wrapper {width:90%; overflow:hidden;}
	#map-container #stores .scroll-pane .table-wrapper > div {display:table; clear:both; width:100%; border-top:2px solid #8ac441; vertical-align:middle; padding:20px 0 20px;}
	#map-container #stores .scroll-pane .table-wrapper > div:after {content:""; display:table; clear:both;}
	#map-container #stores .scroll-pane .table-wrapper div.store {display:table-cell; vertical-align:middle; float:none; width:50%; min-height:15px; line-height:15px; font-size:13px; font-weight:bold; box-sizing:border-box; background:none;}
	#map-container #stores .scroll-pane .table-wrapper div.address {display:table-cell; vertical-align:middle; float:none; width:50%; min-height:15px; line-height:15px; font-size:13px; font-weight:normal; padding-left:15px; box-sizing:border-box; background:none;}
	#map-container #stores .scroll-pane .table-wrapper div.clear {padding:0;}
	#map-container #stores .modal-overlay {display:block; width:100%; height:100%; position:fixed; top:0; left:0; background:rgba(0,0,0,0.8); z-index:1;}
		
	#map-container .buttons {display:block; width:32px; position:absolute; top:25px; left:15px; z-index:10;}
	#map-container .buttons button {display:block; width:32px; height:32px; margin:0 0 5px 0; padding:0; border:0; border-radius:2px; box-shadow:0 0 3px #026548; cursor:pointer;}
	#map-container .buttons button.zoom-in {background:url('../images/zoom-in.png') no-repeat 50% 50%; background-size:100% 100%;}
	#map-container .buttons button.zoom-out {background:url('../images/zoom-out.png') no-repeat 50% 50%; background-size:100% 100%;}
	#map-container .buttons button.zoom-reset {background:url('../images/zoom-reset.png') no-repeat 50% 50%; background-size:100% 100%;}

@media screen and (max-width:900px) {
	#map-container {padding-bottom:90px;}
	#map-container #wrapper {height:auto; min-height:calc(100vh - 90px); overflow:auto;}
	#map-container #cities-list  {display:block;}
	#map-container #cities-list .list-separator {display:block; clear:both; height:35px;}
	#map-container #inner {display:none;}
	#map-container .buttons {display:none;}
}

@media screen and (max-width:600px) {
	#map-container #stores .stores-list {width:80%; padding:25px 10px 25px 40px; background:url('../images/bgr_list_mobile.jpg') no-repeat 50% 50%; background-size:100% 100%; border-radius:0;}
	#map-container #stores .stores-list h2 {padding-right:41px; font-size:25px; height:25px; line-height:25px; margin:0 0 15px 0;}
	#map-container #stores .stores-list .btn-close {width:24px; height:24px; top:-10px; right:-10px;}
	#map-container #stores .scroll-pane .table-wrapper > div {padding:15px 0;}
	#map-container #stores .scroll-pane div.store {font-size:12px;}
	#map-container #stores .scroll-pane div.address {font-size:12px;}
	#map-container #stores .modal-overlay {background:url('../images/bgr_mobile.jpg') no-repeat 50% 50%; background-size:100% 100%;}
}
@media screen and (max-width:480px) {
	#map-container #cities-list a {font-size:16px;}
	#map-container #stores .stores-list {padding:15px 10px 15px 20px;}
	#map-container #stores .stores-list h2 {font-size:24px; padding-right:10px;}
	#map-container #stores .scroll-pane .table-wrapper > div {padding:10px 0;}
	#map-container #stores .scroll-pane div {font-size:11px;}
}
@media screen and (max-width:360px) {
	#map-container #cities-list a {font-size:12px;}
	#map-container #stores .stores-list h2 {font-size:20px;}
}