body{
	margin:0px;
	font: 400 12px/22px 'Lato', sans-serif;
	color:#222222;
}
h1{font: 600 38px/60px 'Lato', sans-serif; color:#3b3b3b; text-transform: uppercase}
h2{font: 600 18px/22px 'Lato', sans-serif; color:#3b3b3b; text-transform: uppercase}
h3{font: 600 14px/16px 'Lato', sans-serif; color:#3b3b3b; text-transform: uppercase}
ul{margin:0px; padding:0px;}
a {text-decoration:none; color:#e74f40;}
a:hover {color:#979797;}
a img{border:0px;}

@media (max-width: 375px) {
  h1 {
    font: 400 44px/30px 'Lato', sans-serif; color:#3b3b3b;
  }
}

#container{
	box-sizing: border-box;
	max-width:960px;
	margin:0px auto 30px auto;
	padding-bottom:100px;
}

/****************************************************/
/* HEADER */
/****************************************************/

#header{

	width:100%;
	height:40px;
	background-color:#3b3b3b;
	padding:20px;
	position:fixed;
	top:0px;
	left: 0px;
	margin: 0 0 0 0px;
	-webkit-box-shadow: 0px 0px 8px 0px #000000;
	-moz-box-shadow: 0px 0px 8px 0px #000000;
	box-shadow: 0px 0px 8px 0px #000000;
	background-color: rgba(1, 0, 0, 0.70);
	color: rgba(1, 0, 0, 0.8);
}

#header #main-menu{
	position:relative;
	width:auto;
	display:inline-block;
	padding-top:20px;}
#header #main-menu li{
	display:inline-block;
	list-style:none;
	margin-left:27px;
	font: 400 16px/20px 'Lato', sans-serif ;

}

/****************************************************/
/* ABOUT SECTION */
/****************************************************/

#about{
	margin:0px 43px; padding-top:115px;}
#about h1{float:left;}
#about #top-social{float:right; padding-top:62px;}
@media (max-width: 375px) {
  #about #top-social {
		float:right; padding-top:34px;
	}
}
#about #top-social li{float:left; list-style:none; margin-left:10px;}
#about #top-social .facebook{
	text-indent:-9999px;
	display:block;
	width:26px;
	height:26px;
	background:url(images/sm-facebook-icon.png) no-repeat;
}
#about #top-social .twitter{
	text-indent:-9999px;
	display:block;
	width:31px;
	height:24px;
	background:url(images/sm-twitter-icon.png) no-repeat;
}
#about #top-social .linkedin{
	text-indent:-9999px;
	display:block;
	width:26px;
	height:26px;
	background:url(images/sm-linkedin-icon.png) no-repeat;
}

#about .content img{
	display:inline-block;
	width:270px;
	/* float:left; */
	margin-right:35px;
	margin-bottom:20px;
	border:5px solid #3b3b3b;}
#about .content #service-icons{margin-top:20px;}
#about .content #service-icons li{
	display:inline-block;
	width:108px;
	height:108px;
	list-style:none;
	/* float:left; */
	margin:10px;
}
@media (max-width: 375px) {
  #about .content #service-icons li {
    width:70px;
		height:70px;
		background-size:100%;
  }
}
#about .content #service-icons li.services-design{
	background:url(images/icon-1.png) no-repeat;
background-size:contain;}
#about .content #service-icons li.services-mobile{background:url(images/icon-2.png) no-repeat; background-size:contain;}
#about .content #service-icons li.services-film{background:url(images/icon-3.png) no-repeat; background-size:contain;}
#about .content #service-icons li.services-photo{background:url(images/icon-4.png) no-repeat; background-size:contain;}

/****************************************************/
/* EXPERIENCE SECTION */
/****************************************************/

#experience{


	margin:0px 35px 0 35px;
	padding-top:115px;}
#experience .col{
	box-sizing: border-box;
	width:100%;
	display:inline-block;
	margin: 15px;}
	@media (max-width: 375px) {
	  #experience .col {
	    width: 100%;
			margin-right:auto;
			margin-left:auto;
	  }
	}
#experience .content{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
		display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
		display: -ms-flexbox;      /* TWEENER - IE 10 */
		display: -webkit-flex;     /* NEW - Chrome */
		display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
		flex-wrap: wrap;
		justify-content: center;
	width:100%;

}
#experience .col-mid{margin:0px 65px;}

/****************************************************/
/* WORK SECTION */
/****************************************************/

#work{margin:0px 43px; padding-top:115px;}
#work .content{

	width:100%;
}
#work #work-thumbs{
	text-align: center;
}

#work #work-thumbs li{
	display:inline-block;
	list-style:none;
	margin:0px 20px 15px 0px;
	padding:0px;
}


/****************************************************/
/* CONNECT SECTION */
/****************************************************/
#connect{
	margin:0px 35px 0 35px;
	padding-top:115px;}

#form{
	box-sizing: border-box;
	width:100%;
	float:left;
	margin-bottom: 15px
}
#form span{
	display:block;
	float:left;
	padding-top:5px;
	font: 400 14px/16px 'Lato',sans-serif;
}
#form input{
	float:left;
	width:100%;
	border:0px;
	color:#3b3b3b;
	padding:10px 10px 10px 30px;
	font: 400 11px/20px 'Lato', sans-serif;
	margin-bottom:10px;
}
#form textarea{
	float:left;
	border:0px;
	width:100%;
	height:100px;
	padding:10px 10px 10px 30px;
	font: 400 11px/20px 'Lato', sans-serif;
	color:#222222;
}

#form input.name{
	box-sizing: border-box;
	width:100%;
	background:#ffffff url(images/icon-user.png) no-repeat 10px 8px;
	border:#999 solid 1px;}
#form input.email{
	box-sizing: border-box;
	width:100%;
	background:#ffffff url(images/icon-mail.png) no-repeat 10px 9px; border:#999 solid 1px;}
#form textarea.message{
	box-sizing: border-box;
	width:100%;
	background:#ffffff url(images/icon-message.png) no-repeat 10px 8px; border:#999 solid 1px;}
#form input.submit{
	width:30%;
	height:30px;
	float:right;
	padding:5px 0px 5px 0px;
	margin:10px 0px 0px 0px;
	background:#ffffff;
	color:#3b3b3b;
	font: 400 14px/16px 'Lato', sans-serif;
	border:#999 solid 1px;
}

#social-footer{
	text-align: center;
	width:100%;
	margin:5px 5px 15px 5px;
}
#social-footer #sm-links{
	display: flex;
	justify-content: center;
	margin-top:25px;
}
#social-footer #sm-links li{
	list-style:none;
	float:left;
}
#social-footer #sm-links li a{
	display:block;
	text-indent:-9999px;
	width:26px;
	height:26px;
	margin-right:10px;
}
#social-footer #sm-links li a.facebook{background:url(images/sm-facebook-icon.png) no-repeat;}
#social-footer #sm-links li a.twitter{background:url(images/sm-twitter-icon.png) no-repeat; width:31px;}
#social-footer #sm-links li a.dribble{background:url(images/sm-dribble-icon.png) no-repeat;}
#social-footer #sm-links li a.vimeo{background:url(images/sm-vimeo-icon.png) no-repeat; width:27px;}
#social-footer #sm-links li a.google{background:url(images/sm-google-icon.png) no-repeat;}
#social-footer #sm-links li a.youtube{background:url(images/sm-youtube-icon.png) no-repeat; width:28px;}
#social-footer #sm-links li a.linkedin{background:url(images/sm-linkedin-icon.png) no-repeat;}

.row > footer {
	padding:25px;
}

.copyright{
	padding:25px;
	text-align: center;
	color:rgb(215, 213, 213);
	background-color:rgb(153, 153, 153);
}

/****************************************************/
/* MISC */
/****************************************************/
.top-divider, .bottom-divider{
	border: 3px solid grey;
}

.bottom-divider{
	border: 1px solid grey;
}
.top-divider{margin-bottom:40px;}
.bottom-divider{margin-top:40px;}
