html {height: 100% !important; min-height: 100% !important;}

/* sets Page Properties to 0 for margin & padding */

 

body { 
  margin:0;
  padding:0;
  line-height: 160%;
  font-family: Georgia, Garamond, Times New Roman, Times, serif;
  font-size: 1em;
  color: #ffffff;
  background-color: #f3d381;
  overflow-x: hidden;
  background-attachment: fixed;
  background-position: top left;
  background-repeat: no-repeat;
}

a {text-decoration: underline;}
body a:link {color: #ffffff; font-weight: bold;}
body a:visited {color: #ffffff; font-weight: bold;}
body a:hover {color: #fde049; font-weight: bold;}

.bodycontent{
    float:left;
}

.header {
	display: block;
	width: 100%;
}

.nav {
	display: block;
	color: #000000;
	width: 100%;
	text-align: right;
	}

.nav a {padding-left: 5%;}
/* For the next two, text-decoration is set separately for desktop and mobile */
.nav a:link, .nav a:visited {color: #000000; font-weight: normal;}
.nav a:hover {color: #000000; text-decoration: underline;}

.strapline { /*font-size set separately for desktop and mobile */
	display: block;
	width: 100%;
	color: #000000;
	text-align: center;
}

.contentblock { /* Padding and Width set separately for desktop and mobile */
	float: left;
	border-radius: 0.4em;
}

.blockred {background-color: #81242d;}
.blockblue {background-color: #415f68;}
.blockyellow {background-color: #deae41;}

.indextitle { /* max-width set separately for desktop */
	display: block;
	width: 80%;
	margin: 0 auto 0 auto;}
	

/* TEXT STYLES */
h1 {font-size: 2em;
	font-weight: normal;
	line-height: 100%;}


/* DESKTOP ONLY SETTINGS */

@media only screen and (min-device-width: 701px) {

body { 
  background-image: url('Images/background_ship.jpg');
  background-size: auto 100%;
  min-height: 100vh;
}

.bodycontent {
	width: 66%;
	padding: 1.5% 3% 3% 31%; /*Extensive space on left for ship pic */
}

.header img {
	display: block;
	width: 50%;
	margin: 0 auto 0 auto;}

.nav a:link {text-decoration: none;}
.nav a:hover {color: #000000; text-decoration: underline;}
	
.strapline {
	margin: 3% auto 3% auto;
	font-size: 1.5em;}
	
.wrapforequalheight{ /* External div to wrap around all three */
	display: table;
	border-spacing: 0;
	border-collapse: separate;
	border-spacing: 50px;
	margin-top: -50px;
	margin-left: -50px; /* these two counteract the border-spacing settings on each side */
	margin-right: -50px;
}

.contentblock {
    display: block;
	float: none;
	width: 100%;
	max-width: 70ch; /*Ensures easy readability on desktop */
	margin: 0 auto 0 auto;
	margin-bottom: 5%;
	border: 3px black solid;
	padding: 1.5%;
}

.contentblock-two, .contentblock-three {
    display: table-cell;
	float: none;
	max-width: 70ch; /*Ensures easy readability on desktop */
	margin: 0 auto 0 auto;
	vertical-align: top;
}
 
.contentblock-three {
	width: 26%;}

.contentblock-two {
	width: 40%;}	
	
.indextitle {
	max-width: 230px;}
	
.form-container {
	display: block;
	max-width: 300px;
	margin: 0 auto;}

 
} /*ENDS desktop only only */

/* MOBILE SETTINGS */

@media only screen and (max-device-width: 700px) {


body { 
  /* background: #f3d381; 
  background: -webkit-linear-gradient(#f3d381, #295a68);
  background:    -moz-linear-gradient(#f3d381, #295a68);
  background:         linear-gradient(#f3d381, #295a68); */
  background-image: url('Images/background_ship_mobile.jpg');
  background-size: 105%;
  background-attachment: fixed;
}

.bodycontent {
	width: 90%;
	padding: 5% 5% 5% 5%;}

.header img {width: 100%;}

.strapline {
	margin: 4% auto 10% auto;
	font-size: 1.2em;}

.contentblock {
	border: 3px black solid;
	padding: 4%;
	width: 91%;
	}

.conentblock-next {
	margin-top: 12%;
}

.blockred {background: rgba(129, 36, 45, 0.85);}
.blockblue {background: rgba(65, 95, 104, 0.85);}
.blockyellow {background: rgba(222, 174, 65, 0.85);}
 
} /*ENDS media only */