html {
    background-color: #fff;
}

body {
    font-family: "museo-sans-rounded",sans-serif;
    font-style: normal;
    font-weight: 100;
    font-size: 16px;
    color: #333333;
}

.container{
	max-width: 960px;
	margin:auto
}

h2, h3{
	padding: 0px;
    margin: 0px;
}

h2{
	font-family: "museo-sans-rounded",sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 36px;
	color:#323232; 
}

h3{
	font-family: "museo-sans-rounded",sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
	color:#323232; 
}

p{color:#b3b3b3; margin: 6px 0px;}

a{
	color:#323232; text-decoration:none; 
}

.alignleft{float:left}
.alignright{float:right}
.aligncenter{display:block;margin-left:auto;margin-right:auto}

.centered{
	padding-top:15%;
}

.content-center{
	text-align:center;
}

.content-center h2{
	padding-top:20px;
}

.row{
	padding-top:20px;
}

.col-1, .col-2{
float:left;
}

.col-1{
	width:65%;
}

.col-2{
	width:25%;
}

.col-1 .icon{
	margin-right: 20px;
    float: left;
}

.col-1 .icontent{
	float:left
}

.col-2 .icon{
	margin-right: 20px;
    float: left;
}

.col-2 .icontent{
	float:left
}

.col-1 .icontent h3, .col-2 .icontent h3{
	margin-top:15px;
}


/*media queries*/
@media screen and (max-width: 768px) {
.col-1 {
    width: 66%; margin-left:2%;
}

.col-2 {
    width: 32%;
}

}


@media screen and (max-width: 767px) {

.centered {
    padding-top: 5%;
}	

.col-1, .col-2{
width:100%;
}

.col-1 {
  margin-left:0px;
}

.col-1 .icontent {
    float: left;
    width: 75%;
}

.centered .row{
	padding:0px 10px;
}

.content-center h2 {
padding-right: 10px;
padding-left: 10px;
padding-bottom: 20px;	
}

.col-1 .icontent h3, .col-2 .icontent h3 {
    margin-top: 10px;
}

}

@media screen and (max-width: 340px) {
.col-1 .icontent {
    float: left;
    width: 70%;
}
}