@charset "utf-8"

/* JD */

body {
  margin: 5px;  
	background-color: #f0f0f0;
    font-family: Arial;
	font-size:36px;
	line-height: 42px;
}
p {
  margin: 5px;  
    font-family: Roboto, Inter, and Open Sans;
	font-size:20px;
	line-height: 32px;
}


ul {
  	font-family: Arial;
	font-size:16px;
	line-height: 24px;
}

ul li {
 	font-family: Arial;
	font-size:16px;
	line-height: 24px;
}

#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
}

.content {
  position: fixed;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #f0f0f0;
  width: 100%;
  padding: 20px;
}

input[type=submit] {
   border-top: 1px solid #13679c;
   background: #6c98ba;
   background: -webkit-gradient(linear, left top, left bottom, from(#164987), to(#6c98ba));
   background: -webkit-linear-gradient(top, #164987, #6c98ba);
   background: -moz-linear-gradient(top, #164987, #6c98ba);
   background: -ms-linear-gradient(top, #164987, #6c98ba);
   background: -o-linear-gradient(top, #164987, #6c98ba);
   padding: 7px 25px;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   border-radius: 20px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 18px;
   font-family: Sans-Serif;
   text-decoration: none;
   vertical-align: middle;
   }

h1 {
	font-family:sans-serif;
	font-size:26px;	
	}
h2 {
	font-family:sans-serif;
	font-size:22px;	
	line-height: 34px;	
	}
h3 {
	font-family:sans-serif;
	font-size:16px;	
	line-height: 24px;
	}		

	
img, object, embed, video {
	max-width: 100%;
}
.ie6 img {
	width:100%;
}

a { color: #02878b; text-decoration: none; }
a:visited { color: #02878b; text-decoration: none; }
a:hover { color: #7fb3b2; text-decoration: none; }
* {
    box-sizing: border-box;
}
#sm_break {
	display:none;
}  
.container {
	margin: 0;
	background-color: #F00;
	}
.frame { 
    border-style: solid;
	border-width: 4px;
	border-color: #002f67; 
	background-color:#006599;
	text-align:center;
	padding:0px; 
	margin:10px;
	color: #FFF;
	}		   

.tablemenu {
    display: block;
	}
.jumpmenu {
		display: none;
	}		
	
/*Border around sections*/
.section {
	width:relative;
	clear: both;
	margin: 0;
	padding: 10px;
	background-color: #d8d9d9;
}
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }

.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; }

.span_2_of_2 { width: 100%; }
.span_1_of_2 { width: 49.2%; }

.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66.13%; }
.span_1_of_3 { width: 32.26%; }

.span_4_of_4 { width: 100%; }
.span_3_of_4 { width: 74.6%; }
.span_2_of_4 { width: 49.2%; }
.span_1_of_4 { width: 23.8%; }

.span_5_of_5 { width: 100%; }
.span_4_of_5 { width: 79.68%; }
.span_3_of_5 { width: 59.36%; }
.span_2_of_5 { width: 39.04%; }
.span_1_of_5 { width: 18.72%; }

.span_6_of_6 { width: 100%; }
.span_5_of_6 { width: 83.06%; }
.span_4_of_6 { width: 66.13%; }
.span_3_of_6 { width: 49.2%; }
.span_2_of_6 { width: 32.26%; }
.span_1_of_6 { width: 15.33%; }

/*  GRID OF NINE  */
.span_9_of_9 { width: 100%; }
.span_8_of_9 { width: 88.71%; }
.span_7_of_9 { width: 77.42%; }
.span_6_of_9 { width: 66.13%; }
.span_5_of_9 { width: 54.84%; }
.span_4_of_9 { width: 43.55%; }
.span_3_of_9 { width: 32.26%; }
.span_2_of_9 { width: 20.97%; }
.span_1_of_9 { width: 9.688%; }


.border {
	    border: 5px solid black;
		border-width: thin;
		color: #000;
		text-align:left;
		font-size:18px;
		line-height:28px;
		margin: 5%;
		padding: 5%;
}


@media only screen and (max-width: 480px) {
	#logo {
    position: fixed;
    bottom: 0;
    width: 50%;
	text-align:right;
	padding-right: 2%;
}

    .tablemenu {
		display: none;
	}
    .jumpmenu {
		display: block;
	}

	.col {  margin: 1% 0 1% 0%; } 
	.span_1_of_2, .span_2_of_2 { width: 100%;  float:left;}
	.span_1_of_3, .span_2_of_3, .span_3_of_3 { width: 100%;  float:left;}
	.span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%;  float:left;}
	.span_1_of_5, .span_2_of_5, .span_3_of_5, .span_4_of_5, .span_5_of_5 { width: 100%;  float:left;}
	.span_1_of_6, .span_2_of_6, .span_3_of_6, .span_4_of_6, .span_5_of_6, .span_6_of_6 { width: 100%;  float:left;}
	.span_1_of_9, .span_2_of_9, .span_3_of_9, .span_4_of_9, .span_5_of_9, .span_6_of_9, .span_7_of_9, .span_8_of_9, .span_9_of_9 { width: 100%; float:left; }

     #sm_break {
	  display:block;
		 }     

}