td:nth-child(odd){
	background-color: #c0c0c0;
	color:black;
}

#ruoat {
	background-color: white;
	padding:10px 30px 30px 30px;
	margin:20px 0;
	/*box-shadow: 10px 10px 5px #333;*/
}

table {
	/*background-color:#;*/
	width:48%;
	float:left;
}

tr {
	float:left;
	width:150px;
}

td {
    float: left;
    width: 250px;
}

.mausteet {
	float:left;
	width:48%;
	margin:5px 0 0 20px;
}

h3 {
    clear: both;
    padding-top: 20px;
}

.reseptit {
	background-color:#369;
	border:1px solid black;
	box-shadow: 5px 5px 3px #333;
	padding:20px;
	color:white;
}

.ohje {
	width:95%;
}

h2 {
	cursor: pointer;
}

.aika {
	font-style:italic;
	margin-left: 20px;
	font-size:18px
}

/*.paivitetty:after {
    content: "OLETUS";
}*/

/*		MEDIA DEVICE WIDTH 480px
*******************************************/

@media (max-device-width:480px){
	/*.paivitetty:after {
	    content: "MIN 480px";
	}*/
	
	#ruoat {
		width:96%;
	}
	
	body {
		width:94%;
	}
	
	table {
		width:95%;
		float:none;
		font-size:16px;
		margin-bottom:20px;
	}
	
	th {
		font-size:39px;
		font-weight:bold;
		line-height:44px;
		height:44px;
	}
	
	tr {
		float:left;
	}
	
	.left {
		width:35%;
	}
	
	.right {
		width:64%;
	}
	
	td {
	    float: left;
	    width: 100%;
	    height:44px;
	    line-height:44px;
	    font-size:36px;
	}
	
	.mausteet {
		margin:10px 0 0 0;
		clear:both;
		width:95%;
	}
	
	h3 {
		clear:both;
		margin-bottom:20px;
		font-size: 42px;
	}
	
	h2 {
		font-size: 46px;
	}
	
	h1 {
		font-size: 56px;
		padding:10px 10px;
	}
	
	.reseptit {
		background-color:#369;
		border:1px solid black;
		box-shadow: 5px 5px 3px #333;
		padding:20px;
		color:white;
		margin-top:10px;
	}
	
	.mausteet {
		width:95%;
		font-size:36px;
	}
	
	.ohje {
		width:95%;
		font-size:36px;
	}
	
	p {
		font-size:20px;
		padding:10px 20px 20px;
	}
	
}

/*		MEDIA DEVICE WIDTH 481px - 800px
*******************************************/

@media (min-device-width: 481px) and @media (max-device-width:800px){
	.paivitetty:after {
	    content: "481px - 800px";
	}
}

/*		MEDIA DEVICE WIDTH 801px
*******************************************/

@media (min-device-width: 801px){
	
	/*.paivitetty:after {
	    content: "MIN 800px";
	}*/
	
	#ruoat {
		width:95%;
	}
	
	body {
		max-width:1000px;
	}
	
	table {
		/*background-color:#;*/
		width:45%;
		float:left;
		max-width:480px;
		display:block;
		padding:6px;
		border: solid 2px;
	}
	
	tr {
		float:left;
	}
	
	.left {
		width:35%;
	}
	
	.right {
		width:64%;
	}
	
	td {
	    float: left;
	    width: 100%;
	    font-size:17px;
	    line-height:20px;
	}
	
	th {
		font-size:17px;
		font-weight:bold;
	}
	
	.mausteet {
		margin:5px 0 0 20px;
		float:left;
		width:50%;
		font-size:17px;
	}
	
	.otsikko {
		float:left;
		width:50%;
		clear:none;
		padding-top:0px;
		margin-left:20px;
	}
	
	.ala-otsikko {
		float:left;
		width:50%;
		clear:none;
		padding-top:20px;
		margin-left:20px;
	}
	
	h3 {
		clear:both;
		margin-bottom:10px;
		font-size:20px;
		font-weight:bold;
	}
	
	h2 {
		font-size:24px;
		font-weight:bold;
	}
	
	h1 {
	    font-size: 30px;
	    font-weight: bold;
	    margin-bottom: 10px;
	    margin-left: 10px;
	}
	
	.reseptit {
		background-color:#369;
		border:1px solid black;
		box-shadow: 5px 5px 3px #333;
		padding:20px;
		color:white;
	}
	
	.ohje {
		width:95%;
		font-size:17px;
	}
}

/*		MEDIA WIDTH 801px
*******************************************/

@media (max-width: 801px){
	
	.paivitetty:after {
	    content: "max 800px";
	}
}