/*///////  SITE-WIDE /////////*/

html {
height: 100%;
}


body {
text-align:center;
margin:0;
padding:0;
background: #F7F7EF;
background: linear-gradient(#F7F7EF, #EAEAE0);
height: 100%;
background-repeat: no-repeat;
background-attachment: fixed;
}


#body {
margin:0 auto;
text-align:left;
padding-top:155px;
padding-bottom: 160px;
}


body, h1, p {
font-family: "Helvetica Neue", "Segoe UI", Segoe, Helvetica, Arial, "Lucida Grande", sans-serif;
color: #999;
}

body {
font-size: 12px;
}

h1{
font-size: 2.5em;
line-height: .9em;
}


#wrap {
     width: 800px;
     margin: 0 auto;
}










/*///////  LINKS   /////////*/

a:link, a:visited {
color:#C1272D;
}



a:hover {
color:#EBAC38
}



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


header#header {
margin:0 auto;
text-align:left;
font-size:16px;
letter-spacing:2px;
background:  #d11a2e;
z-index: 5;
position: fixed;
top: 0;
height: 154px;
width: 100%;
background: -webkit-linear-gradient(#891724, #d11a2e);
background: -o-linear-gradient(#891724, #d11a2e);
background: -moz-linear-gradient(#891724, #d11a2e);
background: linear-gradient(#891724, #d11a2e);
box-shadow: 0px 4px 5px rgba(121, 117, 106, 0.3);
}


#header a:hover {
color:#C1272D;
text-decoration:underline;
}


.logos {
height: 123px; 
text-align: center;
}

.header_logo {
height: 95%; 
margin-top: 5px;
}

.header_wordmark {
height: 53%;
}







/*///////  NAVIGATION   /////////*/


nav {
position: absolute;
bottom: 0;
height: 24px;
border-bottom: solid 5px white;
border-top: solid 2px white;
width: 100%;
background: #f9bb5f;
}

nav div#wrap {
text-align: center;
}

nav ul#desktop {
list-style-type: none;
margin: 0;
padding-top: 3px;
font-weight: bold;
padding-left: 0px;
}

nav ul#desktop li {
display: inline;
margin-right: 13px;
padding: 0 10px;
border: solid 3px rgba(255, 255, 255, -0.67);
transition: all .2s ease-in-out; 
}

nav ul#desktop li a{
color: #fff;
transition: all .2s ease-in-out; 
text-decoration: none;
}

nav ul#desktop li:hover {
background: rgba(255, 255, 255, 0.33);
border: solid 3px rgba(255, 255, 255, -0.67);
text-decoration: none;
}

nav ul#desktop li a:hover{
color: #C1272D;
text-decoration: none;
}


nav ul#desktop li#active{
background: #fff;
border: solid 3px white;
}


nav ul#desktop li#active a{
color: #f9bb5f;
}



#mobile {
display: none;
}





/*///////  BODY   /////////*/



#body .headline {
text-align:center;
color:#656C64;
font-size:36px;
}

article {
background-color: #FFFFFF;
box-shadow: 0px 1px 1px rgba(121, 117, 106, 0.3);
margin-bottom: 30px;
transition: all .2s ease-in-out; 
color: #999;
padding:5%;
}


/*///////  SOCIAL  /////////*/

section#social {
height: 24px;
width: 40%;
float: right;
background: rgba(153, 153, 153, 0);
text-align: right;
}

section#social ul.social-icon  {
list-style-type: none;
padding: 0;
font-size: 16px;
}

section#social ul.social-icon li {
display: inline;
}

section#social ul.social-icon li a {
color: rgba(153, 153, 153, 0.49);
transition: all .2s ease-in-out;
}


section#social ul.social-icon li.social-icon-facebook a:hover {
color: #3b5998;
}

section#social ul.social-icon li.social-icon-twitter a:hover {
color: #00aced;
}

section#social ul.social-icon li.social-icon-linkedin a:hover {
color: #007bb6;
}

section#social ul.social-icon li.social-icon-stumble a:hover {
color: #EB4923;
}

section#social ul.social-icon li.social-icon-plus a:hover {
color: #dd4b39;
}

section#social ul.social-icon li.social-icon-email a:hover {
color: #00bf8f;
}







/*///////  FOOTER  /////////*/


footer#footer {
width: 100%;
margin: 0 auto;
border-top: 1px solid #CCCCCC;
padding-top: 30px;
background-color: #FFF;
color: #999999;
position: fixed;
bottom: 0;
text-align: center;
height: 67px;
}


@media only screen and (min-width: 525px) {

ul#footer {
list-style-type: none;
padding: 0;
margin: 0;
}

ul#footer li{
display: inline;
}

ul#footer li::after { 
content: "|";
margin:0 11px;
}

ul#footer li#clear{
display:block; 
height:0px;
}

ul#footer li#clear::after{
content: "";
margin:0;
}

ul#footer li#copyright{

}

ul#footer li#address{

}

ul#footer li#address::after { 
content: "";
}

ul#footer li#phone{

}

ul#footer li#fax{

}

ul#footer li#email{

}

ul#footer li#email::after { 
content: "";
}

ul#footer li#credit{
color: rgba(153, 153, 153, 0.4);
}

ul#footer li#credit a{
color: rgba(153, 153, 153, 0.4);
}

ul#footer li#sitemap{
color: rgba(153, 153, 153, 0.4);
}

ul#footer li#sitemap::after { 
content: "";
}

ul#footer li#sitemap a{
color: rgba(153, 153, 153, 0.4);
}

}


/*///////  FORM  /////////*/


label {
    display:block;
    margin-top:20px;
    letter-spacing:2px;
}
form {
    margin:0 auto;
    width:459px;
max-width: 100%;
}


input, textarea {
	width:439px;
max-width: 100%;
	height:27px;
	background:#fff;
	border:1px solid #dedede;
	padding:10px;
	margin-top:3px;
	font-size:0.9em;
	color:#3a3a3a;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}

textarea {
	height:213px;
}

input:focus, textarea:focus {
    border:1px solid #97d6eb;
}


#submit, button {
    width:127px;
    height:38px;
    border:none;
    margin-top:20px;
    cursor:pointer;
float: right;
background: -webkit-linear-gradient(#d11a2e, #891724);
background: -o-linear-gradient(#d11a2e, #891724);
background: -moz-linear-gradient(#d11a2e, #891724);
background: linear-gradient(#d11a2e, #891724);
color: #fff;
}

#submit:hover, button:hover {
	    opacity:.9;
}






/*///////  HOME  /////////*/


div#intro {
font-size: 15px; 
line-height: 23px; 
text-align: left; 
background: url('//homefieldadvantageltd.com/portfolio/heft/web%20jpegs/2.jpg'), 
center no-repeat;
background-size: cover; 
height: 221px;
color: #fff;
overflow: hidden;
}

div#intro div {
background-size: cover;
width: 70%;
height: 100%;
background: -webkit-linear-gradient(rgba(153, 153, 153, 0.79), rgba(44, 44, 44, 0.92));
background: -o-linear-gradient(rgba(153, 153, 153, 0.79), rgba(44, 44, 44, 0.92));
background: -moz-linear-gradient(rgba(153, 153, 153, 0.79), rgba(44, 44, 44, 0.92));
background: linear-gradient(rgba(153, 153, 153, 0.79), rgba(44, 44, 44, 0.92));
padding: 15%;
}






/*///////  PORTFOLIO  /////////*/



.portfolio {
margin-top:70px;
}

.portfolio_entry {
background-color: #FFFFFF;
box-shadow: 0px 1px 1px rgba(121, 117, 106, 0.3);
margin-bottom: 30px !important;
transition: all .2s ease-in-out; 
}

a.block {
    text-decoration: none;
    /* Makes sure the link doesn't get underlined */
    z-index: 10;
    /* raises anchor tag above everything else in div */
    background-color: white;
    /*workaround to make clickable in IE */
    opacity: 1;
    /*workaround to make clickable in IE */
    filter: alpha(opacity=100);
    /*workaround to make clickable in IE */
}


.portfolio_entry .col {
margin: 0 !important;
}

.portfolio_entry img {
width: 100% !important;
margin-bottom: -5px;
}

.portfolio_entry:hover {
box-shadow: 0px 7px 9px rgba(121, 117, 106, 0.3);
}

.portfolio_entry h2 {
border-bottom: 1px solid #999;
}





/*///////  MOBILE  /////////*/


@media only screen and (max-width: 820px) {
#wrap {
     width: 94%;
     margin: 0 3%;
}
}



@media only screen and (max-width: 720px) {
header#header {
height: 114px;
}

.header_logo {
height: auto; 
width: 20%;
}

.header_wordmark {
height: auto;
width: 54%;
}

#body {
padding-top: 85px;
}
}



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

body {
font-size: 17px;
}

footer#footer {
font-size: 12px;
}

h1 {
font-size: 1.5em;
line-height: .9em;
text-align: center;
}

header#header {
position: relative;
}

#body {
padding-top: 50px;
margin-bottom: 50px;
padding-bottom: 0px;
}

footer#footer {
position: relative;
}




#desktop {
display: none;
}

.slicknav_menu {
position: fixed;
z-index: 100;
right: 0;
}


header#header #wrap {
z-index: 94;
}

nav.nav {
z-index: -18;
}


.header_wordmark {
float: left;
margin-top: 20px;
}

.header_logo {
float: left;
}
}



@media only screen and (max-width: 525px) {
form {
margin: 0 auto;
width: 100%;
margin-bottom: 160px;
}
input, textarea {
	width:94%;
}

.header_wordmark {
height: auto;
width: 100%;
margin-top: 16px;
}


.header_logo {
display: block;
width: 31%;
}


div#intro {
height: 271px;
}


/*

*/

footer#footer {
height: 233px !important;
padding: 0 !important;
}

footer div#wrap {
width: 100%;
margin: 0;
}


ul#footer {
list-style-type: none;
padding: 0;
margin: 0;
}

ul#footer li{
display: inline;
padding: 12px 0;
border-top: 1px solid rgba(153, 153, 153, 0.4);
}

ul#footer li#clear{
display: none;
}

ul#footer li#copyright{
display: block;
border-top: 0;
}

ul#footer li#address{
display: block;
border-bottom: 1px solid rgba(153, 153, 153, 0.4);
}

ul#footer li#phone{
display: inline;
width: 49%;
float: left;
border-top: 0px;
}

ul#footer li#fax{
display: inline;
width: 50%;
float: right;
border-left: 1px solid rgba(153, 153, 153, 0.4);
clear: right;
border-top: 0px;
}

ul#footer li#email{
display: block;
clear: left;
}

ul#footer li#credit{
display: block;
color: rgba(153, 153, 153, 0.4);
}

ul#footer li#credit a{
color: rgba(153, 153, 153, 0.4);
}

ul#footer li#sitemap{
display: block;
color: rgba(153, 153, 153, 0.4);
}

ul#footer li#sitemap a{
color: rgba(153, 153, 153, 0.4);
}

}