.span3 img{
margin: 0 15% 50px;
max-width: 70%;
text-align: center;

	
}

#page {
  margin: auto;
  width: 90%;

  
}

.row{
clear: both;
}

.content {
  margin: 0 auto 3.333333333333%; /* 32px / 960px */
  width: 100%; /* 960px / 960px */
  max-width: 960px;
  

}


.span3 {
  width: 208px;	
  margin: 0 12px 0 12px;
  float: left;
}

.span4 {
  width: 288px;	
  margin: 0 12px 0 12px;
  float: left;
}


.span6 {
  width: 450px;	
  margin: 0 12px 0 12px;
  float: left;
	
}

.span12 {
  width: 100%; /* 960px / 960px */
  clear: both;
}

#portfolio .span12 {
  clear: both;
  width: auto;
}


img {
  max-width: 100%;
}

@media screen and (min-width: 641px) and (max-width: 1024px) {
 .content {
  margin: 0 auto 1.25%; /* 4px / 320px */
  width: 97.5%; /* 312px / 320px */
}

.span3{
  width: 21.666666666667%; /* 208px / 960px */	
  margin: 0 1.25% 0 1.25%; /* 12px / 960px */	
  float: left;
  padding-bottom: 12px;
}


.span4{
  width: 30%; /* 288px / 960px */	
  margin: 0 1.25% 0 1.25%; /* 12px / 960px */	
  float: left;
  
}



.span6 {
  width: 46.875%; /* 440px / 960px */	
  margin: 0 1.25% 0 1.25%; /* 12px / 960px */	
  float: left;
}

}

@media screen and (min-width: 0px) and (max-width: 640px) {

.span3 img{
margin: 0 35% 50px;
max-width: 30%;
text-align: center;

	
}

 .content {
  margin: 0 auto 1.25%; /* 4px / 320px */
  width: 97.5%; /* 312px / 320px */
  }
  
  #page {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  width: 100%;
}

.span3,
.span4,
.span6{
  width: 97.5%; /* 312px / 320px */	
  margin: 0 1.25% 0 1.25%; /* 4px / 320px */	

}
.span4{
  padding-bottom: 12px;	

}

.span3{
  margin-bottom: 12px;	

}

.slider p {
	font-size: 18px;
}

.slider {
  height: 100px; /* Update to your slider height */
}

  
.nav {
	  font-size: 12px;
	  margin: 0 1.25% 0 1.25%; /* 4px / 320px */	
	
}