@font-face {
        font-family: "Lato Bold";
        src: url('fonts/251556397-Lato-Bol.eot');
        src: url('fonts/251556397-Lato-Bol.eot?#iefix') format('embedded-opentype'),
        url('fonts/251556397-Lato-Bol.svg#Lato') format('svg'),
        url('fonts/251556397-Lato-Bol.woff') format('woff'),
        url('fonts/251556397-Lato-Bol.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: "Lato Light";
        src: url('fonts/524566651-Lato-Lig.eot');
        src: url('fonts/524566651-Lato-Lig.eot?#iefix') format('embedded-opentype'),
        url('fonts/524566651-Lato-Lig.svg#Lato') format('svg'),
        url('fonts/524566651-Lato-Lig.woff') format('woff'),
        url('fonts/524566651-Lato-Lig.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: "Lato Regular";
        src: url('fonts/604888917-Lato-Reg.eot');
        src: url('fonts/604888917-Lato-Reg.eot?#iefix') format('embedded-opentype'),
        url('fonts/604888917-Lato-Reg.svg#Lato') format('svg'),
        url('fonts/604888917-Lato-Reg.woff') format('woff'),
        url('fonts/604888917-Lato-Reg.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }

* {
    margin:0;
    padding:0;
}

html, body {
   height:100%;
	background-color:#dcd6d6;
   position: relative;
}

#wrap {
   height:500px;
	width:1024px;
	background-color:#342b2e;
	margin:0 auto;
}

#mainheader {
    background: #342b2e;
	height:90px;
    /*min-width:1050px;*/
}

/* Header */

#logoheader{
	width:212px;
	/*background:#a12026;*/ /* Enable it for pages with menu*/
	height:inherit;
	float:left;
	text-align:center;
}

#developerlogoheader{
	width:212px;
	background:#a12026;
	height:inherit;
	float:left;
	text-align:center;
}

#textheader{
	float:left;
}

#logonheader
{
    float:right;
    padding-top:23px;
}

#headerimg{
	padding-top:14px;
    position:absolute;
    left:-8px;
}

#textheader{padding-top:23px;}
#textheader p{ font-family: "Lato Light"; font-size:30px; color:#e0e0e0;float:left;}
#textheader img{ float:left; padding-left:10px;padding-right:5px;}

#welcome { font-family: "Lato Light"; font-size:15px; color:#e0e0e0;float:right; padding-top:15px; padding-right:5px;}


.loginbtn
{
	-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
	background-color: #a12026;
	border: solid 3px rgba(120,113,116,.9);
	float:right;
  	margin-right: 30px;
  	top: 24px;
  	width: 117px;
  	height: 37px;
	line-height: 37px;
	text-align: center;
	vertical-align: middle;
	display:inline-block;
	text-decoration:none;
	font-family: "Lato Bold"; 
    font-size:16px; 
    color:#faf6f6;
}

.loginbtn:hover {
	background-color: #a12026;
	border: solid 3px rgba(120,113,116,.6);
}.loginbtn:active {
	background-color: #a12026;
	border: solid 3px rgba(120,113,116,.2);
}

/* Footer */

#loginfooter {
    height:68px;
    background: #342b2e;
	text-align:center;
	display:block;

}

#footerwrap{
	width:800px;
	margin:0 auto;	
}

#loginfooter img {
	margin-top:-13px;
	margin:0 auto; float:left;
	margin-top:17px;
}

#footertext p {
	margin-top:12px;
	color:#9f9e9e;
	vertical-align:text-top;
	text-align:left; line-height:20px;
	margin-left:4px;
	font-family: "Lato Light"; font-size:15px;
    float: left 
}

#footertext{ float:left;}
.footercontact{ color:#eb2d36; }
.footerhighlight{ color:#cccccc; }

.footercontact a:link, .footercontact a:visited, .footercontact a:active, .footercontact a:hover
{
    color: #eb2d36;
    text-decoration:none;
}

/* Content */

#logincontent,#welcomecontent {
   width:500px;
   height:590px;
   background: #f2eff0;
   padding-top:100px;

}

#contentwrap{
	width:430px;
	height:350px;
	margin:0 auto;
	text-align:center;
}

.loginform{
	margin-left:2.5%;margin-right:2.5%;	
}
.loginform button{
	
	font-family: 'LucidaSansRegular', sans-serif;
	margin-top:35px;
	width:95%;
	height:50px;
	border: solid 1px rgba(107,107,107,.2);
	border:none;
	outline: none;
	color:white;
	cursor:pointer;
	padding:3px;
	letter-spacing:2px;
	border-radius:2px;
	font-size:20px;
	-webkit-transition-property: background;
       -moz-transition-property: background;
         -o-transition-property: background;
            transition-property: background;
    -webkit-transition-duration: 1s;
       -moz-transition-duration: 1s;
         -o-transition-duration: 1s;
            transition-duration: 1s;
    -webkit-transition-timing-function: linear;
       -moz-transition-timing-function: linear;
         -o-transition-timing-function: linear;
            transition-timing-function: linear;
}

.loginform button:hover, .loginform button:focus {
	background-color: rgba(0, 0, 0, 0.2);
	border: 1px solid rgba(200, 197, 197, 1);
	box-shadow: 0 0 5px rgba(234, 234, 234, 1);
}

.loginform input:hover, .loginform input:focus {
  box-shadow: 0 0 5px rgba(234, 234, 234, 1);
  border: 1px solid rgba(107, 107, 107, 1);
}

.loginform input{
	font-family: "Lato Bold";
	width:95%;
	height:45px;
	border:none;
	 background-color: #fff;
	border: solid 1px rgba(107,107,107,.2);
	color:black;
	padding:3px;
	border-radius:2px;
	font-size:24px;
	margin-top:0px;
	-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  text-align:center;
}


#contentwrap hr{
	margin-top:3px;
 	border: 0;
    height: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

#contentwrap span{ font-family: "Lato Bold"; font-size:20px; color:#393939;}
#contentwrap p{ font-family: "Lato Bold"; font-size:20px; color:#393939;margin-top:10px; text-align:left;}


#contentwrap .loginbtn{
	margin-top:32px;
	margin-left:30px;
	margin-right: 10px !important;
}

/*Welcome Screen*/
#welcomecontent #welcomecontentwrap{
	width:830px;
	height:350px;
	margin:0 auto;
	text-align:left;
}

#welcomecontentwrap h1{ font-family: "Lato Bold"; font-size:24px; color:#a12026;margin-bottom:15px;}
#welcomecontentwrap p{ font-family: "Lato Regular"; font-size:20px; color:#393939;margin-top:10px; text-align:left;line-height:25px;opacity:0.9;}

#welcomecontentwrap p:hover, #welcomecontentwrap p:focus{ opacity:1; }

.wrap {
   height: 100%;
   min-width: 800px;
}
/* Developer Menu*/

#developercontent {
   width: 100%;
   height: calc(100% - 158px);
   background: #f2eff0;
   padding-top: 0px;
   display: flex;
   overflow-y: hidden;
   overflow-x: hidden;
}

#developercontentmenu {
   width: 212px;
   text-align: left;
   background: #342b2e;
   margin-right: 20px;
   overflow-y: hidden;
   overflow-x: hidden;
   flex: 0 0 212px;
}

#developercontentmenu a {
	height:50px;
	width:212px;
}

a.devlink { 
     width:212px;
     height:50px; 
     float:left;
	 display:block;
	 text-decoration:none;
	 font-family: "Lato Bold";  color:#a2a2a2;
	 margin-left:10px;
     margin-top: 20px;
	 font-size:20px;
	  overflow: hidden;
    white-space: nowrap;
}
.devlink p{
	padding-left:35px;	
	margin-top:5px;
	
}

.devlink p:hover{
	color:#a12026;	
}

#home {
   background-image: url(images/home.png);
   height: 28px;
   width: 28px;
   float:left;
}

#home:hover {
   background-image: url(images/home_a.png);
}

#activity {
   background-image: url(images/activity.png);
   height: 28px;
   width: 28px;
   float:left;
}

#activity:hover {
   background-image: url(images/activity_a.png);
}

#testharness {
   background-image: url(images/testharness.png);
   height: 28px;
   width: 28px;
   float:left;
}

#testharness:hover {
   background-image: url(images/testharness_a.png);
}

#log {
   background-image: url(images/log.png);
   height: 28px;
   width: 28px;
   float:left;
}

#log:hover {
   background-image: url(images/log_a.png);
}

#documentation {
   background-image: url(images/documentation.png);
   height: 28px;
   width: 28px;
   float:left;
}

#documentation:hover {
   background-image: url(images/documentation_a.png);
}

#security {
   background-image: url(images/security.png);
   height: 28px;
   width: 28px;
   float:left;
}

#security:hover {
   background-image: url(images/security_a.png);
}

#chat {
	background-image: url(images/chat.png);
	height: 28px;
	width: 28px;
	float: left;
}

#chat:hover {
	background-image: url(images/chat_a.png);
}

#about {
   background-image: url(images/about.png);
   height: 28px;
   width: 28px;
   float:left;
}

#about:hover {
   background-image: url(images/about_a.png);
}