@charset "UTF-8";
/* Author Name: Kaho */

	body {
			background-color: #E9F8EF;
			font-family: "Source Code Pro", monospace;
			font-size: 1.2em; width: 75%; 
			text-align: justify;
		}
		
		h1, h2 {
			font-family: "Gwendolyn", cursive;
  			font-optical-sizing: auto;
  			font-weight: 400;
  			font-style: normal;
		}

		h1 {
			position: relative;
			left: 30px;
		}


		h2 {
			position: relative;
			left: 30px;
		}
		
		p {
			color: #211E22;
			text-align: justify;
		}
		
		#recipe-title {
			font-size: 2.2em; width: 75%; 
			color: #F28000;
		}

		.headline {
			font-size: 1.8em; width: 75%; 
			color: #B07533;
		}


		.img {
			text-align: center;
		}
	
		img {
			border-radius: 30px;
			border: 3px solid #B99722;
		}


		/*.nutorition {
			position:relative;
   			display:inline-block;
		}
		
		.nutorition::after {
		 	content:"";
   			display:inline-block;
   			width:3px;
  			height:40px;
  			background-color:#0097A7;
   			position:absolute;
   			top:-2px;
   			right:-5px;
		}*/


		/*td {
			background-color: #CD98CC;
		}*/
		
		.auto {
			text-justify: auto;
		}
		
		.box {
			width: 800px; height: auto;
			margin: 5px; padding: 10px; padding-top: 0px; padding-bottom: 0px;
		}
		
		#radius-box {
			width: 400px; height: auto; 
   			border: solid 2px #000;
   			background-color: #eee; 
    		border-radius: 10px; 
			margin: 0 auto;
		}

		#ingredients-radius-box {
			width: 900px; height: auto; 
   			border: solid 2px #000;
   			background-color: #eee; 
    		border-radius: 10px; 
			margin: 0 auto;
		}

		.mini-headline{
			text-decoration:underline;
			position: relative;
			left: 30px;
		}

		.page-top-button {
			height: 50px;
			width: 50px;
			position: fixed;
			right: 30px;
			bottom: 30px;
			background: #37A653;
			border: solid 2px #000;
			border-radius: 50%;
			display: flex;
			justify-content: center;
			align-items: center;
			z-index: 2;
		}

		.pagetop_arrow {
			height: 10px;
			width: 10px;
			border-top: 3px solid #FFFFFF;
			border-right: 3px solid #FFFFFF;
			transform: translateY(20%) rotate(-45deg);
		}

		html {
			scroll-behavior: smooth;
		}

		.colour {
			color: #F37171
		}