﻿/* =======================================
   Website by J.G.
   ======================================= */

BODY
{
	padding: 0px;
	margin: 0px;
	background-color: #00393f;
	font-family: arial;
	font-size: 16pt;
	
	background-image: url('images/gibbons-park-10x3.jpg');
	background-size: 100vw 30vw;
	
    background-attachment:fixed;
   	background-position: top;
	background-repeat: repeat-x;
}

H1
{
	margin-top: 56pt;
	padding: 0px;
	clear: both; 

	font-family: arial;
	font-size: 40pt;
	font-weight: bolder;
	color:	#B81234;
}

H2
{
	margin-top: 48pt;
	clear: left; 
	
	font-family: arial;
	font-size: 32pt;
	font-weight: bold;
	color:	#3860B0;
}


H3
{
	margin-top: 32pt;
	
	font-family: arial;
	font-size: 24pt;
	color: #6890E0;
}

p
{
	line-height: 1.5;
}

em
{
	color: #A00000;
	font-weight: bold;
}


li a:visited,
li a:link,
li a:active
{
	color: #017A70;
	font-weight: bold;
	text-decoration: none;
}

li a:hover
{
	color: #219A90;
	font-weight: bold;
	text-decoration: none;
}


li
{
	padding-bottom: 16px;
	line-height: 1.5;
}

.Indent
{
	margin-left: 32pt;	
}

.ImageRightNoRound
{
	margin-left: 32px;
	margin-bottom: 16px;
	float: right;
	border: none;
}


.ImageRight
{
	margin-left: 24pt;
	margin-bottom: 32pt;
	float: right;
	clear: right;
	border: none;
	border-radius: 16pt 16pt 16pt 16pt;
}

.ImageCenter
{
	margin-top: 24pt;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	height: auto;
	display: block;
	clear: both;
	border-radius: 16pt 16pt 16pt 16pt;
	background-color: #F0F0F0;
}

.ImageCenterBorder
{
	margin-top: 24pt;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	height: auto;	
	display: block;
	clear: both; 
	border: 2pt #A0A0A0 solid;
	border-radius: 16pt 16pt 16pt 16pt;
}


.ImageLeft
{
	margin-right: 24pt;
	margin-bottom: 32pt;
	float: left;
	clear: left;
	border: none;	
	border-radius: 16pt 16pt 16pt 16pt;
}

audio
{
	clear: both; 
	width: 90%;
}

video 
{
	background-color: #E0E0E0;	
}


.VideoCenter
{
	margin: 3vw auto 3vw auto;
	width: 80vw;
	height: 45vw;	
	background-color: #102040;	
	border-radius: 2vw 2vw 2vw 2vw;
	border: #C0C0C0 4px solid;
	
	display: block;
	clear: both;
}

.Headline
{
	font-family: arial;
	font-size: 64pt;
	font-weight:900; 
	color:	#404040;
	clear: both; 
	text-align:center;
}

/* =======================================
   Top
   ======================================= */

.MainTable
{
	width: 100%;
	height: 100%;
	border-spacing: 0px;
	padding: 0px;
	margin: 0px;
}

.MainHeaderCell
{
	text-align: left; 
	padding: 0px;
	height: 30vw;
}

.TitleTable
{
	/* background-color: transparent; /* #FFFFFF; */ 
	 padding: 0px;
	 width: 100%;
	 border-spacing: 0px;
	 height: 100%;
}

.TitleLogoCell 
{
	width: 25vw;
	padding: 0px;
	background-image: url('images/sos-teddy.png');
	background-position: center;
	background-repeat: no-repeat; 
	background-size: 20vw 20vw;
}

.TitleTextCell
{
	font-weight: bold;
	color: #FFFFFF; 
	vertical-align: middle;
}

.TitleText
{
	font-family: arial;
	font-size: 28pt;
	font-weight: bold;
	white-space: nowrap;

	color: #FFFFFF;
	background-color: #B71234;
	border: #FFFFFF 2px solid;
	padding: 12pt 24pt 12pt 24pt;
	border-radius: 28pt;
	
	vertical-align: middle;
	/*text-transform: uppercase;*/
}


/* =======================================
   Body
  ======================================= */

.MainContentBody
{
	font-family: arial;
	font-size: 16pt;
	color: #303030;
	background-color: #FFFFFF;
 
	padding: 16pt 32pt 16pt 32pt;
	text-align: left;
	vertical-align: top;
}

.MainContentBody a,
.MainContentBody a:link,
.MainContentBody a:active,
.MainContentBody a:visited,
.MainContentBody a:hover
{
	color: #219A90;
	font-weight: bold;
	text-decoration: none;
}

.MainContentBody a:hover
{
	color: #41BAB0;
	font-weight: bold;
	text-decoration: underline;
}


/* =======================================
   Menu
   ======================================= */
.MainMenuBarCell
{
	background-color: #6AB0D0; /* #7AC0E0; */
	border-top: 1px #203050 solid; /* #004A40 */
	border-bottom: none; 
	height: 24pt;
	text-align: left;
	vertical-align: middle;	
	padding: 0pt 0pt 0pt 18pt;
}
   
.MenuTable
{
	text-align: center;
	border-collapse:collapse;
	border-spacing: 0px 0px;
	padding: 0px 0px 0px 0px;
	height: 100%
}

.MenuInactiveCell,
.MenuSelectedCell,
.MenuCriticalCell
{	
	padding: 10pt 16pt 10pt 16pt;
	vertical-align: middle;
	/*white-space: nowrap;*/

	font-family: arial;
	font-size: 16pt;
	font-weight: bold;	
	
	border-right: 1px #202020 solid;
	border-left: 1px #202020 solid;	
}
     
.MenuInactiveCell
{
	background-color: #6AB0D0; /*#D09C9C;  /*#6AB0D0; */
}

.MenuSelectedCell 
{
	background-color: #FFFFFF;
}

.MenuCriticalCell
{
	background-color: #E06060; /*#C04040;*/
}

.MenuSelectedCell a,
.MenuSelectedCell a:visited,
.MenuSelectedCell a:link
{
	text-decoration: none;
	color: #5AA0C0;
	display: block; 
}

.MenuInactiveCell a,
.MenuInactiveCell a:visited, 
.MenuInactiveCell a:link
{ 
	text-decoration: none;
	color: #FFFFFF;	
	display: block; 
}

.MenuInactiveCell:hover
{ 
	color: #FFFFFF;			
	background-color: #4A90B0;; /*#E0ACAC; /* #D09C9C; */
}

.MenuCriticalCell a,
.MenuCriticalCell a:visited, 
.MenuCriticalCell a:link
{ 
	text-decoration: none;
	color: #FFFFFF;	
	display: block; 
}

.MenuCriticalCell:hover
{ 
	color: #FFFFFF;			
	background-color: #F07070;
}

/* =======================================
   Countdown table
   ======================================= */
     
.CounterTableWait
{
	margin: 16pt auto 16pt auto;
	width: 90%;

	color: #FFFFFF;
	background-color: #4080C0;
	border: 2px #204060 solid;
	border-radius: 24pt 24pt 24pt 24pt;
}  

.CounterTableBus
{
	margin: 16pt auto 16pt auto;
	width: 90%;

	color: #FFFFFF;
	background-color: #C06040; 
	border: 2px #603020 solid;
	border-radius: 24pt 24pt 24pt 24pt;
}   

.CounterTableAlert
{
	margin: 16pt auto 16pt auto;
	width: 90%;

	color: #FFFFFF;
	background-color: #C03050; 
	border: 2px #601828 solid;
	border-radius: 24pt 24pt 24pt 24pt;
}  

.CounterIconWait 
{   
	content: url('images/icon-wait-white.png');
}

.CounterIconAlert 
{
	content: url('images/icon-dump-white.png');
}

.CounterIconBus  
{
	content: url('images/icon-bus-white.png');
}


/* ----------------------------------- */

.CounterTable 
{
}


.CounterCellIcon
{
	width: 160px;	
	padding: 18pt 0pt 18pt 0pt;
	text-align: center;
	vertical-align: top;
}

.CounterCellTitle
{
	padding: 18pt 24pt 18pt 0pt;
	font-weight: bold;
	font-size: 16pt; 
	text-transform: uppercase;
}

.CounterCellTime
{
	padding: 0pt 24pt 18pt 0pt;
	font-weight: bold;
	font-size: 24pt; 
}

.CounterCellDetail
{
	padding: 0pt 24pt 18pt 0pt;
	font-weight: bold;
	font-size: 14pt; 
}


/* =======================================
   Embed Table
   ======================================= */
.EmbedTable 
{
	border: 3px #E0E0E0 solid;
	border-radius: 24pt 24pt 24pt 24pt;
	background-color: #FFFFFF;
	width: 100%;
}

.EmbedCell
{
	padding: 12pt;
}



/* =======================================
   Measure Table
   ======================================= */

.MeasureTable
{
	border-collapse: collapse;
	margin: 16pt auto 16pt auto;
    border-top: 2px #C8C8C8 dashed;
}

.MeasureCellNumber
{
	vertical-align: middle;
    text-align: left;
	padding: 12pt 0pt 12pt 0pt; 
    border-bottom: 2px #C8C8C8 dashed;

	font-family: arial;
	font-size: 16pt;
}

.MeasureCellItem
{
	vertical-align: middle;
    text-align: left;
	padding: 6pt 0pt 6pt 24pt; 
    border-bottom: 2px #C8C8C8 dashed;

	font-family: arial;
	font-size: 16pt;
}


.MeasureViolation
{
	white-space: nowrap;
	vertical-align: middle;	
	text-align: center;
	display: block;
	font-weight: bold;
	padding: 8pt 24pt 8pt 24pt; 
		
	border-radius: 12pt;	    
	background-color: #B81234;
	color: #FFFFFF;	
}

.MeasureCompliant
{
	white-space: nowrap;
	vertical-align: middle;	
	text-align: center;
	display: block;
	padding: 8pt 24pt 8pt 24pt; 

	border-radius: 12pt;	
	background-color: #508060;
	color: #FFFFFF;	
}


/* =======================================
   Alert Table
   ======================================= */
.AlertTable
{
	color: #FFFFFF;
	border: 2px #970014 solid;
	border-radius: 16pt 16pt 16pt 16pt;
	background-color: #B71234;
	margin: 16pt auto 16pt auto;
}

.AlertTable p
{
	margin: 0pt 0pt 16pt 0pt;
}

.AlertHeader
{
	color: #FFFFFF;
	font-size: 24pt;
	font-weight: bold;
	text-transform: uppercase;
}


.AlertCellLeft
{
	vertical-align: top;
	padding: 16pt 8pt 16pt 16pt;
}

.AlertCellRight
{
	vertical-align: top;
	padding: 16pt 16pt 16pt 8pt;
}

.AlertTable em
{
	color: #FFFFA0;
}


.AlertTable a
{
	color: #FFFF80;
}
.AlertTable a:hover
{
	color: #FFFF00;
}

.AlertTable img
{
	border-radius: 16pt;
}


/* =======================================
   More Info
   ======================================= */

.MoreTable
{
	
	margin: 16pt 0pt 16pt 0pt;
	border-radius: 16pt 16pt 16pt 16pt;
	background-color: #40BAB0; /*#80C0B0; /*#108A80; */
}

.MoreCell
{
	padding: 6pt 18pt 6pt 18pt;
	color: #FFFFFF;
}

.MoreCell a:active,
.MoreCell a:link,
.MoreCell a:visited
{
	color: #FFFFFF;	
	text-decoration: none;
}

.MoreTable:hover
{
	background-color: #50CAC0;
}




/* =======================================
   Section 
   ======================================= */

.SectionTable
{
	margin: 18pt auto 18pt auto;
    border-collapse: collapse;
    width: 90%;
	border-radius: 16pt 16pt 16pt 16pt;
	    
	color: #FFFFFF;
	background-color: #21998F;
    
}

.SectionCellImage
{
	padding: 16pt;
	vertical-align: top;
	width: 320px;
}


.SectionCellDesc
{
	vertical-align: top;
	padding: 16pt 16pt 16pt 0pt;
}

.SectionCellImage IMG
{
	border: #005A50 1px solid; 
	border-radius: 8pt 8pt 8pt 8pt;
	margin: 0px auto 0px auto;
}

.SectionCellDesc H1
{
	font-size: 18pt;
	color: #FFFFFF;
	margin-top: 0pt; /*12pt;*/
}


.SectionCellDesc a,
.SectionCellDesc a:link,
.SectionCellDesc a:active,
.SectionCellDesc a:visited
{
	color: #FFFFFF;
	font-weight: bold;
	text-decoration: none;
}

.SectionCellDesc a:hover
{
	color: #FFFF80;
	font-weight: bold;
	text-decoration: none;

}

/* =======================================
   Audio
   ======================================= */
.AudioIcon
{
	width: 32pt;
	height: 32pt;
	border-radius: 8pt 8pt 8pt 8pt;
}

.AudioClipTable
{	
	border-collapse:collapse;
	margin: 32pt 16pt 32pt 0pt;
	clear: both;
}

.AudioClipCellLink
{	
	vertical-align: middle;
	padding: 8pt 12pt 8pt 0pt;
}

.AudioClipCellName
{	
	font-family: arial;
	font-size: 16pt;
	color:	#2850A0;
	font-weight: bold;
	vertical-align: middle;
	white-space: nowrap;
	padding: 16pt 0pt 16pt 0pt; 
}

.AudioClipCellBlank
{	
	border-bottom: 2px #E0E0E0 solid;
}

.AudioClipCellDesc
{	
	vertical-align: top;
	font-size: smaller;
	padding: 0pt 0pt 16pt 0pt;
	border-bottom: 2px #E0E0E0 solid;	
}


.AudioClipCellColumnSep
{	
    width: 24pt;
}



/* =======================================
   Quotes
   ======================================= */

.QuoteTable
{	
	border-collapse:collapse;
	margin: 24pt 16pt 0pt 0pt;
	border-left: 4px #E0E0E0 solid;
}


.QuoteCellLeft
{
	vertical-align: top;
	width: 24px;
	line-height: 1.5;
    padding: 0pt 0pt 0pt 8pt
}


.QuoteCellText
{
	vertical-align: top;
	font-style: italic;
	color: #2850A0; 
	line-height: 1.25;
	padding: 0pt 8pt 0pt 2pt;
}

.QuoteCellBlank
{ 		
}

.QuoteCellSource
{
	padding: 8pt 0pt 0pt 0pt;
	color: #2850A0;
	font-size: smaller;
}

.QuoteImage
{
	vertical-align: text-top; 
	width: 12px;
	height: 8px;
	padding: none;
}

/* =======================================
   Document
   ======================================= */

.DocumentTable
{	
	/*border-collapse: collapse;*/
	margin: 16pt 0pt 16pt 0pt;
	border-radius: 16pt 16pt 16pt 16pt;
	border: 2pt #D0D0D0 solid;
	background-color: #FCFCFC;
}

.DocumentCell
{
	vertical-align: top;
	font-style: normal;
	font-family: "Times New Roman", Times, serif;
	color: #202020; 
	line-height: 1.25;
	padding: 16pt;
}
