body{
		font-family: Arial, Helvetica, sans-serif;
		font-size:14px;
		background: url("./../images/left_small.gif");
		background-position: left;
		background-repeat: repeat-y;
		margin:0px;
		padding:0px;
}

li{
		margin-top:20px;
}
#page {
		font-family: Arial, Helvetica, sans-serif;
		font-size:14px;
		background: url("./../images/left_small.gif");
		background-position: left;
		background-repeat: repeat-y;
		margin:0px;
		padding:0px;
		background-image: url("./../images/right_small.gif");
		background-position: right;
		background-repeat: repeat-y;
		
}

#header{
	height:100px;
	/* background:#000; */
}

#logo_image{
	float:right;
	margin-top:-70px;
}

#royal_marines_title_box{
	width:370px;
	margin-left: auto ;
	margin-right: auto ;
}

#royal_marines_title_text{
	background:#000;
	padding-top:15px;
	padding-bottom:15px;
	color:#FFFFFF;
	font-family: "Myriad Pro", "Myriad Web", Arial, Helvetica, sans-serif;
	font-size:23px;
	font-weight:bold;
	text-align: center;
}

#page_title_bar_box{
    margin-left:130px;
    margin-right:155px;
	background:#003300;
}

#page_title_text_I{
	color:#FFFFFF;
	font-family: "Myriad Pro", "Myriad Web", Arial, Helvetica, sans-serif;
	font-size:1.8em;
	font-weight:bold;
	text-align: center;
	padding-top: 8px;
	padding-bottom: 8px;
}

#navigation_buttons {
	position: absolute;
	left: 10px;
	width: 120px;
}
#center {
	top: 0;
	margin-left: 140px;
	margin-right: 160px;
}


#find_text{
	text-align:left;
	margin:0px auto;
	margin-top:20px;
	margin-bottom:20px;
    font-family: "Myriad Pro", "Myriad Web", Arial, Helvetica, sans-serif;
	font-size:16px;
}

#search_form{
	margin-bottom:20px;
}

img{
	border:none;
}


#search_results_table{
	table-layout: fixed;
	width:100%;
}

tr.d0 td {
	background-color: #ffffff;
	color: black;
}
tr.d1 td {
	background-color: #eeeeee;
	color: black;
}
tr.section_header td {
	background-color: #000000;
	color: white;
	font-size:1.2em;
	font-weight:bold;
	text-align: left;
	padding-top: 5px;
	padding-left: 10px;
	padding-bottom: 5px;
}

th{
		text-align: left;
}

#bar{
	width:550px;
	height:8px;
	float:right;
	background:#001F5F;
	color:#FFFFFF;
}

#footer{
	font-size:13px;
	font-weight:bold;
	color:#666666;
	text-align: center;
}

#nothing_found_text{
	font-size:15px;
	font-weight:bold;
	color:#dd0000;
	text-align: center;
}

#logo_image img {
	position: relative;
}

/* Roll-over image previews */
#screenshot{
	position:absolute;
	border:1px solid #ccc;
	background:#333;
	padding:5px;
	display:none;
	color:#fff;
}

/* Navigation tabs */
#navigation_buttons a {
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    outline: medium none;
    text-decoration: none;
  }

/* Changes Tab Image on Hover State */
.spriteButton { display: block; position:relative; text-align: center; width: 120px; height: 64px; background: url(../images/button.png) no-repeat 0 0px; }
.spriteButton:hover, .spriteButton:focus { background-position: bottom; }

.spriteButton div {
	position: absolute;
	top: 20%;
	left: 0%;
	width:100%;
}
.topnav{
	display: none;
}
@media only screen and (max-width: 580px) {
	.topnav{
		display: block;
	}
	#page { 
		background: unset;
		background-position: left; 
		background-image: unset;
		background-position: unset;
		background-repeat: unset; 
	} 
	#center {
		top: 0;
		margin-left: 10px;
		margin-right: 10px;
	} 
	#page_title_bar_box{
	    margin-left:10px;
	    margin-right:10px;
		background:#003300;
	}
	#logo_image,#royal_marines_title_box,#navigation_buttons{
		display: none;
	}
	body{ 
		background: unset;
	}
	#search_results_table {
	    table-layout:unset;
	    width: 100%;
	    overflow: scroll;
	    display: flex;
	}
	#header{
		height: unset;
	}
	#search{
		margin: 0px 2px;
	}
	.pagination_section a {
	    color: black;
	    padding: 9px 13px;
	    text-decoration: none;
	    display: inline-block;
	}
	#search input[type="search"] {
		width: 100%;
    	display: block;
    	padding: 15px 3px;
	}
	#search input[type="submit"] {
    padding: 12px 21px;
    width: 100%;
    margin-top: 11px;
    background: #133306;
    color: #fff;
    font-size: 19px;
  }
}
.mobile-container {
  max-width: 480px;
  margin: auto;
  background-color: #555;
  height: 500px;
  color: white;
  border-radius: 10px;
}

.topnav {
  overflow: hidden;
  background-color: #333;
  position: relative;
}

.topnav #myLinks {
  display: none;
}

.topnav a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
  background: #003300;
}

.topnav a.icon { 
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.active {
  background-color: #000;
  color: white;
}
.topnav a:first-child,.topnav a:first-child:hover{
	background-color: #000;
  	color: white;
}
.topnav a:last-child{
	background-color: #000; 
}

.nav_label {
    display: block;
    background: #fff;
    width: 40px;
    height: 40px;
    cursor: pointer;
    position: absolute;
    right: 13px;
    top: 11px;
}
.nav_label:after {
    content: '';
    display: block;
    width: 30px;
    height: 5px;
    background: #777;
    margin: 7px 5px;
    box-shadow: 0px 10px 0px #777, 0px 20px 0px #777
}

#screenshot {
    text-align: center;
}