/* html 5 semantics tags */
article, aside, figure, footer, header, hgroup, menu, nav, section 
{ display: block; }
html, body { height: 100%; margin: 0; padding: 0; }
body
{
  background-color:black;
  color:white;
  font-family:'Arial';
  min-width: 1035px;
}
/* ----------- MAIN PAGE OUTLINE BEGIN ------------ */
#pageContainer {
    margin: 0px auto 0px auto;
	width: 1200px;
	height:2000px;
	background-color:black;
	border: thin solid black;
}
/* ----------- Common -------------------------- */
.alignCenter{
	text-align: center;
}
.alignLeft{
	text-align: left;
}
.width14{
	width: 14;
}
.width100Percent{
	width: 100%
}
/* ----------- PAGE HEADER --------------------- */
#pageHeader {
    margin:2px auto 2px auto;
    height:75px;
    position:relative;
/*
    border-color: yellow;
	border-style:  solid;
	border-width: thin;
*/
   }
#logo{
	float: left;
	height:66px;
	width: 150px;
}
#headerContent {
    margin-left: 157px;
    margin-right: 400px;
    padding-top: 0px;
    padding-bottom: 0px;
}
#expeditionCall{
	margin-left: 50px;
	margin-right: 50px;
	/* http://www.google.com/fonts# */
	font-family: 'Poiret One', cursive;
	font-size: 1.5em; /* 2em for production */
	text-align: center;
	color:#1cf7ae; /* color:#00C080; */
	/*
border-width: thin;
	border-style: solid;
	border-color: lime;
*/
}
#expeditionDate{
	margin-left: 150px;
	margin-right: 200px;
	margin-top: 10px;
	font-size: .9em;
	/* font-family: 'Raleway Dots', cursive; */
	font-family: 'Poiret One', cursive;
	text-align: center;
	color:#1cf7ae; /* color:#00C080; */
	
	/*
	border-width: thin;
	border-style: solid;
	border-color: lime;
	*/
}
.vp6d{
	color:#1cf7ae;
}
#status{
	float: right;
	width: 310px;
	margin-right: 55px;
	max-height: 70px;
	overflow: auto;
/* 	color:#C0C080; */
	color:#1cf7ae;
	font-family: 'Open Sans', sans-serif;
	font-size: .9em;
	padding-left: 2px;
	padding-right: 8px;
	/*
border-color: yellow;
	border-style:  solid;
	border-width: thin;
*/
}
/* ------------ MAP CONTAINER -------------------- */
#mapContainer{
    position:relative;
    overflow:hidden;
    /*background-image: url('../maps/t33a/Banaba_01.jpg');*/
   
/*
 border-style:  solid;
    border-color: red;
    border-width: thin;
*/

}

#canvas{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 100;
	visibility: visible;
/* 	display:block; */
	/*
border-style:  solid;
    border-color: #005180;
    border-width: thin;
*/
    /* background-color: yellow; */
}
#googleCanvas{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 100;
	visibility:visible;
/* 	display: none; */
}
.watermark{
	margin-left: 480px;
	margin-top: 465px;
	color:#C0C080;
	font-family: 'Open Sans', sans-serif;
	font-size: .6em;
	/*visibility:hidden;*/
	/*
border-style:  solid;
    border-color: #005180;
    border-width: thin;
*/
    
}
#version{
	font-size:.9em; color:#e0ffff; font-style:oblique
}
.normal{
	margin-left: 157px;
    margin-right: 405px;
    margin-top: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
    /*
width: 640px; 
    height: 480px;
*/
}
.expanded{
	margin-left: 157px;
    margin-right: 0px;
    margin-top: 10px;
    padding-top: 0px;
    padding-bottom: 0px;
}
/* -------------- LEFT COLUMN ------------------ */
#leftColumn{
	float:left;
	width: 150px;
	height: 490px;
	margin-top: 10px;
	font-family: 'Open Sans', sans-serif;
/*
border-style:  solid;
	border-width: thin;
	border-color: yellow;
*/
}
#logoContainer{
	margin-left: 0px;
}
#jssor_1{
	position: relative; margin: 0 auto; top: 0px; left: 0px; height: 30px; width: 300px;  overflow: hidden; margin-left:10px;
}
#loading{
	position: absolute; top: 0px; left: 0px;
}
#nav1{
	color:red;
	margin-left: 10px;
	margin-top: 10px;
	/*
border-color: lime;
	border-style:  solid;
	border-width: thin;
*/
}
/* http://css.maxdesign.com.au/listutorial/index.htm */
ul{
    list-style-type: none;
    padding:0; 
    margin:0;
}
li{
	margin-top: 5px;
	font-family: 'Open Sans', sans-serif;
	font-size: .9em;
	color:#C0C080;
}
.link{
	color:#C0C080;
}

#login{
	margin-top: 300px;
	margin-bottom: 0;
	text-align: center;
}
#callbox{
	width: 75px;
}
a.menu
{
	color:#C0C080;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
	cursor:pointer;
	text-decoration: none;
     display: block;
     width: 100%;
     height: 100%;
}
.menuAltColor{
	 color:#1cf7ae;
	 font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
	cursor:pointer;
	text-decoration: none;
     display: block;
     width: 100%;
     height: 100%;
}
.leftNormal{
	display: block;
}
.leftCollapsed{
	display: none;
}
/* -------------- RIGHT COLUMN ------------------ */
#rightColumn{
	float:right;
	width: 310px;
	height: 490px;
	margin-top: 10px;
	margin-right: 75px;
	
	
/*
	border-style:  solid;
	border-width: thin;
	border-color: yellow;
*/
}
#currentWorkingContainer{
	float:left;
	height:285px; /*485*/
	width:150px;
	text-align: center;
	margin-right: 2px;
	font-family: 'Raleway Dots';
	overflow: auto;
}
#currentQsoHeader{ 
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-style: italic;
	font-size: 1.2em;
	color:#FFFFC0;
	height: auto;
	padding-bottom: 5px;
	text-decoration: underline;
}
 #previousQsoHeader{
	 font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	font-style: italic;
	font-size: 1.2em;
	color:#FFFFC0;
	height: auto;
	padding-bottom: 5px;
	text-decoration: underline;
 }
#previousWorkedContainer{
	float:right;
	height:285px;
	width:150px;
	text-align: center;
	margin-right: 2px;
	/* font-family: 'Raleway Dots'; */
	font-family: 'Poiret One';
	overflow: auto;
}

#statusHeader{
	color:#1cf7ae;
	font-family: 'Open Sans', sans-serif;
	font-size: .7em;
	padding-left: 110px;
	margin-top:305px;
}
#status2{
/* 	float: right; */
	width: 250px;
/* 	margin-right: 2px; */
	margin-left: 25px;
/* 	margin-top:295px; */
	max-height: 150px;
	min-height:75px;
	overflow: auto;
	color:#C0C080;
	font-family: 'Open Sans', sans-serif;
	font-size: .7em;
	padding-left: 5px;
	padding-right: 8px;

/* #efefbe; */
/*
	border-color: rgba(255, 255, 255, 0.5); 
	border-style:  solid;
	border-width: 5px;
*/


}
/* not currently used*/
.abovebottom{
	border-top-style:ridge;
	border-bottom-style:ridge;
	padding-top:5px;
	padding-bottom:5px;
	border-top-color:#ecf495; /*#7cbfcf;*/
	border-bottom-color:#ecf495; /*#7cbfcf;*/
	border-top-width:2px;
	border-bottom-width:2px;
}

.currentQso{
    /* font-family: 'Raleway Dots'; */
    font-family: 'Open Sans', sans-serif;
	font-size: .7em;
	color:#00C080;
	height: auto;
	text-align: left;
	margin-left: 40px;
	/*
border-color: lime;
	border-style:  solid;
	border-bottom: thin;
*/
}
.matchQso{
    /* font-family: 'Raleway Dots'; */
    font-family: 'Open Sans', sans-serif;
	font-size: .8em;
	color:#FF8080;
	height: auto;
	text-align: left;
	margin-left: 40px;
	/*
border-color: lime;
	border-style:  solid;
	border-bottom: thin;
*/
}
.previousQso{
    font-family: 'Open Sans', sans-serif;
	font-size: .7em;
	color:#00C080;
	height: auto;
	text-align: left;
	margin-left: 40px;
	/*
border-color: lime;
	border-style:  solid;
	border-bottom: thin;
*/
}
.ssbQso{
		color: #FFFFC0;	/* #FFFFC0; */
}
.cwQso{
		color: cyan;
}
.digiQso{
		color: #00FF80;
}

.dateTime{
	font-family: 'Open Sans', sans-serif;
	font-size: .6em;
	color:#C0C080;
	height: auto;
	text-align: left;
	margin-left: 40px;
	/* text-decoration: underline; */
}
.overflow{
	max-height: 445px;
	overflow: auto;
}
.rightNormal{
	display: block;
}
.rightCollapsed{
	display: none;
}
/* ------------- PAGE FOOTER ------------------- */
#pageFooter {
	margin-left: 5px; 
    padding-bottom: 0px;
	position: relative;
	height:200px;
	clear: both;
	
/*
	border-style:  solid;
	border-color: yellow;
	border-width: thin;
*/

}
#statistics{
/* 	margin-left: 157px; */
	/*
border-style:  solid;
	border-color: #00eeff;
	border-width: thin;
*/
}
.cellBorderBottom
{
	border-bottom: solid;
	border-bottom-color: gray;
	padding-bottom: .2em;
	border-bottom-width: 2px;
}
.cellBorderTopAndBottom
{
	border-top: solid;
	border-top-color: gray;
	padding-top: .2em;
	border-top-width: 2px;
	border-bottom: solid;
	border-bottom-color: gray;
	padding-bottom: .2em;
	border-bottom-width: 2px;
}
.cellBorderLeft
{
	border-left: solid;
	border-left-color: #eaeaea;
	padding-left: .2em;
	border-left-width: 2px;
}
.cellBorderRight
{
	border-right: solid;
	border-right-color: #eaeaea;
	padding-right: .2em;
	border-right-width: 2px;
}
.cyanHeading
{
	font-size:1.1em;
	color:cyan;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.uppercase
{
    text-transform: uppercase;
}
.bandHeading
{
	font-size:.8em;
	font-weight: 500;
	color:white;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.smallWhiteHeading
{
	font-size:0.7em; 
	font-weight: 500;
	color:white;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.smallWhiteheadingEx{
	margin-left:25px;
}
.redRemainingLarge
{
	font-size:2.5em; 
	color:red;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.redRemainingMedium
{
	font-size:1.8em; 
	color:#FF8080;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}

.redRemainingSmall
{
	font-size:1.0em;
	color:red;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.whiteRemainingLarge
{
	font-size:.9em;
	color:white;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.whiteRemainingSmall
{
	font-size:.7em;
	color:white;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.numberQSOTotal
{
	font-size:1.8em; 
	color:#00C080;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
	padding-bottom: .2em; /* needed for fine tuning with Time Remaining*/
}
.numberQSOSmall
{
	font-size:.7em; 
	color:#00C080;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}

.numberQSOHeading
{
	font-size:.7em;
	font-weight: 500;
	color:white;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.limeHeading
{
	font-size:1.1em;
	color:lime;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.whiteHeading
{
	text-align: center;
	font-size:.8em;
	font-weight: 500;
	color:white;
	font-family:Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.callBox{
	height: 20px;
	display: table-cell;
	float:left;
	margin-left: 20px;
}

/* -------------- MAIN PAGE OUTLINE END --------------------- */
#testArea {
	float:left;
    margin-top: 2px;
    margin-left: 70px;
    /* margin-right: 150px; */
    padding-bottom: 0px;
	/* border-style:  solid; */
	height:1025px;
	width: 1025px;
	/*
border-style:  solid;
	border-color: yellow;
	border-width: thin;
*/
	
}
#testArea2 {
float:right;
    margin: 2px auto;
    padding-bottom: 0px;
	border-style:  solid;
	height:500px;
	width: 500px;
	border-style:  solid;
	border-color: yellow;
	border-width: thin;
}
/* ------------------------ Google Maps ------------------------------------------ */
.labels {
     color: red;
     /* background-color: #98b3cd; */
     font-family: "Lucida Grande", "Arial", sans-serif;
     font-size: .7em;
     font-weight: bold;
     text-align: center;
     /* width: 40px; */     
/*      border: none solid black; */
     white-space: nowrap;
}
/* ------------------------ FLAGS ------------------------------------------ */
.flag
{
	position: absolute;
	z-index: 100;
	width: 48px;
	height: 12px;
	visibility:hidden;
	display: block;
	vertical-align: middle;
	text-align: center;
	padding-top: 1px; 
	font-size: .6em;
	color: black;
	font-family: Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
}
.ssb{
	border: 1px solid #47f147; 
	border: 1px solid black;
	background-color: #FFFFC0;	/* #FFFFC0; */
}
.cw{
	border: 1px solid #47f147; 
	border: 1px solid black;
	background-color: cyan;
}
.digi{
	border: 1px solid #47f147; 
	border: 1px solid black;
	background-color: #00FF80;
}
/* -------------------------*/
.confirm{
	height:17px;
	width:20px;
	float: right;
}
.greenieOn{
	background-color: #00C080;
}
.greenieOff{
	background-color: DimGray;
}
.bandMode{
	height:20px; 
	width:20px;
/* 	border="0"; */
	background-image: url('../images/LEDs/LED_dimgray.jpg');
}
/*--------------------------MISC for Testing ----------------------------------- */
.testborder
{
	border-width: thin;
	border-style: solid;
	border-color: lime;
}
/* ------------------------ SLIDE SHOW ------------------------------------------- */
 /* jssor slider bullet navigator skin 01 css */
        /*
        .jssorb01 div           (normal)
        .jssorb01 div:hover     (normal mouseover)
        .jssorb01 .av           (active)
        .jssorb01 .av:hover     (active mouseover)
        .jssorb01 .dn           (mousedown)
        */
        .jssorb01 {
            position: absolute;
        }
        .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av {
            position: absolute;
            /* size of bullet elment */
            width: 12px;
            height: 12px;
            filter: alpha(opacity=70);
            opacity: .7;
            overflow: hidden;
            cursor: pointer;
            border: #000 1px solid;
        }
        .jssorb01 div { background-color: gray; }
        .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; }
        .jssorb01 .av { background-color: #fff; }
        .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; }

        /* jssor slider arrow navigator skin 02 css */
        /*
        .jssora02l                  (normal)
        .jssora02r                  (normal)
        .jssora02l:hover            (normal mouseover)
        .jssora02r:hover            (normal mouseover)
        .jssora02l.jssora02ldn      (mousedown)
        .jssora02r.jssora02rdn      (mousedown)
        */
        .jssora02l, .jssora02r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 55px;
            height: 55px;
            cursor: pointer;
            background: url('../images/slides/a02.png') no-repeat;
            overflow: hidden;
        }
        .jssora02l { background-position: -3px -33px; }
        .jssora02r { background-position: -63px -33px; }
        .jssora02l:hover { background-position: -123px -33px; }
        .jssora02r:hover { background-position: -183px -33px; }
        .jssora02l.jssora02ldn { background-position: -3px -33px; }
        .jssora02r.jssora02rdn { background-position: -63px -33px; }
        
        .slidedeck{
	        cursor: default; 
	        position: relative; 
	        top: 0px; 
	        left: 0px; 
	        height: 230px; 
	        width: 230px;  
	        overflow: hidden;
        }
/* ------------------------ SLIDEOUTS ------------------------------------------ */
/* SLIDEOUT STYLES BEGIN http://jsfiddle.net/Alexis/FUAQJ/ */
#slideout {
    position: fixed;
    top: 100px;
    left: 0;
    width: 35px;
    padding: 12px 0;
    text-align: center;
    background: #f4f6d1;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
#slideout_inner {
    position: fixed;
    top: 100px;
    left: -250px;
    background: #f4f6d1; /* #6DAD53 */
    width: 200px;
    padding: 25px;
    height: 130px;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    text-align: left;
    -webkit-border-radius: 0 0 5px 0;
    -moz-border-radius: 0 0 5px 0;
    border-radius: 0 0 5px 0;
}
#slideout_inner textarea {
    width: 190px;
    height: 140px;
    margin-bottom: 6px;
}
#slideout:hover {
    left: 250px;
}
#slideout:hover #slideout_inner {
    left: 0;
}
/* ------------------------------- */
#slideoutPilot {
    position: fixed;
    top: 350px;
    left: 0;
    width: 35px;
    padding: 12px 0;
    text-align: center;
    background: #c3f6d1;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    visibility: hidden;
}
#slideoutPilot_inner {
    position: fixed;
    top: 350px;
    left: -250px;
    background: #c3f6d1; /* #6DAD53 */
    width: 200px;
    padding: 25px;
    height: 130px;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    text-align: left;
    -webkit-border-radius: 0 0 5px 0;
    -moz-border-radius: 0 0 5px 0;
    border-radius: 0 0 5px 0;
}
#slideoutPilot_inner textarea {
    width: 190px;
    height: 140px;
    margin-bottom: 6px;
}
#slideoutPilot:hover {
    left: 250px;
}
#slideoutPilot:hover #slideoutPilot_inner {
    left: 0;
}

/* ------------------------------- */
#slideoutAdmin {
    position: fixed;
    top: 450px;
    left: 0;
    width: 35px;
    padding: 12px 0;
    text-align: center;
    background: #f6cfc3;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    visibility: hidden;
}
#slideoutAdmin_inner {
    position: fixed;
    top: 450px;
    left: -250px;
    background: #f6cfc3; /* #6DAD53 */
    width: 200px;
    padding: 25px;
    height: 130px;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    text-align: left;
    -webkit-border-radius: 0 0 5px 0;
    -moz-border-radius: 0 0 5px 0;
    border-radius: 0 0 5px 0;
}
#slideoutAdmin_inner textarea {
    width: 190px;
    height: 140px;
    margin-bottom: 6px;
}
#slideoutAdmin:hover {
    left: 250px;
}
#slideoutAdmin:hover #slideoutAdmin_inner {
    left: 0;
}

/* SLIDEOUT STYLES END */


/* http://www.htmlgoodies.com/html5/css/css-cross-browser-text-rotation.html#fbid=bhDi7Fyufi- */
#perfCompChartYaxisTitle {
  float:left;
  position: relative;
  width: 15px;
  top: 72px;
  border: thin;
  background: #f4f6d1;
  font-size: 1em;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}


/* Clear Floated Elements */
.clearfix:before, .clearfix:after {content: "\0020"; 
display: block; height: 0; visibility: hidden;}
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }