/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/

@import url(http://fonts.googleapis.com/css?family=Oswald);

/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/



/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 10px auto;
  padding: auto;
  box-sizing: border-box; 
  background-color: #fdfdfd;
  
  }
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; 
  background-color: #fdfdfd;
  padding: 5px 10px 5px 12px;
  }
  
.six.columns { background-color: #ececec; }

.twelve.columns { 
background-color: #fdfdfd;
max-width: 98%;
}

.one-half.column { background-color: #fdfdfd;}

.one.column { background-color: #fdfdfd;}

.one-third.column { 
background-color: #fdfdfd;
width: 85%;
}

.two-thirds.column { background-color: #fdfdfd;}

.three.columns { background-color: #fdfdfd;}

.ten.columns { width: 95%; }

.indent {
margin-left: 3%;
margin-right: 1%
}

/* break point menu  */
@media (max-width: 930px) {

.five.columns { 
display:none; }
}

.featured { 
width: 85%; 

}
}


/* For devices larger than 400px */
@media (min-width: 400px) {
  .container {
    width: 95%;
    padding: 0; }
}

/* For devices smaller than 640px */

@media (max-width: 640px) {

.twelve.columns { 
padding-right: 8%;
}

}

/* For devices larger than 550px */
@media (min-width: 680px) {
  .container {
    width: 95%; }
  .column,
  .columns {
    margin-left: 3%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }
    
  .one.column,
  .one.columns                    { width: 7.66666666667%; background-color: #fdfdfd;}
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%; background-color:#fdfdfd;}
  .four.columns                   { width: 30.6666666667%;}
  .five.columns                   { width: 40.3333333333%; background-color: #fdfdfd;}
  .six.columns                    { width: 48%; background-color: #fdfdfd; }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 90%; margin-left: 5%; background-color: #fdfdfd;}

  .one-third.column               { width: 28.6666666667%; background-color: #fdfdfd;}
  .two-thirds.column              { width: 55.3333333333%; background-color: #fdfdfd;}

  .one-half.column                { width: 42%; margin-left: 30px; background-color: #fdfdfd;}

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }

}

/* Larger than tablet */
@media (max-width: 550px) {

.featured { 
width: 95%; }

.one-half.column { width: 96%; background-color: #fdfdfd;}

.vertmenu {margin-left: 10%;}

}

@media (min-width: 950px) {

.featured { 
width: 80%; 

}
}

/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; }
body {
  font-size: 1.4em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.6;
  letter-spacing: .08rem; 
  font-weight: 300;
  font-family: 'Oswald',"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #282828; 
  background-color: #fdfdfd;
  }


/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 1rem;
  font-weight: 300; }
h1 { font-size: 4.0rem; line-height: 1.2;  letter-spacing: -.1rem;}
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 2.1rem; line-height: 1.3;  letter-spacing: .10rem; padding: 0 10px 0 10px; }
h4 { font-size: 1.6rem; font-weight: 80; line-height: 1.35; letter-spacing: .06rem; }
h5 { 
font-size: 1.6rem; 
line-height: 1.5;  
letter-spacing: .1rem; 
font-weight: 100;
margin-left: 30px;
font-family: 'Oswald',"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #919191; 
 }
 
h4 { margin-left: 3%; margin-top: 3.5%; margin-right: 0px; margin-bottom: .5%;}
h6 { font-size: 1.6rem; line-height: 1.6;  font-weight: 40; letter-spacing: .09rem; margin-left: 0%; margin-right: 0px;}

/* Larger than phablet */
@media (min-width: 550px) {
  h1 { font-size: 5.0rem; }
  h2 { font-size: 4.2rem; }
  h3 { font-size: 2.1rem; letter-spacing: .05rem; }
  h4 { font-size: 1.6rem; }
  h5 { margin-left: 45px; }
  h6 { font-size: 1.3rem; }
}

p {
  margin-top: 0;
  margin-left: 10px;
}

.name {
  font-size: 1.6em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.0;
  letter-spacing: .19rem; 
  font-weight: 400;
  font-family: 'Oswald',"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #444444; 
  background-color: #fdfdfd;
  margin-left: 20px;
  }
  
  .subname {
  font-size: 0.8em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.2;
  letter-spacing: .09rem; 
  font-weight: 200;
  font-family: 'Oswald',HelveticaNeue, Helvetica Neue, Helvetica, Arial, sans-serif;
  color: #909090; 
  background-color: #fdfdfd;
  margin-left: 21px;
  margin-top: -20px;
  }
  
  .about {
  font-size: 1.2em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.4;
  letter-spacing: .03rem;
  text-align: justified; 
  font-weight: 200;
  font-family: Arial, Verdana, sans-serif;
  color: #111111; 
  background-color: #fdfdfd;
  float:center;
  margin-left: 0px;
  margin-top: 0px;
  }
  
  .about-bold {
  font-size: 1.1em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.4;
  letter-spacing: .08rem; 
  font-weight: 500;
  font-family: Arial, Verdana, sans-serif;
  color: #222222; 
  background-color: #fdfdfd;
  float:center;
  margin-left: 0px;
  margin-top: 0px;
  }
  
  .subtitle {
  font-size: 1.1em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.4;
  letter-spacing: .08rem; 
  font-weight: 200;
  font-family: 'Oswald',"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #222222; 
  background-color: #fdfdfd;
  margin-left: 0px;
  margin-top: 0px;
  width: 255px;
  }
  
    .subtitle2 {
  font-size: 1.0em; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.0;
  letter-spacing: .08rem; 
  font-weight: 200;
  font-family: 'Oswald',"HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #222222; 
  background-color: #fdfdfd;
  width:100%;
  margin-left: 2px;
  margin-top: 0px;
  }

/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #fd8a17;
  text-decoration:none;
  
   }
a:hover {
  color: #444444; }



/* Buttons removed 8-6-16
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Forms removed 8-6-16
–––––––––––––––––––––––––––––––––––––––––––––––––– */


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle inside;
  color: #8b8d09;}
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 25px;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
li {
  margin-bottom: 1rem; 
  color:#222222;
  }



/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }



/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }



/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
  margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }



/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }



/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }

.circleBase {
    border-radius: 50%;
    float: left;
    margin-right: 10px;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */
}

.type1 {
    width: 22px;
    height: 22px;
    background: orange;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}

.type2 {
    width: 22px;
    height: 22px;
    background: #454545;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}

.type3 {
    width: 22px;
    height: 22px;
    background: #6C6C6C;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}

.type4 {
    width: 22px;
    height: 22px;
    background: #919191;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}

.type5 {
    width: 22px;
    height: 22px;
    background: #ADADAD;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}

.type6 {
    width: 22px;
    height: 22px;
    background: #CDCDCD;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}

.type7 {
    width: 22px;
    height: 22px;
    background: #F0F0F0;
    border: 1px solid gray;
    margin-left:15px;
    margin-top: -1px;
}
/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }



/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/



/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}