* {
	margin:0;
	padding:0;
}

body {
  width: 100%;
}


@import 'https://fonts.googleapis.com/css?family=Open+Sans';


h1 {
	font-family: "Lucida Sans Unicode","Lucida Grande", sans-serif;
	font-weight: bold;
	font-size: 30px;
	color: #26252A;
	text-align: center;
}

h2 {
	font-family: "Lucida Sans Unicode","Lucida Grande", sans-serif;
	font-style: normal;
	font-size: 20px;
	color: black;
	text-align: center;
}

h3 {
	font-family: "Lucida Sans Unicode","Lucida Grande", sans-serif;
	font-style: normal;
	font-size: 18px;
	color: black;
	padding: 15px;
}

p {
	font-family: "Lucida Sans Unicode","Lucida Grande", sans-serif;
	font-style: normal;
	font-size: 15px;
	color: black;
	line-height: 20px;
}

header {
	background: #FFF;
	width: 100%;
	height: 86px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	border-bottom: 5px solid #FFF;
}
 
ul {
	list-style: none;
}
 
li {
	display: inline-block;
	float: left;
	padding: 10px
}
 
a {
	color: black;
	text-decoration: none;
}
 
a:hover {
	text-decoration: underline;
}
 
#logo {

	float: left;
	width: 350px;
	height: 100px;
	background: url(images/logo.png) no-repeat center;
	display: block;
}
 
nav {
	float: right;
	padding: 30px 20px 20px 20px;
	font-family: 'Open Sans', sans-serif;
}

.current {
	text-decoration: underline;
}
 
#menu-icon {
	background: url(images/menu-icon.png) no-repeat center;
	display: hidden;
	width: 32px;
	height: 32px;
}
	
@media only screen and (max-width : 1010px) {
 
 header {
 position: absolute;
 }
 
 #menu-icon {
 display:inline-block;
 }
 
 nav ul, nav:active ul{ 
 display: none;
 position: absolute;
 padding: 10px;
 background: #c5c5c5;
 right: 10px;
 top: 65px;
 width: 35%;
 }
 
 nav:hover ul {
 display: block;
 }
 
 nav a li {
 text-align: center;
 width: 100%;
 padding: 5px 0;
 margin: 0;
 }

.banner > .banner-image {
	width: 100%;
	display: block;
	padding: 30px 0 0 0;
}

.responsivesection {
	padding: 30px 0 0 0;
}
}




.banner > .banner-image {
	width: 100%;
	display: block;
}

@media(min-width:640px){

	
	#container-1{
	background-color: #F8F8F8;
	display:flex;
	padding: 10px 10px 10px 10px;
	
	}
	
	#container-2{
		display: flex;
		text-align: center;
	}
	
	#container-3{
	background-color: #F8F8F8;
	display:flex;
	}
	
	#container-5{
	background-color: #F8F8F8;
	display:flex;
	}
	
	#container-6{
	display:flex;
	padding: 10px 10px 10px 10px;
	}
	
	#container-7{
	background-color: #F8F8F8;
	display:flex;
	padding: 10px;
	align-items: center;
	}
	}
	
	
	
	

#container-1 div{
	border: none;
	padding:30px;
	background-color: #F8F8F8;
}

#articleimg {
	width: 100%;
	height: auto;
}

#box-1{
	flex: 1;
	text-align: center;
	padding: 20px;
  
}

#box-2{
	flex: 1;
	text-align: center;
	padding: 20px;
}

#box-3{
	flex: 1;
	text-align: center;
	padding: 20px;
}





#container-2 div{
	font-family: "Lucida Sans Unicode","Lucida Grande", sans-serif;
	font-size: 20px;
	color: #26252A;
}

#box-4 {
	padding: 20px 120px 20px 120px;
}


.donationp {
	line-height: 22px;
	text-align: center;
}

#headingone {
	text-align: center;
	padding: 10px 0 10px 0;
}

button {
	background-color: #2A2A30;
	color: #F8F8F8;
	padding: 15px 30px 15px 30px;
	font-family: "Lucida Sans Unicode","Lucida Grande", sans-serif;
	font-size: 17px;
	border-radius: 15px;
	display: block;
	margin: auto;
}







#container-3 div{
	border: none;
	padding:30px 0 30px 0;
	text-align: center;
	background-color: #F8F8F8;
}

#box-7{
	flex: 1;
	padding: 20px;
}

#box-8{
	flex: 1;
	padding: 20px;
}

#box-9{
	flex: 1;
	padding: 20px;
}

#box-10{
	flex: 1;
	padding: 20px;
}

#articleimg {
	width: 370px;
	height: 220px;
}

.roundimage {
	width: 270px;
	height: 270px;
	border-radius: 100%;
}

#articleheading {
	text-align: center;
	padding: 20px 0 10px 0;
}

.adoptp {
	padding: 0 20px 0 20px;
}







#container-5 div{
	border: none;
	background-color: #F8F8F8;
		padding: 30px 0 30px 0;
}

#box-14{
	flex: 1;
	text-align: center;
}

#box-15{
	flex: 1;
	text-align: center;
}

#box-16{
	flex: 1;
	text-align: center;
}

#box-17{
	flex: 1;
	text-align: center;
}

.teamimage{
	width: 300px;
	height: 300px;
}

#aboutus {
	padding: 0 20px 0 20px;
}

#teamsection{
	padding: 30px 20px 20px 20px;
}






#container-6 div{
	border: none;
	padding:10px;
}

#box-18{
	flex: 1;
	text-align: center;
}

#box-19{
	flex: 1;
	text-align: center;	
}

#box-20{
	flex: 1;
	text-align: center;	
}

#servicetext {
	padding: 10px;
}
#serviceimage{
	width: 60px;
	height: 60px;
}







#container-7 div{
	border: none;
	padding:30px 0 30px 0;
	text-align: center;
	background-color: #F8F8F8;
}

#box-21{
	flex: 1;
	padding: 20px;
}

#box-22{
	flex: 1;
	padding: 20px;
}

#box-23{
	flex: 1;
	padding: 20px;
}

#box-24{
	flex: 1;
	padding: 20px;
}

#hellodogs{
	width: 350px;
	height: 280px;
}

#donationheart {
	width: 42px;
	height: 50px;
	margin: auto;
	display: block;
}






footer {
	background-color: #2A2A30;
	padding: 20px;
}

#container-4{
	display:flex;
	padding: 10px 10px 10px 10px;
	justify-content: center;
}

#container-4 div{
	border: none;
	padding:10px;
	width: 5%;
}

#box-11{
	text-align: center;
}

#box-12{
	text-align: center;
}

#box-13{
	text-align: center;
}

#socialmediaicon{
	width: 40px;
	height: 40px;
}

footer p {
	text-align: center;
	color: #737373
}


