* {
  box-sizing:border-box;
}

body { 
	width:100%;
	margin: 0px;
	font-family: "Open Sans, sans-serif, Lucida Grande, Tahoma, Verdana, Arial, Helvetica, sans-serif";
    background: #FFFFF;
 

}
.header {
  overflow: hidden;
  background-color: #FFFFF;
  padding: 10px 50px;

}
.myheader {
	border-top: 5px solid #003366; padding-bottom:10px;
  width:100%;
  float:left;
  background-color: #000000;
  padding: 50px 30px;
  border-top: 3px;
}


.content {
  padding: 16px;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}

.sticky + .content {
  padding-top: 102px;
}
.header a {
  float: left;
  color: #00000;
  text-align: center;
  padding: 12px;
  text-decoration: none;
  font-size: 15px; 
  line-height: 20px;
  border-radius: 4px;
}
.content a {
 
  color: #3973ac;
  text-align: center;
  padding: 10px 10px 10px 10px;
  text-decoration: none;
  font-size: 15px; 
  line-height: 20px;
  border-radius: 4px;
}
.content a:hover  {
 
  color: #000000;
  text-align: center;
  padding:10px 10px;
  text-decoration: none;
  font-size: 18px; 
  line-height: 20px;
  border-radius: 4px;
}
.header a.logo {
  font-size: 25px;
  font-weight: bold;
}

.header a:hover {
  background-color:#009999;
  color:#FFFFFF;
 letter-spacing:0px;
}

.header a.active {
  background-color:#555;
  color: blue;
}

.header-right {
  float: right;
 background-color:#003366;
  color: #333;
  width:100%;
}

/*   slide code*/

.item-1, 
.item-2, 
.item-3 {
	position: relative;
	display: block;
	top: 0em;
	left: 0px;
	width:800px;
	height:50%;
    font-size: 2em;
	animation-duration: 20s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}

.item-1{
	animation-name: anim-1;
	
}

.item-2{
	animation-name: anim-2;
	
}

.item-3{
	
	animation-name: anim-3;
}

@keyframes anim-1 {
	0%, 8.3% { left: -100%; opacity: 0; }
  8.3%,25% { left: 25%; opacity: 1; }
  33.33%, 100% { left: 110%; opacity: 0; }
}

@keyframes anim-2 {
	0%, 33.33% { left: -100%; opacity: 0; }
  41.63%, 58.29% { left: 25%; opacity: 1; }
  66.66%, 100% { left: 110%; opacity: 0; }
}

@keyframes anim-3 {
	0%, 66.66% { left: -100%; opacity: 0; }
  74.96%, 91.62% { left: 25%; opacity: 1; }
  100% { left: 110%; opacity: 0; }
}

/*END*/

@media screen and (max-width: 500px) {
  
  
  .header a {
    float: none;
    display: block;
    text-align: left;
  }
 
}
ul {
    list-style-type: none;
	font:.6em "Lucida Grande", Tahoma, Verdana, Arial, Helvetica, sans-serif;
    padding: 10px 10px 10px 10px;
    overflow: hidden;
    background-image: url(bg.jpg);
	border-top-right-radius: 0.2em;
	border-top-left-radius: 0.2em;
	border-bottom-right-radius: 0.2em;
	border-bottom-left-radius: 0.2em;
  
}

li {
    float: left;
}

li a {
	font:2em "Lucida Grande", Tahoma, Verdana, Arial, Helvetica, sans-serif;
    display: block;
    color: #000000;
    text-align: center;
    padding: 0px 10px 0px 5px;
    text-decoration: none;
}

li a:hover:not(.active) {
	
    background-color: #uuu;
	color:#000000;
	border-top-right-radius: 0.2em;
	border-top-left-radius: 0.2em;
	border-bottom-right-radius: 0.2em;
	border-bottom-left-radius: 0.2em;
  
}
a, u {
    text-decoration: none;
	color:#FFFFFF;
	
}
a:hover
  {
	 
    color:#005580;
    text-decoration:none;
    cursor:pointer;
   }
.active {
    background-color: #4CAF50;
}
.topcontener 	{
				
				font:.8em "Lucida Grande", Tahoma, Verdana, Arial, Helvetica, sans-serif;
				color: #000000; 
				background-color:#00000; 
				width: 100%;  
				height:auto;
				top:0; 
				right: 0px;
				position: absolute;
				border-bottom-right-radius: 3em;
				border-bottom-left-radius: 3em;	
			}
#headertext{
		padding:0px 2px 0px 0px;
		right: 15px;
		top:1px;
		width:100%;
		color:#FFFFF; font-weight:bold; text-align:right; font-size:12;
		height:10px;
		background: # url(../images/logoepjpg) left no-repeat;
		position: relative;
		
	}
	
.logoheader{
		padding:0px 2px 0px 0px;
		
		width:100%;

		height:10px;
	}
	
.left {
	Color:#105c7f;
  padding:5px 5px 5px 2px;
  float:left;
  width:18%; /* The width is 20%, by default */
  height:auto;
  text-align: center;
  font-family: arial;
  box-shadow: 10px 5px 9px 5px rgba(38, 51, 71);
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
   }

   
.leftinner {
	padding:1px 10px 1px 1px;
  background-color:#66b3ff;
  padding:5px;
  float:left;
  width:100%; /* The width is 20%, by default */
  height:50px;
  text-align: center;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
   }
.main {
	
  padding:5px 2px 5px 5px;
  color:#ffffff;
  background:#009999;
  float:left;
  width:20%; /* The width is 60%, by default */
  height:auto;
 
  box-shadow: 2px 5px 10px  rgba(0.2, 0, 0, 0.2);
  width: 33%;
  margin: 2px;
  text-align: center;
  font-family: arial;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  }
.maincard {
	
  padding:5px 2px 5px 5px;
  color:#ffffff;
  background:#009999;
  float:left;
  width:100%; /* The width is 60%, by default */
  height:auto;
  box-shadow: 2px 5px 10px  rgba(0.2, 0, 0, 0.2);
  margin: 2px;
  text-align: center;
  font-family: arial;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  }
  
.right {
	padding:1px 1px 1px 1px;
  background-color:#00cc99;
  padding:5px;
  float:left;
  width:20%; /* The width is 20%, by default */
  height:50px;
  }
  .left1 {
  background-color:#66b3ff;
  padding:5px;
  float:left;
  width:20%; /* The width is 20%, by default */
  height:50px;
   }

.main1 {
  padding:1px 1px 1px 1px;
  color:#ffffff;
  background-color:#009999;
  padding:5px;
  float:left;
  width:20%; /* The width is 60%, by default */
  height:50px;
  }

.right1 {
  background-color:#00cc99;
  padding:5px;
  float:left;
  width:20%; /* The width is 20%, by default */
  height:50px;
  }
.para{
	
	Color:#105c7f;
}
.innermain {
  background-color:#FFFFFF;
  padding:5px;
  float:left;
  width:100%; /* The width is 60%, by default */
  height:auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  
}
.innerleft {
  background-color:#3380cc;
  padding:5px;
  float:left;
  width:20%; /* The width is 20%, by default */
  height:auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;	
  }
.maininnersub{
  position: relative;
  background-color:#009999;
  padding:5px;
  float:left;
  width:100%; /* The width is 60%, by default */
  height:auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  overflow: hidden;
}
.maininnersub1{
  
  background-color:#FFFFFF;
  padding:5px 5px 5px 1px;
  float:left;
  width:100%; /* The width is 60%, by default */
  height:auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  
}
.testimonial-container {
	
	padding:5px 5px 5px 100px;
  max-width: 100%;
  position: relative;
  margin: auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
}

.innersub{
  background-color:#FFFFFF;
  padding:5px;
  float:left;
  width:60%; /* The width is 60%, by default */
  height:auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  
}
.titlename{
  background-color:#99ccff;
  padding:5px;
  float:left;
  width:100%; /* The width is 60%, by default */
  height:50px;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  
  
}

.innerright {
  background-color:#00cc99;
  padding:5px;
  float:left;
  width:20%; /* The width is 20%, by default */
  border-top-right-radius: 1em;
  border-bottom-right-radius: 1em;
  height:auto;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
  
}
.bottom-right {
	padding:5px 5px 5px 5px;	
    position: absolute;
    bottom: 8px;
    right: 16px;
	}
	

/* Use a media query to add a break point at 800px: */
@media screen and (max-width:800px) {
  .left, .main, .right {
    width:100%; /* The width is 100%, when the viewport is 800px or smaller */
  }
}
.container {
  background-color:#;
  padding: 10px 10px 10px 10px;
  float:left;
  width:100%; /* The width is 60%, by default */
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
}
.dashed-box { 
  position: relative;
 
  border: solid;
  height: auto;
  margin-bottom: 1em;
  margin-top: 2em;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
}
.gold-box { 
  background-color:#FFFFFF;
  position: absolute;
  z-index: ; /* put .gold-box above .green-box and .dashed-box */
  width: 80%;
  height:auto;
  left: 85px;
  top: 2em;
}
.green-box { 
  position: absolute;
  /* put .green-box above .dashed-box */
  background: lightgreen;
  width: 20%;
  left: 65%;
  top: -25px;
  height: 7em;
  opacity: 0.9;
}


.col-container {
	border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
	background-color: #FFFFFF;
    display: table;
    width: 100%;
}
.col {
    display: table-cell;
    padding: 10px;
	 width: 100%;
}
.card {
	float:left;
  box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.2);
  width: 55%;
  margin: auto;
  text-align: center;
  font-family: arial;
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-bottom-right-radius: 1em;
  border-bottom-left-radius: 1em;
}
.img-responsive {
	width: 100%;
	vertical-align: middle;
    background: url(yourUrl);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center; 
}
