/*
   ======================================

   Written by: Steve Beeston
   Date:       January/February 2016
   Notes:      Pull quote formatting taken from HTML Dog - http://htmldog.com/techniques/pullquotes/

   ======================================
*/

@import url(normalize.css);
@import url(grid.css);
@import url(menu.css);
@import url(buttons.css);

* {
   padding: 0;
   margin: 0;
}

body {
   background: #e8e8e8;
}



/*
   ======
   LAYOUT
   ======
*/


.outer-wrapper {
   position: relative;
   float: left;
   width: 100%;
   min-height: 100%;
   background: #e8e8e8;
}


#container {
   position: relative;
	margin: 0 auto;
   width: 100%;
   max-width: 980px;
   box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1);
   -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1);
   -webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1);
   -webkit-border-radius: 7px;
   -moz-border-radius: 7px;
   border-radius: 7px;
   background: #fff;
}

.inner-wrapper {
   position: relative;
	margin: 0 auto;
   width: 100%;
   /*max-width: 980px;*/
}

header, footer {
	width: 100%;
}

header {
   /*  box-shadow: 0px 0px 6px 0px silver;
   border-bottom: 1px solid #ddd;
   border-bottom: 1px solid #f1b7b7; */
}

footer {
   background-color: #f8f8f8;
   border-radius: 0 0 7px 7px;
   margin-bottom: 50px;
}

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

.panel {
   float: left;
   background: #f8f8f8;
   width: 100%;
   padding: 10px
}

.panel h2 {
   font-family: 'Roboto Condensed', arial, sans-serif;
   color: #00579A;
   font-size: 24px;
}

.panel h3 {
   font-family: 'Roboto Condensed', arial, sans-serif;
   color: black;
   font-size: 16px;
   padding: 0;
}

.panel img {
   margin-top: 10px;
   width: 100%;
}

.text-center {
   text-align: center;
}

.text-right {
   text-align: right;
}

.text-left {
   text-align: left;
}

.no-padding {
   padding: 0;
}

/* -----------
   Pull Quotes
   -----------
*/

.pquote {
   float: right;
   width: 300px;
   background: url(../img/openquote.gif) top left no-repeat;
   color: #030;
   font-size: 26px;
   line-height: 0.9;
   font-style: italic;
   padding: 13px;
   margin-left: 15px;
}

blockquote p {
   line-height: inherit;
   font-size: 36px;
   margin: 0;
}

.pquote p:first-letter {
   font-size: 60px;
   font-weight: bold;
}


/*
   ==========
   TYPOGRAPHY
   ==========
*/


h1, h2, p, a, li, td, label {
   color: #444; 
}

h1, h2, h3, h4 {
   font-family: 'EB Garamond', serif;
   color: #00579A;
}

h1 {
   font-size: 30px; 
   font-weight: normal; 
   padding: 8px 0;
}

h2 {
   font-size: 24px; 
   font-weight: normal; 
   padding: 8px 0;
}

h3 {
   font-size: 22px; 
   font-weight: normal;
   padding: 8px 0;
}

p, a, li, td, label {
   font-family: 'EB Garamond', serif;
   font-size: 18px; 
   line-height: 26px;
   padding: 10px 0;
}


a { 
   text-decoration: none;
   border-bottom: 1px dotted;
   padding-bottom: 0;
}

#footer p {
   font-size: 16px;
}



img.profile-photo {
   float: right;
   margin-left: 20px;
   border-bottom: 0;
}




/* 
   ================================
   MESSAGES 
   ================================
*/

.success, 
.failure {
   font: bold 13px arial;
   display: inline; 
   padding: 3px; 
   border-radius: 4px; 
   border-width: 2px; 
   border-style: solid; 
   margin: 3px;
}

.success {
   color: green; 
   border-color: green;
}

.failure {
   color: red; 
   border-color: red;
}







/*
   =======================================
   S M A L L   S I Z E D   S C R E E N S
   =======================================
*/


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

   header .text-right,
   footer .text-right,
   footer .text-left {
      text-align: center;
   }

   footer .columns {
      padding-top: 0;
      padding-bottom: 0;
   }

   .featurebox {
      float: none;
      margin: 15px auto;
   }

   li {
      list-style-type: none;
   }

   img.profile-photo {
      float: none;
      margin: 10px auto;
   }



}