*{margin:0 0 0 0;
padding:0 0 0 0}
body{
max-width:1280px;
margin:0 auto;
font-family: Roboto , Arial, verdana, tahoma, sans-serif;
font-size:20px;
font-style:normal;
font-weight:normal;
color:#000;
background:#f9f9f9}


header{
	width:90%;
	float:left;
	padding: 2% 5% 0 5%;
	background:linear-gradient(to bottom , #000000, #ffffff);
	box-shadow: none }

/*For nav see navbar1.css*/

div.main{
	width:60%;
	padding:0 5%;
   background: #fff;
	}
footer{
	width:96%;
   background:linear-gradient(to top , #000000, #ffffff);
	/*background:#0066cc;*/
	float:left;
   padding: 0 2% 2% 2%;
	}

/*Define Text*/
header p {
font-size: 36px;
margin: 2% 0 0 5%;
color: #fff;
line-height: 100%;
font-weight : bold;
text-indent: 0px;
text-shadow: 1px 1px 1px #000;}

.slogan {
font-size: 28px;
font-style: oblique;
color: #0e0e0e;
font-weight: 200;
line-height: 100%;
text-indent:0px;
text-shadow :none}

div.main h1{
	font-size:24px;
	text-align:center;
	color:#0066cc;
	margin:1% 0}

div.main h2{
font-size:22px;
text-align:center;
color:#0066cc;
margin:1% 0}

div.main p {
font-size: 20px;
text-align:left;
text-indent:0px;
margin:1% 0}

div.main p.clear{font-size: 16px; clear:both}

footer p, footer p a {
font-size : 18px;
text-align:center;
color:#000;
text-shadow: none;
padding:0 0}

/*Define Images*/
.image1,.image2,.image3,.image4,.image5 {
max-width: 100%;	
margin: 1% 1%;
box-shadow:2px 2px 4px #000;
float:right}


.image2,.image3,.image4,.image5 {display:none}

/*Begin Media Queries*/


@media (max-width:1024px){
	.main h1{font-size:30px}
    .main h2 , .right h2 {font-size:22px}
.image1,.image3,.image4,.image5 {display:none}
	.image2 {display:block}
}

@media (max-width:1000px) {

header p {
display : block;
float:none; 
margin:2% auto 0 auto;
font-size:32px;
text-align: center;
}
.slogan {
display : block;
float:none; 
margin:0 auto;
font-size:24px;}

}
	
@media (max-width:850px) {
		.image1 , .image2, .image4 , .image5 {display:none}
		.image3 {display:block}
}

@media (max-width:768px) {
	div.main h1{font-size:22px}
	div.main h2{font-size:18px}
   div.main p {font-size: 18px}
.image1 , .image2, .image3 , .image5 {display:none}
		.image4 {display:block}
}

@media (max-width:720px) {
	div.main h1{font-size:20px}

.image1 , .image2, .image3 , .image4 {display:none}
		.image5 {display:block}
}

	
@media (max-width: 500px) {
	header {
      width:100% ;
      
		padding: 2% 0 0 0;
		margin:0 auto}


   div.main {
		width:96% ;
      
		padding:0 2%;
		margin:0 auto }

	footer {width:96%; padding : 0 2% 2% 2%}
	footer p {font-size: 16px}	
	header p {font-size:24px}
	.slogan{font-size:18px;}
	div.main h1 , div.main h2 {font-size:18px; font-weight: normal;}
		
	.image5 , .image2, .image3 , .image4 {display:none}
		
		.image1 {
			float:none;
			display:block;
         max-width:100%;
         box-shadow: none;
         margin:2% auto;}
}