@charset "utf-8";

/*
   Author: Boe Mathewson
   Date:   09/12/2022
   Filename: benjamin_Style2.css
*/


/* HTML and Body Styles */
html {
   background-color: rgb(11, 10, 37);
   font-family: Arial, Verdana, sans-serif; 	
}




/* Body Only Styles */
body {
   margin-left: auto;
   margin-right: auto;
   width: 70%;

   background-color: rgb(189, 190, 111);
   font-family: Arial, Verdana, sans-serif;  
   color: black; 

}


/* Body Header Styles */
body > header > img {
   display: block;
   width: 100%
}

body > header > nav.horizontalNavigation li{
   width: 33.333333333333333333333333333333%;             
}


/* Horizontal Navigation Styles */

nav.horizontalNavigation a {
   background-color: rgb(0, 0, 0);
   display: block;
   font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
   font-size: 1.5em;
   line-height: 1.0em;
   text-align: center;
}  

nav.horizontalNavigation a:link, 
nav.horizontalNavigation a:visited {
   color: rgb(255, 255, 255);
}

nav.horizontalNavigation a:hover, 
nav.horizontalNavigation a:active {
   background-color: rgb(133, 133, 133);
}   

nav.horizontalNavigation li {
   display: block;
   float: left;
}

nav.horizontalNavigation a {
   display: block;
   text-align: center;
}

/* -----------------Right Column Styles: albums----------------- */
section#rightColumn {
    clear:both;
    color: rgb(82, 82, 82);
    font-size: 0.9em;
    float:left;
    width: 25%;

 }
 
 
 section#rightColumn h2, h2, h3 {
    color: rgb(255, 255, 255);
    font-size: 1.0em;
    line-height: 1.7em;
    background-color: rgb(54, 11, 11);
    padding-top: 11px;
    padding-bottom: 12px;
    text-align: center;
    font-size: 1.1em;
 }
 
 section#rightColumn li{
    
    display: block;
    float: left;
    width: 25%;            
    list-style: none;
    text-align: center;
    font-size: 0.7em;
    color: rgb(0, 0, 0);
 }
 
 section#rightColumn img {
    display: block;
    width: 90%;

   
 
 }
 
 
 
/* ---------Benjamins Journey---------- */

section#leftColumn{
    clear:right;
    color: rgb(82, 82, 82);
    font-size: 0.6em;
    float:left;
    width: 25%

 }
 
section#leftColumn p {
    color: rgb(0, 0, 0);
    font-size: 0.9em;
    line-height: 1.6em;
   
}


section#leftColumn h2, h2, h3 {
    color: rgb(255, 255, 255);
    font-size: 1.0em;
    line-height: 1.6em;
    background-color: rgb(54, 11, 11);
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
    font-size: 1.1em;
 }



section#leftColumn img {
   display: block;
   float:right;
   width: 70%;
   
}
/* ---------Left Column Styles 2: History---------- */
section#leftColumn2{
    clear:right;
    color: rgb(82, 82, 82);
    font-size: 0.6em;
    float:left;
    width: 25%
}

section#leftColumn2 p {
    color: rgb(0, 0, 0);
    font-size: 0.9em;
    line-height: 1.6em;

}

section#leftColumn2 h2, h2, h3 {
    color: rgb(255, 255, 255);
    font-size: 1.0em;
    line-height: 1.6em;
    background-color: rgb(54, 11, 11);
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
    font-size: 1.1em;
 }
section#leftColumn2 img {
   display: block;
   width: 100%;
}
section#leftColumn2 img {
   float: right;
   width: 60%;
}

/* ---------Left Column Styles 3 how did he---------- */
section#leftColumn3{
    
    clear:right;
    color: rgb(82, 82, 82);
    font-size: 0.6em;
    float:left;
    width: 25%
}

section#leftColumn3 p {
   color: rgb(0, 0, 0);
   font-size: 0.9em;
   line-height: 1.6em;
}



section#leftColumn3 h2, h2, h3 {
    color: rgb(255, 255, 255);
    font-size: 1.0em;
    line-height: 1.6em;
    background-color: rgb(54, 11, 11);
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
    font-size: 0.8em;
 }
section#leftColumn3 img {
   float: left;
   width: 60%;
}

/* Horizontal Navigation Styles */

nav.horizontalNavigation li {
   display: block;
   float: left;
}
section#rightColumn > nav.horizontalNavigation ul {
   width: 25%;
}

/* Footer Styles */

footer {
   Clear: both;
   color: rgb(255, 255, 255);
   background-color: rgb(0, 0, 0);
   text-align: center;

}