/* variables go here */
body {
	background-color: green; /* the main colour is green */
	}
   
p /* styling all paragraph fonts */ {
	font: 15px arial, sans-serif;
	font-size: 1.5em;
	}
   
li /* styling all lists */ {
	font: 15px arial, sans-serif;
	font-size: 1.5em;
	}

h1 {
	font: 30px arial, sans-serif;
	font-size: 2.3em;
	font-weight: bold;
	/* Styling h1 tags to be bold and large */
	}
	


section /* styling all section tags */ {
	background-color: rgba(255, 255, 255, 0.5); /* Adds a background colour to the section tag */
	padding: 20px;
	border-radius: 10px; /* border-radius gives the section tags rounded corners for style */  
	}


img /* styling all images */ {
	max-width: 100%; /* Useful for responsive scaling images for different screens
	as it enables images to scale properly without it looking too small or large */
	overflow: auto;
	float: right; /* floats all of the images right of the content */
	border-radius: 15px; /* this gives all images rounded corners on the website */
	}
	

.navbar, .dropdown-menu {
	background: linear-gradient(to left,black,green); 
	/* adding colour gradients to navbar and dropdown menu */
	border-radius: 10px; /* gives navbar rounded corners for styling */
	}

/* Normal links in navbar */
.navbar-default .navbar-nav > li > a {
  color: #ffffff;
  font-weight: bold;  
  font-size: 18px;
  }
  
iframe {
	max-width: 100%;
}
 

/* For mobile phone scaling: */
[class*="col-"] {
    width: 100%;
}
@media only screen and (min-width: 600px) {
    /* For scaling to tablets: */
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 33.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
    /* For scaling to desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
} 


/* Hover link in navbar */
.navbar-default .navbar-nav > li > a:hover {
  color: #c1d1f2;
  font-weight: bold; }

/* Sub Menu Normal Links */
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
  color: #ffffff;
  font-weight: bold; }

/* Sub Menu Hover Links */
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
  color: #ffffff;
  font-weight: bold;
}

/* Navigation Header */
.navbar-default > .navbar-header > h1 {
  color: #ffffff;
  padding-left: 10px; }

sup.required {
  color: #c60101; }

div.error {
  background-color: #ffd6d6;
  color: #c60101;
  padding: 10px;
  border: solid 1px #c60101; }

input {
  max-width: 100%;
  padding: 5px; }

select {
  padding: 5px; }

div.one {
  background-color: #c1d1f2;
  border: solid 1px #010c22;
  padding: 15px; }

div.two {
  background-color: #ffffff;
  /* white */
  border: solid 1px #010c22;
  /* dark blue */
  padding: 15px; }

span.error {
  color: #c60101; }

hr.dark {
  color: #010c22;
  border: solid 1px #010c22; }

/* removes blue border on modal */
.modal-open .modal, .btn:focus, a:focus {
  outline: none !important; }

.modal .modal-content {
  width: 265px;
  margin: auto; }

.btn-success {
  background-color: #2a59b5;
  /* medium blue */
  border-color: #2a59b5;
  /* medium blue */ }

.btn-success:hover {
  color: #fff;
  background-color: #010c22;
  border-color: #2a59b5;
  /* medium blue */ }

/* Links in 'main' part of page... */
a {
  font-weight: bold; }

a:link {
  color: #010c22; }

a:visited {
  color: #616161; }

a:hover {
  color: #720543;
  text-decoration: none; }
  
  table.results {
  text-align: left;
  border: 3px solid black;
  border-collapse: collapse; }

th.results {
  height: 36px;
  vertical-align: middle;
  padding: 10px;
  border-bottom: 1px solid black;
  border-right: 1px solid white;
  background-color: #010c22;
  color: #ffffff; }

tr.results {
  margin-top: 12px;
  margin-bottom: 12px;
  height: 24px; }

tr.results:nth-child(even) {
  background-color: #c1d1f2; }

tr.results:nth-child(odd) {
  background-color: #ffffff;
  /* white */ }

td.results {
  padding: 10px;
  border-bottom: 1px solid black;
  border-right: 1px solid black; }