@charset "utf-8";
/* Author Name: Eng Yan Ling
	Date Created:10 June 2024
	Exercise 3 (recipe book)
*/

		h1, h2, h3, h4 {
	font-family: "Signika Negative", sans-serif;
  	font-optical-sizing: auto;
 	font-weight: 400;
  	font-style: normal;
		}
		
		h2 {
	color: darkolivegreen;
		}
		
		h3 {
	color: darkblue;
		}
		
		p, ul, ol, table, form {
  	font-family: "Crimson Text", serif;
  	font-weight: 400;
  	font-style: normal;
		}
		
		body {
	padding-left: 15px;
	background-color: #DCEDCF;
		}
	
		table, th, td {
			border-collapse: collapse;
			border: 2px solid #5D45E6;
		}
		
		table {
			width: 70%;
			margin:auto;
			margin-top: 15px;
			margin-bottom: 30px;
		}
		
		p {
			width: 95%;
		}
		
		#ttitle {
			background-color:#574BDE;
			color: floralwhite;
			text-transform: uppercase;
		}

		.card {
			border: #000000 medium;
			box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
			width: 1170px;
			border-radius: 6px;
		}
		.container{
			padding-left: 10px;
			padding-right: 5px;
			padding-top: 2px;
			padding-bottom: 3px;
			margin-top: 15px;
			margin-bottom: 15px
		}
		.dark {
			background-color: #35A2D9
		}
		.light {
			background-color: #A6D1F3
		}
		.formborder {
			border: solid #EC8517;
			border-collapse: collapse;
			width: 80%;
			margin-top: 25px;
			margin-bottom: 30px;
			margin-left: auto;
			margin-right: auto;
			padding-bottom: 15px;
			padding-top: 10px;
			background-color: #DBF5F8;
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
		}
		.center {
			display: block;
			text-align: center;
			margin-bottom: auto;
			margin-right: auto;
		}
		
		.ingredients > li:nth-child(even){
			color: blueviolet
		}

		.ingredients > li:nth-child(odd){
			color: darkolivegreen
		}
		
		.firstp::first-letter {
			font-size: 1.5em;
		}
		
		input[type="text"], textarea[name="comment"] {
			border: 1px solid lightgray;
			border-radius: 3px;
			background-color: white;
			padding: 5px;
			margin-bottom: 10px;
			width:220px;
			display: block;
		}

		input[type="submit"] {
			background-color: green;
			color: white;
			padding: 10px;
			border-radius:30px;
			width:120px;
			border:0;
		}
	
		input:focus, textarea:focus {
			background:#567F6C;
		}
		
		input[type="reset"] {
			background-color: gray;
			color: white;
			padding: 10px;
			border-radius:30px;
			width:120px;
			border:0;
		}
			
		img[alt="img left"] {
			border: 2px solid gray;
			float:left;
			margin-right:2%;
			margin-left: 3%;
			margin-bottom: 2%;
		}
		
		img[alt="img right"] {
			border: 2px solid gray;
			float:right;
			margin-left:1%;
			margin-right: 5%;
			margin-bottom: 2%;
		}
	
		ul li:last-child {
			color: orangered;
			font-style: italic;
		}
		
		a[href^="https://"] {
			color: darkorange;
			text-decoration: none;
			font-weight: bold;
		}