/*
#f4f4f9: White that is not bright
#32292f: Semi black
#667761: Olive Green
#f3dfc1: very semi very soft orange
#a9e5bb: bright neon lime color
#50514f: dark grey clean
*/
@font-face {font-family: Macondo; src: url("Macondo-Regular.ttf") format("ttf");}

@font-face {font-family: Comfortaa; src: url("Comfortaa-VariableFont_wght.ttf"); format("ttf");}

@font-face{ font-family: Kalam; src: url("Kalam-Bold.ttf") format("ttf");}

	
	
	nav {
    	text-align: right; /* Align the navigation to the right */
    	margin-top: 20px; /* Adjust top margin as needed */
    	color: #667761;
    	font-family: Comfortaa;
    	float: right;
    	
		}

	nav ul {
    	list-style-type: none; /* Remove default list styles */
    	margin: 0;
    	padding: 0;
		}

	nav li {
    	display: inline;
    	margin-left: 10px;
		}
				
	
	h6 {
		display: inline;
		margin: 10px;
		padding: 50px;
		float; left;
		}
	
	
	.content1 {
    	display: flex; /* Use flexbox */
		}

	.text1 {
   		width: 70%; 
    	padding: 0 250px; 
    	background-color: 0 ;
  		border: 0px solid;
  		
  		line-height: 1.8;	
  		font-family: Comfortaa;
		}

	.video1 {
    	width: 450px;
    	margin-right: 20px; 
    	padding: 0 150px;
		}
	
	
	
	
	
	
		
	.content2 {
    	display: flex; /* Use flexbox */
		}

	.text2 {
   		width: 70%; 
    	padding: 0 250px; 
    	background-color: 0 ;
  		border: 0px solid;
  		
  		line-height: 1.8;	
  		font-family: Comfortaa;
		}

	.video2 {
    	width: 450px;
    	margin-right: 20px; 
    	padding: 0 150px;
		}
		
		
	
	.content3 {
    	display: flex; /* Use flexbox */
		}

	.text3 {
   		width: 70%; 
    	padding: 0 250px; 
    	background-color: 0 ;
  		border: 0px solid;
  		
  		line-height: 1.8;	
  		font-family: Comfortaa;
		}

	.video3 {
    	width: 450px;
    	margin-right: 20px; 
    	padding: 0 150px;
		}







	
	a.font-style {
    	font-family: Comfortaa;
    	text-decoration: none;
    	font-size: 3.6em;
    	color: inherit; 
					}

	a.font-style:visited {
    	text-decoration: none; 
    	color: inherit; 
					}
	a.font-style:hover {
    	text-decoration: none; 
    	color: inherit; 
    	
    a.font-style:active {
    	text-decoration: none; 
    	color: inherit; 
    	
    a.font-style:link {
    	text-decoration: none; 
    	color: inherit; 

	span.Black {
    	color: #32292f;
					}

	span.Green {
   		 color: #a9e5bb;
    	 font-weight: bold;
				}
			
	#clock {
    font-family: Comfortaa;
    border: 2px solid #ccc; /* Grey border */
    padding: 10px; /* Optional: Add padding for better appearance */
}