html,body {
    height:100%;
}

h1{
    text-align: center;
}

.toolbar{
    float: top;
    list-style-type: none;
    margin: 0;
    padding: 0;
    //background-color: #f1f1f1;
}

.toolbar_box {
    min-width: 800px;
    padding: 8px;
    background-color: #f1f1f1;
}

.toolbar_box > div {
    display: inline-block;
    white-space: normal;
}

.nav {
    width: 520px;
}

.toolbar li{
    display:inline-block;
    color: #000;
    background-color: #f1f1f1;
    text-decoration: none;
}

.toolbar .auth{
    width: 245px;
    float:right;
}

.toolbar li a{
    display:inline-block;
    padding: 8px 16px; 
    //width: inherit;
}
.toolbar li a:hover {
    background-color: #555;
    color: white;
}

.active {
    background-color: darkblue;
    color: white;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    z-index: 999;
    //box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    //padding: 12px 16px;
}

#main_dropdown {
    min-width: 80px;
}

#ftrecs_dropdown {
    min-width: 124px;
}

#experiences_dropdown {
    min-width: 155px;
}

#photos_dropdown {
    min-width: 120px;
}

#restricted_dropdown {
    min-width: 152px;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    text-decoration: none;
    display: block;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
    z-index: 1;
}

.login h1 {
    text-align:center;
}

.login form {
    width: 205px;
    margin: 0 auto;
}

.login form li {
    list-style:none;
}

.login label {
    min-width:70px;
    display:inline-block;
}

//If i want to center the submit button later
//.login form #submit {
//    display: inherit;
//    margin: auto
//}

.login p {
    text-align: center;
}

.register h1 {
    text-align:center;
}

.register form {
    width: 265px;
    margin: 0 auto;
}

.register form li {
    list-style:none;
}

//If i want to center the submit button later
//.login form #submit {
//    display: inherit;
//    margin: auto
//}

.register p {
    text-align: center;
}

.register #new_user_form li {
    list-style:none;
}

.register label {
    min-width:125px;
    display:inline-block;
}

.new_listing_page #listing_form_div {
    padding-left: 5%;
}

.new_listing_page li {
    list-style: none;
}

.new_listing_page label {
    min-width:100px;
    display:inline-block;
}

.new_listing_page textarea {
    height: 15em;
    width: 60em;
    vertical-align:top;
}

.new_listing_page li ul { 
    margin:0;
    padding-top: 0.5em;
}


.submit_listing_page p,#links {
    text-align:center;
}

.new_review_page #review_form_div {
    padding-left: 5%;
}

.submit_review_page p,#links {
    text-align:center;
}


.submit_user_page #links {
    text-align:center;
}

.page_title h1 {
    color:darkblue;
    text-align:center;   
    white-space:nowrap;
}

.page_title .separator {
    display:block;
    margin:auto;
}

.main_page .ft_spec{
    width: 80px;
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 100px;
}

.main_page #left_pole{
    padding-left: 5%;
    padding-right: 5%;
    float:left;
}

.main_page #right_pole{
    padding-left: 5%;
    padding-right: 5%;
    float:right;
}

.main_page .content > .separator {
    display: block;
    margin: auto;
    //padding-top: 25px;
    padding-top: 38px;
}

.main_page .footer {
    position: relative;
}

.easter_egg_link {
  cursor: text;
  color: inherit;
  text-decoration: inherit;
}

.ftrecs_main_page #listing_links {
    padding: 1em 0 0 0 ;
    list-style: none;
}

.ftrecs_main_page #listing_links li {
    text-align: center;
}

.ftrecs_main_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 250px;
}

.ftrecs_main_page .footer {
    position: relative;
}

.listing_page {
    min-width: 750px;
}

.listing_page .separator {
    display:block;
    margin:auto;
}

.listing_by_state .state_header {
    text-align:center;
}

.listing_by_country .country_header {
    text-align:center;
}

.listing_page .below_toolbar {
    min-height:100%;
    background-image: url("images/BarberPole.jpg"), url("images/BarberPole.jpg");
    background-repeat: repeat-y, repeat-y;
    background-position: right top, left top; 
    background-size: 4%, 4%;
}

.listing_page .content {
    min-height:100%;
    padding-left:9%;
    padding-right:9%;
}

.listing_page .new_review_form {
    float:right
}

.listing_page .entry {
    padding-bottom: 1px;
}

.listing_page .listing p {
    display: inline;
}

.listing_page .review .review_text {
    text-indent: 30px;
}

.listing_page .review .review_credit {
    font-size: 0.95em;
    color: darkblue;
}

.experiences_main_page #experience_links {
    padding: 1em 0 0 0 ;
    list-style: none;
}

.experiences_main_page #experience_links li {
    text-align: center;
}

.experiences_main_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 286px;
}

.experiences_main_page .footer {
    position: relative;
}

.experiences_main_page #credit {
    text-align: center;
    font-size; 0.9em;
    margin: 0;
    padding: 3px;
}

.new_experience_page #experience_form_div {
    padding-left: 5%;
}

.new_experience_page li {
    list-style: none;
}

.new_experience_page label {
    min-width:100px;
    display:inline-block;
}

.new_experience_page #id_title {
    width: 30em; 
}

.new_experience_page #id_author {
    width: 15em; 
}

.new_experience_page textarea {
    height: 15em;
    width: 90em;
    vertical-align:top;
}

.submit_experience_page p,#links {
    text-align:center;
}

.exp_text {
    padding-left: 2%;
    padding-right: 2%;
    text-indent: 30px;
}

.view_experience h1 {
    margin: .5em 0 0 0;
}

.author_credit {
    margin: 0.5em 0 1em 0;
    text-align: center;
}

.image_page img {
    display: block; 
    margin: auto;
}

.image_page .caption {
    text-align: center;
}

.links_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 292px;
}

.links_page .footer {
    position: relative;
}

.links_page li {
    list-style:none;
    text-align: left;
}

.links_page #links {
    padding-top: 1.5em;
    width: 35em;
    margin: auto;
}

.ft_collage {
    //width: 570px; 
    width: 40%;
    min-width: 350px;
    display: block;
    margin: auto;
    padding-top: 50px;
}

#credit {
    text-align: center;
    font-size; 0.9em;
    margin: 0;
    padding: 3px;
}

.contact_page .content > .separator {
    display: block;
    margin: auto;
}

.contact_page .footer {
    position: relative;
}

.contact_page p {
    text-align: center;
}

.contact_page #text {
    padding-top: 35px;
    padding-bottom: 73px;
}

.photos_main_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 272px;
}

.photos_main_page .column {
    display: inline-block;
    width: 49%;
}

.photos_main_page .column {
    vertical-align: top;
}

.photos_main_page .column ul {
    width: 300px; 
    margin: 1em auto;
    list-style: none;
    padding: 0;
}

.photos_main_page .column ul li {
    text-align: center;
}

.photos_main_page h3 {
    color: darkblue;
}

.w3-btn-floating {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    display:inline-block;
    text-align:center;
    color:#fff;
    background-color:#000;
    position:relative;
    overflow:hidden;
    z-index:1;
    padding:10px;
    border-radius:50%;
    cursor:pointer;
    font-size:24px;
    -webkit-transition:background-color .3s,color .15s,box-shadow .3s,opacity 0.3s,filter 0.3s;
    transition:background-color .3s,color .15s,box-shadow .3s,opacity 0.3s,filter 0.3s;
    width: 20px;
}

.w3-display-left{
    float: left;
    top: 50%;
    left: 10%;
}

.w3-display-right{
    float: right;
    top: 50%;
    right: 10%;
}

.w3-x-btn-floating {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    display:inline-block;
    text-align:center;
    color:#fff;
    background-color:#000;
    position:relative;
    overflow:hidden;
    z-index:1;
    padding: 0 3px;
    //border-radius:50%;
    cursor:pointer;
    font-size:24px;
    -webkit-transition:background-color .3s,color .15s,box-shadow .3s,opacity 0.3s,filter 0.3s;
    transition:background-color .3s,color .15s,box-shadow .3s,opacity 0.3s,filter 0.3s;
    width: 20px;
}


.w3-display-top-right {
    float: right;
    top: 5%;
    right: 12.5%;
}

.gallery_page h1 {
    color: darkblue;
}

.slideshow {
    position: relative;
}

.slideshow_image {
  //display: inline-block;
  //position: relative;
  //top: 50%;
  //left: 50%;
  //transform: translateY(-50%) translateX(-50%);
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0; 
  bottom: 0;
  max-height: 600px;
}

.gallery_page p {
    text-align: center;
    float: bottom;
}

#grid_div {
  width: 660px;
  margin: 0 auto;
  overflow: auto;
}
 
#grid {
  list-style-type: none;
}
 
#grid li img {
  width: 15%;
  float: left;
  margin: 5px;
  border: 5px solid #333;
 -moz-transition: all 0.2s ease-in-out;
 -webkit-transition: all 0.2s ease-in-out;
 transition: all 0.2s ease-in-out;
}

#grid li img:hover {
border: 5px solid darkred;
}

#grid_w_titles {
  list-style-type: none;
}

#grid_w_titles li .titled_thumb {
    display: inline-block;
    float: left;
}

#grid_w_titles li .titled_thumb p {
    margin: 0; 
}

#grid_w_titles li img {
  width: 100px;
  display:inline-block;
  margin: 5px;
  border: 5px solid #333;
 -moz-transition: all 0.2s ease-in-out;
 -webkit-transition: all 0.2s ease-in-out;
 transition: all 0.2s ease-in-out;
}

#grid_w_titles li img:hover {
    border: 5px solid darkred;
}

.new_photo_page #photo_form_div {
    padding-left: 5%;
}

.new_photo_page li {
    list-style: none;
}

.new_photo_page label {
    min-width:100px;
    display:inline-block;
}

.new_photo_page #id_title {
    width: 30em;
}

.new_photo_page textarea {
    height: 5em;
    width: 30em;
    vertical-align:top;
}

.new_photo_page p {
    padding-left: 5%;
    padding-right: 5%;
}

.gallery_page #description {
    width: 660px;
    margin: 0 auto;
}

.new_icon {
    width: 35px;
}

.instagram-gallery {
    min-width: 614px;
    width: 614px;
    margin: auto;
}

.listing_page_link {
    color: inherit;
}

.restricted_main_page #restricted_subpage_links {
    padding: 1em 0 0 0 ;
    list-style: none;
}

.restricted_main_page #restricted_subpage_links li {
    text-align: center;
}

.restricted_main_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 250px;
}

.restricted_story_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 250px;
}


.restricted_experience_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 250px;
}

.restricted_experience_page #restricted_experience_links {
    padding: 1em 0 0 0 ;
    list-style: none;
    text-align: center;
}

.restricted_experiences_page #restricted_experience_links li {
}

.restricted_story_page #restricted_story_links {
    padding: 1em 0 0 0 ;
    list-style: none;
    text-align: center;
}

.restricted_story_page #restricted_story_links li {
}

.restricted_photo_page .content > .separator {
    display: block;
    margin: auto;
    padding-top: 272px;
}

.restricted_photo_page .column {
    display: inline-block;
    width: 100%;
}

.restricted_photo_page .column {
    vertical-align: top;
}

.restricted_photo_page .column ul {
    width: 300px;
    margin: 1em auto;
    list-style: none;
    padding: 0;
}

.restricted_photo_page .column ul li {
    text-align: center;
}

.restricted_photo_page h3 {
    color: darkblue;
}