body {

background-color:#26A093;
margin: 0px;
font-family: Catamaran, Montserrat, Lora, sans-serif;
font-size: 18px;

}
/*================HEADER section===================================*/
#header {
    background-color: #DD6D34;
    margin: 10px;
    height: 90px;
    border-radius: 5px;
    position: relative; /* Allows positioning of the logo */
    text-align: center; /* Centers the h3 text horizontally */
    display: flex;
    justify-content: center;
    align-items: center; /* Vertically centers the h3 text */
}

#header img.logo {
    position: absolute;
    left: 40px; /* Aligns the logo to the left side of the header */
    height: 90px; /* Adjust the logo size as needed */
}
/*================NAVIGATION section===================================*/

#navbar ul {

padding: 5px;
list-style-type:none;
text-align: center;
background-color: #ECB172;
margin: 10px;
border-radius: 5px;
}

#navbar ul li{
display: inline;
}

#navbar ul li a{

text-decoration: none;
font-family: Catamaran, Montserrat, Lora, sans-serif;
padding:.2em 1em;
color:#FFFFFF;
background-color: #ECB172;
}

#navbar ul li a:hover, #navbar ul li a:focus {
    color: #ECB172;
    background-color: #23647D;
    border-bottom: 3px solid #ECB172; 
}

#navbar ul li a.active:hover {
    color: #FFFFFF;
    background-color: #23647D;
    border-bottom: 3px solid #DD6D34; 
}
/*================MAIN section===================================*/

.main {
background-color: #FFFFFF;
margin-left: 10px;
margin-right: 320px;
margin-top: 10px;
margin-bottom: 10px;
border-radius: 5px;
padding: 20px;
font-size: 120%;
}

.main a {
text-decoration: none;
color: inherit;
}

.main a {
color: #ECB172;

}

h1 {
font-size: 140%;
color:#DD6D34;
}

h2 {
font-size:110%;
color: #DD6D34;
}

h3 {
font-size: 250%;
color: #FFFFFF;
font-family:Catamaran, Montserrat, Lora, sans-serif;
margin: 0px;
line-height:1px;
}

.sideright {
background-color: #FFFFFF;
margin-left: 10px;
margin-right: 10px;
margin-top: 0px;
margin-bottom: 10px;
border-radius: 5px;
padding: 20px;
font-size: 105%;
float: right;
width: 260px;
clear:right;
}

.imagesidebar {
width: 300px;
float: right;
border-radius: 5px;
margin-left: 10px;
margin-right: 10px;
margin-top: 0px;
margin-bottom: 10px;
clear:right;
opacity: 1.0;
transition: opacity 1s ease-in-out;
}

.imagesidebar:hover {
opacity: 0.4;
}

/*=============CALENDAR section=============================*/

#calendar-container {
    margin: 10px;
    border-radius: 5px;
    overflow: hidden;
    height: 580px; /* Adjust this height as needed */
    background-color: #FFFFFF;
}

#calendar-container iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.my-iframe {
    border: none;
}

.scrollable-iframe {
    overflow: auto;
}

.no-border {
    border: none;
}


/*================FOOTER section===================================*/

#footer {
background-color: #DD6D34;
margin: 10px;
height: 60px;
border-radius: 5px;
clear:both;
color:#FFFFFF;
text-align: center;
padding: 15px;
font-size: 90%;

}

#footer ul {

padding: 5px;
list-style-type:none;
text-align: center;
margin: 10px;
border-radius: 5px;
}

#footer ul li{
display: inline;
}

#footer ul li a{

text-decoration: none;
font-family: Catamaran, Montserrat, Lora, sans-serif;
padding:.2em 1em;
color:#FFFFFF;
background-color: #DD6D34;
}

#footer ul li a:hover {
color: #ECB172;
background-color:#23647D;
}

img
{
max-width:100%;
max-height:100%;
}


