@charset "utf-8";
/*--Inställningar för responsibiliteten, brytpunkt 768 px --*/
* {
	box-sizing: border-box;
}
/*För Mobiler*/
[class*="size-"]{
	width: 98%;
	float: left;
	margin: 1%;
}

/* För större skärmar*/
@media only screen and (min-width:768px){
	.size-1{width:31.3%;}
	.size-2{width: 64.6%;}
/*--inställningar för responsibilitet slutar, men t.ex. float:left och clear:both har också med detta att göra --*/
}
/* vanliga CSS-inställningar*/
body {
	font-size: 16px;
	font-family: Tahoma, Geneva, sans-serif;
	max-width: 1400px;
	margin: 0 auto;
}
	
nav {
	background-color:#999;
	padding: 5px;
}
	
header, footer {
		background-color: #666;
		padding:5px;
}

header h1 {
	font-size: 24px;
	text-align: center;
	color: white;
	margin: 20px 0px 20px 0;
}

footer p {
	color:white;
}	
article {
	padding: 5px;
	float:left;
}

/* används för att struktuera filminfo + bild*/
.first, .second{
	float:left;
	margin: 0 2.5%;
	width: 45%;
}

footer{
	clear: both;
}
h1 {
	font-size: 24px;
	text-align: center;
	margin: 20px 0 20px 0;
}
h2 {
	font-size: 18px;
	text-align: center;
	margin: 20px 0 20px 0;
}

button {
	background-color: #DFDFDF;
	border-radius: 5px;
	padding: 10px;
}
/* -- Här slutar vanliga CSS-Inställningar -- */

/*-- Inställningar för filen allfims.php --*/
	
	#container {
		width: 98%;
		float: left;
		margin: 5px;
		background-color: #CCCCCC;
		border-radius: 10px;
		padding: 10px;
	}
	table {
		font-family: Verdana, Geneva, sans-serif;
		font-size: 16px;
		border-collapse: collapse;
		width: 90%;
		margin-left: auto;
		margin-right: auto;
	}
	
	table, th, td {
		border: none;
	}
	th, td {
		height: 25px;
		text-align: center;
		padding: 5px;
	}
	tr:nth-child(even) {
		background-color:#E6F2FF;
	}
	th {
		background-color: black;
		color: #FFFFFF;
	}
/* -- Här slutar inställningarna för filen allfilms.php -- */

/* -- Dessa inställningar är till för att styra menyn -- */
	aside a:link, a:visited {
		background-color: #DFDFDF;
		text-decoration: none;
		padding: 5px;
		border-radius: 5px;
		color: black;
	}
	
	aside a:hover {
		background-color: #999;
		text-decoration: none;
		padding: 5px;
		border-radius: 5px;
		color: white;
	}
	
	aside label {
		display: block;
		padding: 8px 30px;
		margin: 0 0 2px 0;
		cursor: pointer;
		background-color: black;
		border-radius: 3px;
		color: #FFF;
		transition: ease .5s;
		position: relative;
	}
	
	aside label:hover {
		background-color: #ADCCFA;
	}
	
	aside label::after {
		content: '+';
		font-size: 22px;
		font-weight: bold;
		position: absolute;
		left: 10px;
		top: 2px;
	}
	
/* Efter första etiketten, efter input som är ikryssad*/
	aside input:checked + label::after {
		content: '-';
		right:14px;
		top: 3px;
	}
	
	aside .content {
		background-color: #FAFAFA;
		padding: 10px 25px;
		border: 1px solid #A7A7A7;
		margin: 0 0 1px 0;
		border-radius: 3px;
	}
/* göm första klassen content, efter första labeln, efter input */
	aside input + label + .content {
		display: none;
	}
	
	aside input:checked + label + .content {
		display: block;
	}
	
	aside input {
		display: none;
	}
/* --Här slutar inställningarna för menyn-- */
	
/* --Inställningar specifika för formuläret new.php-- */
	
	article fieldset {
		width: 100%;
	}
	
	article input[type=text], textarea {
		width: 100%;
		padding: 12px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		resize: vertical;
	}
	
	article input[type=submit] {
		background-color: #DFDFDF;
		color: black;
		padding: 12px 20px;
		border: none;
		border-radius: 4px;
		cursor: pointer;
		float: right;
		
	}
	
	article select {
		width: 100%;
		padding: 12px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		resize: vertical;
	}
/* --Här slutar inställningarna för formuläret new.php-- */