@font-face {
    font-family: 'ciutadella_runbold_italic';
    src: url('../font/ciutadella_run-bold_italic-webfont.eot');
    src: url('../font/ciutadella_run-bold_italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ciutadella_run-bold_italic-webfont.woff') format('woff'),
         url('../font/ciutadella_run-bold_italic-webfont.ttf') format('truetype'),
         url('../font/ciutadella_run-bold_italic-webfont.svg#ciutadella_runbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
* {
	margin:0;
	padding:0;
}
#game {
	width:620px;
	position:relative;
	min-height:800px;
}
#start {
	background:url("../img/bg/start.jpg?v3") no-repeat;
}
#goal {
	background:url("../img/bg/goal.jpg?v3") no-repeat;
	height:1198px;
}
#defense {
	background:url("../img/bg/defense.jpg?v3") no-repeat;
	height:1408px;
}
#midfield {
	height:1408px;
	background:url("../img/bg/midfield.jpg?v3") no-repeat;
}
#striker {
	background:url("../img/bg/striker.jpg?v3") no-repeat;
	height:1248px;
}
.defense #player_6,
.defense #player_7,
.defense #player_8,
.defense #player_9,
.defense #player_10,
.defense #player_11,
.midfield #player_11 {
	display:none;
}
#feedback {
	background:url("../img/bg/feedback.jpg?v3") no-repeat;
	height:1078px;
}
#compare-user {
	background:url("../img/bg/compare-user.jpg?v3") no-repeat;
	height:1198px;
}
#compare-office {
	background:url("../img/bg/compare-office.jpg?v3") no-repeat;
	height:1198px;
}
#compare-lodda {
	background:url("../img/bg/compare-lodda.jpg?v3") no-repeat;
	height:1198px;
}
.absolute {
	position:absolute;
	z-index:1;
}
#statistic-office .player,
#statistic-all .player,
#statistic-lodda .player {
	z-index:3;
}
.site {
	width:620px;
	height:1387px;
	left:0;
	top:0;
}
.hidden {
	display:none;
	z-index:0;
}
.button {
	cursor:pointer;
	width:290px;
	height:65px;
}
.player {
	width:125px;
	height:129px;
	float:left;
	margin:0 0 7px 20px;
	cursor:pointer;
}
.feedback .player {
	margin-top:128px;
}
.settle .player {
	position:relative;
}
.player .name {
	position:absolute;
	bottom:0;
	left:-20px;
	right:auto;
	top:auto;
	background:#061b3a;
	width:115px;
	height:35px;
	line-height:25px;
	font-size:12px;
	color:#FFF;
	text-align:center;
	word-wrap: nowrap;
	white-space: nowrap;
	overflow:hidden;
}
#player .player .name {
	bottom:3px;
	left:-28px;
}
.player .team {
	position:absolute;
	bottom:3px;
	left:-20px;
	width:115px;
	text-align:center;
	top:auto;
	right:auto;
	background:none;
	color:#FFF;
}
#player .player .team {
	left:-28px;
}
.settle {
	top:221px;
	left:24px;
}
.settle:hover .player {
	opacity:0.7;
	filter:alpha(opacity=70);
}
.settle .player:hover {
	opacity:1;
	filter:alpha(opacity=100);
}
.settle .player.active {
	opacity:0.5;
	filter:alpha(opacity=50);
}
.settle:hover .player.active {
	opacity:0.3;
	filter:alpha(opacity=30);
}
.player img {
	width:72px;
	margin-left:7px;
}
#start {
	z-index:5;
}
#startButton {
	top:571px;
	left:168px;
	z-index:5;
}
#shareButton {
	left:20px;
	top:254px;
	z-index:3;
}
.midfield #player_11 {
	display:none;
}
.feedback #shareButton,
.compare #shareButton {
	display:block;
}
.compare #shareButton {
	left: 360px;
    top: 410px;
}
#restartButton {
	left: 160px;
    top: 1073px;
	display:none;
}
.compare #restartButton {
	display:block;
}
#compareUserButton,
#compareOfficeButton,
#compareLoddaButton {
	left: 30px;
    top: 713px;
    width: 230px;
	display:none;
}
#compareOfficeButton {
    top: 787px;
}
#compareLoddaButton {
    top: 927px;
}
.compare #compareUserButton,
.compare #compareOfficeButton,
.compare #compareLoddaButton {
	display:block;
}
#compareButton {
	top:254px;
	left:310px;
}
#popupButton {
	left: 328px;
    top: 18px;
	display:none;
}
.feedback #popupButton,
.compare #popupButton{
	display:block;
}
#backButton {
	top:1270px;
	left:50px;
	display:none;
}
.defense #backButton {
	top:1319px;
}
.midfield #backButton {
	top:1319px;
}
.feedback #backButton {
	top:985px;
}
.defense #backButton,
.midfield #backButton,
.striker #backButton,
.goal #backButton,
.feedback #backButton {
	display:block;
}
#player .player {
	z-index:3;
	cursor:default;
	opacity:0;
	filter:alpha(opacity=0);
}
#player_1 {
	left:255px;
  top:932px;
}
#player_2 {
	left:65px;
	top:789px;
}
#player_3 {
	left:196px;
	top:789px;
}
#player_4 {
	left:327px;
	top:789px;
}
#player_5 {
	left:458px;
	top:789px;
}
#player_6 {
	left:86px;
	top:513px;
}
#player_7 {
	left:173px;
	top:556px;
}
#player_8 {
	left:261px;
	top:513px;
}
#player_9 {
	left:348px;
	top:556px;
}
#player_10 {
	left:436px;
	top:513px;
}
#player_11 {
	left:259px;
	top:798px;
}
#statistic-user_1 {
	left: 145px;
    top: 461px;
}
#statistic-user_2 {
	left: 1px;
    top: 356px;
}
#statistic-user_3 {
	left: 97px;
    top: 356px;
}
#statistic-user_4 {
	left: 192px;
    top: 356px;
}
#statistic-user_5 {
	left: 288px;
    top: 356px;
}
#statistic-user_6 {
	left: 2px;
    top: 216px;
}
#statistic-user_7 {
	left: 74px;
    top: 256px;
}
#statistic-user_8 {
	left: 146px;
    top: 220px;
}
#statistic-user_9 {
	left: 216px;
    top: 252px;
}
#statistic-user_10 {
	left: 288px;
    top: 224px;
}
#statistic-user_11 {
	left: 145px;
	top: 122px;
}

#statistic-all_1,
#statistic-office_1,
#statistic-lodda_1 {
	left: 396px;
    top: 836px;
}
#statistic-all_2,
#statistic-office_2,
#statistic-lodda_2 {
	left: 252px;
    top: 731px;
}
#statistic-all_3,
#statistic-office_3,
#statistic-lodda_3 {
	left: 348px;
    top: 731px;
}
#statistic-all_4,
#statistic-office_4,
#statistic-lodda_4 {
	left: 443px;
    top: 731px;
}
#statistic-all_5,
#statistic-office_5,
#statistic-lodda_5 {
	left: 540px;
    top: 731px;
}
#statistic-all_6,
#statistic-office_6,
#statistic-lodda_6 {
	left: 252px;
    top: 590px;
}
#statistic-all_7,
#statistic-office_7,
#statistic-lodda_7 {
	left: 324px;
    top: 631px;
}
#statistic-all_8,
#statistic-office_8,
#statistic-lodda_8 {
	left: 396px;
    top: 595px;
}
#statistic-all_9,
#statistic-office_9,
#statistic-lodda_9 {
	left: 467px;
    top: 626px;
}
#statistic-all_10,
#statistic-office_10,
#statistic-lodda_10 {
	left: 540px;
    top: 598px;
}
#statistic-all_11,
#statistic-office_11,
#statistic-lodda_11 {
	left: 396px;
    top: 497px;
}

.midfield #player_1 {
	left: 253px;
    top: 955px;
}
.midfield #player_2,
.midfield #player_3,
.midfield #player_4,
.midfield #player_5 {
	top:819px;
}
.midfield #player_6,
.midfield #player_8,
.midfield #player_10 {
	top:647px;
}
.midfield #player_7,
.midfield #player_9 {
	top:785px;
}
.feedback #player_1 {
	top:679px;
}
.feedback #player_2,
.feedback #player_3,
.feedback #player_4,
.feedback #player_5 {
	top:545px;
}
.feedback #player_6,
.feedback #player_8,
.feedback #player_10 {
	top:375px;
}
.feedback #player_7,
.feedback #player_9 {
	top:418px;
}
.feedback #player_11 {
	top:250px;
}
.striker #player_11 {
	margin-top:-315px !important;
}
.share .player {
	opacity:1!important;
	filter:alpha(opacity=100)!important;
}
.share #striker {
	top:-300px;
	height:1000px;
	overflow:none;
}
.player span {
	background:#1858e0;
	color:#FFF;
	font: 10px arial;
    padding: 2px 5px;
    right: 31px;
	position:absolute;
	top:0;
}
.defense #player .player,
.midfield #player .player {
	margin-top:154px;
}
.midfield #player .player {
	margin-top:134px;
}
.striker #player .player {
	margin-top:120px;
}
h1 {
	color:#FFFFFF;
  font-family:ciutadella_runbold_italic;
  font-size:34px;
  left:45px;
  position:absolute;
  top:100px;
}
h2 {
	color:#FFFFFF;
  font-family:ciutadella_runbold_italic;
  font-size:26px;
  left:247px;
  position:absolute;
  text-align:center;
  top:130px;
}
#player .player img {
	width:70px;
	margin:0;
}

#statistic-office .player img,
#statistic-user .player img,
#statistic-all .player img,
#statistic-lodda .player img {
  margin-left:3px;
  width:57px;
}
#statistic-office .player span,
#statistic-user .player span,
#statistic-all .player span,
#statistic-lodda .player span {
  background-color:#1858E0;
  background-position:initial initial;
  background-repeat:initial initial;
  color:#FFFFFF;
  font-family:arial;
  font-size:10px;
  font-style:normal;
  font-variant:normal;
  font-weight:normal;
  left:-20px;
  line-height:normal;
  padding:2px 5px;
  position:absolute;
  top:0;
  right:auto;
}
#statistic-office .player .team,
#statistic-user .player .team,
#statistic-all .player .team,
#statistic-lodda .player .team {
  background:none;
  background-position:initial initial;
  background-repeat:initial initial;
  bottom:31px;
  color:#FFFFFF;
  left:-32px;
  position:absolute;
  right:auto;
  text-align:center;
  top:auto;
  width:112px;
}
#statistic-office .player .name,
#statistic-user .player .name,
#statistic-all .player .name,
#statistic-lodda .player .name {
  background-color:#061B3A;
  background-position:initial initial;
  background-repeat:initial initial;
  bottom:29px;
  color:#FFFFFF;
  font-size:10px;
  height:28px;
  left:-18px;
  line-height:17px;
  overflow:hidden;
  position:absolute;
  right:auto;
  text-align:center;
  top:auto;
  white-space:nowrap;
  width:86px;
}
.striker #player .player {
  margin-top:-3px;
}
.defense #player #player_2,
.defense #player #player_3,
.defense #player #player_4,
.defense #player #player_5 {
	margin-left: 14px;
    margin-top: 165px;
}
.striker #player #player_2,
.striker #player #player_3,
.striker #player #player_4,
.striker #player #player_5 {
    margin-left: 14px;
    margin-top: 5px;
}
.midfield #player .player {
    margin-top: 134px;
}
.midfield #player #player_2, 
.midfield #player #player_3, 
.midfield #player #player_4, 
.midfield #player #player_5 {
    margin-left: 14px;
}
.midfield #player #player_6 {
	margin-left:2px;
}
.midfield #player #player_7 {
    margin-left: 8px;
    margin-top: 36px;
}
.midfield #player #player_8 {
    margin-left: 14px;
    margin-top: 134px;
}
.midfield #player #player_9{
    margin-left: 18px;
    margin-top: 36px;
}
.midfield #player #player_10 {
    margin-left: 18px;
}
.striker #player #player_6,
.striker #player #player_7,
.striker #player #player_8,
.striker #player #player_9,
.striker #player #player_10 {
    margin-left: 10px;
    margin-top: 108px;
}
.striker #player #player_6 {
	margin-left:2px;
}
.striker #player #player_8 {
	margin-left:12px;
}
.striker #player #player_9 {
	margin-left:19px;
}
.striker #player #player_10 {
	margin-left:24px;
}
.compare .player {
	margin-top:100px;
}
#popupBG {
	position:fixed;
	z-index:9;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background:rgba(0,0,0,0.5);
}
#popup {
	position:absolute;
	top:50%;
	left:50%;
	width:300px;
	height:410px;
	margin:-205px 0 0 -150px;
	background:url("../img/mobile/popup.jpg?v3") no-repeat;
	z-index:10;
}
#popup iframe {
	width:100%;
	height:100%;
}
.player .right {
	position:absolute;
	top:80px;
	right:39px;
	width:17px;
	height:17px;
	cursor:pointer;
	background:url("../img/bg/right.png") no-repeat;
}
.player .left {
	position:absolute;
	top:80px;
	cursor:pointer;
	left:-17px;
	width:17px;
	height:17px;
	background:url("../img/bg/left.png") no-repeat;
}
#player_2 .left,
#player_5 .right,
#player_6 .left,
#player_10 .right {
	display:none;
}
#player_12,
#player_13,
#player_14,
#player_15,
#player_16,
#statistic-lodda_12,
#statistic-lodda_13,
#statistic-lodda_14,
#statistic-lodda_15,
#statistic-lodda_16,
#statistic-office_12,
#statistic-office_13,
#statistic-office_14,
#statistic-office_15,
#statistic-office_16 {
	display:none;
}
#edm {
	width:250px;
	height:140px;
	top:0;
	left:0;
	z-index:9;
}
.striker #backButton {
	top:1155px;
}

.player,.settle {
	padding:50px 0 0;
}
.settle .player {
	padding:0;
}
.compare .player,
.feedback .player {
 	padding:0; 
}