body,html{
		padding: 0;
		margin-top: 16px;
		font-family: sans-serif;
		background-color:#0d7eae;
		-webkit-touch-callout: none;
	    -webkit-user-select: none;
	    -khtml-user-select: none;
	    -moz-user-select: moz-none;
	    -ms-user-select: none;
	    user-select: none;
		}



		#footer {
		position:absolute;
		background-image: url('../img/footer.png');
		width: 205px;
		height: 13px;
		left:95px;
		top:607px;
		}

		.hover { 
		background-color: #91c84b; 
		}

		.wrapper {
		width: 960px;
		margin: 0 auto;
		}

		.content {
		position:relative;
		background-image: url('../img/bakgrunnur.png');
		width: 960px;
		height: 630px;
		}

		#logo {
		position:absolute;
		background-image: url('../img/logo.png');
		height:113px;
		width:416px;
		top:30px;
		left:250px;
		cursor: pointer;
		}

		#veldu {
		position:absolute;
		background-image: url('../img/veldu.png');
		height:88px;
		width:160px;
		top:60px;
		left:750px;
		}

		#um {
		position:absolute;
		background-image: url('../img/um.png');
		height:88px;
		width:160px;
		top:30px;
		left:55px;
		cursor: pointer;
		}

		#krok1 {
		position:absolute;
		background-image: url('../img/krok1.png');
		height:209px;
		width:220px;
		top:150px;
		left:45px;
		cursor: pointer;
		}

		#krok2 {
		position:absolute;
		background-image: url('../img/krok2.png');
		height:197px;
		width:284px;
		top:185px;
		left:464px;
		cursor: pointer;
		}


	    #krok3 {
		position:absolute;
		background-image: url('../img/krok3.png');
		height:220px;
		width:315px;
		top:392px;
		left:45px;
		cursor: pointer;
		}


	    #krok4 {
		position:absolute;
		background-image: url('../img/krok4.png');
		height:266px;
		width:341px;
		top:334px;
		left:600px;
		cursor: pointer;
		}

		#skyMoving {
		position:absolute;
		background-image: url('../img/skyMoving.png');
		height:92px;
		width:160px;
		top:35px;
		left:-350px;
		}


		#skyMoving2 {
		position:absolute;
		background-image: url('../img/skyMoving2.png');
		height:72px;
		width:128px;
		top:135px;
		left:-200px;
		}


/*----------------plúsleikir------------------------------------*/		
		.plusContent {
		position:relative;
		background-image: url('../img/bakgrunnur.png');
		width: 960px;
		height: 630px;
		overflow: hidden;
		}

		#overlay {
	  	position:absolute;
		background-color: #2e2e2e;
		opacity: 0.98;
		width: 960px;
		height: 630px;
		z-index:100;
	    }
	
	    #finishText {
	  	position:absolute;
		background-image: url('../img/finishText.png');
		height:328px;
		width:574px;
		top:85px;
		left:175px;
		opacity: 1;
	    }

	    #expl1 {
	  	position:absolute;
		background-image: url('../img/expl1.png');
		height:328px;
		width:574px;
		top:85px;
		left:175px;
		opacity: 1;
	    }

	    #heim {
	  	position:absolute;
		background-image: url('../img/heim.png');
		height:88px;
		width:88px;
		top:519px;
		left:840px;
		cursor: pointer;
		-webkit-transition: all .1s ease-in-out;
	    }

	    #heim:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
	    }


	    #byrja {
	  	position:absolute;
		background-image: url('../img/byrja.png');
		height:88px;
		width:88px;
		top:276px;
		left:224px;
		cursor: pointer;
		-webkit-transition: all .1s ease-in-out;
	    }

	    #byrja:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
	    }


	    #heim2 {
	  	position:absolute;
		background-image: url('../img/heim2.png');
		height:88px;
		width:88px;
		top:277px;
		left:292px;
		cursor: pointer;
		-webkit-transition: all .1s ease-in-out;
	    }

	    #heim2:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
	    }

	     #aftur {
	  	position:absolute;
		background-image: url('../img/aftur.png');
		height:88px;
		width:88px;
		top:277px;
		left:148px;
		cursor: pointer;
		-webkit-transition: all .1s ease-in-out;
	    }

	    #aftur:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
	    }


	    #finish1 {
	  	position:absolute;
		background-image: url('../img/krok2.png');
		height:267px;
		width:217px;
		top:0px;
		left:0px;
		opacity: 1;
		cursor: pointer;
	    }

	   


		#diceContainer1 {
		position:absolute;
		width: 80px;
		height: 80px;
		top:375px;
		left:50px;
		}

		#diceContainer2 {
		position:absolute;
		width: 80px;
		height: 80px;
		top:375px;
		left:210px;
		}

		#diceContainer3 {
		position:absolute;
		width: 80px;
		height: 80px;
		top:501px;
		left:50px;
		}

		#diceContainer4 {
		position:absolute;
		width: 80px;
		height: 80px;
		top:501px;
		left:210px;
		text-align: center;
		}

		#emptyDice {
		position:absolute;
		background-image: url('../img/emptyDice.png');
		height:70px;
		width:70px;
		top:0px;
		left:0px;
		text-align: center;
		}

		#emptyDice p {
		font-size: 45px;
		margin-top:10px;

		}

		#emptyDice2 {
		position:absolute;
		background-image: url('../img/emptyDice2.png');
		height:70px;
		width:70px;
		top:0px;
		left:0px;
		}

		#emptyDice2 p {
		font-size: 45px;
		margin-top:10px;

		}


	


		#player {
		position:absolute;
		background-image: url('../img/player.png');
		height:63px;
		width:35px;
		top:415px;
		left:575px;
		z-index: 11;
		}

		#neutral {
		position:absolute;
		background-image: url('../img/neutral.png');
		height:91px;
		width:110px;
		top:272px;
		left:598px;
		}

		#rett {
		position:absolute;
		background-image: url('../img/rett.png');
		height:91px;
		width:100px;
		top:269px;
		left:616px;
		}

		#rangt {
		position:absolute;
		background-image: url('../img/rangt.png');
		height:85px;
		width:115px;
		top:273px;
		left:596px;
		}

		#spilabord {
		position:absolute;
		background-image: url('../img/spilabord.png');
		width: 284px;
		height: 480px;
		top:20px;
		left:625px;
		z-index: 10;
	
		}

		#b1 {
		position:absolute;
		background-image: url('../img/b1.png');
		height:168px;
		width:139px;
		top:50px;
		left:85px;
		}

		@-webkit-keyframes spaceboots {
		0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
		10% { -webkit-transform: translate(-1px, -2px) rotate(-20deg); }
		20% { -webkit-transform: translate(-3px, 0px) rotate(20deg); }
		30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
		40% { -webkit-transform: translate(1px, -1px) rotate(20deg); }
		50% { -webkit-transform: translate(-1px, 2px) rotate(-20deg); }
		60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
		70% { -webkit-transform: translate(2px, 1px) rotate(-20deg); }
		80% { -webkit-transform: translate(-1px, -1px) rotate(20deg); }
		90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
		100% { -webkit-transform: translate(1px, -2px) rotate(-20deg); }
		}

			@-moz-keyframes spaceboots {
		0% { -moz-transform: translate(2px, 1px) rotate(0deg); }
		10% { -moz-transform: translate(-1px, -2px) rotate(-20deg); }
		20% { -moz-transform: translate(-3px, 0px) rotate(20deg); }
		30% { -moz-transform: translate(0px, 2px) rotate(0deg); }
		40% { -moz-transform: translate(1px, -1px) rotate(20deg); }
		50% { -moz-transform: translate(-1px, 2px) rotate(-20deg); }
		60% { -moz-transform: translate(-3px, 1px) rotate(0deg); }
		70% { -moz-transform: translate(2px, 1px) rotate(-20deg); }
		80% { -moz-transform: translate(-1px, -1px) rotate(20deg); }
		90% { -moz-transform: translate(2px, 2px) rotate(0deg); }
		100% { -moz-transform: translate(1px, -2px) rotate(-20deg); }
		}

			@-ms-keyframes spaceboots {
		0% { -ms-transform: translate(2px, 1px) rotate(0deg); }
		10% { -ms-transform: translate(-1px, -2px) rotate(-20deg); }
		20% { -ms-transform: translate(-3px, 0px) rotate(20deg); }
		30% { -ms-transform: translate(0px, 2px) rotate(0deg); }
		40% { -ms-transform: translate(1px, -1px) rotate(20deg); }
		50% { -ms-transform: translate(-1px, 2px) rotate(-20deg); }
		60% { -ms-transform: translate(-3px, 1px) rotate(0deg); }
		70% { -ms-transform: translate(2px, 1px) rotate(-20deg); }
		80% { -ms-transform: translate(-1px, -1px) rotate(20deg); }
		90% { -ms-transform: translate(2px, 2px) rotate(0deg); }
		100% { -ms-transform: translate(1px, -2px) rotate(-20deg); }
		}
	
		.shake {
			-webkit-animation-name: spaceboots;
			-webkit-animation-duration: 0.8s;
			-webkit-transform-origin:50% 50%;
			-webkit-animation-iteration-count: 1;
			-webkit-animation-timing-function: linear;
			-moz-animation-name: spaceboots;
			-moz-animation-duration: 0.8s;
			-moz-transform-origin:50% 50%;
			-moz-animation-iteration-count: 1;
			-moz-animation-timing-function: linear;
			-ms-animation-name: spaceboots;
			-ms-animation-duration: 0.8s;
			-ms-transform-origin:50% 50%;
			-ms-animation-iteration-count:1;
			-ms-animation-timing-function: linear;
	
	
		}

	#check {
		position:absolute;
		background-image: url('../img/check.png');
		height:70px;
		width:70px;
		top:500px;
		left:428px;
		cursor: pointer;
		-webkit-transition: all .1s ease-in-out;
		}

		 #check:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
	    }


		#checkOverlay {
		position:absolute;
		background-image: url('../img/colorOverlay.png');
		height:108px;
		width:79px;
		top:467px;
		left:423px;
		cursor: pointer;
		z-index:1;
		}

		#checkOverlayWrong {
		position:absolute;
		background-image: url('../img/colorOverlayWrong.png');
		height:108px;
		width:79px;
		top:467px;
		left:423px;
		cursor: pointer;
		z-index:1;
		}


		#plus {
		position:absolute;
		background-image: url('../img/plus.png');
		height:28px;
		width:27px;
		top:522px;
		left:150px;
		cursor: pointer;
		}

		#plus2 {
		position:absolute;
		background-image: url('../img/plus.png');
		height:28px;
		width:27px;
		top:24px;
		left:-59px;
		cursor: pointer;
		}

		#plus3 {
		position:absolute;
		background-image: url('../img/plus.png');
		height:28px;
		width:27px;
		top:24px;
		left:-59px;
		cursor: pointer;
		}

		#equals {
		position:absolute;
		background-image: url('../img/equals.png');
		height:19px;
		width:27px;
		top:528px;
		left:300px;
		cursor: pointer;
		}

		#number1 {
		position:absolute;
		text-align: center;
		top:500px;
		left:45px;
		cursor: pointer;
		}

		#number2 {
		position:absolute;
		text-align: center;
		top:500px;
		left:205px;
		cursor: pointer;
		}

		#sum {
		position:absolute;
		text-align: center;
		top:500px;
		left:345px;
		cursor: pointer;
		}

		#d1 {
		position:absolute;
		background-image: url('../img/d1.png');
		height:70px;
		width:70px;
		top:0px;
		left:0px;
	
		}

		#d2 {
		position:absolute;
		background-image: url('../img/d2.png');
		text-align: center;
		height:70px;
		width:70px;
		top:0px;
		left:0px;
	
		}

		#d3 {
		position:absolute;
		background-image: url('../img/d3.png');
		text-align: center;
		height:70px;
		width:70px;
		top:0px;
		left:0px;
	
		}

		#d4 {
		position:absolute;
		background-image: url('../img/d4.png');
		text-align: center;
		height:70px;
		width:70px;
		top:0px;
		left:0px;
	
		}

		#d5{
		position:absolute;
		background-image: url('../img/d5.png');
		text-align: center;
		height:70px;
		width:70px;
		top:0px;
		left:0px;
	
		}

		#d6{
		position:absolute;
		background-image: url('../img/d6.png');
		text-align: center;
		height:70px;
		width:70px;
		top:0px;
		left:0px;
	
		}

		input, textarea, button {
	    -webkit-appearance: none; /*Safari/Chrome*/
	    -moz-appearance: none; /*Firefox*/
	    -ms-appearance: none; /*IE*/
	    -o-appearance: none; /*Opera*/
	    -webkit-border-radius: 0; 
		}

	input[type="text"]{
   		 font-size:40px;
   		 border:solid 3px black;
   		 width: 63px;
		 height: 63px;
		 padding:0;
		 -moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px; /* future proofing */
		-khtml-border-radius: 10px; /* for old Konqueror browsers */

		}
	
	
		#notNumber{
		position: absolute;
		top:585px;
		left:48px;
		color:#fff;
		font-size: 19px;
		}

		#naesta {
		position:absolute;
		background-image: url('../img/naesta.png');
		height:138px;
		width:60px;
		top:240px;
		left:300px;
		-webkit-transition: all .1s ease-in-out;
		cursor: pointer;
		}

		#naesta:hover {
		position:absolute;
		background-image: url('../../img/naestaHover.png');
		height:138px;
		width:60px;
		}

		#sidasta {
		position:absolute;
		background-image: url('../../img/sidasta.png');
		height:138px;
		width:60px;
		top:240px;
		left:30px;
		-webkit-transition: all .1s ease-in-out;
		cursor: pointer;
		}

		#sidasta:hover {
		position:absolute;
		background-image: url('../../img/sidastaHover.png');
		height:138px;
		width:60px;
		}

		#verk1 {
		position:absolute;
		background-image: url('../../img/verk1.png');
		height:32px;
		width:163px;
		top:510px;
		left:115px;
		}

		#verk2 {
		position:absolute;
		background-image: url('../../img/verk2.png');
		height:32px;
		width:167px;
		top:510px;
		left:115px;
		}

		#verk3 {
		position:absolute;
		background-image: url('../../img/verk3.png');
		height:32px;
		width:167px;
		top:510px;
		left:115px;
		}

		#umhverfi{
		position:absolute;
		background-image: url('../../img/umhverfi.png');
		height:73px;
		width:173px;
		top:465px;
		left:405px;
		cursor: pointer;
		}

		#umhverfi:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#talbladra{
		position:absolute;
		background-image: url('../../img/talbladra.png');
		height:73px;
		width:173px;
		top:465px;
		left:405px;
		cursor: pointer;
		}

		#talbladra:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#ny{
		position:absolute;
		background-image: url('../../img/ny.png');
		height:73px;
		width:173px;
		top:465px;
		left:405px;
		cursor: pointer;
		}

		#ny:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}


		#myndbrellur {
		position:absolute;
		background-image: url('../../img/myndbrellur.png');
		height:69px;
		width:173px;
		top:545px;
		left:405px;
		cursor: pointer;
		}

		#myndbrellur:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#hreyfing {
		position:absolute;
		background-image: url('../../img/hreyfing.png');
		height:69px;
		width:173px;
		top:545px;
		left:405px;
		cursor: pointer;
		}

		#hreyfing:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#faeraFram {
		position:absolute;
		background-image: url('../../img/faeraFram.png');
		height:69px;
		width:173px;
		top:545px;
		left:405px;
		cursor: pointer;
		}

		#faeraFram:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}
		


		#faera {
		position:absolute;
		background-image: url('../../img/faera.png');
		height:69px;
		width:173px;
		top:465px;
		left:765px;
		cursor: pointer;
		}

		#faera:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#hljod {
		position:absolute;
		background-image: url('../../img/hljod.png');
		height:69px;
		width:173px;
		top:465px;
		left:765px;
		cursor: pointer;
		}

		#hljod:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}
		

		#teikning {
		position:absolute;
		background-image: url('../../img/teikning.png');
		height:69px;
		width:172px;
		top:465px;
		left:585px;
		cursor: pointer;
		}

		#teikning:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#fela {
		position:absolute;
		background-image: url('../../img/fela.png');
		height:69px;
		width:172px;
		top:465px;
		left:585px;
		cursor: pointer;
		}

		#fela:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#bid {
		position:absolute;
		background-image: url('../../img/bid.png');
		height:69px;
		width:172px;
		top:465px;
		left:585px;
		cursor: pointer;
		}

		#bid:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}
		
		

		#tengja {
		position:absolute;
		background-image: url('../../img/tengja.png');
		height:69px;
		width:172px;
		top:545px;
		left:585px;
		cursor: pointer;
		}

		#tengja:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}


		#deila {
		position:absolute;
		background-image: url('../../img/deila.png');
		height:69px;
		width:172px;
		top:545px;
		left:585px;
		cursor: pointer;
		}

		#deila:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#endurtekning {
		position:absolute;
		background-image: url('../../img/endurtekning.png');
		height:69px;
		width:172px;
		top:545px;
		left:585px;
		cursor: pointer;
		}

		#endurtekning:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}
		
		

		#spila {
		position:absolute;
		background-image: url('../../img/spila.png');
		height:67px;
		width:173px;
		top:545px;
		left:765px;
		cursor: pointer;
		}

		#spila:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}

		#snua {
		position:absolute;
		background-image: url('../../img/snua.png');
		height:67px;
		width:173px;
		top:545px;
		left:765px;
		cursor: pointer;
		}

		#snua:hover{
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
    	-ms-transform: scale(1.1);
		}
		

		#videoContainer {
		position:absolute;
		height:323px;
		width:436px;
		top:70px;
		left:449px;
		border:solid black 1px;
		}

		#videoOnLoad {
		position:absolute;
		height:323px;
		width:436px;
		top:70px;
		left:449px;
		border:solid black 1px;
		}