@charset "utf-8";
/* CSS Document */

/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }


ol, ul {
  list-style: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block; }

body {
	background-color: #f2f2f2;
	color: #3e3831;
	font-family: Calibri, Verdana, Arial, Numans, sans-serif;
	font-size:large;
	font-weight:bold;
	line-height: 1.5em;
}

nav {
  min-width: 800px;
}

nav ul {
  position: relative; }

nav > ul:after {
  content: "";
  position: absolute;
  width: 50%;
  border-radius: 40%;
  height: 40px;
  bottom: 0;
  left: 20%;
  box-shadow: 0 0 10px rgba(28, 110, 126, 0.5);
  z-index: -1; }

nav > ul:hover:after {
  bottom: 5px; }

h2 {
  font-size: 1.5em;
  text-align: center;
  margin-top: 3em;
  margin-bottom: 1em;
  text-shadow: 0 1px 0 white;
  color: #404040;
  color: darkolivegreen; 
} 

h2:first-child {
    color: teal; 
}

nav.ph-lift {
  text-align: center; }
  
  nav.ph-lift > ul {
    display: inline-block;
    position: relative; }
	
    nav.ph-lift > ul:after {
      box-shadow: 0 0 10px rgba(0, 128, 128, 0.5); }
	  
  nav.ph-lift ul li {
    float: left;
    height: 90px;
    line-height: 90px;
    background: white;
    overflow: hidden;
    -webkit-transition: all.6s ease;
    -moz-transition: all.6s ease;
    -o-transition: all.6s ease;
    -ms-transition: all.6s ease;
    transition: all.6s ease; }
	
    nav.ph-lift ul li:hover {
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.3) inset;
	background-color: #EE2D24;
}
	  
	nav.ph-lift ul li a {   
      display: block;
      text-decoration: none;
      color: #000; 
      padding: 0 45px;
      margin-top: 0;
      -webkit-transition: all.6s ease;
      -moz-transition: all.6s ease;
      -o-transition: all.6s ease;
      -ms-transition: all.6s ease;
      transition: all.6s ease; }
	  
    nav.ph-lift ul li:hover a {
      margin-top: -90px;
      color: white;
      text-shadow: 0 1px 2px  black; }
	  
      nav.ph-lift ul li a:after {
        content: attr(data-title);
        display: block; }