.sweetpres {
    padding: 50px 50px;
    font-family: 'museo-sans', sans-serif;
}

.sweetpres{
	padding: 2em 50px 0em;
    bafckground: #F8F5F5;
}
 .sweetpres h2{margin-bottom: 25px;
    mfargin-left: -41px;color: #202328;
    text-align: center;
    font-weight: 100; display: block;}
.sweetpres div{
	    text-align: center;
    font-weight: 100;
    font-size: smaller;
    line-height: 1.6em;
}




.sweetpres .circs{
    position: relative;
    margin: 50px auto 0;
    width: 1024px;
            height: 200px;bforder-bottom: 1px solid #3e4147;margin: 0 auto; margin-top: 3em;    margin-left: auto;
                height: auto;
    display: table;
}




.sweetpres .circs a{color: #fbaf43; text-decoration: none;}
.sweetpres .circs > div {
    float: left;
    padding-right: 1%;
    padding-left: 1%;
	padding-bottom: 90px;
    background-repeat: no-repeat;
    width: 21.3333%;
    color: #fbaf43;
    text-align: center;
    background-size: 89%;
    margin-right: 0px;
    border-right: 1px solid #3e4147; 
}
.sweetpres .circs > .circc {border-right: 0px solid #000000;}
.sweetpres .circs > div > div {
    height: 158px;
    width: 158px;
    display: inline-block;
}
.sweetpres .circs p{
	    color: #7d7d7d;
    text-align: center;
    padding-right: 0px;
    font-size: 13px;
    line-height: 18px;
    height: 58px;
}
.sweetpres .circs p strong{
	color: #5db1d9;
    text-align: center;
    display: block;
    font-size: 1.4em;
    font-weight: 100;
    margin-bottom: 1em;
}




	.brandlist_buttons {
	    z-index: 1;
	    position: relative;
	    bottom: -1.8em;
	    display: block;
	    margin: 0 auto;
	    box-sizing: border-box;
	    -webkit-appearance: none;
	    width: 32%;
	    height: 3em;
	    font: 0.6em/2.8em 'museo-sans', sans-serif;
	    text-decoration: none;
	    text-align: center;
	}
	.brandlist_buttons a:nth-of-type(1){float: left}
	.brandlist_buttons a:nth-of-type(2){float: right}
	.brands-list > div .button {
	     position: unset !important; 
	    width: 130px;font: 0.9em/2.8em 'museo-sans', sans-serif;
	}


	.dfeatured p {
		color: #ffffff; margin-bottom: 1em;
	}
	#letushelpyou h2{
		margin-bottom: 25px;
	    color: #202328;
	    text-align: center;
	    font-weight: 100;
	    display: block;
	}
	.sweetpres .circa>div {background-image: url(/wp-content/themes/ethos/img/5.svg);background-repeat: no-repeat;}
	.sweetpres .circb>div {background-image: url(/wp-content/themes/ethos/img/6.svg);background-repeat: no-repeat;}
	.sweetpres .circc>div {background-image: url(/wp-content/themes/ethos/img/7.svg);background-repeat: no-repeat;}


.brand-list .button {
    position: relative;
    display: block;
    margin: 3.5em auto 2em;
    border: 2px solid #FBAF43;
    box-sizing: border-box;
    -webkit-appearance: none;
    width: 13%;
    height: 3em;
    font: 0.8em/2.8em 'museo-sans', sans-serif;
    text-decoration: none;
    color: #409FCD;
    text-align: center;
}

.home-quote > #letushelpyou {
    width: 85%;
}

#letushelpyou #boxes {
	        width: 700px;    margin: auto;
    display: block;
}
#letushelpyou #boxes .abox{
	background-color: #fbaf43; float: left; width: 332px; height: 200px; margin:5px; color: #ffffff;text-align: center;
}
#letushelpyou #boxes .icb,#letushelpyou #boxes .icc{
	background-color:#52aeda;
}
#letushelpyou #boxes .abox>div{ height: 125px;
    width: 125px;
    margin: auto;
    padding-top: 4px;
    margin-top: 19px;}
#letushelpyou #boxes .ica>div {background-image: url(/wp-content/themes/ethos/img/8.svg);background-repeat: no-repeat;}
#letushelpyou #boxes .icb>div {background-image: url(/wp-content/themes/ethos/img/9.svg);background-repeat: no-repeat;}
#letushelpyou #boxes .icc>div {background-image: url(/wp-content/themes/ethos/img/10.svg);background-repeat: no-repeat;}
#letushelpyou #boxes .icd>div {background-image: url(/wp-content/themes/ethos/img/11.svg);background-repeat: no-repeat;}

.floatabox{
	display:none;background-color: rgba(0,0,0,0.8);
    width: 332px;
    height: 200px;
    position: relative;
    z-index: 1;
    margin-left: 5px;
    margin-top: 5px;
    float: left;
    margin-left: -337px;}
.floatabox>div {    margin: 18px;
    font-size: 15px; color: #ffffff;}
.floatabox .button{
	    position: relative;
    display: block;
    margin: 0em auto 0em;
    border: 2px solid #FBAF43;
    box-sizing: border-box;
    -webkit-appearance: none;
    width: 13%;
    height: 3em;
    font: 0.8em/2.8em 'museo-sans', sans-serif;
    text-decoration: none;
    color: #409FCD;
    text-align: center;    margin-top: -8px;
}











@media (max-width: 930px){
	.sweetpres .circs > div > div {
	    width: 77%;
	    tjp: 25%;
	    fojnt-size: 70%;
	    lijne-height: 122%;

    height: 105px;
	}
}



.sweetpres .circa{    margin-left: 14%;}

@media only screen and (max-width: 1081px){
	.sweetpres .circa{    margin-left: 14%;}
}

@media only screen and (max-width: 1024px){

	.sweetpres {
	    padding: 2em 0px 0em !important;
	}
	.sweetpres .circs > div {
		mavrgin-right: 17px !important;
	    puadding-top: 10% !important;
	}
	.sweetpres .circs > div > div img{
		width: 59%;
		height: unset !important;
	}



	.sweetpres .circs p {
	    padding-right: 18px;
	}
	.sweetpres .circs > div > div {
	    thop: 31%;
	    lhine-height: 122%;
    }
	.sweetpres .circs {
	    width: 100%;
	}
	.sweetpres .circa p{top:54% !important;}
	.sweetpres.circb p{top:62% !important;}
	.sweetpres.circc p{top:62% !important;}
	.sweetpres.circd p{top:57% !important;}




}
@media (max-width: 1012px){
	.sweetpres .circs > div > div img{
		margin-top: 5%;
	}
}

/*circles pia....*/
@media (max-width: 990px){

	.sweetpres .circa {
	    margin-left: 12%;
	}
}

@media (max-width: 942px){
	.sweetpres .circs > .cr {
	    width: 22vw;
	}
}
@media (max-width: 875px){
	.floatabox{
	    width: 332px;
	    height: 200px;
	}
	#letushelpyou #boxes .abox{
		width: 332px;
		height: 200px;
	}
	.luhy > #letushelpyou {
	    width: 100%;
	}
	.luhy {
	    padding: 1em 0px 0em;
	}
}
@media (max-width: 875px){
	.sweetpres .circs > div {
    	width: 21.3333% !important;
	}
	.sweetpres {
	    padding: 2em 4% 0em !important;
	}
	.sweetpres .circa {
	    margin-left: 14%;
	}
}
@media (max-width: 850px) {
	.sweetpres .circs > div {
	    width: 22.3333% !important;
	}
	.sweetpres .circa {
	    margin-left: 14% !important;
	}

	.sweetpres .circs > div > div img {
	    margin-top: 17%;
	}
	.sweetpres .circs p strong {
	    margin-bottom: 3px;
	}
	.sweetpres .circs > div > div {
	    font-size: 59%;
	}

}



@media (max-width: 820px) {

	.sweetpres .circa {
	    margin-left: 14% !important;
	}




	.sweetpres .circs {
	    border-bottom: 0px solid #3e4147;    
	    width: 100%;
	}
	.sweetpres h3 {
	    margin-left: 0px;
	}

	.sweetpres .circs p {
	        padding-right: 5px;
    	line-height: 16px;
    font-size: 11px;
	}


}
@media (max-width: 795px) {
	#letushelpyou #boxes {
	    width: 100%;
	    margin-left: 27px;
	}
	#letushelpyou #boxes .abox {
	    width: 75%;
	    height: 200px;
	}
	.floatabox {
	    width: 75%;
	    height: 200px;
	    margin-left: -245px;
	}
	.floatabox>div {
	    font-size: 3vw;
	}
	.sweetpres h2{
		margin: 4px 52px 15px 52px;
	}
	.sweetpres div:first-of-type{
		    width: 90%;
    margin: auto;
    font-size: 11px;
	}
	.home-quote > div {
	    width: 100%;
	}
	.home-quote .image {
    	display: inline;
    }
    .home-quote {
	    text-align: center;
	    padding: 1em 41px 0.8em;
	}
	.home-quote > div .image{
		float: left;
    	width: 72px;
	}
	.home-quote > div .image img{
		width: 100%;
	}
	.home-quote > div .quote {
	    color: #ffffff;
	    width: 66%;
	    font-size: 10px;
	    margin-left: 9px;
	}
}

@media (max-width: 766px) {
	.sweetpres .circs > div > div img {
	    margin-top: 22%;
	}
	.sweetpres .circs > div {
	    margin-right: 12px !important;
	}
	.sweetpres .circs > div {
	    width: 20.3333% !important;
	}
	.sweetpres {
	    padding: 2em 0% 0em !important;
	}
}
@media (max-width: 667px) {
	.sweetpres .circs > div > div img {
	    margin-top: 32%;
	}



}





@media (max-width: 620px) {
	.sweetpres .circs > div {
	        width: 20vw !important;
	}
	.sweetpres .circa {
	    margin-left: 14% !important;
	}
}

@media (max-width: 375px) {
	.sweetpres .circs {
	    margin-left: 9px;
	}
	.sweetpres .circs p {
	    line-height: 15px;
	    font-size: 11px;
	    padding-left: 0px;
	    padding-right: 0px;
	    margin-right: 0px;
	    margin-left: -10px;
	}
	.sweetpres .circs p strong {
	    font-size: 1.1em;
	    letter-spacing: -0.3px;
	}
	.sweetpres .circs > div {
	    margin-left: 2px;
	}
	.sweetpres .circs > div > div {
	    height: 62px !important;
	        margin-left: -9px;
	}
	.sweetpres .circs {
	    height: 264px;
	}

}

/*circles pia....*/

.head-subhead>div,.dfeatured>div {
    width: 65%;
    margin: auto;
}
@media (max-width: 1420px){
	.head-subhead>div {
	    width: 85%;
	    margin: auto;
	    top: 40%;
	}
	.dfeatured>div{
		width: 85%;
	    margin: auto;
	}
}

@media (max-width: 1420px){
	.brandlist_buttons {
	    width: 50%;
	}
}





@media (max-width: 1055px){
	.head-subhead {
	    top: 35% !important;
	}
	
}
@media (max-width: 788px){
	.brandlist_buttons {
	    width: 80%;
	}
}

@media (max-width: 650px){
	.head-subhead {
	    top: 8% !important;
	}
	#header > .wrapper > img {
	    height: 350px !important;
	    margin-top: -127px !important;
	}
	
}




@media (max-width: 537px) {
	.sweetpres .circs > div > div img {
	    margin-top: 40%;
	}
	.sweetpres .circs > div > div {
		height: 87px;
	}
	.brandlist_buttons {
	    width: 95%;
	}

}
@media (max-width: 502px) {
	.sweetpres .circs > div {
	    width: 19vw !important;
	}

}

@media (max-width: 486px) {

	.sweetpres .circs > div > div img {
	    margin-top: 50%;
	}
}
@media (max-width: 480px){
	#header .learn-more, .image-copy .learn-more {
	    display: inline;
	}
	.brands-list > div .button{
		display: inline-block !important;
	    float: unset !important;
	    padding: 8px !important;
	    padding-top: 0 !important;
	    margin-bottom: 6px !important;
	}
	.brands-list > div {
	    width: 96% !important;    margin-bottom: 3em;
	}
}

@media only screen and (max-width: 420px){

	.sweetpres .circs > div > div img {
	    margin-top: 61%;
	}
}


@media (max-width: 399px) {
	.sweetpres .circs > div > div img {
	    margin-top: -36%;
	}
	.sweetpres .circs > div > div img {
	    margin-top: 68%;
	}
}