/*css reset rule*/
/** {
    margin:0; padding:0;
    Border:0; box-sizing: border-box;
}*/

body {
    background-image: url(darksky.jpg);
    background-size: cover;
}

.intro {
    float:left;
    width:400px;
    border: 1px inset rgb(70, 54, 54);
    border-radius: 30px; 
    box-shadow: 0 0 30px rgb(47, 40, 40);
    padding: 30px;
    
}
header h1 {
    font-family:Garamond;
    font-style: oblique;
    font-size: 50px;
    color: rgb(131, 101, 61);
    padding: 10px;
    border: 2px outset rgb(10, 17, 20);
    border-radius: 8px;
}
header h2 {
    font-size: smaller;
    text-align: center;
    display: inline-block;
    padding: 5px;
    margin: 2px ;
    color:rgb(154, 158, 69);
    border: 2px dotted black;
    border-radius: 25px;  
         
}

.summary {
    font-style: italic;
    color:rgb(226, 223, 166)
}
.summary a{
    color:#94640c
}


.preamble {
    color:#e9c88b;
    background-color: rgba(72, 76, 79, 0.3); 
    padding: 20px; 
    border-radius: 30px; 
    box-shadow: 0 0 50px rgb(9, 6, 6); 
    
    
}

.preamble h3 {
    color: #787338; 
    font-family: garamond;
    font-size: 24px; 
    font-style: italic;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 1); /* Add a subtle text shadow */
    margin-bottom: 10px; /* Add spacing below h3 elements */
    border: 2px outset rgb(12, 20, 24);
    border-radius: 8px;
    text-align: center;
    
}

.main.supporting {
    background-color: rgba(54, 57, 61, 0.3); 
    padding: 15px; 
    border-radius: 30px; 
    box-shadow: 0 0 30px rgb(47, 40, 40);
    width:1000px;
    float:right;
    
}

.explanation {
    color:#d89b28;
    font-weight: 400;
    margin: 20px;
    border: 2px solid rgb(36, 21, 21);
    border-radius: 8px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 1);
    padding:20px;
}


.main.supporting h3 {
    color: #787338; 
    font-family: garamond;
    font-size: 24px; /* Adjust font size as needed */
    font-style: italic;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 1);
    margin-bottom: 10px; /* Add spacing below h3 elements */
    margin:12px;
    border-radius: 8px;
    text-align: center;
    text-decoration: underline;
}
.benefits {
    color:#ce9223;
    font-weight: 400;
    border: 2px solid rgb(36,36,21);
    border-radius: 8px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 1);
    padding:20px;
    margin: 20px;
}
.participation {
    color:#d89b28;
    font-weight: 400;
    border: 2px solid rgb(36,36,21);
    border-radius: 8px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 1);
    padding:20px;
}
.participation a {
    color: rgb(197, 177, 111)
    
}
.requirements{
    border: 2px solid rgb(36,36,21);
    border-radius: 20px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 1);
    color:#e29c1a;
    text-align: center;
}
.requirements a {
    color: rgb(197, 177, 111)
}
footer{
    margin:30px;
    text-align: center;
}
footer a {
    color:rgb(127, 111, 19);
    padding: 10px;
    border-radius: 30px;
    box-shadow: 0 0 10px;
    text-decoration:none;
    font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

.sidebar {
    color: #bdc3c7; 
    padding: 20px; 

}

.sidebar .wrapper {
    border: 1px solid #3c546d; 
    border-radius: 500px; 
    box-shadow:0 0 50px rgba(0, 0, 0, 1);
    padding: 10px;
    margin:auto;
    text-align:center ;
    float:inline-start;
    width:500px;
    
    

}
.design-selection {
    margin-bottom: 20px; 
    
}

.design-selection .select {
    color: #9b9995; 
    font-family: garamond;
}

.design-selection a {
    color: #9a862d; 
    text-decoration: none; 
}

.design-selection a:hover {
    color:#3498db; 
}
.design-archives{
    margin-bottom: 20px; 
    color: #9b9995;
    font-family: garamond;
}

.design-archives .select {
    color: #fff; 
}

.design-archives a {
    color: #9a862d; 
    text-decoration: none; 
}

.design-archives a:hover {
    color: #3498db; 
}

.zen-resources {
    margin-bottom: 20px; 
    color: #9b9995;
    font-family: garamond;
}

.zen-resources .select {
    color: #fff; 
}

.zen-resources a {
    color:#9a862d; 
    text-decoration: none;
}

.zen-resources a:hover {
    color: #3498db; 
}
.sidebar ul {
    list-style-type: none; 
}