/* Shared
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="text"], textarea{
	color: #000;
}

.button {
  border-radius: 100px;
}


.header
{
	background-color: #333333;
	height: 71px;
}

.header a{
	text-decoration: none;
}

.header h2, .header p
{
	vertical-align: 15px;
	margin: 0 5px 0 5px;
	color: #C45B34;
}

.header h2, .header p
{
	display: inline;
}

/* Sections
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.section {
  padding: 8rem 0 7rem;
  text-align: center;
}
.section h1{
	color: #fff;
}

.section-heading{
	color: #FCFCFC;
}
.section-heading,
.section-description {
  margin-bottom: 1.2rem;
}

/* Hero
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.hero{
	background-image: url('../images/looming-wolves-banner.jpg');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
}
.phones {
  position: relative;
}
.phone {
  position: relative;
  max-width: 80%;
  margin: 3rem auto -12rem;
}
.phone + .phone {
  display: none;
}

/* Welcome
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.welcome {
	background-color: #333333;
  color: #fff;
  padding-bottom: 5rem;
}
.welcome-multiplier {
  margin-bottom: .5rem;
  color: #C45A33;
}
.welcome-heading {
  margin-bottom: .3rem;
}
.welcome-description {
  opacity: .8;
  font-weight: 300;
}


/* subpages
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.text
{
	color: #FFFFFF;
}

.main{
	background-color: #333333;
  color: #fff;
  padding: 5rem 0 5rem 0;
}

.preview a
{
	text-decoration: none;
	color: #fff;
}

/* Subpage backgrounds
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.story1
{
		  background: linear-gradient(
      rgba(127, 127, 127, 0.60), 
      rgba(127, 127, 127, 0.60)
    ), url('../images/blfc-room-sign.jpg');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;

}


/* Stories
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.stories {
  background: linear-gradient(
      rgba(127, 127, 127, 0.60), 
      rgba(127, 127, 127, 0.60)
    ), url('../images/reunion-tower-hump.jpg');
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
}

.stories a{
	color: white;
	text-decoration: none;
}



/* Social Media
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.social{
	float: right;
	padding: 5px 5px 0 0;
}

.social img{
	height: 50px;
	width: 50px;
}


/* twitter
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.twitter {
  background-color: #581800;
	height: 900px;
  color: #fff;
}
.twitter .section-description { 
  margin-bottom: 4rem;
}

/* Bigger than 550 */
@media (min-width: 550px) {
  .section {
    padding: 12rem 0 11rem;
  }
  .welcome {
    padding-bottom: 12rem;
    text-align: left;
    height: 165px;
  }
  .phone {
    position: absolute;
    top: -7rem;
    right: 3rem;
    max-height: 362px;
    z-index: 3;
  }
  .phone + .phone {
    top: -6rem;
    display: block;
    max-width: 73.8%;
    right: 0;
    z-index: 2;
    max-height: 338px;
  }
  .welcome-heading {
    font-size: 2.4rem;
  }
	
	.art img{
		width: 450px;
	}
}

.art img{
		width: 400px;
	}

footer{
	height: 100%;
	padding: 10px 0 0 5px;
	background: #310D00;
	font-size: 12px;
	color: #fff;
}
footer h5{
	padding-top: 10px;
}

footer a, footer a:visited {
	color: #fff;
	text-decoration: none;
}

footer a:hover
{
	color: #fff;
}

footer .social{
	float: left;
}
footer .clear{
	display: none;
}
@media (max-width: 980px) {
	footer .clear{
	clear:both; display:block;
}
	footer .social{
		margin-left: 4%;
	}
}

/* Bigger than 750 */
@media (min-width: 750px) {
  .hero {
    height: 390px;
  }
  .welcome-heading {
    font-size: 2.6rem;
  }
  .section {
    padding: 14rem 0 15rem;
  }
  .welcome {
    padding: 16rem 0 14rem;
  }
  .section-description {
    max-width: 60%;
    margin-left: auto;
    margin-right: auto;
  }.art img{
		width: 500px;
	}
  .categories {
    padding: 15rem 0 8rem;
  }
}

/* Bigger than 1000 */
@media (min-width: 1000px) {
  .section {
    padding: 20rem 0 19rem;
  }
  .welcome {
    padding: 22rem 0;
  }
	.art img{
		width: 700px;
	}
}



#menu ul {
	
  margin: 0;
  padding: 0;
}

#menu .main-menu {
  display: none;
}

#tm:checked + .main-menu {
  display: block;
}

#menu input[type="checkbox"], 
#menu ul span.drop-icon {
  display: none;
}

#menu li, 
#toggle-menu, 
#menu .sub-menu {
  border-style: solid;
  border-color: rgba(0, 0, 0, .05);
}

#menu li, 
#toggle-menu {
  border-width: 0 0 1px;
}

#menu .sub-menu {
  background-color: #444;
  border-width: 1px 1px 0;
  margin: 0 1em;
}

#menu .sub-menu li:last-child {
  border-width: 0;
}

#menu li, 
#toggle-menu, 
#menu a {
  position: relative;
  display: block;
	text-decoration: none;
  color: white;
  text-shadow: 1px 1px 0 rgba(0, 0, 0, .125);
}

#menu {
  background-color: #7E2200;
}

#toggle-menu {
  background: #333;
}

#toggle-menu, 
#menu a {
  padding: 1em 1.5em;
}

#menu a {
  transition: all .125s ease-in-out;
  -webkit-transition: all .125s ease-in-out;
}

#menu a:hover {
  background-color: white;
  color: #7E2200;
}

#menu .sub-menu {
  display: none;
}

#menu input[type="checkbox"]:checked + .sub-menu {
  display: block;
}

#menu .sub-menu a:hover {
  color: #444;
}

#toggle-menu .drop-icon, 
#menu li label.drop-icon {
  position: absolute;
  right: 0;
  top: 0;
}


#menu label.drop-icon, #toggle-menu span.drop-icon {
  padding: 1em;
  font-size: 1em;
  text-align: center;
  background-color: rgba(0, 0, 0, .125);
  text-shadow: 0 0 0 transparent;
  color: rgba(255, 255, 255, .75);
}

@media only screen and (min-width: 1024px) {
  #menu .main-menu {
    display: block;
  }

  #toggle-menu, 
  #menu label.drop-icon {
    display: none;
  }
	
	.art img{
		width: 900px;
	}

  #menu ul span.drop-icon {
    display: inline-block;
  }

  #menu li {
    float: left;
    border-width: 0 1px 0 0;
  }

  #menu .sub-menu li {
    float: none;
  }

  #menu .sub-menu {
    border-width: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width: 12em;
    z-index: 3000;
  }

  #menu .sub-menu, 
  #menu input[type="checkbox"]:checked + .sub-menu {
    display: none;
  }

  #menu .sub-menu li {
    border-width: 0 0 1px;
  }

  #menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }

 #menu .sub-menu .drop-icon {
    position: absolute;
    top: 0;
    right: 0;
    padding: 1em;
  }

  #menu li:hover > input[type="checkbox"] + .sub-menu {
    display: block;
  }
}

@media (max-width: 1130px) {
	.header{
		height: 150px;
	}
}

@media (max-width: 600px) {
	.header{
		height: 200px;
	}
}

@media (max-width: 510px) {
	.header{
		height: 250px;
	}
}

@media (max-width: 400px) {
	.header{
		height: 320px;
	}
}

@media (max-width: 290px) {
	.header{
		height: 340px;
	}
}

@media (max-width: 1000px) {
	.section {
	min-height: 500px;
}
}
