/* CSS Document */
body        				{background-color: #F1F3CE;}

h1, h2, h3 					{font-family:Open Sans, arial, Helvetica, sans-serif;} 

#wrapper 					{width:900px;margin:10px auto; }

#top							{float:left;}
#top		ul					{float:right; margin-left:190px;margin-top:25px; }

#top	 ul li				{display:inline; list-style-type:none; margin:0 0; padding:0 2px; }



#navi ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #00293b; float:right; margin-right:51px; margin-top:10px; border-radius:25px;
}

#navi li 					{float: left;}
		
#navi li a, .dropbtn 			{
  									display: inline-block;
 								 	color: white;
 									font-size:20px;
  									text-align: center;
 									 padding: 10px 20px;
  									text-decoration: none;
											}

#navi li a:hover , .dropdown:hover .dropbtn{
  						background-color: #00293b;
  						color: white;
							}

#navi .dropdown-content {
  display: none;
  position: absolute;
  background-color: lightblue;
  min-width: 160px;
  box-shadow: 5px 8px 10px 0px black;
  margin-left:18px;
 }

#navi .dropdown-content a {
  color: black;
  padding: 12px 10px;
  text-decoration: none;
  display: block;
  text-align: left;
}

#navi   .dropdown-content a:hover {
background-color: gray;
color:white;
}

#navi .dropdown:hover .dropdown-content {
  display: block;
}

#navi {clear:both;}

#navi li 					{float: left;}
		
#navi li a, .submenu  			{
  									display: inline-block;
 								 	color: white;
 									font-size:20px;
  									text-align: center;
 									 padding: 10px 20px;
  									text-decoration: none;
											}
#navi .submenu {
  position: relative;
  display: block;
}


#navi .submenu-content {
  display: none;
  position: absolute;
  left: 100%;       /* This pushes the menu to the right */
  top: 0;            /* Aligns the top with the parent link */
  background-color: lightblue;
  min-width: 180px;
  box-shadow: 5px 8px 10px 0px black;
}

#navi .submenu:hover > .submenu-content {
  display: block;
}

#navi .submenu-content a {
  color: black;
  padding: 12px 10px;
  text-decoration: none;
  display: block;
  text-align: left;
  background-color: lightblue;
}

#navi .submenu-content a:hover {
  background-color: gray;
  color: white;
}
#navi .submenu {
  padding: 0; 
  display: block;
  width: 100%;
}








#tit	h2	{float:left; margin-top:20px; margin-left:35px; font-style:Helvetica;}



#evt1 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt1 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt1 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt1 a {
  text-decoration: none;
}


#evt2 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt2 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt2 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt2 a {
  text-decoration: none;
}



#evt3 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt3 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt3 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt3 a {
  text-decoration: none;
}


#evt4 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt4 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt4 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt4 a {
  text-decoration: none;
}


#evt5 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt5 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt5 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt5 a {
  text-decoration: none;
}


#evt6 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt6 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt6 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt6 a {
  text-decoration: none;
}


#evt7 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt7 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt7 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt7 a {
  text-decoration: none;
}


#evt8 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt8 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt8 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt8 a {
  text-decoration: none;
}


#evt9 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt9 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt9 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt9 a {
  text-decoration: none;
}


#evt10 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt10 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: 12px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt10 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt10 a {
  text-decoration: none;
}


#evt11 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt11 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt11 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt11 a {
  text-decoration: none;
}



#evt12 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt12 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt12 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt12 a {
  text-decoration: none;
}


#evt13 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt13 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt13 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt13 a {
  text-decoration: none;
}


#evt14 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt14 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt14 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt14 a {
  text-decoration: none;
}



#evt15 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt15 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt15 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt15 a {
  text-decoration: none;
}



#evt16 {
  margin-top: 50px; 
  margin-left: 10px; 
  background-color: #00293C;
  border: 2px solid white;
  border-radius: 20px;
  padding: 20px;
  overflow: hidden; /* CRITICAL: This keeps the background color behind floated items */
  width: 950px;     /* Ensure the box is wide enough for both */
}

/* 2. Float the image to the left and REMOVE negative margins */

#evt16 img {
  float: left; 
  margin-right: 25px; 
  border-radius: 18px; 
  margin-top: -10px;
  
  /* Add these three lines for the frame */
  border: 3px solid white;    /* Thickness and color */
  padding: 2px;               /* Optional: creates a small gap between image and border */
  box-sizing: border-box;     /* Ensures padding doesn't increase the image size */
}

/* 3. Adjust the h4 to sit next to the image */
#evt16 h4 {
  float: left;
  width: 600px;      /* Give the text a specific width so it doesn't wrap under the image */
  color: white; 
  margin-top: 10px;  /* Adjust vertical alignment manually */
  margin-left: 40px;    /* Reset your previous 280px margin */
  text-align: justify;
  font-weight: normal;
  line-height: 1.5;
}

/* 4. Optional: Clean up the link appearance */
#evt16 a {
  text-decoration: none;
}


#footer 			{clear:both; padding: 10px 0; text-align:center;}

#contactus			{float:right; margin:-105px 60px;display:inline;}
#contactus2 				{float:right; margin:70px -510px;}	
#contactus	{text-align: center;
  		}
        button {
           color:lightgoldenrodyellow;
            font-size: 16px; 
        } 
        .b1 { 
            background-color: grey; 
        } 
        .b1:hover { background-color:yellow; color:blue;}
        
        
#text	 p		{text-align:justify;}