
#top {
	/*
	background:url(../images/textures/blue_three.jpg) no-repeat fixed center ;
	display: block;
	height:100 px;
	*/
	position: relative; 
   width: 100%; /* for IE 6 */
}

#top h1 {
	
	position: absolute; 
	/*
	top: 80px; 
   left: 280px; 
   */
	top: 20%; 
    left: 30%; 
   
    width: 100%;
   
	font-size: 18px;
	padding : 30px 40px 0 25px;
	margin : 0;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:400;
	
	letter-spacing:3px;
	/*text-align:left;*/
	color:#E6A614;
	background:transparent;
}

#top h2 {
	
	position: absolute; 
	/*
	top: 80px; 
   left: 280px; 
   */
	top: 10%; 
    left: 20%; 
   
    width: 100%;
   
	font-size: 18px;
	padding : 30px 40px 0 25px;
	margin : 0;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:400;
	
	letter-spacing:3px;
	/*text-align:left;*/
	color:#E6A614;
	background:transparent;
}

/**
 * 	wrap image around text 
 *  wrap-div-topSpacer height is how much space is from top
 */
	div.wrap-div-topSpacer {
		width: 0px;
		height: 10px; 
		float: left;
	}
	div.wrap-div {
		float: left;
		clear: both;
		margin: 0px 10px 0 0;
		height: 280px;
		width: 20%;
		text-align: center;
		/*background: #0088cc;*/
		color: #FFF;
	}
	div.wrap-div-small {
		float: left;
		clear: both;
		margin: 0px 10px 0 0;
		height: 280px;
		width: 15%;
		text-align: center;
		/*background: #0088cc;*/
		color: #FFF;
	}

	div.wrap-div-right {
		float: right;
		width: 50%;
	}
	
	div.wrap-wide {
        float: left;
        clear: both;
        margin: 0px 10px 0 0;
        height: 500px;
        width: 50%;
        text-align: center;
        /*background: #0088cc;*/
        color: #FFF;
    }

    div.wrap-small {
        float: left;
        clear: both;
        margin: 0px 10px 0 0;
        height: 140px;
        width: 20%;
        text-align: center;
        /*background: #0088cc;*/
        color: #FFF;
    }
	
/**
 * 	End
 */

/**
 * 	Simple list with square bullets
 */
ul.slist {
	list-style-type: square;
 	list-style-position: outside;
 	list-style-image: none;
 	
 	/**list-style-image: url(images/bullet.png);*/
}

/**
 * 	Nice animated tab
 * 
 * https://blog.gaya.ninja/articles/animated-tabbed-content-with-jquery/
 */
.tabbed_content_jq {
	background-color: #000000;
	width: 620px;	
}

.tabs_jq  {
	height: 62px;
	position: relative;
}

.tabs_jq  .moving_bg {
	padding: 15px;
	background-color:#7F822A;
	background-image:url(../images/arrow_down_green.gif);
	position: absolute;
	width: 125px;
	z-index: 190;
	left: 0;
	padding-bottom: 29px;
	background-position: bottom left;
	background-repeat: no-repeat;
}

.tabs_jq  .tab_item {
	display: block;
	float: left;
	padding: 15px;
	width: 125px;
	color: #ffffff;
	text-align: center;
	z-index: 200;
	position: relative;
	cursor: pointer;
}

.tabbed_content_jq  .slide_content {
	overflow: hidden;
	background-color: #000000;
	padding: 20px 0 20px 20px;
	position: relative;
	width: 600px;
}

.tabslider_jq  {
	width: 5000px;
}

.tabslider_jq  ul {
	float: left;
	width: 560px;
	margin: 0px;
	padding: 0px;
	margin-right: 40px;
}

.tabslider_jq  ul a {
	color: #ffffff;
	text-decoration: none;
}

.tabslider_jq  ul a:hover {
	color: #aaaaaa;
}

.tabslider_jq  ul li {
	padding-bottom: 7px;
}

/**
 * 	H1 with icon - ges, tges, and gges
 */
h1.hges {
    width: 50px;
    height: 50px;
    display: inline-block;
    vertical-align: middle;
    background-image: url('/assets/images/gesicon.png');
    background-repeat: no-repeat;
}

h1.htges {
    width: 50px;
    height: 50px;
    display: inline-block;
    vertical-align: middle;
    background-image: url('/assets/images/tgesicon.png');
    background-repeat: no-repeat;
}

h1.hgges {
    display: inline-block;
    vertical-align: middle;
    height: 16px;
    width: 16px;
    background-image: url('/assets/images/ggesicon.png');
    background-repeat: no-repeat;
}

/**
 * 	On the model page the header with background blue
 */
.header_section{
		width:100%; 
		/*background: #66AAEE;*/
		padding: 10px;
		border-bottom: 3px solid #1C3653;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7db9e8+0,2989d8+76,1e5799+100 */
		background: #7db9e8; /* Old browsers */
		background: -moz-linear-gradient(top, #7db9e8 0%, #2989d8 76%, #1e5799 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, #7db9e8 0%,#2989d8 76%,#1e5799 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, #7db9e8 0%,#2989d8 76%,#1e5799 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */
}

.headerContent_section{
		margin: 0 auto; width: 200px;
	}
	
/**
 * 	Bullet list on model - uses span
 */
.lst_def {
	font-size: 16px;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:350;
	color: #1C3653;
}
.lst_def_light {
    font-size: 16px;
    /*
    font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
    font-weight:350;
    */
    font-family: Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
    font-style: normal;
    
    color: #1C3653;
}

.lst_attn {
	font-size: 14px;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:250;
	color: #660000;
}
.lst_high {
	font-size: 14px;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:250;
	color: #0066cc;
}
.lst_sym {
	font-size: 14px;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:250;
	color: #ff0000;
}

.lst_norm {
	font-size: 14px;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:120;
	color: #000000;
}

.lst_entrynav {
	/*font-size: 12px; */
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	/*font-family: "Oswald";*/
	font-style: normal;
	font-weight:120;
	color: #000000;
}


.lst_par {
	font-size: 12px;
	/*
	font : Helvetica, "Trebuchet MS", Arial,Tahoma, sans-serif;
	*/
	font-family: "Oswald";
	font-style: normal;
	font-weight:200;
}

/**
 * 	Added flex for the entries in the model.html page and GES
 */
.wrap_ges {
    display: flex;
    width: 100% ;
    justify-content: center;
}
.cell_ges {
    display: flex;
    height: 1.2 rem;
    align-items: center;
}
.description_ges {
    /*background-color: #ccc;*/
    width: 80%;
}
.val_ges {
    /*background-color: gold;*/
    width: 10%;
    justify-content: right;
}
.val_wideges {
    /*background-color: gold;*/
    width: 35%;
    justify-content: right;
}
.shortdesc_ges {
    /*background-color: #ccc;*/
    width: 10%;
    justify-content: left;
}
.longval_ges {
    /*background-color: gold;*/
    width: 80%;
    justify-content: right;
}
/*
.remove_ges {
    background-color: red;
    width: 10%;
    justify-content: center;
}*/

/**
 * 	Slider for GES map opacity
 */
div.balSlider {
    width: 100%;
}

div.balSlider .k-slider-selection {
    display: none;
}
        
#grid {
    width : 490px;
}
    
#gridjob {
    	/**	width : 490px; */
}

/**
 * 	Hide arrow for drop down combobox
 */
.hideArrow {
	 padding: 0 0 0 0;
}
.hideArrow > .k-input {
	 border-radius: 3px 3px 3px 3px;
}

/**
 * 	Primary button Panels in all pages
 */
.primary {
    background-color: #64a1d5;
    background-image: linear-gradient(to bottom, #64a1d5, #428bca);
    color: #fff;
    border-color: #428bca;
    border-radius: 4px;
    min-width: 70px;
}
.primary:hover {
    background-color: #428bca;
    color: #fff;
    border-color: #428bca;
}
.primary.k-state-disabled, .primary.k-state-disabled:hover {
    background-color: #8dc5e1;
    color: #fff;
}

/**
 *     Button log in ,etc
 */
.btnges {
    -webkit-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
    box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75);
    
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 15px;
  padding: 10px 20px 10px 20px;
  margin-top: 20px;
  border: solid #010d14 2px;
  text-decoration: none;
}

.btnges:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

/**
 *     Form style
 */
.form-container {
  position:fiexd;
  width:50%;
  margin-left: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  padding: 20px;
  background-color: #E8E1E1;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.form-floatRight{
    float:right;
    margin-right: 18px;
}

.form-has-error{
    color:red;
}


.form-success{
  position:fiexd;
  width:50%;
  margin-left: 50px;
  margin-top:20px;
  padding: 20px;
  background-color: #E8E1E1;
  border: 1px solid #ddd;
  border-radius: 4px;
}

/**
 *     Remove underline
 */
.nolink a {
    text-decorations:none !important; 
    color:inherit;
}

.nolink a :hover {
    text-decoration:none !important; 
    color: red;
}
