/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

body {
	background: #ddd;
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}

section {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: minmax(20px, 40px) 1fr 0.5fr 0.5fr 1fr minmax(20px, 40px);
	grid-template-columns: minmax(20px, 40px) 1fr 0.5fr 0.5fr 1fr minmax(20px, 40px);
	-ms-grid-rows: 1fr 20px 1fr 20px;
	grid-template-rows: 1fr 20px 1fr 20px;
}

section > *:nth-child(1) {
	-ms-grid-row: 1;
	-ms-grid-column: 1;
}

section > *:nth-child(2) {
	-ms-grid-row: 1;
	-ms-grid-column: 2;
}

section > *:nth-child(3) {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}

section > *:nth-child(4) {
	-ms-grid-row: 1;
	-ms-grid-column: 4;
}

section > *:nth-child(5) {
	-ms-grid-row: 1;
	-ms-grid-column: 5;
}

section > *:nth-child(6) {
	-ms-grid-row: 1;
	-ms-grid-column: 6;
}

section > *:nth-child(7) {
	-ms-grid-row: 2;
	-ms-grid-column: 1;
}

section > *:nth-child(8) {
	-ms-grid-row: 2;
	-ms-grid-column: 2;
}

section > *:nth-child(9) {
	-ms-grid-row: 2;
	-ms-grid-column: 3;
}

section > *:nth-child(10) {
	-ms-grid-row: 2;
	-ms-grid-column: 4;
}

section > *:nth-child(11) {
	-ms-grid-row: 2;
	-ms-grid-column: 5;
}

section > *:nth-child(12) {
	-ms-grid-row: 2;
	-ms-grid-column: 6;
}

section > *:nth-child(13) {
	-ms-grid-row: 3;
	-ms-grid-column: 1;
}

section > *:nth-child(14) {
	-ms-grid-row: 3;
	-ms-grid-column: 2;
}

section > *:nth-child(15) {
	-ms-grid-row: 3;
	-ms-grid-column: 3;
}

section > *:nth-child(16) {
	-ms-grid-row: 3;
	-ms-grid-column: 4;
}

section > *:nth-child(17) {
	-ms-grid-row: 3;
	-ms-grid-column: 5;
}

section > *:nth-child(18) {
	-ms-grid-row: 3;
	-ms-grid-column: 6;
}

section > *:nth-child(19) {
	-ms-grid-row: 4;
	-ms-grid-column: 1;
}

section > *:nth-child(20) {
	-ms-grid-row: 4;
	-ms-grid-column: 2;
}

section > *:nth-child(21) {
	-ms-grid-row: 4;
	-ms-grid-column: 3;
}

section > *:nth-child(22) {
	-ms-grid-row: 4;
	-ms-grid-column: 4;
}

section > *:nth-child(23) {
	-ms-grid-row: 4;
	-ms-grid-column: 5;
}

section > *:nth-child(24) {
	-ms-grid-row: 4;
	-ms-grid-column: 6;
}

.gr_1 {
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 1;
	grid-row: 1;
}

.gr_2 {
	-ms-grid-column: 3;
	-ms-grid-column-span: 2;
	grid-column: 3/5;
	-ms-grid-row: 1;
	grid-row: 1;
}

.gr_3 {
	-ms-grid-column: 5;
	grid-column: 5;
	-ms-grid-row: 1;
	grid-row: 1;
}

.gr_4 {
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2/4;
	-ms-grid-row: 3;
	grid-row: 3;
}

.gr_5 {
	-ms-grid-column: 4;
	-ms-grid-column-span: 2;
	grid-column: 4/6;
	-ms-grid-row: 3;
	grid-row: 3;
}

.gr p a {
	font-size: 16px;
	font-weight: 600;
}

.gr p {
	font-size: 20px;
}

.gr {
	margin: 20px;
	background-color: white;
	border-radius: 20px;
	padding: 10px;
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	        box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

.gr_4, .gr_5 {
	margin: 0 100px;
}

.chance button {
	width: 100px;
    margin-bottom: 5px;
    border: 1px solid #666;
    border-radius: 5px;
}

.chance li {
	list-style-type: none;
}

.contact_hide{
	display: none;
}

article {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 40px 200px 1fr;
	grid-template-columns: 40px 200px 1fr;
	-ms-grid-rows: 200px 1fr;
	grid-template-rows: 200px 1fr;
	background-color: white;
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
	        box-shadow: 0 0 10px rgba(0,0,0,0.5);
	padding: 35px 0;
}

article > *:nth-child(1) {
	-ms-grid-row: 1;
	-ms-grid-column: 1;
}

article > *:nth-child(2) {
	-ms-grid-row: 1;
	-ms-grid-column: 2;
}

article > *:nth-child(3) {
	-ms-grid-row: 1;
	-ms-grid-column: 3;
}

article > *:nth-child(4) {
	-ms-grid-row: 2;
	-ms-grid-column: 1;
}

article > *:nth-child(5) {
	-ms-grid-row: 2;
	-ms-grid-column: 2;
}

article > *:nth-child(6) {
	-ms-grid-row: 2;
	-ms-grid-column: 3;
}

.big_maps {
	-ms-grid-column: 1;
	-ms-grid-column-span: 3;
	grid-column: 1/4;
	-ms-grid-row: 1;
	-ms-grid-row-span: 2;
	grid-row: 1/3;
	z-index: 1;
}

.chance {
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 1;
	grid-row: 1;
	z-index: 2;
	border: solid #8989a5 3px;
	background-color: #9dbcb92e;
	border-radius: 5px;
}

#city_0 {
	cursor: pointer;
	font-size: 18px;

}

#map_0 {
	text-align: center;
	list-style-type: ;
}

.chance span {
	padding-left: 40px;
	line-height: 54px;
}

.chance ul {
	margin-top: -12px;
}

@media only all and (max-width: 750px) {
	.gr {
		margin: 20px 20px;
	}

	section {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 1fr 0.5fr 0.5fr 1fr;
		grid-template-columns: 1fr 0.5fr 0.5fr 1fr;
		-ms-grid-rows: 1fr 20px 1fr 20px;
		grid-template-rows: 1fr 20px 1fr 20px;
	}

	section > *:nth-child(1) {
		-ms-grid-row: 1;
		-ms-grid-column: 1;
	}

	section > *:nth-child(2) {
		-ms-grid-row: 1;
		-ms-grid-column: 2;
	}

	section > *:nth-child(3) {
		-ms-grid-row: 1;
		-ms-grid-column: 3;
	}

	section > *:nth-child(4) {
		-ms-grid-row: 1;
		-ms-grid-column: 4;
	}

	section > *:nth-child(5) {
		-ms-grid-row: 2;
		-ms-grid-column: 1;
	}

	section > *:nth-child(6) {
		-ms-grid-row: 2;
		-ms-grid-column: 2;
	}

	section > *:nth-child(7) {
		-ms-grid-row: 2;
		-ms-grid-column: 3;
	}

	section > *:nth-child(8) {
		-ms-grid-row: 2;
		-ms-grid-column: 4;
	}

	section > *:nth-child(9) {
		-ms-grid-row: 3;
		-ms-grid-column: 1;
	}

	section > *:nth-child(10) {
		-ms-grid-row: 3;
		-ms-grid-column: 2;
	}

	section > *:nth-child(11) {
		-ms-grid-row: 3;
		-ms-grid-column: 3;
	}

	section > *:nth-child(12) {
		-ms-grid-row: 3;
		-ms-grid-column: 4;
	}

	section > *:nth-child(13) {
		-ms-grid-row: 4;
		-ms-grid-column: 1;
	}

	section > *:nth-child(14) {
		-ms-grid-row: 4;
		-ms-grid-column: 2;
	}

	section > *:nth-child(15) {
		-ms-grid-row: 4;
		-ms-grid-column: 3;
	}

	section > *:nth-child(16) {
		-ms-grid-row: 4;
		-ms-grid-column: 4;
	}

	.gr p {
		font-size: 15px;
	}

	.gr_1 {
		-ms-grid-column: 1;
		grid-column: 1;
		-ms-grid-row: 1;
		grid-row: 1;
	}

	.gr_2 {
		-ms-grid-column: 2;
		-ms-grid-column-span: 2;
		grid-column: 2/4;
		-ms-grid-row: 1;
		grid-row: 1;
	}

	.gr_3 {
		-ms-grid-column: 4;
		grid-column: 4;
		-ms-grid-row: 1;
		grid-row: 1;
	}

	.gr_4 {
		-ms-grid-column: 1;
		-ms-grid-column-span: 2;
		grid-column: 1/3;
		-ms-grid-row: 3;
		grid-row: 3;
	}

	.gr_5 {
		-ms-grid-column: 3;
		-ms-grid-column-span: 2;
		grid-column: 3/5;
		-ms-grid-row: 3;
		grid-row: 3;
	}
}

@media only all and (max-width: 550px) {
	.gr p {
		font-size: 12px;
	}

	.gr h2 {
		font-size: 20px;
	}

	.header {
		z-index: 100;
	}

	article {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 40px 0.5fr 1fr;
		grid-template-columns: 40px 0.5fr 1fr;
		-ms-grid-rows: 200px 1fr;
		grid-template-rows: 200px 1fr;
		background-color: white;
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
		        box-shadow: 0 0 10px rgba(0,0,0,0.5);
		padding: 35px 0;
	}

	article > *:nth-child(1) {
		-ms-grid-row: 1;
		-ms-grid-column: 1;
	}

	article > *:nth-child(2) {
		-ms-grid-row: 1;
		-ms-grid-column: 2;
	}

	article > *:nth-child(3) {
		-ms-grid-row: 1;
		-ms-grid-column: 3;
	}

	article > *:nth-child(4) {
		-ms-grid-row: 2;
		-ms-grid-column: 1;
	}

	article > *:nth-child(5) {
		-ms-grid-row: 2;
		-ms-grid-column: 2;
	}

	article > *:nth-child(6) {
		-ms-grid-row: 2;
		-ms-grid-column: 3;
	}

	.chance span,
	.chance ul {
		padding-left: 20px;
	}
}


@media only all and (max-width: 500px) {
	article {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: 0.5fr 1fr;
		grid-template-columns: 0.5fr 1fr;
		-ms-grid-rows: 200px 1fr;
		grid-template-rows: 200px 1fr;
		background-color: white;
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
		        box-shadow: 0 0 10px rgba(0,0,0,0.5);
		padding: 35px 0;
	}
	article > *:nth-child(1) {
		-ms-grid-row: 1;
		-ms-grid-column: 1;
	}
	article > *:nth-child(2) {
		-ms-grid-row: 1;
		-ms-grid-column: 2;
	}
	article > *:nth-child(3) {
		-ms-grid-row: 2;
		-ms-grid-column: 1;
	}
	article > *:nth-child(4) {
		-ms-grid-row: 2;
		-ms-grid-column: 2;
	}

	.big_maps {
		-ms-grid-column: 1;
		-ms-grid-column-span: 2;
		grid-column: 1/3;
		-ms-grid-row: 1;
		-ms-grid-row-span: 2;
		grid-row: 1/3;
		z-index: 1;
	}

	.chance {
		display: none;
	}

	section {
		display: block;
	}

	.gr {
		display: none!important;
	}

	.town {
		margin: 20px;
		background-color: white;
		border-radius: 20px;
		padding: 10px;
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
		    box-shadow: 0 0 10px rgba(0,0,0,0.5);
	}	

	.contact_hide {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: (1fr)[5];
		grid-template-columns: repeat(5, 1fr);
		-ms-grid-rows: 20px 1fr;
		grid-template-rows: 20px 1fr;
		margin-top: 10px;
   		font-size: 11px;
   		text-align: center;
	}

	.contact_hide > *:nth-child(1) {
		-ms-grid-row: 1;
		-ms-grid-column: 1;
	}

	.contact_hide > *:nth-child(2) {
		-ms-grid-row: 1;
		-ms-grid-column: 2;
	}

	.contact_hide > *:nth-child(3) {
		-ms-grid-row: 1;
		-ms-grid-column: 3;
	}

	.contact_hide > *:nth-child(4) {
		-ms-grid-row: 1;
		-ms-grid-column: 4;
	}

	.contact_hide > *:nth-child(5) {
		-ms-grid-row: 1;
		-ms-grid-column: 5;
	}

	.contact_hide > *:nth-child(6) {
		-ms-grid-row: 2;
		-ms-grid-column: 1;
	}

	.contact_hide > *:nth-child(7) {
		-ms-grid-row: 2;
		-ms-grid-column: 2;
	}

	.contact_hide > *:nth-child(8) {
		-ms-grid-row: 2;
		-ms-grid-column: 3;
	}

	.contact_hide > *:nth-child(9) {
		-ms-grid-row: 2;
		-ms-grid-column: 4;
	}

	.contact_hide > *:nth-child(10) {
		-ms-grid-row: 2;
		-ms-grid-column: 5;
	}

	.contact_hide #c1,
	.contact_hide #c2,
	.contact_hide #c3,
	.contact_hide #c4,
	.contact_hide #c5 {
		margin: 0 10px;
		background-color: white;
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
		        box-shadow: 0 0 10px rgba(0,0,0,0.5);
		font-weight: bold;
		padding: 2px;
		border-radius: 4px;
	}

	.contact_hide #c1 {
		-ms-grid-column: 1;
		grid-column: 1;
	}
	
	.contact_hide #c2 {
		-ms-grid-column: 2;
		grid-column: 2;
	}

	.contact_hide #c3 {
		-ms-grid-column: 3;
		grid-column: 3;
	}

	.contact_hide #c4 {
		-ms-grid-column: 4;
		grid-column: 4;
	}

	.contact_hide #c5 {
		-ms-grid-column: 5;
		grid-column: 5;
	}

	.town {
		-ms-grid-column: 1;
		-ms-grid-column-span: 5;
		grid-column: 1/6;
		-ms-grid-row: 2;
		grid-row: 2;
	}

	.town p {
		font-size: 10px;
	}

	.town p a {
		font-size: 13px;
	}
}