/* Tulip Management Cookbook CSS */

/************************************************/
/*     General Settings                        */
/************************************************/
body.navigation {
    font-family: Arial;
    font-size: small;
    color: rgb(44,19,86);
    background-color: rgb(167,154,173); /* Purple background */
}

/************************************************/
/*     Navigation Table                        */
/************************************************/
table.navigation {
    font-family: Arial;
    font-size: small;
    color: rgb(44,19,86);
    background-color: rgb(211,206,215);
}

a.navigationitem {
    color: rgb(44,19,86);
    background-color: rgb(211,206,215);
   font-weight: bold; 
   font-size: small;
    /* font-size: 12pt;  */
    font-family: Arial;
    vertical-align: middle;
    text-decoration: none;
	 margin-top: 5pt; 
}


 


/************************************************/
/*     Top Button                              */
/************************************************/
a.topbutton {
    color: rgb(44,19,86);
    font-weight: bold;
    font-size: small;
    font-family: Arial;
    vertical-align: middle;
    text-decoration: none;
}

/************************************************/
/*     Picture Table                           */
/************************************************/
table.picture_table {
    width: 510px;
    height: 510px;
    border: 4px solid rgb(167,154,173);
    background-color: rgb(241,236,245);
    border-collapse: collapse;
}

td.picture_td {
    padding: 0;
    text-align: center;
}

img.picture_img {
    width: 500px;
    height: 500px;
    display: block;
}

/************************************************/
/*     Slidesgow                           */
/************************************************/

div.slideshow_title {
    color: rgb(255,255,255);
    text-align: center;
	 font-size: 32px;
}

table.slideshow_picture {
    cellpadding: 0px;
	cellspacing:  0px;
	margin-left: auto;
    margin-right: auto;
    border: 4px solid rgb(167,154,173);
    background-color: rgb(241,236,245);
     
}

/************************************************/
/*     OLD Welcome Page                           */
/************************************************/
/* The scrolling table-like DIV for displaying the welcome page - height: 780px; */
div.welcome_scrollable_table {
/* Old  width: 426px; */
    width: 590px; /* 526px */
    height: 505px;  /* 780px */
    border: 4px solid rgb(167, 154, 173);
    background-color: rgb(241, 236, 245);
   /* overflow: auto;  Enables scrolling */
}


div.welcome_scrollable_content { 
    padding: 10px;
	color : rgb(44,19,86);
	font-size : 11pt;
	font-family : Arial;
}

 

table.welcome_picture_table {
    width: 510px;   /* 510px */
    height: 510px;   /* 510px */
    border: 4px solid rgb(167,154,173);
    background-color: rgb(241,236,245);
    border-collapse: collapse; /* Optional for tighter table borders */
}

/************************************************/
/*     Welcome Page                           */
/************************************************/
.welcome_flex_container {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
}

/* Stack vertically on smaller screens */
@media screen and (max-width: 768px) {
  .welcome_flex_container {
    flex-direction: column;
    align-items: center;
  }

  .welcome_picture_table {
    width: 100% !important;
  }

  .welcome_scrollable_table {
    width: 100% !important;
  }
}
