@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@200..900&display=swap');

body {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 100;
	font-size: 15px;
		color: #5F6360;
	line-height: 1.58;
	letter-spacing: +.03em;
	padding-top: 20px;
	margin: 0px;
	-webkit-font-smoothing: antialiased;
	    overflow-y: scroll;
}


h1 {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 500;
	font-size: 32px;
	color: #5F6360;
	line-height: 1.58;
	letter-spacing: .03em;
	 padding: 0px;
	 margin: 0;
	-webkit-font-smoothing: antialiased;
}

h2 {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 400;
	font-size: 20px;
	color: #5F6360;
	/* line-height: 1.58; */
	letter-spacing: .01em;
	 padding: 0px;
	 margin: 0;
	-webkit-font-smoothing: antialiased;
}


h3 {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 400;
	font-size: 44px;
		color: #DA70D6;
	line-height: 1;
	letter-spacing: +.03em;
	padding-top: 0px;
	margin: 0px;
	-webkit-font-smoothing: antialiased;
	  
}

h4 {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 700;
	font-size: 48px;
		color: #DA70D6;
	line-height: 0.8;
	letter-spacing: +.03em;
	padding-top: 2px;
	margin: 0px;
	-webkit-font-smoothing: antialiased;
	  
}

h5 {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 500;
	font-size: 16px;
		color: #DA70D6;
	line-height: 1.3;
	letter-spacing: +.03em;
	padding-top: 2px;
	margin: 0px;
	-webkit-font-smoothing: antialiased;
	  
}


a {
text-decoration: none;
color: #5F6360;
}



p {
	font-family: 'Noto Sans'; sans-serif;
	font-weight: 300;
	font-size: 20px;
		color: #5F6360;
	/* line-height: 1.58; */
	letter-spacing: .03em;
	 padding: 0px;
	 margin: 0;
	-webkit-font-smoothing: antialiased;
}



    .container {
    	margin: auto;
      display: flex;
      justify-content: center;
      padding: 5px;
      border: 0px solid #ccc;
    }

    .column-side {
      flex: 1;
      margin: 0 10px;
      padding: 5px;
      border: 0px solid #ccc;
      border-radius: 8px;
      box-sizing: border-box;
    }
    
    

    .column-name {
    	text-transform: none;
    	height: 72px;
    	border: 0px solid #ccc;
      border-radius: 8px;
      box-sizing: border-box;
      flex: 0 0 250px; /* fixed width for the center column */
       padding: 5px;

    }
    
.column-menu { 	
    	font-family: 'Noto Sans'; sans-serif;

      border-radius: 8px;
      font-weight: 100;
		font-size: 20px;
		letter-spacing: .05em;
      box-sizing: border-box;
      flex: 0 0 450px; /* fixed width for the center column */
		display:inline-table;
       padding: 0px;
/*       
    	border: 1px solid #ccc;       
       border-color: black;
*/   
     }
     
.column-content {
    	border: 0px solid #ccc;
      border-radius: 4px;
      box-sizing: border-box;
      flex: 0 0 700px; /* fixed width for the center column */
      padding: 10px;
      justify-content: center;

    }
       

.column-footer {
    	border: 0px solid #ccc;
      border-radius: 4px;
      box-sizing: border-box;
      flex: 0 0 700px; /* fixed width for the center column */
       padding: 10px;
       	font-family: 'Noto Sans'; sans-serif;
		font-weight: 100;
		font-size: 8px;
		text-align: center;
    }       


table {
	height: 100%;
}       
       
th {
	font-weight: 400;
	height: 60px;
	/*vertical-align: middle;*/
	margin: 0;
}

 img {
      max-width: 100%; /* Ensure the image doesn't exceed the cell width */
      vertical-align: middle; /* Vertical centering within the image */
      text-align: center;
    }
      
.image {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
  padding-top: 100;
}



        #gallery-container {
      font-family: Arial, sans-serif;
      margin: 0;
      padding: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      background-color: #ffffff;

        }

        #gallery img {
 	  display: block;
      margin: 0 auto; /* This centers the image horizontally */
      max-width: 450px; /* This ensures the image doesn't exceed its container's width */
        }

        #prev, #next {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            font-size: 24px;
            color: #5F6360;
            cursor: pointer;
            background-color: #ffffff;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        #prev {
            left: 10px;
        }

        #next {
            right: 10px;
        }
#caption {
	letter-spacing: +.03em;
	font-weight: 200;
	font-size: 12px;
}