/*
REMEMBER THAT DEFAULT STYLES SHOULD BE MOBILE FIRST.
THERE SHOULD BE NO NEED TO TARGET MOBILE (EXTRA SMALL) DISPLAYS SPECIFICALLY

you don't tell me how to live my life

^YOU CAN DO WHAT YOU WANT SO LONG AS IT'S WHAT I TELL YOU

^ this is america. i do what i want. >:(

*/



/******************
TARGETS SMALL, MEDIUM, AND LARGE SCREENS
******************/
@media screen and (min-width: 768px) {

  #header-wrap {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    z-index: 100;
  }
  nav {
    float: left;
  }
  .navbar-btn {
    margin-left: 0;
  }

  .nav > li {
    float: left;
    position: relative;
  }
  .nav > li > a {
    padding: 12px;
    margin-top: 40px;
  }
  .nav li a:hover {
    background: transparent;
    color: rgba(41, 77, 157, 1);
  }

  .nav ul.dropdown-menu {
    position: fixed;
    top: 98px;
    background: rgba(255, 255, 255, 0.9);
    width: 100%;
    padding: 2em;
    max-width: 1170px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    box-shadow: 1px 1px 4px rgba(128, 128, 128, 0.5);
  }

  .nav ul.dropdown-menu > li {
    width: 33.333333%;
    float: left;
  }

  .nav-buttons {
    text-align: left;
    float: right;
  }

  .progressbar-row .webform-progressbar-page-label {
    border-width: 0 1px 0 0;
    height: 3em;
  }
  .progressbar-row a:last-child .webform-progressbar-page-label {
    border: none;
  }

}

/******************
TARGETS MEDIUM AND LARGE SCREENS
******************/
@media screen and (min-width: 992px) {

  .header-primary {
    padding: 8em 0;
  }
  .header-primary.small {
    padding: 3em 0;
  }

  .nav ul.dropdown-menu {
    top: 100px;
  }


  .progressbar-row .webform-progressbar-page-label {
    font-size: 1em;
  }


}

/******************
TARGETS LARGE SCREENS
******************/
@media screen and (min-width: 1200px) {


  .nav ul.dropdown-menu {
    top: 118px;
  }

  .nav > li > a {
    margin-top: 50px;
  }

}

/******************
TABLET PORTRAIT, MENU FIX
******************/
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 990px)   {
	.nav > li > a {
		padding: 7px;
	}
}

/*******************
PHONES ONLY
********************/
@media screen and (max-width: 767px) {
	.overlay.vertical-center {
		transform: translateY(-0%);
		width: 100%;
	}
	
	#welcome-page-wrap {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	
	.navbar-toggle {
	  margin-top: 40px!important;
	}
	
	.nav-buttons {
		float: none!important;
	}
	
	.nav-buttons .search-nav {
		margin-top: 10px;
	}
	
	.nav-buttons .btn {
		padding: 1em 2em!important;
	}
}