@import "reset.css";

body {
	font-family:Miriad Pro;
	background:#b6d54f url("http://media.hm.leikurinn.is/images/bg.png") repeat-x;
	padding-bottom:100px;
}

#how-to-predict-page {
	background-image:url("http://media.hm.leikurinn.is/images/how-to-predict-bg.png");
}

#top16-page {
	background-image:url("http://media.hm.leikurinn.is/images/top16-bg.png");
}
/*--- Common elements and classess ---*/
br {
	clear:both;
}

.floatleft {
	float:left;
}

.floatright {
	float:right;
}

a img {
	border:0px;
}

a {
	text-decoration:none;
}

/*--- End of Common ---*/
#main-container {
	width:1012px;
	overflow:hidden;
	margin:auto;
}

#left-container {
	width:820px;
	float:left;

}

#header {
	width:100%;
	float:left;
	height:162px;
	position:relative;
	background:url("http://media.hm.leikurinn.is/images/page-top.jpg") no-repeat left bottom;
}

/*--- Leikurinn Logo ---*/
#logo {
	position:absolute;
	left:30px;
	top:38px;
}

#logo h1 {
	text-indent:-9999px;
}

#logo a {
	width:445px;
	height:53px;
	background:url("http://media.hm.leikurinn.is/images/logo.jpg") no-repeat 0px 0px;
	display:block;
}

#logo a:hover {
	background-position:0px -53px;
}
/*--- Top content bellow grass ---*/
#top-nav {
	width:800px;
	padding:6px 10px 0px 10px;
	float:left;
	height:20px;
	background:#b7d54d;
	color:#231f20;
	font-size:17px;
	line-height:20px;
	margin-bottom:2px;
}

#top-nav a {
	color:#231f20;
}

#top-nav a:hover {
	text-decoration:underline;
}
/*--- Center Content ---*/
#main-content {
	float:left;
	width:100%;
	background:#b7d54d;
	-webkit-border-radius:0px 0px 12px 12px;
	-moz-border-radius:0px 0px 12px 12px;
	border-radius:0px 0px 12px 12px;
	min-height:700px;
}

#top16-page #main-content {
	padding-bottom:110px;
}

#qualification-page #main-content {
	padding-bottom:50px;
}

#how-to-predict-page #main-content {
	padding-bottom:80px;
}

#main-content h2 {
	color:#fff;
	font-size:34px;
	line-height:36px;
	font-weight:normal;
	padding:8px 0px 0px 33px;
	float:left;
}

#how-to-predict-page h2 {
	color:#231f20;
	font-size:26px;
}
/*--- Gray Round Button ---*/
#submit-button {
	color:#231f20;
	font-size:28px;
	line-height:30px;
	font-weight:bold;
	text-decoration:none;
	display:block;
	width:160px;
	height:38px;
	line-height:38px;
	text-align:center;
	background-color:#babcbe;
	-webkit-border-radius:8px 8px 8px 8px;
	-moz-border-radius:8px 8px 8px 8px;
	border-radius:8px 8px 8px 8px;
	position:relative;
	overflow:hidden;
	margin: 35px auto 0px auto;
}

#submit-button:hover {
	background-color:#666;
	color:#eee;
}
/*--- GROUP RESULTS INPUT SETTINGS ---*/
#group-results-input {
	width:550px;
	height:220px;
	margin:auto;
	overflow:hidden;
	padding:50px 0px 15px 0px;
}

/*--- QUALIFICATIONS RESULTS INPUT SETTINGS ---*/
#qualifications-results-input {
	float:left;
	width:100%;
}

/*--- HOW TO PREDICT RESULTS INPUT SETTINGS ---*/
#howtopredict-results-input {
	float:left;
	width:610px;
	padding-left:15px;
}
/*--- RESULTS LISTS ---*/
.results-list ul{
	width:175px;

}

.qualification-list {
	padding:15px 18px;
}

.howtopredict-list {
	padding: 15px 0px;
}

.fourth {
	padding-right:0px;
}

#how-to-predict-page .howtopredict-list li {
	width:142px;
	padding-left:5px;
	padding-right:5px;
}

#how-to-predict-page .howtopredict-list li.loss {
	background-color:#dfa58c;
	width:140px;
	height:25px;
	border:1px solid #ee3224;
}

#how-to-predict-page .howtopredict-list li.draw {
	background-color:#ead580;
	height:25px;
	width:140px;
	border:1px solid #fee43f;
}


#how-to-predict-page .howtopredict-list li.win {
	background-color:#9ccf83;
	width:140px;
	height:25px;
	border:1px solid #398941;
}

/*--- HOW TO PREDICT INDICATORS ---*/
#indicators {
	float:right;
	padding-right:10px;
	padding-top:25px;
	width:180px;
}

#indicators div {
	margin-bottom:18px;
	text-indent:5px;
}

#draw-indicator {
	background-color:#ead580;
	width:175px;
	height:25px;
	border:1px solid #fee43f;
	color:#231f20;
	font-size:15px;
	line-height:25px;
}

#loss-indicator {
	background-color:#dfa58c;
	width:175px;
	height:25px;
	border:1px solid #ee3224;
	color:#231f20;
	font-size:15px;
	line-height:25px;
}

#win-indicator {
	background-color:#9ccf83;
	width:175px;
	height:25px;
	border:1px solid #398941;
	color:#231f20;
	font-size:15px;
	line-height:25px;
}

/*--- END HOW TO PREDICT INDICATORS ---*/

.results-list li{
	width:200px;
	height:27px;
	margin:5px 0px;
}

.group-title {
	font-size:24px;
	color:#231f20;
	line-height:25px;
}

#howtopredict-results-input .group-title {
	color:#fff;
	text-indent:18px;
}

.howtopredict-list .home-team , .howtopredict-list .away-team {
	width:65px;
}

 .home-team {
	width:95px;
	float:left;
}

 .away-team {
	width:95px;
	float:right;
}

 .separator {
	float:left;
	width:10px;
	text-align:center;
	height:25px;
	line-height:25px;
}

.final-score {
	height:25px;
	line-height:25px;
	width:10px;
}

.home-team input, .away-team input{
	width:22px;
	height:22px;
	line-height:22px;
	padding:0px;
	margin:0px;
}

 .team-flag {
	height:25px;
	line-height:25px;
	width:22px;
}

 .team-name {
    font-size: 12px;
	height:25px;
	line-height:25px;
	width:32px;
	text-align:center;
}

.team-name-vote {
    width:50px;
}

.away-team div {
	float:right;
}

 .away-team input {
	float:left;
}

 .home-team div {
	float:left;
}

 .home-team input {
	float:right;
}

/*--- END OF GROUP RESULTS INPUT SETTINGS ---*/

/*--- LADDER ---*/

#ladder {
	width:100%;
	float:left;
	height:540px;
	margin-top:50px;
	position:relative;
}

.normal-game{
	width:100px;
	height:110px;
	border:2px solid #fff;
	color:#231f20;
	position:absolute;
	-webkit-border-radius:8px 8px 8px 8px;
	-moz-border-radius:8px 8px 8px 8px;
	border-radius:8px 8px 8px 8px;
}

.normal-game .home-team-flag {
	position:absolute;
	width:22px;
	height:24px;
	top:15px;
	left:7px;
}

.normal-game .away-team-flag {
	position:absolute;
	width:22px;
	height:24px;
	bottom:11px;
	left:7px;
}

.normal-game .home-team-name {
	position:absolute;
	font-size:13px;
	line-height:15px;
	width:63px;
	top:20px;
	left:34px;
}

.normal-game .away-team-name {
	position:absolute;
	font-size:13px;
	line-height:15px;
	width:63px;
	bottom:15px;
	left:34px;
}

.normal-game .result-separator {
	font-size:1px;
	line-height:1px;
	background:#fff;
	width:20px;
	height:1px;
	position:absolute;
	left:43px;
	top:56px;
}

.normal-game .home-result {
	position:absolute;
	left:49px;
	top:37px;
	font-size:18px;
}

.normal-game .away-result {
	position:absolute;
	left:49px;
	top:59px;
	font-size:18px;
}

/*--- Qualifying games for quarter-finals---*/

#game-1 {
	top:0px;
	left:20px;
}

#game-2 {
	top:138px;
	left:20px;
}


#game-3 {
	top:276px;
	left:20px;
}


#game-4 {
	top:414px;
	left:20px;
}

#game-5 {
	top:0px;
	right:12px;
}

#game-6 {
	top:138px;
	right:12px;
}


#game-7 {
	top:276px;
	right:12px;
}


#game-8 {
	top:414px;
	right:12px;
}

/*--- Quarterfinals ---*/

#quarter-game-1 {
	top:77px;
	left:135px;
}

#quarter-game-2 {
	top:354px;
	left:135px;
}

#quarter-game-3 {
	top:77px;
	right:133px;
}

#quarter-game-4 {
	top:354px;
	right:133px;
}

#semi-game-1 {
	top:215px;
	left:234px;
}

#semi-game-2 {
	top:215px;
	right:237px;
}

#finals {
	width:103px;
	height:183px;
	border:2px solid #fff;
	color:#231f20;
	position:absolute;
	top:180px;
	left:355px;
	-webkit-border-radius:8px 8px 8px 8px;
	-moz-border-radius:8px 8px 8px 8px;
	border-radius:8px 8px 8px 8px;
}

#finals h4 {
	font-size:19px;
	line-height:20px;
	position:absolute;
	width:103px;
	top:10px;
	left:0px;
	text-align:center;
	color:#fff;
}

#finals .home-team-flag {
	position:absolute;
	width:22px;
	height:24px;
	top:45px;
	left:7px;
}

#finals .away-team-flag {
	position:absolute;
	width:22px;
	height:24px;
	bottom:50px;
	left:7px;
}

#finals .home-team-name {
	position:absolute;
	font-size:13px;
	line-height:15px;
	width:63px;
	top:50px;
	left:34px;
}

#finals .away-team-name {
	position:absolute;
	font-size:13px;
	line-height:15px;
	width:63px;
	bottom:55px;
	left:34px;
}

#finals .result-separator {
	font-size:1px;
	line-height:1px;
	background:#fff;
	width:20px;
	height:1px;
	position:absolute;
	left:43px;
	top:88px;
}

#finals .home-result {
	position:absolute;
	left:49px;
	top:67px;
	font-size:18px;
}

#finals .away-result {
	position:absolute;
	left:49px;
	top:91px;
	font-size:18px;
}

/*-- Third Place ---*/
#third-place {
	width:184px;
	height:112px;
	border:2px solid #fff;
	-webkit-border-radius:8px 8px 8px 8px;
	-moz-border-radius:8px 8px 8px 8px;
	border-radius:8px 8px 8px 8px;
	position:absolute;
	top:415px;
	left:315px;
}

#third-place h4 {
	font-size:19px;
	line-height:20px;
	position:absolute;
	width:183px;
	top:10px;
	left:0px;
	text-align:center;
	color:#fff;
}

#third-place .home-team-flag {
	position:absolute;
	width:22px;
	height:24px;
	top:40px;
	left:7px;
}

#third-place .away-team-flag {
	position:absolute;
	width:22px;
	height:24px;
	bottom:15px;
	left:7px;
}

#third-place .home-team-name {
	position:absolute;
	font-size:13px;
	line-height:15px;
	width:63px;
	top:45px;
	left:34px;
}

#third-place .away-team-name {
	position:absolute;
	font-size:13px;
	line-height:15px;
	width:63px;
	bottom:20px;
	left:34px;
}

#third-place .result-separator {
	font-size:1px;
	line-height:1px;
	background:#fff;
	width:20px;
	height:1px;
	position:absolute;
	left:120px;
	top:68px;
}

#third-place .home-result {
	position:absolute;
	left:125px;
	top:43px;
	font-size:18px;
}

#third-place .away-result {
	position:absolute;
	left:125px;
	bottom:20px;
	height:15px;
	font-size:18px;
}

/*--- Game Indicators ---*/

.draw-game {
	background-color:#ead580!IMPORTANT;
	border:2px solid #fee43f!IMPORTANT;
}

.loss-game {
	background-color:#dfa58c!IMPORTANT;
	border:2px solid #ee3224!IMPORTANT;
}

.win-game {
	background-color:#9ccf83!IMPORTANT;
	border:2px solid #398941!IMPORTANT;
}

/*--- END LADDER   ---*/

/*--- Right Container  ---*/

#right-container {
	float:right;
	padding-top:190px;
	width:160px;
}

#right-container .rounded-block {
	width:158px;
	height:190px;
	position:relative;
	background-color:#b7d54d;
	-webkit-border-radius:8px 8px 8px 8px;
	-moz-border-radius:8px 8px 8px 8px;
	border-radius:8px 8px 8px 8px;
	margin-bottom:18px;
}
#right-container .rounded-block .rounded-block {
	position:absolute;
	bottom:-20px;
	left:0px;
	background-color:#dae796;
	height:155px;
	float:left;
}

#right-container .rounded-block h2 {
	float:left;
	padding:5px;
	clear:both;
	color:#fff;
	font-weight:700;
	font-size:16px;
	line-height:18px;
}

#right-container .rounded-block a.more {
	position:absolute;
	bottom:10px;
	right:15px;
	color:#231f20;
	font-size:15px;
	line-height:17px;
	font-weight:bold;

}

#right-container .rounded-block a.more:hover {
	text-decoration:underline;
}

#right-container .rounded-block ul {
	padding:10px 15px 0px 15px;
	width:128px;
}

#right-container .rounded-block li {
	width:128px;
	float:left;
	height:25px;
	line-height:25px;
	color:#231f20;
	font-size:12px;
	line-height:14px;
	font-weight:bold;
}

#right-container .rounded-block li.green {
	color:#00a651;
}

#right-container .rounded-block li.red {
	color:#ee2524;
}

/*--- Collection Points ---*/

#collection-points {
	padding:15px 0px 0px 75px;
	float:left;
}

#collection-points li {
	width:730px;
	float:left;
	padding:3px 0px;
	color:##231f20;
	font-size:18px;
	line-height:20px;
}

#collection-points li div {
	float:right;
	width:450px;
}

#collection-points li span {
	float:left;
	display:block;
	width:280px;
}

#page_1_container {
	float:left;
	padding:25px 0px 0px 100px;
	width:640px;
}

#page_1_container a {
	color:#000;
}

#page_1_container h3 {
	color:#fff;
	padding-bottom:10px;
	float:left;
	width:100%;
}

#page_1_left {
	float:left;
	width:320px;
}

#page_1_right {
	float:left;
	width:320px;
}

#page_1_container li {
	float:left;
	width:300px;
	padding:3px 0px 3px 20px;
}

#page_1_text {
	width:650px;
	float:left;
	padding-left:45px;
	padding-top:10px;
	color:#000;
	line-height:18px;
}

.people-icon {
	display:block;
	float:left;
	padding-left:30px;
	background:url("http://media.hm.leikurinn.is/images/klukka.png") no-repeat left center;
    background-size: 25px;
}

.pencil-icon {
	display:block;
	float:left;
	padding-left:30px;
	background:url("http://media.hm.leikurinn.is/images/breyta.png") no-repeat left center;
}

.spurn-icon {
	display:block;
	float:left;
	padding-left:30px;
	background:url("http://media.hm.leikurinn.is/images/spurning.png") no-repeat left center;
}

#page_2_container {
	float:left;
	padding:25px 0px 0px 90px;
	width:680px;
}

#page_2_container a {
	color:#000;
}

#page_2_text {
	float:left;
	width:680px;
	padding:10px 0px 0px 90px;
}

#page_2_left {
	float:left;
	width:285px;
}

#page_2_right {
	float:right;
	width:370px;
}


#page_2_left label{
	float:left;
	width:100%;
	padding:2px 0px;
}

#page_2_left input , #page_2_left select {
	float:right;
	width:182px;
	border:1px solid #000;
}

#page_2_right {
	float:right;
	width:375px;
	padding-top:25px;
}

#page_3_text {
	float:left;
	width:680px;
	padding:10px 0px 0px 90px;
}

#page_4_container {
	float:left;
	padding:25px 0px 0px 90px;
	width:680px;
}

#page_4_container a {
	color:#fff;
}

#page_4_container h3 {
	color:#fff;
	float:left;
	width:100%;
	padding-bottom:10px;
}

#page_4_text {
	float:left;
	width:680px;
	padding:10px 0px 0px 90px;
}

#page_4_left {
	float:left;
	width:285px;
}

#page_4_right {
	float:right;
	width:370px;
}


#page_4_left label{
	float:left;
	width:100%;
	padding:2px 0px;
}

#page_4_left input , #page_4_left select {
	float:right;
	width:182px;
	border:1px solid #000;
}

#page_4_right {
	float:right;
	width:375px;
	padding-top:25px;
}

#page_5_container {
	float:left;
	width:660px;
	padding:0px 0px 0px 90px;
}

.page_5_home_flag {
	float:left;
	width:27px;
	height:24px;
}

.page_5_home_team {
	float:left;
	width:86px;
	line-height:24px;
	height:24px;
}

.page_5_away_flag {
	float:left;
	width:27px;
	height:24px;
	text-align:right;
}

.page_5_away_team {
	float:left;
	width:86px;
	height:24px;
	line-height:24px;
	text-align:right;
}

.page_5_score_separator {
	width:5px;
	float:left;
	text-align:center;
	line-height:24px;
	height:24px;
}

.page_5_home_score {
	width:15px;
	float:left;
	height:24px;
	line-height:24px;
	text-align:left;
}

.page_5_away_score {
	width:15px;
	float:left;
	height:24px;
	line-height:24px;
	text-align:right;
}

.page_5_gameinfo {
	float:left;
	padding-left:25px;
	height:24px;
	line-height:24px;
}

#page_5_container li {
	float:left;
	width:100%;
	padding:3px 0px;
}

#page_6_container {
	float:left;
	width:775px;
	padding:25px 0px 0px 10px;
}

#page_6_container table {
	text-align:center;
	width:100%;
}

#page_6_container td {
	padding:3px 0px;
	vertical-align:middle;
	line-height:22px;
}

#page_6_container td span {
	float:left;
}

.first_row {
	width:32px;
}

.second_row {
	width:150px;
}

.third_row {
	width:90px;
	border-right:1px solid black;
}

.fourth_row {
	width:90px;
}

.fifth_row {
	width:110px;
	border-right:1px solid black;

}

.sixth_row {
	width:82px;
}

.seventh_row {
	width:86px;
}

.eigth_row {
	width:125px;
}

.ninth_row {
	width:55px;
}

.row_separator {
	border-bottom:1px solid black;
}

.normal_row {
	color:#fff;
}

.table_flag {
	float:left;
	padding:0px 5px;
}