* {
  -moz-appearance: none;
  -moz-border-radius: 0;
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  margin: 0;
  padding: 0; 
  }

.cf {
  zoom: 1; 
  }

.cf:after,.cf:before {
  content: ' ';
  display: table; 
  }

.cf:after {
  clear: both; 
  }

a:link,a:visited {
  color: inherit; 
  }

a:hover,a:active {
  outline: 0; 
  }

a:focus {
  outline: thin dotted; 
  }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%; 
  }

img {
  border-style: none;
  vertical-align: bottom; 
  }

fieldset {
  border-style: none;
  }

html, body {
  height: 100%;
  }

body {
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  background-color: #f8f8f8;
  font: normal normal 62.5%/1em 'Source Sans Pro', sans-serif;
  font-size: 62.5%;
  }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
  }

audio, canvas, video {
  display: inline-block; 
  }

a:link,a,a:hover,a:active{
	outline:none;
	}

#no-script{
	background-color:#212328;
	color:#80807e;
	display:none;
	left:0;
	height:130px;
	position:fixed;
	top:0;
	width:100%;
	z-index:10000
	}
	
#no-script div{
	font-size:14px;
	font-weight:300;
	line-height:1em;
	padding:60px;
	text-align:left;
	width:100%;
	}
	
#no-script a{
	color:#fff;
	text-decoration:underline;
	}
	
#no-script a:active,#no-script a:hover{
	color:#80807e;
	text-decoration:none;
	}
	
.no-js #no-script{
	display:block;
	}
	
.no-js body{
	margin-top:75px;
	}
	
#container{
	min-height:100%;
	position:relative;
	}
	
section#content{
	padding-bottom:30px;
	}
	
section#content .strong{
	color:#212328;
	}
	
section#content header{
	padding:0 60px 60px;
	}
	
section#content #pfd{
	padding:55px 0 35px 0;
	}
	
section#content #pfd img{
	height:42px;
	width:210px
	}

section#content #preamble,section#content article{
	max-width:1200px;
	}
	
section#content #preamble h1,section#content article h1{
	color:#212328;
	font:300 19px/1.2em Source Sans Pro,sans-serif;
	line-height:150%;
	padding-bottom:1em;
	}
	
section#content #preamble h2,section#content article h2{
	color:#80807e;font:300 16px/1.8em Source Sans Pro,sans-serif;
	padding-bottom:1.0em;
	}
	
section#content #preamble h3,section#content article h3{
	color:#212328;font:300 15px/1.4em Source Sans Pro,sans-serif,sans-serif
	}
	
section#content #preamble p,section#content article p{
	color:#80807e;
	font:300 16px/1.2em Source Sans Pro,sans-serif;
	padding-bottom:1em
	}
	
section#content #preamble p.space-after,section#content article p.space-after{
	padding-bottom:50px;
	}
	
section#content #preamble .em,section#content article .em{
	color:#80807e;
	font:300 18px/1.2em Source Sans Pro,sans-serif;
	padding-bottom:1em
	}
	
section#content #preamble a,section#content article a{
	border-bottom:1px dotted #80807e;
	color:#80807e;
	text-decoration:none;
	}
	
section#content #preamble a:hover,section#content article a:hover{
	border-bottom-color:#d04f14;
	color:#d04f14;
	}
	
section#content #preamble.home h1{
	color:#80807e;
	}
	
section#content #our-work{
	zoom:1
	}
	
section#content #our-work:after,section#content #our-work:before{
	content:' ';
	display:table
	}
	
section#content #our-work:after{
	clear:both
	}
	
section#content #our-work{
	margin-bottom:0
	}
	
section#content #our-work ul{
	list-style:none
	}
	
section#content #our-work ul li{
	display:block;
	float:left;
	height:359px;
	width:449px;
	position:relative
	}
	
section#content #our-work ul li a{
	text-decoration:none
	}
	
section#content #our-work ul li img{
	width:100%
	}
	
section#content #our-work ul li .overlay{
	background-color:rgba(248,129,75,.9);
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
	opacity:0;
	-webkit-transition:all .4s ease-in-out;
	-moz-transition:all .4s ease-in-out;
	-o-transition:all .4s ease-in-out;
	-ms-transition:all .4s ease-in-out;
	transition:all .4s ease-in-out
	}
	
section#content #our-work ul li .overlay:hover{
	background-color:rgba(248,129,75,.9);
	height:100%;
	left:0;
	position:absolute;
	top:0;
	width:100%;
	opacity:1;
	-webkit-transition:all .4s ease-in-out;
	-moz-transition:all .4s ease-in-out;
	-o-transition:all .4s ease-in-out;
	-ms-transition:all .4s ease-in-out;
	transition:all .4s ease-in-out
	}
	
section#content #our-work ul li .overlay summary{
	bottom:30px;
	left:60px;
	padding-right:30px;
	position:absolute
	}
	
section#content #our-work ul li .overlay summary h2{
	background:url(../images/pfd-sprites.png) no-repeat left bottom;
	color:#fff;
	font:400 20px/1em Source Sans Pro,sans-serif;
	padding-bottom:15px
	}
	
section#content #our-work ul li .overlay summary h3{
	color:#fff;
	font:300 16px/1em Source Sans Pro,sans-serif;
	padding-top:12px
	}
	
section#content #our-work ul li .overlay .loves{
	-moz-borderradius:40px;
	-webkit-borderradius:40px;
	background-color:#fff;
	border-radius:40px;
	height:80px;
	position:absolute;
	right:60px;
	text-align:center;
	top:60px;
	width:80px
	}
	
section#content #our-work ul li .overlay .loves span{
	background:transparent url(../images/pfd-sprites.png) no-repeat right -121px;
	color:#ed7b47;
	font:300 15px/1.4em Source Sans Pro,sans-serif;
	line-height:80px;
	padding-right:25px
	}
	
section#content #pfd-work{
	position:relative;
	zoom:1
	}
	
section#content #pfd-work footer{
	bottom:-80px;
	padding:50px 60px 0;
	position:absolute;
	right:0
	}
	
section#content #pfd-work footer #other-projects{
	float:right;
	list-style:none
	}
	
section#content #pfd-work footer #other-projects li{
	float:left;
	margin-left:12px
	}
	
section#content #pfd-work footer #other-projects a{
	background:#f8f8f8 url(../images/pfd-sprites.png) no-repeat;
	display:block;
	height:30px;
	text-indent:-8000px;
	width:34px
	}
	
section#content #pfd-work footer #other-projects a.previous-work{
	background-position:0 -30px
	}
	
section#content #pfd-work footer #other-projects a.next-work{
	background-position:0 -60px
	}
	
section#content #pfd-work:after,section#content #pfd-work:before{
	content:' ';
	display:table
	}
	
section#content #pfd-work:after{
	clear:both
	}
	
section#content #work-bio{
	left:0;
	position:fixed;
	top:0;
	width:40%
	}
	
section#content #work-bio #preamble h1{
	line-height:1em;
	padding-bottom:0
	}
	
section#content #work-bio #preamble h2,section#content #work-bio #preamble p.space-after{
	padding-bottom:50px
	}
	
section#content #work-bio #links{
	height:80px;
	list-style:none;
	margin:40px 0
	}
	
section#content #work-bio #links li{
	float:left;
	margin-right:40px
	}
	
section#content #work-bio #links #ilovethis{
	-moz-borderradius:40px;
	-webkit-borderradius:40px;
	background-color:#d04f14;
	border-radius:40px;
	cursor:pointer;
	display:block;
	height:80px;
	text-align:center;
	width:80px
	}
	
section#content #work-bio #links #ilovethis span{
	background:transparent url(../images/pfd-sprites.png) no-repeat right -201px;
	color:#fff;
	font:300 15px/1.4em Source Sans Pro,sans-serif;
	line-height:80px;
	padding-right:25px
	}
	
section#content #work-bio #links #ilovethis.unloved,section#content #work-bio #links #ilovethis:hover{
	background:#212328 url(../images/pfd-sprites.png) no-repeat 10px -170px
	}
	
section#content #work-bio #links #ilovethis.unloved span,section#content #work-bio #links #ilovethis:hover span{
	display:none
	}
	
section#content #work-bio #links #ilovethis.loved:hover{
	background-image:none
	}
	
section#content #work-bio #links #ilovethis.loved:hover span{
	display:inline
	}
	
section#content #work-bio #links #home{
	-moz-borderradius:40px;
	-webkit-borderradius:40px;
	background:#d04f14 url(../images/pfd-sprites.png) no-repeat 50% -250px;
	border-radius:40px;
	cursor:pointer;
	display:block;
	height:80px;
	text-indent:-8000px;
	width:80px
	}
	
section#content #work-visuals{
	float:right;
	width:60%
	}
	
section#content #work-visuals ul{
	list-style:none
	}
	
section#content #work-visuals ul li{
	line-height:0;
	margin-bottom:10px
	}
	
section#content #work-visuals ul li img{
	width:100%
	}
	
section#content #preamble a.read-more{
	border-style:none;
	color:#212328;
	font:300 16px/1.4em Source Sans Pro,sans-serif;
	text-decoration:none
	}
	
section#content #preamble a.read-more:hover{
	color:#80807e;
	}
	
section #what-we-do header{
	background:transparent url(../images/grass.jpg) no-repeat 50% top fixed;
	padding:0 60px
	}
	
section#content #what-we-do header #preamble{
	padding-bottom:60px
	}
	
section #what-we-do article{
	padding:120px 60px
	}
	
section #what-we-do article h2{
	color:#212328;
	font:300 22px/1.2em Source Sans Pro,sans-serif
	}
	
section#content footer#msf{
	bottom:0;
	left:0;
	position:absolute;
	width:100%
	}

#botao-home {
	padding-top:25px;
	}

footer#msf .wrapper{
	border-top:1px solid #e4e4e4;
	height:73px;
	margin:0 60px
	}
	
footer#msf ul#lets-be-social{
	float:left;
	width:230px;
	list-style:none;
	}
	
footer li {
	list-style-type: none;
	float: left;
	padding-right: 10px;
	
}

footer {
	padding-left: 50px;
	
}
	
footer#msf ul#lets-be-social li{
	float:left;
	padding-right:8px
	}
	
footer#msf div#legal{
	float:left;
	font:400 15px/1em Source Sans Pro,sans-serif;
	text-align:left;
	width:400px;
	padding-bottom:60px;
	}
	
footer#msf div#legal span{
	padding-right:72px
	}
	
footer#msf li a,footer#msf span{
	line-height:73px
	}
	
footer#msf #legal span{
	line-height:20px;
	margin-top:20px;
	display:block;
	}
	
footer#msf a{
	font:300 14px Source Sans Pro,sans-serif;
	text-decoration:none
	}
	
footer#msf a:hover{
	color:#80807e
	}

footer#msf p{
	font:300 19px/1.2em Source Sans Pro,sans-serif;	
	color:#80807e;
	padding-top: 50px;
}	

	

@media screen and (max-width:1200px){
footer#msf .wrapper{
		margin:0 30px
		}
		
section#content header{
	padding:0 30px 60px
	}
	
section#content #pfd{
	padding-top:30px
	}
	
section#content #our-work ul li .overlay summary{
	left:30px
	}
	
section#content #our-work ul li .overlay .loves{
	right:30px;
	top:30px
	}
	
section#content #pfd-work footer{
	padding:50px 30px 0
	}
	
	
}	




@media screen and (max-width:768px){
section#content #work-bio{
	float:none;
	position:relative;
	width:auto
	}
	
section#content #work-visuals{
	float:none;
	width:auto
	}
	
section#content #pfd-work #links{
	display:none
	}
	
section#content #what-we-do section{
	height:auto!important
	}
	
section#content #what-we-do section article{
	padding:60px 30px
	}
	
section#content #what-we-do #web-design .parallax{
	background:#ededeb url(/images/web-development-sm.jpg) no-repeat 50% 0!important;
	height:460px
	}
	
section#content #what-we-do #identity{
	border-bottom:none
	}
	
section#content #what-we-do #identity article{
	padding:60px 30px
	}
	
section#content #pfd-about #example-photographs li,section#content #what-we-do #photography #example-photographs li{
	width:100%!important
	}
	
section#content p.em{
	font:300 18px/1.4em Source Sans Pro,sans-serif!important
	}
}


@media screen and (max-width:460px){
section#content{
	padding-bottom:30px
	}
	
section#content #what-we-do #photography #example-photographs li{
	min-height:50px
	}
	
footer#msf .wrapper{
	padding:20px 0
	}
	
footer#msf 
ul #lets-be-social{
	float:none;
	width:auto;
	zoom:1
	}
	
footer#msf 
ul#lets-be-social:after,footer#msf ul#lets-be-social:before{
	content:' ';
	display:table
	}
	
footer#msf
ul#lets-be-social:after{
	clear:both
	}
	
footer#msf div#legal{
	float:none;
	width:auto
	}
	
footer#msf div#legal span{
	display:block;
	padding-left:0;
	text-align:left
	}
	
footer#msf li a,footer#msf span{
	line-height:2em
	}