/**
*** SIMPLE GRID
*** (C) ZACH COLE 2016
**/




/* UNIVERSAL */

html,
body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  left: 0;
  top: 0;
  font-size: 100%;
  /* background-image: url(images/wires.jpg);
  background-repeat: no-repeat;
  background-attachment:fixed;
  background-position: left center; */
}
.wideHead {
  width: 100%;
background-image: url("images/sky.jpg");
background-size: cover;
text-align:center;
margin-top:0px;

}
.wideButt {
  width: 100%;
background-image: url("images/ground.jpg");
background-size: cover;
text-align:center;
margin-top:0px;

}

.titleBanner {

outline:1px solid black;
}
.rightFront {
background-image: url("images/collage.jpg");
background-size: cover;
background-repeat: no-repeat;
outline:1px solid black;
}
.footBanner {
background-image: url("images/ground.jpg");
background-size: cover;
}
/* ROOT FONT STYLES */

@import url(http://cloud.typenetwork.com/projects/2661/fontface.css/)

* {
  color: #333447;
  line-height: 1.5;
}

/***************************************************************
These styles are subject to the following license agreement(s):

https://store.typenetwork.com/cart/eula/font-bureau
https://store.typenetwork.com/cart/eula/font-bureau
https://store.typenetwork.com/cart/eula/font-bureau
https://store.typenetwork.com/cart/eula/font-bureau
https://store.typenetwork.com/cart/eula/font-bureau
***************************************************************/

.poynterserifrebold {
    font-family: "Poynter Serif RE Bd";
    font-style: Normal;
    font-weight: Normal;
}

.poynterserifreregular {
    font-family: "Poynter Serif RE Reg";
    font-style: Normal;
    font-weight: Normal;
}

.poynterserifreitalic {
    font-family: "Poynter Serif RE It";
    font-style: Italic;
    font-weight: Normal;
}

.bentonsansbold {
    font-family: "Benton Sans Bd";
    font-style: Normal;
    font-weight: Normal;
}

.poynterserifrebolditalic {
    font-family: "Poynter Serif RE Bd It";
    font-style: Italic;
    font-weight: Normal;
}



.source-sans-3-title {
  font-family: "Source Sans 3", sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
}

.source-sans-3-headings {
  font-family: "Source Sans 3", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}


.crimson-pro-regular {
  font-family: "Crimson Pro", serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}


.crimson-text-regular {
  font-family: "Crimson Text", serif;
  font-weight: 400;
  font-style: normal;
}

.crimson-text-semibold {
  font-family: "Crimson Text", serif;
  font-weight: 600;
  font-style: normal;
}

.crimson-text-bold {
  font-family: "Crimson Text", serif;
  font-weight: 700;
  font-style: normal;
}

.crimson-text-regular-italic {
  font-family: "Crimson Text", serif;
  font-weight: 400;
  font-style: italic;
}

.crimson-text-semibold-italic {
  font-family: "Crimson Text", serif;
  font-weight: 600;
  font-style: italic;
}

.crimson-text-bold-italic {
  font-family: "Crimson Text", serif;
  font-weight: 700;
  font-style: italic;
}




/* TYPOGRAPHY */

b {
  font-family: "Source Sans 3";
    font-style: Bold;
    font-weight: 600;
}
i {
 font-family: "Source Sans 3";
    font-style: Italic;
    font-weight: Normal;
}

b i {
font-family: "Source Sans 3";
    font-style: Italic;
    font-weight: Normal;
}

a {
color:#264fa8;
}

a:hover {
background-color:orange;
}



h1 {
  font-size: 5rem;
      font-family: "Source Sans 3";
      padding-left:10px;
      font-weight: 800;
color: black;

}
@media only screen 
  and (max-width: 800px)
  {
  h1 {
  font-size: 3rem;
  }

}


h2 {
  font-size: 2rem;
}

h3 {
  font-size: 1.375rem;
}

h4 {
  font-size: 1.75rem;
        font-family: "Source Sans 3";
        text-align: left;
        font-weight: 400;
        

}

h5 {
font-size: 1rem;
        font-family: "Crimson Text";
        text-align: left;}

h6 {
  font-size: 0.875rem;
}
h7 {
  font-size: 1.5rem;
        font-family: "Source Sans 3";
        text-align: center;
       
        

}

p {
    font-family: "Source Sans 3";

  font-size: 1.1rem;
  font-weight: Normal;
  line-height: 1.5;
}

ul {
    font-family: "Source Sans 3";

  font-size: 1rem;
  font-weight: Normal;
  line-height: 1.5;  
}

.firstGraph p:first-of-type:first-letter {
    font-family: "Source Sans 3";
    font-weight: 700;
    float: left;
    font-size: 3.6rem;
    line-height: 3rem;
    margin-right: 7px;
    margin-top: .2rem;
}

li {
margin-bottom: .75rem;
}

.listy {
font-size: 1rem;
margin: .7rem;


}
.listy a:hover {
background-color: orange;

}
.listy a:link {
color: black;

}

.artPix {

font-size:1rem;text-align:center;
}
.artBox {
position:relative;
text-align:center;
}


.artText {
	color: #000000;
	font-size:1rem;
	/*position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);*/
	font-family:"Crimson Text";
	
}

.font-light {
  font-weight: 300;
}

.font-regular {
  font-weight: 400;
}

.font-heavy {
  font-weight: 700;
}

/* POSITIONING */

.left {
  text-align: left;
}

.right {
  text-align: right;
}

.center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.justify {
  text-align: justify;
}


/* ==== GRID SYSTEM ==== */

.title {
height: 4rem;
}

.container {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.row {
  position: relative;
  width: 100%;
}

.row [class^="col"] {
  float: left;
  margin: 0.2rem 2%;
  min-height: 0.125rem;
}

.askMe {
	height: 175px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-repeat: no-repeat;
	background-size:cover;
	font-weight: 600;
	font-size: 1rem;
}





.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  width: 96%;
}

.col-1-sm {
  width: 4.33%;
}

.col-2-sm {
  width: 12.66%;
}

.col-3-sm {
  width: 21%;
}

.col-4-sm {
  width: 29.33%;
}

.col-5-sm {
  width: 37.66%;
}

.col-6-sm {
  width: 46%;
}

.col-7-sm {
  width: 54.33%;
}

.col-8-sm {
  width: 62.66%;
}

.col-9-sm {
  width: 71%;
}

.col-10-sm {
  width: 79.33%;
}

.col-11-sm {
  width: 87.66%;
}

.col-12-sm {
  width: 96%;
}

.row::after {
	content: "";
	display: table;
	clear: both;
}

.hidden-sm {
  display: none;
}

@media only screen and (min-width: 33.75em) {  /* 540px */
  .container {
    width: 80%;
  }
  
}

@media only screen and (min-width: 55em) {  /* 720px */
  .col-1 {
    width: 4.33%;
  }

  .col-2 {
    width: 12.66%;
  }

  .col-3 {
    width: 21%;
  }

  .col-4 {
    width: 29.33%;
  }

  .col-5 {
    width: 37.66%;
  }

  .col-6 {
    width: 46%;
  }

  .col-7 {
    width: 54.33%;
  }

  .col-8 {
    width: 62.66%;
  }

  .col-9 {
    width: 71%;
  }

  .col-10 {
    width: 79.33%;
  }

  .col-11 {
    width: 87.66%;
  }

  .col-12 {
    width: 96%;
  }

  .hidden-sm {
    display: block;
  }
  
}

@media only screen and (min-width: 60em) { /* 960px */
  .container {
    width: 75%;
    max-width: 70rem;
  }
}
