/*Stylesheet used for trekking/kontrollvindu*/

a{
	text-decoration:none;
	color:#000000;
}

html,body{
	/*background:#AAAAAA;*/
	width:100%;
	height:100%;
	margin:0%;
	overflow:hidden;
}

body.bingo{
	background: url(../imgs/bg-header-new.png);
}

body.body-flex{
	display:inline-flex;
	flex-wrap:wrap;
	background: url(../imgs/bg-header-new.png);
	align-items:center;
	justify-content:center;
}

header.header-flex{
	display:inline-flex;
	height:20%;
	width:80%;
	justify-content:center;
	align-items:center;
}

/*tvmeny.php*/

main#main-tvmeny{
	width:100%;
	height:80%;
	display:inline-flex;
	justify-content:center;
}

div.storvindu{
	display:inline-flex;
	flex-direction:column;
	flex-wrap:wrap;
	background-color:#EEEEEE;
	width:90%;
	height: 90%;
	border-radius:10px;
	border:1px solid black;
	overflow:hidden;
}

nav.storvindunavigasjon{
	display:inline-flex;
	flex-wrap:wrap;
	box-sizing:border-box;
	width:20%;
	height:100%;
	align-content:flex-start;
}

nav.storvindunavigasjon a{
	padding-left:10px;
	display:inline-flex;
	align-items:center;
	width:100%;
	height:10%;
	box-sizing:border-box;
	border-bottom:1px solid black;
	transition:1s;
	font-weight:bold;
	border-right:1px solid black;
}

nav.storvindunavigasjon a.undervalg{
	padding-left:40px;
}

nav.storvindunavigasjon a:hover{
	transition:1s;
	background-color:#CCCCCC;
}

div.storvindu-hoyre{
	background-color:#EEEEEE;
	height:100%;
	width:80%;
	box-sizing:border-box;
	border-left:0px;
}

h1.storvindu-hoyre-overskrift{
	display:inline-flex;
	width:100%;
	height:10%;
	margin:0px;
	justify-content:center;
	align-items:center;
}

div.storvindu-hoyre-innhold{
	padding-top:10px;
	display:inline-flex;
	flex-wrap:wrap;
	background-color:inherit;
	justify-content:center;
	width:100%;	
}

table.storvindu-hoyre-table{
	background-color:#DDDDDD;
	width:90%;
	border-radius:10px;
	border-collapse: collapse;
	overflow:hidden;
}

table.storvindu-hoyre-table tr{
	text-align:center;
	height:20px;
}

table.storvindu-hoyre-table td.red{
	color:red;
	font-weight:bold;
}

table.storvindu-hoyre-table td.left, th.left{
	text-align:left;
}

table.storvindu-hoyre-table td.right, th.right{
	text-align:right;
}

table.storvindu-hoyre-table tr:nth-child(even){
	background: url(../imgs/bg-header-new.png);
}

div.headeroverskrift{
	display:inline-flex;
	background-color:#FFFFFF;
	width:80%;
	height:50%;
	border-radius:10px;
	justify-content:center;
	align-items:center
}

div{
	background:#BBBBBB;
}

body.trekking{
	/*background-color:#000f7f; /*mørk blåfarge*/
	/*background-color:rgb(237, 237, 237); /*lys gråfarge*/
	background: url(../imgs/bg-header-new.png);
}

body#indexbody{
	display:flex;
	flex-direction:column;
	align-items:center;
	background: url(../imgs/bg-header-new.png);
}

header#indexheader{
	display:inline-block;
	background:#FFFFFF;
	box-sizing:border-box;
	width:60%;
	height:10%;
	margin:40px 0px;
	font-size: 50px;
	border-radius: 10px;
	text-align: center;
	min-width: 600px;
	max-width:700px;
	max-height:60px;
}

main#indexmain{
	display:inline-flex;
	background:#FFFFFF;
	border-radius: 10px;
	width:40%;
	margin:40px 0px;
	min-width: 400px;
	max-width:500px;
	padding-top:15px;
	flex-direction:column;
	justify-content: center;
	
}

main#indexmain label, input{
	justify-content:flex-start;
	display:inline-block;
	width:30%;
}

main#indexmain input{
	display:inline-block;
	width:50%;
}

main#indexmain label{
	padding-right:10px;
	text-align:right;
	font-weight:bold;
}

main#indexmain h1{
	text-align:center;
	margin:0px 0px 20px 0px;
}

main#indexmain form{
	display:inline-flex;
	flex-wrap:wrap;
	justify-content:center;
}

main#indexmain form p{
	width:100%;
	text-align:center;
	padding-bottom:10px;
}

.indexknapp{
	border-radius:5px;
	background: #BBBBBB;
	color:#000000;
	text-decoration:none;
	height:30px;
	padding:10px 5px 0px 5px;
	border: 1px solid black;
	margin: 10px 0px;
}

body#indexbody p{
	font-weight:bold;
	font-family:"Times New Roman";
	text-align: left;
	margin: 0px;
}

a.blanklink{
	text-decoration:none;
	color:#000000;
	text-align:center;
	margin-bottom:10px;
}

a.blanklink:hover{
	color:#999999;
}

input.indexknapp{
	padding: 2px;
}

.indexknapp:hover{
	cursor: pointer;
	background: #999999;
}

a.indexknapp{
	width:210px;
}

header.trekkinglogo{
	display:flex;
	justify-content: center;
	align-items: center;
	width:100%;
	height:25%;
	color:white;
	font-size:100px;
	background: url(../imgs/bg-header-new.png);
	box-sizing:border-box;	
}

.bunnlogo{
	max-width:300px;
	border-radius:10px;
	margin-left:50px;
	margin-top:50px;
}

.bunnlogostortvindu{
	max-width:300px;
	border-radius:10px;
	margin-left:50px;
	margin-top:20px;
}

.trekkinglogo img{
	display:inline-block;
	width:50%;
	min-width:800px;
	border-radius:10px;
	margin:3%;
}

.trekkinglogo img#bingosystemerlogo{
	width:40%;
	min-width:300px;
	max-width:300px;
	min-height:80px;
	max-height:80px;
}

.bingovertsnavn {
	font-size:46px;
	min-width:300px;
	max-width:800px;
	min-height:80px;
	max-height:80px;
	line-height:80px;
}

.venstreside{
	background: url(../imgs/bg-header-new.png);
	display:inline-block;
	width:40%;
	height:60%;
	float:left;
}

.venstresideinfo{
	display:flex;
	justify-content: center;
	align-items: center;
	width:calc(50% - 10px);
	height:calc(60% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	color:#000000; /*svart*/
	font-size:400px;
	margin:5px;
	/*background:#FFFFFF;*/
}


.hoyresideinfo{
	display:flex;
	justify-content: center;
	align-items: center;
	width:calc(50% - 10px);
	height:calc(60% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	color:#000000; /*svart*/
	font-size:400px;
	margin:5px;
	/*background:#FFFFFF;*/
}

.hoyreinfoside{
	/*display:flex;
	justify-content: center;
	align-items: center;*/
	width:calc(60% - 10px);
	height:calc(60% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	color:#000000; /*svart*/
	font-size:20px;
	margin:5px;
}

.hoyreside{
	display:flex;
	justify-content: center;
	align-items: center;
	width:calc(60% - 10px);
	height:calc(60% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	color:#000000; /*svart*/
	font-size:400px;
	margin:5px;
	/*background:#FFFFFF;*/
}

.venstrelitenboks{
	display:inline-block;
	width:calc(40% - 10px);
	height:calc(30% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	margin:5px;
}

.venstrestorboks{
	display:inline-block;
	width:calc(60% - 10px);
	height:calc(30% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	margin:5px;
}

.venstrebunn{
	display:inline-flex;
	flex-direction:column;
	width:calc(100% - 10px);
	height:calc(40% - 10px);
	border:2px solid #356889;
	border-radius:10px;
	box-sizing:border-box;
	float:left;
	margin:5px;
	overflow:hidden;
}

body.kontrollvindu{
	/*background-color:#007f00; /*mørk grønnfarge*/
	background: url(../imgs/bg-header-new.png);
	justify-content: center;
}

header.trekking{
	display:flex;
	flex-wrap:wrap;
	margin:0px;
	width:calc(100% - 40px);
	height:calc(40% - 40px);
	overflow:hidden;
	background-color:#BBBBBB;
	box-sizing:border-box;
	margin:20px 20px;
	border-radius:10px;
}

div#vinnerrute{
	display:inline-flex;
	flex-flow: row wrap;
	width:calc(100% / 9);
	height:calc(100% / 3);
	justify-content: space-between;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	color:#ffffff;
	background: #BBBBBB;
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
}	

div.litetrekttall{
	display:inline-flex;
	flex-flow: row wrap;
	width:calc(100% / 9);
	height:calc(100% / 3);
	justify-content: space-between;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	color:#000000;
	/*background: url(../imgs/bg-header-new.png);*/
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
}

div.litekontrolltrekttall{
	display:inline-flex;
	flex-flow: row wrap;
	width:calc(100% / 9);
	height:calc(100% / 3);
	justify-content: center;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	color:#000000;
	/*background-color:#BBBBBB;*/
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
}

div.litekontrolltrekttallnr{
	display:inline-flex;
	flex-flow: row wrap;
	width:calc(100% / 9);
	height:calc(100% / 3);
	justify-content: center;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	color:#999999;
	/*background-color:#BBBBBB;*/
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
}

div.litekontrolltrekttallbrukt{
	display:inline-flex;
	flex-flow: row wrap;
	width:calc(100% / 9);
	height:calc(100% / 3);
	justify-content: center;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	//color:#FFFF00;
	color:#000000;
	/*background-color:#BBBBBB;*/
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
}

div.litekontrolltrekttallsiste{
	display:inline-flex;
	flex-flow: row wrap;
	width:calc(100% / 9);
	height:calc(100% / 3);
	justify-content: center;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	color:#FF0000;
	/*background-color:#BBBBBB;*/
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
}

p.kontroll-trekknummer{
	box-sizing: border-box;
	font-size:20px;
	align-self:flex-start;
	text-align:left;
	width:25%;
	height:25%;
	border:1px solid #FFFFFF;
	border-bottom-right-radius:5px;
	border-top:0px;
	border-left:0px;
	padding-left:4px;
}

p.kontroll-trekttall{
	font-size:50px;
	width:100%;
	height:75%;
}

p.kontroll-vinnerrekke{
	box-sizing: border-box;
	font-size:20px;
	align-self:flex-start;
	color:red;	
	width:70%;
	height:20%;
	text-align:right;
}

p#kontroll-litenoverskriftkontroll{
	display: inline-flex;
	justify-content:center;
	align-items: center;
	height: calc(12% - 40px);
	width: calc(100% - 400px);
	margin: 20px 200px;
	background:#FFFFFF;
	border: 1px solid white;
	border-radius:10px;
	font-size:50px;
}

div.storrutekontroll{
	display:inline-block;
	float:left;
	width:calc(33% - 40px);
	height:calc(30% - 20px);
	margin:10px 20px;
	overflow:none;
	border:2px solid #356889;
	border-radius:10px;
	/*background-color:#FFFFFF;*/
	box-sizing:border-box;
}

div.startslutt{
	display:inline-block;
	float:left;
	width:calc(33% - 40px);
	height:calc(50% - 20px);
	margin:10px 20px;
	overflow:none;
	border:2px solid #356889;
	border-radius:10px;
	/*background-color:#FFFFFF;*/
	box-sizing:border-box;
}

div#tallongnummeret{
	display:inline-block;
	height:calc(25% - 20px);
	width:calc(100% - 300px);
	margin:10px 150px;
}

div#startvindu{
	display:inline-block;
	height:calc(50% - 20px);
	width:calc(90% - 300px);
	margin:10px 150px;
}

p{
	transition: transform 0.5s ease-in;
	text-align:center;
	color:#000000; /*svart skrift*/
	margin:0px;
}

p.kontroll-litenoverskrift{
	display:flex;
	justify-content: center;
	align-items:flex-end;
	font-size:30px;
	height:35%;
}

p.kontroll-litenoverskriftkontroll{
	display:flex;
	justify-content: center;
	align-items:flex-end;
	font-size:30px;
	height:5%;
}

p.kontroll-storttall{
	font-size:100px;
	height:75%;
}

p.litenoverskrift{
	display:flex;
	justify-content: center;
	align-items:flex-end;
	font-size:30px;
	height:35%;
}

p.storttall{
	font-size:70px;
	height:65%;
}

p.vertstorttall{
	font-size:50px;
	height:65%;
}

p#sistetall{
	display:inline-block;
	margin:0, auto;
}

div#bruksanvisning{
	display:none;
	font-size:25px;
}

span#sistetallspan{
	font-family: "Lucida Console";
}

/*
header.kontrolltavle{
	display:inline-flex;
	flex-wrap:wrap;
	margin:0px;
	width:calc(100% - 40px);
	height:calc(70% - 50px);
	overflow:hidden;
	background-color:#FFFFFF;
	background-color:#BBBBBB;
	box-sizing:border-box;
	margin:15px 20px;
	border-radius:10px;
	justify-content:flex-start;
	align-items:flex-start;
}*/

header.kontrolltavle{
	display:inline-flex;
	flex-wrap:wrap;
	margin:0px;
	width:calc(100% - 40px);
	height:calc(80% - 50px);
	overflow:hidden;
	background-color:#BBBBBB;
	box-sizing:border-box;
	margin:15px 20px;
	border-radius:10px;
	justify-content:flex-start;
	align-content:flex-start;
}

header.kontrolltavle div.litetrekttall{
	display:inline-flex;
	height:calc(100% / 7);
	width:calc(100% / 13);
	background-color:#BBBBBB;
	
}

header.kontrolltavle div.litetrekttallvinner{
display:inline-flex;
	flex-flow: row wrap;
	height:calc(100% / 7);
	width:calc(100% / 13);
	justify-content: space-between;
	align-items: center;
	float:left;
	margin:0px;
	font-size:72px;
	color:#000000;
	/*background: url(../imgs/bg-header-new.png);*/
	border:1px solid white;
	border-radius:10px;
	box-sizing:border-box;
	background-color: #BBDDBB;
}


div.bunnboks p#navn{
	display:inline-flex;
	margin:0px;
	width:100%;
	font-size:30px;
	justify-content:center;
}


/*
 slutt fra media
*/

div.lagoppsett{
	display:inline-flex;
	flex-flow:row wrap;
	align-content:flex-start;
	margin-top:0%;
	margin-left:15%;
	margin-right:15%;
	//width:100%;
	//height:80%;
	border-radius:10px;
	//box-sizing: border-box;
}

div.lagoverskrift{
	text-align:center;
	font-size:70px;
	color:black;
	width=100%;
	//margin-left:0%;
	//margin-right:0%;
	//margin-bottom:1%;
	background: rgba(100,100,100,0.2);
	border-radius:5px;
}

	div.lagoverskrift img#logo{
		width:50px;
		margin-left:10%;
		border-radius:3px;
	}

	div.lagoverskrift img#logoliga{
		width:50px;
		margin-right:10%;
		border-radius:3px;
	}
	


div.lagoppsett div#lagoppsettliste{
	display:inline-flex;
	flex-flow:row wrap;
	align-content:flex-start;
	width:100%;
	box-sizing: border-box;
}

div.lagoppsett div#lagoppsettliste table{
	width:100%;
	//margin-top:0%;
	//margin-left:5%;
	font-size:30px;
}

div.lagoppsett div#lagoppsettliste table#bred{
	width:80%;
	margin-top:1%;
	margin-left:5%;
	font-size:30px;
}

div.lagoppsett div#lagoppsettliste table#ledere{
	width:40%;
	margin-top:1%;
	margin-left:30%;
	//background: rgba(100,100,100,0.2);
}

div.lagoppsett div#lagoppsettliste table td#nummer{
	text-align:right;
}

div.lagoppsett div#lagoppsettliste table td#navn{
}

div.lagoppsett div#lagoppsettliste table td#posisjon{
}

div.lagoppsett div#lagoppsettliste table td#midtstillt{
	text-align:center;
}

div.rolleliste{
	display:inline-flex;
	flex-flow:column wrap;
	align-content:flex-start;
	width:80%;
	height:80%;
	border-radius:70px;
	border:3px solid white;
	background: rgba(100,100,100,0.2);
	box-sizing: border-box;
	margin-left:10%;
	margin-bottom:6%;
}

div.rolleliste div#logo{
	display:inline-flex;
	align-items:center;
	width:45%;
	height:100%;
}

div.rolleliste div#logo img#logo{
	height:50%;
	margin:10px;
}

div.rolleliste div#liste{
	height:100%;
	width:50%;
	display:inline-flex;
	flex-wrap:wrap;
	padding-top:10%;
	align-content:flex-start;
}

div.rolleliste div#liste p#overskrift{
	text-align:center;
	width:100%;
	font-size:50px;
}

div.rolleliste div#liste p#kursiv{
	text-align:center;
	width:100%;
	font-style:italic;
	font-size:30px;
}

div.rolleliste div#liste p#draktnr{
	text-align:center;
	width:100%;
	font-size:30px;
}

div.rolleliste div#liste p#tekst{
	text-align:center;
	width:100%;
	font-size:30px;
}

div.rolleliste div#liste p#mellomrom{
	text-align:center;
	width:100%;
	height:60px;
	font-size:50px;
}

#spinn{
	animation-name: spinne;
	animation-iteration-count: 1;
	animation-duration: 0.5s;
	transform-style: preserve-3d;
	visibility: hidden;
	animation-fill-mode: forwards; 	
}	

/* background: rgba(100,100,100,0.2);	*/


@keyframes spinne {
  from {
    transform: rotateX(90deg);
  }
  to {
    transform: rotateX(0deg);
	visibility: visible;
  }
}


/*
 slutt fra media
 */ 