/***** BASE STYLES *****/

body{
  max-width: 100%; margin: 0 auto;
  font-family:'Montserrat:600';
  color:#000000;
  text-align:justify;
  background:#ebebeb;
  padding:25px;
}

#wrapper { width: 100%;}


 /***** Responsive *****/




/***** GRID *****/


.full-width {
  margin:0 auto;
  width:100%;
}

.half-width{
  float:left;
  margin:0 auto;
  width: 50%;
}

.third-width{
  width:33%;
  float:left;
  margin:0 auto;
}

.top-section, .bottom-section {margin: 0 auto;}

/***** HOME PAGE *****/

/****** HEADER ******/

#home{
  width: 100%;
  Font-Size: 26px;
  margin:10px 25px 10px 0;
  text-align:left;
  font-style:italic;
  background:url('../img/lake-michigan.webp');
  background-size:cover;
  height:480px;
}

#home span{
  font-family: 'Montserrat:600i';
}

header nav{
  float:right;
}


header ul{
  list-style-type:none;
  margin:0;
}

header li{
  display:inline-block;
  font-size:20px;
  padding:0 10px 0 0;
}

nav ul li a{
  color:#000000;
  font-weight:bold;
}

/***** BODY *****/

main p{
  font-size:30px;
  font-style:bold;
  text-align:center;
  padding:160px 100px 160px 100px;
}

main h1{
  font-size:20px;
}


#introduction img{
  width:250px;
  height:auto;
  display:inline-block;
}

#introduction{
  text-align:center;
}

#introduction h2{
  Font-Size: 18px;
  Line-height: 28px;
  width: 33%;
  margin: 0 auto;
}

#introduction p{
  Font-Size: 18px;
  Line-height: 30px;
  padding: 0 0 0 30px;
}


footer{
  text-align:center;
  clear:both;
  font-style:italic;
}

h2{
  font-size:22px
}


h3{
  font-size:18px;
}

h4{
  font-style:italic;
}



  /***** WORK PAGE ******/

#main-header h1{
  width: 100%;
  text-align:left;
  Font-Size: 40px;
  padding: 25px;
  margin: 0 auto;
}

#main-header span{
  font-family: 'Montserrat:600i';
}

 #main-header h2{
  font-size:30px;
  font-style:bold;
}

#main-header h3{
  font-size:22px;
  font-style:italic;
}

#main-header li{
  font-size:18px;
}

#main-header{
  background:url('../img/header-icon.webp');
  background-size:cover;
  height:200px;
}


 /***** PHOTOGRAPHY PAGE *****/


#gallery-header h1{
   text-align:left;
   Font-Size: 40px;
   padding: 25px;
   margin: 0 auto;
   font-style:italic;
   font-weight:bold;
 }

#gallery-header{
   width: 100%;
   background:url('../img/header-icon.webp');
   background-size:cover;
   height:200px;
 }

 .row {
   display: flex;
   flex-wrap: wrap;
   padding: 0 4px;
 }

 /* Create four equal columns that sits next to each other */
 .column {
   flex: 22%;
   max-width: 25%;
   padding: 0 4px;
 }

 .column img {
   margin-top: 8px;
   vertical-align: middle;
   width: 100%;
 }


#photography h2{
  font-style:italic;
  text-align:center;
}

.container{
  background:url(images/sprite.png) 0 0px;
}

.container img {
  filter: url(filters.svg#grayscale);
  /* Firefox 3.5+ */
  filter: gray;
  /* IE6-9 */
  -webkit-filter: grayscale(1);
  /* Google Chrome & Safari 6+ */
}
.container img:hover {
  filter: none;
  -webkit-filter: none;
}



 /***** VOLUNTEER PAGE *****/

#volunteer-header h1{
 text-align:left;
 Font-Size: 40px;
 padding: 25px 25px 10px 25px;
 margin: 0 auto;
}

#volunteer-header span{
 font-family: 'Montserrat:600i';
}

#volunteer-header{
 width: 100%;
 background:url('../img/header-icon.webp');
 background-size:cover;
 height:200px;
}

/***** MAIN VOLUNTEER SECTION *****/

.volunteerchildrens img, .volunteerrelay img{
  width:33%;
  height:auto;
  display:inline-block;
  margin:25px 0 35px 55px;
}

.volunteerflw img{
  width:33%;
  height:auto;
  display:inline-block;
  margin:25px 0 35px 55px;
  padding:25px 0 0 0;
}


.volunteerchildrens h1, .volunteerflw h1, .volunteerrelay h1{
  font-size:17px;
  padding:35px 0 0 0;
}


#vset-up h2{
  font-weight:normal;
  font-size:18px;
}

#vset-up li{
  font-size:16px;
}

#vset-up span{
  font-style:italic;
}

.volunteerflw #vset-up span{
    font-style:italic;
  }

.volunteerrelay #vset-up span{
  font-style:italic;
}

#org{
  text-align:justify-all;
  margin-top:30px;
}

#secondorg{
margin-left:auto;
clear:both;
text-align:justify-all;
margin-top:30px;
}

#thirdorg{
  margin-left:auto;
  margin-top:30px;
  clear:both;
  text-align:justify-all;
}



/***** ADDITIONAL VOLUNTEER SECTION *****/

.additionalvolunteer{
  padding:35px 0 0 0;
  margin-left:auto;
  clear:both;
}


 .additionalcmfk img, .additionalasp img, .additionalsarahscircle img{
  width:33%;
  height:auto;
  display:inline-block;
  margin:25px 0 35px 55px;
}

.additionalcmfk h1, .additionalasp h1, .additionalsarahscircle h1{
  font-size:18px;
  padding:45px 0 0 0;
}

.additionalcmfk h3, .additionalasp h3, .additionalsarahscircle h3{
  font-size:16px;
  font-weight:normal;
}

#c,#d,#e{
  width:66%
  margin:auto;
  clear:both;
}
