/*Returning everything to default*/

*   { margin: 0;
      padding: 0;
      border:  0;
      font-size: 100%;
      vertical-align: baseline;
      text-decoration: none;
      background: transparent;   }

/* making css compatable with older browsers*/

header, main, nav, footer, section, article, aside, figure, figcaption {  display: block;  }


/*Setting headers to relative sizes*/

h1  { font-size: 2em; 
      font-family: Snell Roundhand, Papyrus, Georgia, sans-serif;
      font-weight: bold; 
      text-align: center;
      text-align: center;
      background-color: #c56a76;
      height: 60px; 
      padding-top: 0px;
      border-bottom: 2px solid black;
 
      color: #000000; 
       }

h2  { font-size: 1.5em; 
      font-family: Palatino,Garamond, Times New Roman, sans-serif; 
      text-align: center; 
      font-weight: normal; 
      padding-top: 20px;
      padding-bottom: 15px;
      text-decoration: underline; }

h3  { font-size: 1.125em; 
       font-family: Georgia, sans-serif; }
      

h4  { font-size: 1em;
       }

h5, h6  { font-size: .875em;
          font-family: Arial, serif; 
          font-weight: normal; }

h6  { font-style: italic;
      text-align: center; 
      padding-bottom: 8px; 
      margin-top: -5px;
      padding-top: 5px; }

p   { font-size: .75em;
      font-family: Trebuchet MS, Verdana, serif;
      color: #595959; }

/*Setting attributes to common tags*/

a   { color: #c56a76;   }

table  { margin: auto; 
         padding-bottom: 20px;
         width: 200px; }

article    { padding-bottom: 15px;  }

nav li   { font-size: 1.125em; 
           display: block; 
           margin-top: 20px; }

nav a     { color: #ffffff; 
            padding: 10px;
           }

nav ul   {float: left;
          padding-left: 10px;
          width: 20%;  }


.topnav a:hover   {  color: #c56a76;   }


fieldset  {   display: block;
              padding: 25px; 
              border: 2px solid #000000; 
              width: 450px;
              margin: auto; 
              margin-top: 50px;
              margin-bottom: 220px;}

form       {padding-top: 35px;  }

button     { border: 1px solid black; 
             color: #000000; 
             border-radius: 15px;
             padding: 4px;   }

legend      { font-size: 1.125em;
              font-family: Georgia, sans-serif; 
              font-weight: bold; }

footer  {  height: 100px;
           background-color: #ddf0ed;  
           border-top: 2px solid black; }

#brand  {    margin-top: 50px;
                font-family: Arial, serif;
                font-size: 16px;
                text-align: center;   }

#brand a  { color: #000000;   }


/* id tags to control various aspects of the page*/


#words  { padding-left: 5px;
          padding-right: 5px;
          font-size: 18px;
          margin-left: auto;
          margin-right: auto; 
          width: 400px; }


#words2  { padding-left: 5px;
          padding-right: 5px;
          font-size: 18px;
          margin-left: auto;
          margin-right: auto; 
          width: 425px;
          padding-right: 0%; }


#blog    { text-decoration: none;
           font-family: Times New Roman, sans-serif;  }


#btn     { background-color:  #ddf0ed;
           float: right;
           box-shadow: 2px 2px;
           cursor: pointer;     }

#frm     {   padding-top: 10px;
             padding-bottom: 15px;   }

#phone1   {  padding-top: 20px;
             text-align: center;  }
         


.title    { height: 80px;
            background-color: #c56a76;
            border-bottom: 2px solid black;
            border-top: 2px solid black;
                    }
/* The sticky class is added to the header with JS when it reaches its scroll position */

.sticky {
  position: fixed;
  top: 0;
  width: 100%
}

/* makes iframe reponsive*/

#container5   { overflow: hidden;
                padding-top: 0px;
                position: relative;  }

#container5 iframe  { height: 250px;
                      width: 350px;
                      position: relative;
                      margin: auto;  }

#container5 -4x3  {  padding-top: 56.25%;  }

#container6   { overflow: hidden;
                padding-top: 0px;
                position: relative;  }

#container6 iframe  { height: 250px;
                      width: 350px;
                      position: relative;
                      margin: auto;  }

#container6 -4x3  {  padding-top: 56.25%;  }


#ft2      {  text-align: center;
             padding-top: 57px; 
             font-family: Times New Roman, sans-serif;
             font-size: 1.125em;  }

#div1     {   display: inline-block;
              text-align: center;
              margin-left: auto;
              margin-right: auto;
              }

#div2     {   padding-top: 20px;
              display: block;
              padding-left: 5px;  }


/*Controls links in footer*/

#ft      { margin-left: auto;
           margin-right: auto;
           text-align: center;
           padding-top: 10px;
           font-family: Verdana, serif; 
           font-size: .875em; 
           width: 600px;
           }
#ft a  {    padding: 20px;   }

li   {   display: inline-block;   }

#ft a:hover  { color: black;  }




.logo   {  cursor: pointer   }

.container  { display: inline-block;
              cursor: pointer;  }

/*Classes to control various aspects of the page*/

   /*policy and width for trade.html*/


.trade   {   font-weight: bold;
             text-decoration: underline;  }


#policy  {  text-align: center; 
            padding-top: 10px;
            padding-bottom: 5px;    }

.width   { padding-left: 10px;
           padding-right: 10px;
           padding-bottom: 10px;   }

/* fix for the volunteer form*/

#fix3  { padding-right: 20%;  }



.color3  {   color: #992600;   }


.div1  {  margin: auto;
          text-align: center;
          padding-top: 10px; 
          padding-bottom: 20px; }

.div2   { margin-left: auto;
          margin-right: auto;
          text-align: center;
          display: block; 
          padding-top: 20px;
          background-size: 100%;
          }



.div3   {  text-align: center;
           padding-top: 20px;
           padding-bottom: 15px;  }

/*  pictures on index, literacy, and libraries pages*/

#div6    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/booknook7.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div7    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/literacy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div8    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/library6copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div9    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/lflpic2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* Div's for photo gallery on books.html*/

#div10    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/specialauthorscopy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div11    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/classics3copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div12    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/religion2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div13    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/christiancopy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div14    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/scificopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div15    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/mysteriescopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div16    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/kidscopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div17    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/cookbooks2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div18    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/puzzles2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div19    {  width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/25cents2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* end of photo gallery */

/*photo's for blog */

#div20    { width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog6.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div21    { width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog5.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div22    { width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog4.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div23    { width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog3.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div24    { width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog2.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div25    { width: 350px;
            height: 250px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog1.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* end blog photos */




























#border   { border: 3px solid black; 
            margin-right: 22%;
            margin-left: 22%;
            padding-top: 10px;
            margin-bottom: 10px; }


.color     {background-color: #dcc0b7;
            font-size: 1em;
            font-family: Times New Roman, sans-serif; }

.color2     {color: #cc0000;  }


.color2    {  color:   #992600;  }

.cap       { padding-top: 15px;
            font-family: Georgia, sans-serif;
            font-size: 1.5em;    }

.div4      { width: 275px;
             margin: auto;
             padding-top: 10px;
             padding-bottom: 10px;    
             border-top: 1px solid black; 
             border-bottom: 1px solid black; }

.div5     {  width: 45px;
             height: 4.5px;
             background-color: #000000;
             margin: 3.5px 0;
             transition: 0.4s;  }


#curs    { display: none;
           padding-left: 3px;
           padding-top: 3px;  }


#myLinks    {   
                padding-top: 25px;   }

.topnav a  { color: black;
             text-decoration: none;  
             font-size: 1.5em;
             display: block;
             font-family: Georgia, sans-serif;   }

#fix   { padding-top: 19px;
         border-bottom: 0px solid black;  }

#fix2  { padding-right: 20%; 
          }



.padding   {  padding-top: 20px; 
              color: #992600;  }

.cover   {  text-align: center;
            display: block;
            padding-bottom: 0px;  }

.cover2   {  text-align: center;
            display: block;
            padding-bottom: 15px;  }
      
          



label       {  padding-right: 10px;
               font-family: Arial, serif;  }


input       { border: 1px solid #000000;  }

/*fixed sticky header*/



@media only screen and (max-width: 900px)  {


#fix    {    border-bottom: 2px solid black;  
             padding-top: 0px;  }

#fix2  { padding-right: 0%;  }

#border   { border: 3px solid black; 
            margin-right: 10%;
            margin-left: 10%;
            padding-top: 10px;
            margin-bottom: 10px;
            margin-top: 20px; }

#brand  {    margin-top: 50px;
                font-family: Arial, serif;
                font-size: 14px;
                text-align: center;   }

#brand a  { color: #000000;   }

#container5 iframe  { height: 210px;
                      width: 320px;
                      position: relative;
                      margin: auto;  }

#container6 iframe  { height: 210px;
                      width: 320px;
                      position: relative;
                      margin: auto;  }



#div6    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/booknook7.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div7    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/literacy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div8    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/library6copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div9    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/lflpic2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }


/* Div's for photo gallery on books.html*/

#div10    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/specialauthorscopy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div11    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/classics3copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div12    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/religion2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div13    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/christiancopy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div14    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/scificopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div15    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/mysteriescopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div16    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/kidscopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div17    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/cookbooks2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div18    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/puzzles2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div19    {  width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/25cents2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* end of photo gallery */


/*photo's for blog */

#div20    { width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog6.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div21    { width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog5.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div22    { width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog4.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div23    { width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog3.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div24    { width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog2.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div25    { width: 320px;
            height: 210px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog1.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* end blog photos */








			

/*three line navigation*/

.topnav   {overflow: hidden;
           position: relative;
           background-color: #ddf0ed; 
           float: none;
           width: 100%;
             }

.topnav #myLinks { display: none; }

.sticky  {  position: relative;
            top: 0px;
            width: 100%; 
             }



.div2   { margin-left: auto;
          margin-right: auto;
          text-align: center;
          display: block; 
          padding-top: 20px;
          width: auto;
          height: auto;
          padding-right: 0%;
          background-size: 100%; }

#fix2     { padding-right: 0%;   }




#words  { padding-left: 5px;
          padding-right: 5px;
          font-size: 18px;
          margin-left: auto;
          margin-right: auto; 
          width: 350px; }

#words2  { padding-left: 5px;
          padding-right: 5px;
          font-size: 18px;
          margin-left: auto;
          margin-right: auto; 
          width: 300px;
          padding-right: 0%; }


#ft      { margin-left: auto;
           margin-right: auto;
           text-align: center;
           padding-top: 10px;
           font-family: Verdana, serif; 
           font-size: .75em; 
           width: 320px; }


#ft a   {   padding: 3px;    }




#myLinks   {  padding-top: 0px;  }


.topnav a  { color: black;
             padding: 14px 10px;
             text-decoration: none;
             font-size: 1.125em;
             display: block;
             font-family: Georgia, sans-serif;   }

.topnav a:hover  {color: #c56a76;  }


.div5     {  width: 24px;
             height: 3.5px;
             background-color: #000000;
             margin: 3.5px 0;
             transition: 0.4s; 
              }

#curs    { cursor: pointer;
           display: block; }


  }

@media only screen and (max-width: 600px)   {

#border   { border: 3px solid black; 
            margin-right: 10%;
            margin-left: 10%;
            padding-top: 10px;
            margin-bottom: 10px;
            margin-top: 20px; }

#words  { padding-left: 5px;
          padding-right: 5px;
          font-size: 18px;
          margin-left: auto;
          margin-right: auto; 
          width: 275px; } 

fieldset  {   display: block;
                padding: 3px; 
                border: 2px solid #000000; 
                width: 325px;
                margin: auto; 
                margin-top: 50px;
                margin-bottom: 200px;}

#container5 iframe  { height: 177px;
                      width: 256px;
                      position: relative;
                      margin: auto;  }

#container6 iframe  { height: 177px;
                      width: 256px;
                      position: relative;
                      margin: auto;  }



#div6    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/booknook7.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div7    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/literacy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div8    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/library6copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div9    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('photos/lflpic2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }


/* Div's for photo gallery on books.html*/

#div10    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/specialauthorscopy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div11    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/classics3copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div12    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/religion2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div13    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/christiancopy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div14    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/scificopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div15    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/mysteriescopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div16    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/kidscopy.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div17    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/cookbooks2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div18    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/puzzles2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div19    {  width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('books/25cents2copy.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* end of photo gallery */

/*photo's for blog */

#div20    { width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog6.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div21    { width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog5.jpeg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div22    { width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog4.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div23    { width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog3.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div24    { width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog2.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

#div25    { width: 256px;
            height: 177px;  
            margin: auto; 
            background-position: center;
            background-image: url('blog/blog1.jpg');
            background-size: contain;
            background-repeat: no-repeat;  }

/* end blog photos */








  }






@media only screen and (max-width: 500px)   {

   h1  {font-size: 1.5em;  }
 
   #border  {   border-left: 0px; 
                border-right: 0px;
                border-bottom: 0px;
                border-top: 0px;
                margin-top: 6px;
                padding-left: 0px;
                padding-right: 0px;
                padding-bottom: 0px;
                padding-top: 20px;  }


  fieldset  {   display: block;
                padding: 3px; 
                border: 2px solid #000000; 
                width: 260px;
                margin-left: auto;
                margin-right: auto;
                margin-top: 50px;
                margin-bottom: 120px;}

   #words   { padding-right: 0px;
              padding-left: 0px;
               width: 100%;       }

   #ft2   { font-size: .75em;
            text-align: center;
            display: block;
            margin: auto;
            padding-top: 57px; 
            font-family: Times New Roman, sans-serif;  }

   

        }