/ color gradient generator /http://angrytools.com/  */

body{
font-family:Arial, Helvetica, sans-serif;
font-size:15pc;
line-height:1.5;
/*   we can write one line sentence as a bbreviation for above 3 sentences as the following*/
 font:15px/1.5 Arial,Helvetica,sans-serif; 
 
 margin:0;
 padding:0;

}

.boxnote{
	 width:350px;
	 height: 20px; 
	  background-color:#FF3737;
		   text-align:center;
	   margin-left:17px;
	    box-shadow: 1px 1px 5px #ECECEC;
	    color: white;
}
.topheader{
background:#35424a;
color:#ffffff;
padding-top: 5px;
padding-bottom:5px;
min-height: 20px;
border-bottom:#e8491d 2px solid ;


}

#top_left{
	display:inline-block;
	margin-top:2px;
	margin-bottom:2px;
	margin-left:5%;
}

#top_right{
	float:right;
	margin-top:2px;
	margin-bottom:2px;
		margin-right:5%;
}

/* header begining with nav*/
/*global */

.container { 
width:90%;
margin:auto;
overflow: hidden;

}
header ul{
	
	margin:0;
	padding: 0;	
}

.button_1{
	height:38px;
	background: #e8491d;
	border:0;
	padding-left:20px;
	padding-right:20px;
	color: #ffffff;
	
}
.dark{
	padding:15px;
	background: #35424a;
	color:#ffffff;
	margin-top:10px;
	margin-bottom:10px;
}

/* Header*/
header {
background:#35424a;
color:#ffffff;
padding-top: 10px;
min-height: 84px;
border-bottom:#e8491d 3px solid ;

width:100%;

}

header a {
	
	color:white;
		font-weight:bold;

	text-decoration:none;
	text-transform: uppercase;
	font-size:16px;	
	transition: 1.3s ease;
	
}

header li {
	
	float: left;
	display:inline;
	padding: 1px 3px 0 44px ;
	
	color:white;
	 

}


header li:hover  {

	  color:#e8491d;
}



header #branding{
	
	float: left;
	margin-top:20px;
	margin-left:60px;

}


#logo{ float:left ;
	display:inline;
	width: 110px;
	height:110px;
	margin-top:1px;
	margin-bottom:1px;
}

header #branding h1{
	margin:0;
	font-size:45px;
}
header nav{
	float :right ;
	margin-top:1px;
	margin-right:1px;

	
	
}
header .highlight,header .current {
	color:#e8491d;
	font-weight:bold;
	
}

header a:hover {
	color: #e8491d;
	font-weight:bold;

	
}

/*    begining of menu */


.topnav {
  overflow: hidden;
  background-color: #333;
  float: right ;
  border-left:2px solid white ;
    border-right:3px solid white ;

    border-radius: 20px 20px 20px 20px ;
    margin-top:30px;
    margin-right:30px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

  
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
   
}

.active {
  background-color: #4CAF50;
  color: white;
}

.topnav .icon {
  display: none;
}

.dropdown {
    float: left;
    overflow: hidden;
}

.dropdown .dropbtn {
    font-size: 17px;    
    border: none;
    outline: none;
    color: white;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    float: none;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: green;

   /*   background-color: #555; */
  color: white;
  border:1px solid green ;
}

.dropdown-content a:hover {
    background-color: green;
    color:white;
    border-top:1px solid white ;
}

.dropdown:hover .dropdown-content {
    display: block;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}



 /* end of menu  */


 
 ul.sub-menu{ 
 color: white;
 list-style-type:none ;
 position: absolute ;
	width:200px;
	padding-left:0px;
	margin-left:-5px;
	padding-top:2px;
	opacity:0; /*mean invisible*/
cursor:pointer;
}
 
cursor:pointer;
}
 
ul.sub-menu li {
color: white;
padding-left:6px;
padding-top:1px;
padding-bottom:1px;

} 

header li:hover .sub-menu {
 opacity:1;
 	

 	}

 ul .sub-menu li:hover{
	
	color:#e8491d;
	
}



/*header end*/

/* banner begining*/
.banner{
		width: 90%;
		height:500px;
		/*border: 1px solid #e8491d;*/
		margin: 0px auto;
		overflow:hidden;
		position:relative;
		
}
      .img{
      margin-left:50px;
		position:absolute;
		width:90%;
		height:500px;
		border-radius:10px;
		animation: mm 22s infinite ;
		-webkit-animation: mm 22s infinite ;
		opacity:0;	
		}
		@keyframes mm{
		15%{opacity:1}
		55%{opacity:0}
	}
        img:nth-child(0){animation-delay: 0s; -webkit-animation-delay: 0s}
		img:nth-child(1){animation-delay: 5s;  -webkit-animation-delay: 5s}
		img:nth-child(2){animation-delay: 10s;  -webkit-animation-delay: 10s}
		img:nth-child(3){animation-delay: 15s;  -webkit-animation-delay: 15s}
		img:nth-child(4){animation-delay: 20s;  -webkit-animation-delay: 20s}

}

/* banner end*/



/*newsletter  begining*/
.container
{
	background-color:#35424a;

}
#newsletter {

	padding:15px;
	color: #ffffff;
	background-color:#35424a;

}

#newsletter h1{
	float:left ;
}

#newsletter form{
	
	float: right;
	margin-top:15px;
}


#newsletter input[type=email] {
	
	padding: 4px;
	height:25px;
	width: 250px;
}

/*newsletter*/
/* boxes */

#boxes {
	
	margin-top:20px;
	
}


#boxes .box{
float: left;
text-align: center;
width:30%;
padding: 10px;

	
}

#boxes .box h3{
	color:#e8491d;
}

#boxes .box img{
width:200px;
	
	
}

/*newsletter  end*/


/*section main id  begining */
/*sidebare*/

aside#sidebar{
	float:right;
	width:30%;
	margin-top:10px;


	
}
aside#sidebar .quote input,aside#sidebar .quote textarea{
	
	width : 90%;
	padding: 0px;

}

/*main col*/

article#main-col{
	
	float: left;
	width: 64%


}
p{
	letter-spacing:0px;
	line-height:25px;
	font-family:Arial, Helvetica, sans-serif;
}
article#main-col h1{ font-size:35px; color:#e8491d;   	

}

/*section main id  end */

  
  /* Contact page  services begining*/
  /* services*/
ul#services li{
    list-style :none ;
	padding:1px;
	border:#cccccc solid 1px;
	
	margin-bottom:5px;
	background: #e6e6e6;
	color:black;
	
	
}
    /* Contact page  services end*/
    
    
    
    /*form begining for send emails*/
    #formwrapper{
 width: 310px;
 height: auto;

 margin-left:40px;
 margin-top:12px;
 margin-bottom:0px;
	
color:white;
}
 #form{
 width: 310px;
 height: auto;
}
fieldset {
	 border: NONE;
	 padding: 10px;
background:#35424a;


}
 h1 {
	font-family:"Trebuchet MS",Helvetical,sans-serif;
	font-size:50px;
 text-align: center;

 
    margin: 0px auto;
} 

label {
	width:250px;
	display:block;
	font-family:"Trebuchet MS",Helvetical,sans-serif;
	font-size:11px;
	
	margin-top:5px;
	margin-right:0px;
	margin-bottom:5px;
	margin-left:0px;
	

}  
 
 input {
	width:250px;
	border:thin solid #6cf;
	margin-bottom:10px;
	
}
textarea {
	width:250px;
	border: thin solid #6cf;
	margin-bottom:10px;
}
.btn{
	width:50px;
	height: 20px;
	font-family:"Trebuchet MS",Helvetical,sans-serif;
	font-weight:bold;
	color:#fff;
	background-color:#6cf;
	margin-left:10px;
	float: left;
}
    /*form end for sending emails*/

  
  
/*foorer begining*/
 /* footer begining*/
footer{ width: 100%;
height: 100px;
	padding:10px;
	margin-top:1px;
	margin-bottom:1px;
	color:#ffffff;
	text-align: center;
	background-color:#e8491d;
	
}
#social-media{float:right;margin:15px 3px 3px 13;}
#social-media p {color:white;margin:13px 1px 5px 13px;  }

#social-media img{width:40px;height:40px; margin:-14px 20px 1px 1px; border-bottom:1px black solid;}

#social-media ul li {display:inline;}

#logo-footer{ float:left ;
	display:inline-block;
	width: 100px;
	height:100px;
	margin-top:0px;
	margin-bottom:0px;
	margin-left:0px;	

}
#logo-footer img{
	width:80px;
	height:80px;

}
#footer_section h3 {
color:#f9f7d1;}
#footer_section h4 {
color:#f9f7d1;
padding-top:1px;}

#footer_section a{
	color: white;
	text-decoration:none;
	
}

#footer-projection img{
	display:inline;
	width: 50%;
	height:90px;
	margin-top:1px;
	margin-bottom:-20px;
	margin-left:0%;	
	float: right;	
}
#footer-projection1 img{
	display:inline;
	width: 50%;
	height:90px;
	margin-top:1px;
	margin-bottom:-20px;
	margin-right:0%;
	
}

/*  footer end */


/* media queries */

@media (max-width:270px){

header #branding,header nav,header nav li,#newsletter h1,#newsletter  form,
#boxes .box,article#main-col,aside#sidebar{
float: none;
text-align: center;
width:100%;

}
header {
	padding-bottom:20px;
}
#showcase{
margin-top:40px;
	
}
#newsletter button, .quote button{
	display:block;
	width: 100%;
}
#newsletter form input[type=email], .quote input, .quote textarea {
	width:100%;
	margin-bottom:5px;
	
	
}

/*following css for social media */



/* end of social media */