@charset "UTF-8";

.navigation {
  height: 110px;
  background: #2e4b90;
}



.brand1 {
  position: absolute;
  line-height: 100px;
  height: auto;
  max-width:100%;
  padding:10px 400px 10px 430px;
}

.brand {
  position: absolute;
  padding-right: 20px;
  float: left;
  line-height: 100px;
  height: auto;
  max-width:100%;
  padding:15px;
}
.brand a,
.brand a:visited {
  color: #ffffff;
  text-decoration: none;
}

 @media screen and (max-width: 360px){
     
     .brand{
       height:85px;
     max-width: 60%;
    
     }
     
     }

 @media screen and (max-width: 400px){
     
     .brand{
       height:85px;
       max-width: 60%;
    
     }
     
     }

  @media screen and (max-width: 520px){
     
     .brand{
       height:85px;
        max-width: 60%;
    
     }
     
     }

  @media screen and (max-width: 640px){
     
     .brand{
      height:85px;
      max-width: 60%;
    
     }
     
     }
   @media screen and (max-width: 768px){
     
     .brand{
     height:85px;
     max-width: 60%;
    
     }
      }



/*-----Login.aspx logo responsive---------------*/
@media screen and (max-width: 360px){
     
     .brand1{
       height:85px;
     max-width: 60%;
    
     }
     
     }

 @media screen and (max-width: 400px){
     
     .brand1{
       height:85px;
     max-width: 60%;
    
     }
     
     }

  @media screen and (max-width: 520px){
     
     .brand1{
       height:85px;
     max-width: 60%;
    
     }
     
     }

  @media screen and (max-width: 640px){
     
     .brand1{
      height:85px;
     max-width: 60%;
    
     }
     
     }
   @media screen and (max-width: 768px){
     
     .brand1{
     height:85px;
     max-width: 60%;
    
     }
     
     }


/*-----End Login.aspx logo responsive---------------*/


.nav-container {
  max-width: 95%;
  margin: 0 auto;
}

/*------------Nav Container Responsive-----------*/
@media screen and (max-width: 360px) {
    .nav-container {
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 400px) {
    .nav-container {
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 520px) {
    .nav-container {
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 640px) {
    .nav-container {
        max-width: 100%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 768px) {
    .nav-container {
        max-width: 100%;
        margin: 0 auto;
    }
}
/*-------------End Nav Container-----------------*/

nav {
  float: right;
}
nav ul {
  list-style: none;
  margin: 0;
  padding: 13px 0px 0px 0px;
}
nav ul li {
  float: left;
  position: relative;
}
nav ul li a,
nav ul li a:visited {
  display: block;
  padding: 0 0px;
  line-height: 5px;
  background: #2e4b90;
  color: #ffffff;
  text-decoration: none;
}


/*--------------nav ul li a, nav ul li a:visited responsive---------*/
 @media screen and (max-width: 360px){
  nav ul li a, nav ul li a:visited{
  display: block !important;
  padding: 0 0px;
  line-height: 5px;
  background: #2e4b90;
  color: #ffffff;
  text-decoration: none;
 
     }   
     }

  @media screen and (max-width: 400px){
    nav ul li a, nav ul li a:visited{
  display: block !important;
  padding: 0 0px;
  line-height: 5px;
  background: #2e4b90;
  color: #ffffff;
  text-decoration: none;
  
     }   
     }

   @media screen and (max-width: 520px){
     nav ul li a, nav ul li a:visited{
  display: block !important;
  padding: 0 0px;
  line-height: 5px;
  background: #2e4b90;
  color: #ffffff;
  text-decoration: none;
  
     }   
     }

    @media screen and (max-width: 640px){
     nav ul li a, nav ul li a:visited{
  display: block !important;
  padding: 0 0px;
  line-height: 5px;
  background: #2e4b90;
  color: #ffffff;
  text-decoration: none;

     }   
     }

     @media screen and (max-width: 768px){
     nav ul li a, nav ul li a:visited{
  display: block !important;
  padding: 0 0px;
  line-height: 5px;
  background: #2e4b90;
  color: #ffffff;
  text-decoration: none;
 
     }   
     }
/*----End nav ul li a, nav ul li a:visited responsive------------- */

nav ul li a:not(:only-child):after,
nav ul li a:visited:not(:only-child):after {
  padding-left: 4px;
 
}
nav ul li ul li {
  min-width: 190px;
}
nav ul li ul li a {
  padding: 10px;
  line-height: 5px;
}

.nav-dropdown {
  position: absolute;
  display: none;
  z-index: 100;
 
}

/* Mobile navigation */
.nav-mobile {
  display: none;
  position: absolute;
  top: 10px;
  right: 30px;
  background:transparent;
  height: 60px;
  width: 80px;
  
  
}

@media only screen and (max-width: 1200px) {
  .nav-mobile {
    display: block;
  }

  nav {
    width: 100%;
    padding: 105px 0 15px;
  }
  nav ul {
    display: none;
  }
  nav ul li {
    float: none;
  }
  nav ul li a {
    padding: 0px;
    
  }
  nav ul li ul li a {
    padding-left: 30px;
  }

  .nav-dropdown {
    position: static;
  }
}



@media screen and (min-width: 800px) {
  .nav-list {
 
 
  }

}
#nav-toggle {
  position: absolute;
  left: 25px;
  top: 22px;
  cursor: pointer;
  padding: 10px 35px 16px 0px;    
}
#nav-toggle span,
#nav-toggle span:before,
#nav-toggle span:after {
  cursor: pointer;
  border-radius: 1px;
  height: 5px;
  width: 35px;
  background: #ffffff;
  position: absolute;
  display: block;
  content: '';
  transition: all 300ms ease-in-out;
}
#nav-toggle span:before {
  top: -10px;
}
#nav-toggle span:after {
  bottom: -10px;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
}


article {
  max-width: 1000px;
  margin: 0 auto;
  padding: 10px;
}

p.test {
    background-color:#2e4b90;
    width:6em;
    border: none;
    text-align:center;
    word-wrap:break-word;
    color: white;  
}
/*--------------p.test responsive---------*/
 @media screen and (max-width: 360px){
     p.test{
    background-color:#2e4b90;
    width:13em;
    border: none;
    text-align:left;
    word-wrap:break-word;
    color: white;  
     }   
     }

  @media screen and (max-width: 400px){
     p.test{
    background-color:#2e4b90;
    width:13em;
    border: none;
    text-align:left;
    word-wrap:break-word;
    color: white; 
     }   
     }

   @media screen and (max-width: 520px){
     p.test{
    background-color:#2e4b90;
    width:13em;
    border: none;
    text-align:left;
    word-wrap:break-word;
    color: white; 
     }   
     }

    @media screen and (max-width: 640px){
     p.test{
    background-color:#2e4b90;
    width:13em;
    border: none;
    text-align:left;
    word-wrap:break-word;
    color: white;  
     }   
     }

     @media screen and (max-width: 768px){
     p.test{
    background-color:#2e4b90;
    width:13em;
    border: none;
    text-align:left;
    word-wrap:break-word;
    color: white; 
     }   
     }
/*----End p.test responsive------------- */
p.testdd {
    width: 13em;
    border: none;
    text-align: center;
    word-wrap: break-word;
    color:white;  
}
p{
	line-height:1em;
}

p.testfoot {
    width: 38em;
    font-family:Verdana;
    font-size:11px;
    color:#ffffff;
    border: none;
    line-height:1.5em;
    word-wrap: break-word;
   
}

p.small {
    line-height: 1.5;
    font-family:Verdana;
	font-size:11px;
	color:#fff;
    padding-top:7px;
    
}

p.small-right-side {
    line-height: 1.5;
    font-family:Verdana;
	font-size:12px;
	color:#fff;
    padding-top:20px;
    
}

/*  GRID OF FIVE   ============================================================================= */




/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.span_5_of_5 {
		width: 100%; 
	}
	.span_4_of_5 {
		width: 100%; 
	}
	.span_3_of_5 {
		width: 100%; 
	}
	.span_2_of_5 {
		width: 100%; 
	}
	.span_1_of_5 {
		width: 100%; 
	}
}


/*  SECTIONS  ============================================================================= */

.section-icon {
	
	padding: 30px 0px 0px 10px;
	
    	
  
   
}

/*  GROUPING  ============================================================================= */


.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float:left;
	
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */


/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}