@charset "UTF-8";	
html {
	font-family: sans-serif;
	height: 100%;
	line-height: 1.15;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}
article,
aside,
footer,
header,
nav,
section {
	display: block; }

div, 
ul, 
ol, 
li, 
h1, 
h2, 
h3, 
h4, 
h5, 
h6, 
pre, 
form, 
p, 
th, 
td {
	margin: 0;
	padding: 0;
}
a:active,
a:hover {
	outline-width: 0; }

img {
	border-style: none; }

svg:not(:root) {
	overflow: hidden; }

html {
	box-sizing: border-box;
	font-size: 100%; }

*,
*::before,
*::after {
	box-sizing: inherit; }

body {	
	background: #d0ebff;
	color: #fff;
	font-family: 'Quicksand', sans-serif;
	font-size: 1em;
	margin: 0;
	min-height: 100%;
	padding: 0;
	padding: 0;
	font-weight: normal;
	line-height: 1.5; }
img {
	display: inline-block;
	vertical-align: middle;
	max-width: 100%;
	height: auto;
	-ms-interpolation-mode: bicubic;
}
.site-wrapper {
	background: #d0ebff;
}
.map-wrap {
	display: none;
}
.logo-wrap {
	border-radius: 240px;
	box-shadow: -7px 7px 0 #8393a0;
	height: 230px;
	margin: 20px auto;
	position: relative;
	width: 230px;
	z-index: 100;
}
.logo-bg, 
.logo-globe {
	left: 0;
	position: absolute;
	top: 0;
}
.logo-copy {
	left: 0;
	position: absolute;
	top: 10px;
	text-align: center;
	width: 100%;
}
.logo-avatar {
	margin: 0 auto 0;
}
.logo-avatar, 
.logo-avatar img {
	border-radius: 100%;
	height: 70px;
	width: 70px;
}
.logo-name {
	font-size: 26px;
	line-height: 1.3;
	margin-bottom: 4px;
}
.logo-title {
	font-size: 28px;
	font-weight: bold;
	line-height: 1.15;
	margin-bottom: 4px;
	margin-top: -4px;
}
.logo-name, 
.logo-title {
	text-shadow: 0 0 5px rgba(105, 105, 105, 1);
}
.logo-social img {
	margin-left: 3px;
	margin-right: 3px;
}
.title-intro {
	font-size: 22px;
	font-weight: bold;
	line-height: 1.3;
	padding: 16px;
	text-align: center;
}
.song-item {
	display: flex;
	margin-bottom: 25px;
}
.song-country {
	position: relative;
	width: 40%;
}
.song-country__img {
	text-align: center;
}
.song-country__img img {
	max-height: 160px;
}
.song-country__player {
	left: 50%;
	margin-top: -22px;
	margin-left: -22px;
	position: absolute;
	top: 50%;
}
.song-item__title {
	font-size: 1.4em;
	line-height: 1.25;
	padding-left: 12px;
	padding-top: 46px;
}
@media all and (max-width: 767px) {
	.title-intro {
		background: linear-gradient(45deg, #9880fc 0%,#12b7d0 50%,#61c944 100%);
	}
	.mobile-content {
		color: #315d7f;
		padding-left: 12px;
		padding-right: 12px;
	}
}
@media all and (min-width: 768px) {
	body {
		background: linear-gradient(45deg, #9880fc 0%,#12b7d0 50%,#61c944 100%);
	}
	.mobile-content {
		display: none;
	}
	.map-wrap {
		display: block;
		padding-top: 90px;
		min-width: 700px;
		overflow: hidden;
		position: relative;
		text-align: center;
	}
	.site-map {
		min-width: 1350px;
	}
	.content-wrap {
		margin: 0 auto;
		max-width: 1350px;
		position: relative;
	}
	.logo-wrap {
		position: absolute;
		top: 10px;
		right: 20px;
	}
	.title-intro {
		font-size: 40px;
	}
}

.mobile-content ul {
	list-style: none;
}

.player-mobile .player-title {
	text-align: left;
}

.player-item {
	position: absolute;
}
.player-preview {
	cursor: pointer;
	width: 36px;
}
.player-icon {
	background: linear-gradient(55deg, #ff7000 0%,#ffc928 100%);
	border-radius: 44px;
	cursor: pointer;
	height: 36px;
	position: relative;
	width: 36px;
}	
.player-icon-mobile {
	/*background: url(../images/play.png);*/
}	
.player-icon:after {
	/*
	border-width: 9px 0 9px 18px;
	border-color: transparent transparent transparent #fff;
	border-style: solid;
	content: "";
	height: 0;
	left: 50%;
	margin-left: -7px;
	margin-top: -10px;
	position: absolute;
	top: 50%;
	width: 0;
	*/
    border-width: 8px 0 8px 16px;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    content: "";
    height: 0;
    left: 50%;
    margin-left: -6px;
    margin-top: -8px;
    position: absolute;
    top: 50%;
    width: 0;	
}
.player-stick {
	background: #d35f04;
	height: 22px;
	margin: 0 auto;
	position: relative;
	width: 3px;
}
.player-stick:after {
	background: #d35f04;
	border-radius: 8px;
	bottom: 0;
	content: "";
	height: 8px;
	left: 50%;
	margin-left: -4px;
	margin-top: -4px;
	position: absolute;
	width: 8px;
}
.player-full {
	background: #ff7000;
	border-radius: 40px 0 40px 40px;
	display: none;
	padding: 14px;
	position: relative;
	z-index: 100;
}
.player-item .player-full {
	left: -10px;
	position: absolute;
	top: -60px; 
}
.player-item:hover .player-full {
	/*display: block;*/
}
.player-mobile {
	background: #d0ebff;
	bottom: 0;
	box-shadow: 0 0 8px rgba(0, 0, 0, .3);
	display: none;
	left: 0;
	padding: 20px 25px 20px 10px;
	position: fixed;
	width: 100%;
	z-index: 150;
}
.player-mobile .player-full {
	display: block;
}
.song-country__player:hover .player-mobile {
	/*display: block;*/
} 
.player-title {
	color: #fff;
	text-align: center;
}
.player-close {
	background: #fff;
	border: 6px solid #ff7000;
	border-radius: 50px;
	color: #8393a0;
	cursor: pointer;
	font-size: 35px;
	height: 46px;
	line-height: 24px;
	padding: 4px;
	position: absolute;
	text-align: center;
	top: -20px;
	right: -20px;
	width: 46px;
}
.player-mobile .player-close {
	top: -10px;
}
.player-item__gb {
	left: 200px;
	top: 220px;
}
.player-item__poland {
	left: 325px;
	top: 240px;
}
.player-item__greece {
	left: 312px;
	top: 338px;
}
.player-item__bulgaria {
	left: 355px;
	top: 312px;
}
.player-item__turkey {
	left: 415px;
	top: 340px;
}
.player-item__armeina {
	left: 465px;
	top: 332px;
}
.player-item__iran {
	left: 545px;
	top: 365px;
}
.player-item__india {
	left: 670px;
	top: 382px;
}
.player-item__romania {
    left: 388px;
    top: 308px;
}