/****************************************************/
/*                Logbook Stuff                     */
/****************************************************/

@media screen and (min-width: 800px) {
  body.treasure_map_ahhrr {
    background-image:url("../logbook/images/Arr.jpg");
    background-size: 1350px;
    background-repeat: repeat-y;
  }
}
@media screen and (max-width: 799px) {
  body.treasure_map_ahhrr {
    background-image:url("../logbook/images/Walk_The_Plank.jpg");
  }
}

/****************************************************/
/*               Index to Codex                     */
/****************************************************/
.log_index {
  padding-top: 10px;
  color: white;
  background-image:url("../scuba_images/Ocean_Entry_BG.jpg");
  background-size:100%;
}
@media screen and (min-width: 800px) {
  .log_index {
    width: 850px;
    padding-left:20px;
  }
}
@media screen and (max-width: 799px) {
  .log_index {
    width: 100%;
  }
}

.log_title {
	padding-top:10px;
	font-size:35px;
}
.log_subtitle {
	font-size:20px;
  padding-bottom:20px;
}
@media screen and (min-width: 800px) {
  .log_subtitle {
	  padding-left:30px;
  }
}
@media screen and (max-width: 799px) {
  .log_title {
    text-align:center;
  }
  .log_subtitle {
    text-align:center;
  }
}

.salty_stories {
  display: flex;
  flex-wrap: wrap;
  width:100%;
}
@media screen and (min-width: 800px) {
  .salty_stories {
    flex-direction: column;
  }
}
@media screen and (max-width: 799px) {
  .salty_stories {
    flex-direction: row;
  }
}

.salty_stories a:hover {
  background-color: #606060;
}

.log_entry {
  color:white;
  margin-top:20px;
  padding-bottom:10px;
  margin-bottom:20px;
}
@media screen and (min-width: 800px) {
  .log_entry {
    width:100%;
    float:left;
  }
}
@media screen and (max-width: 799px) {
  .log_entry {
    width:350px;
    padding-left:10px;
  }
}

@media screen and (min-width: 800px) {
  .entry_pic {
    width:150px;
    float:left;
  }
  .entry_pic img {
    width:150px;
  }
}
@media screen and (max-width: 799px) {
  .entry_pic {
    width:100%;
  }
  .entry_pic img {
    display:block;
    width:200px;
    margin-left:auto;
    margin-right:auto;
  }
}

.pertinent_info {
  float:right;
	font-family:DejaVu Sans;
	font-size:20px;
	line-height:110%;
}
@media screen and (min-width: 800px) {
  .pertinent_info {
    padding-left: 10px;
    width:670px;
    height:100%;
  }
}
@media screen and (max-width: 799px) {
  .pertinent_info {
    margin-top:10px;
    width:100%
  }
}

.pertinent_info p {
	text-align:left;
	font-size:17px;
}

/****************************************************/
/*               A Salty Story                      */
/****************************************************/
.main_log {
  margin-top: 0px;
	margin-left:auto;
	margin-right:auto;
  display: flex;
}
@media screen and (min-width: 800px) {
  .main_log {
    width: 1350px;
    flex-direction: row;
  }
}
@media screen and (max-width: 799px) {
  .main_log {
    width: 100%;
    flex-direction: column-reverse;
  }
}

.log_stuff {
  margin-top: 0px;
  border-top: 2px solid white;
  position: relative;
  display: flex;
  flex-direction: column;
}

div.log_page_title {
  padding-top:10px;
  color:black;
  text-align:center;
  width:100%;
}

div.asa {
  text-align:center;
  color:black;
  width:100%;
}

div.log_where_when {
  width:100%;
  margin-top:10px;
  display:flex;
  flex-direction:row;
}

div.log_where {
  text-decoration:underline;
}

div.log_when {
  font-size:20px;
  text-align:right;
  margin-left:15px;
}

div.log_why {
  width:100%;
  font-size:20px;
  text-decoration:none;
  margin-top:10px;
}

div.log_text {
  width:100%;
  font-size:11px;
}

  div.log_text p {
	  line-height:18.5px;
	  margin-top:0px;
	  margin-bottom:0px;
	  text-indent:2em;
  }

	  div.log_text p.no_indent {
		  text-indent:0em;
	  }

  div.log_text ul {
	  line-height:18.5px;
	  margin-top:0px;
	  margin-bottom:0px;
  }

  div.log_text li {
	  line-height:18.5px;
	  margin-top:0px;
	  margin-bottom:0px;
  }

  div.log_text br {
	  margin-top:0px;
	  margin-bottom:0px;
	  line-height:18.5px;
  }

a.return_to {
  padding-top:10px;
  color:white;
  text-align:center;
  width:100%;
  font-size:30px;
  text-decoration:none;
}

  a.return_to:visited {
    color:white;
  }

  a.return_to:hover {
    text-decoration:underline;
  }

@media screen and (min-width: 800px) {
  div.log_stuff {
    width: 1200px;
  }
  div.log_page_title {
    font-size:40px;
  }
  div.asa {
    font-size:24px;
  }
  div.two_page {
    width: 100%;
    height: 820px;
    background-image: url("../logbook/images/Log_BG_MoBigga.png");
    background-position:0px 30px;
    background-repeat:no-repeat;
    display:flex;
    flex-direction:row;
  }
  div.log_page {
    width:360px;
    height:590px;
    margin-left:170px;
    margin-top:165px;
    font-family:DejaVu Sans;
  }
  div.log_where {
    font-size:25px;
  }

}
@media screen and (max-width: 799px) {
  div.log_stuff {
    width: 350px;
	  margin-left:auto;
	  margin-right:auto;
    margin-top:20px;
    margin-bottom:20px;
    border-top:none;
  }
  div.log_page_title {
	  font-size:30px;
    color:white;
  }
  div.asa {
    font-size:14px;
    color:white;
  }
  div.two_page {
    margin-top:30px;
    width: 340px;
    height: 1500px;
    background-image: url("../logbook/images/Vellum.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    display:flex;
    flex-direction:column;
  }
  div.left_page {
    margin-top:10px;
  }
  div.log_page {
    margin-left:auto;
    margin-right:auto;
	  width:300px;
	  font-family:Ye Olde;
    line-height:110%;
    height:700px;
  }
  div.log_text {
    width:100%;
    font-size:20px;
  }
  div.log_where {
    font-size:30px;
    line-height:110%;
  }

}