/* ==============================
   Typography
   ============================== */

body{
    color: #111;
    font-size: 16px;
    font-family: "HelveticaNeue-Regular", "Helvetica Neue Regular", "Helvetica Neue", 
  Helvetica, Arial, "Lucida Grande", sans-serif;
    line-height: 1.7;    
    -webkit-font-smoothing: antialiased;
}

a{
    color: #e91e63;
    text-decoration: none;
}
a:hover{
    color: #e91e63;
    text-decoration: underline;
}

h1,h2,h3,h4,h5,h6{
    margin-bottom: 1.3em;
    line-height: 1.4;
    font-weight: 400;
    font-family: "HelveticaNeue-Thin", "Helvetica Neue Thin", "Helvetica Neue", 
  Helvetica, Arial, "Lucida Grande", sans-serif;
   
}
h1{
    font-size: 38px;
}
h2{
    font-size: 34px;
}
h3{
    font-size: 30px;
}
h4{
    font-size: 26px;
}
h5{
    font-size: 22px;
}
h6{
    font-size: 18px;
    font-weight: 700;
}
p{
    margin: 0 0 2em 0;
}
ul, ol{
    margin: 0 0 1.5em 0;
}
blockquote{
    margin: 3em 0 3em 0;
    padding: 0;
    border: none;
    background: none;
    font-style: normal;
    line-height: 1.7;
    color: #777;
}
blockquote p{
    margin-bottom: 1em;
    font-size: 24px;
    font-weight: 300;
    font-style: normal;
    line-height: 1.6;
}
blockquote footer{    
    font-size: 11px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
}
dl dt{
    margin-bottom: 5px;
}
dl dd{
    margin-bottom: 15px;
}
pre{
    background-color: #f9f9f9;
    border-color: #ddd;

}
hr{
    background-color: rgba(255,255,255, .08);
}
hr.white{
    border-color: rgba(255,255,255, .35);
    background: rgba(255,255,255, .35);
}
hr.black{
    border-color:rgba(0,0,0, .85);
    background: rgba(0,0,0, .85);
}
.uppercase{
    text-transform: uppercase;
    letter-spacing: 1px;
}

.serif{
    font-family: "Times New Roman", Times, serif;
    font-style: italic;
    font-weight: normal;
}
.normal{
    font-weight: normal;
}
.strong{
    font-weight: 700 !important;
}
.lead{
    margin: 1em 0 2em 0;
    font-size: 140%;
    line-height: 1.6;
}
.text{        
    font-size: 16px;
    font-weight: 300;
    color: #5f5f5f;
    line-height: 1.8;
}
.text h1,
.text h2,
.text h3,
.text h4,
.text h5,
.text h6{
    color: #111;
}


.big-icon{
    display: block;
    width: 90px;
    height: 90px;
    margin: 0 auto 20px;
    border: 3px solid rgba(255,255,255, .93);
    text-align: center;
    line-height: 88px;
    font-size: 32px;
    color: rgba(255,255,255, .93);
    
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    
    -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.big-icon .fa-play{
    position: relative;
    left: 4px;
}
.big-icon.big-icon-rs{
    border: none;
    width: auto;
    height: auto;
    font-size: 96px;
}

.big-icon-link,
.big-icon-link:focus{
    display: inline-block;
    text-decoration: none;
}
.big-icon-link:hover{
    border-color: transparent !important;
}
.big-icon-link:hover .big-icon{
    border-color: #fff;
    color: #fff;
    
    -webkit-transition: 0 none !important;  
    -moz-transition: 0 none !important;  
     -ms-transition: 0 none !important;
    -o-transition: 0 none !important;    
    transition:0 none !important;  
}
.big-icon-link:active .big-icon{
    -webkit-transform: scale(0.99);
    -moz-transform: scale(0.99);
    -o-transform: scale(0.99);
    -ms-transform: scale(0.99);
    transform: scale(0.99);
}

.wide-heading{
    display: block;
    margin-bottom: 0;
    font-size: 48px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    color: rgba(255,255,255, .93);
    -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);  
    -moz-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
    -ms-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); 
    transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}

.big-icon-link:hover,
.big-icon-link:hover .wide-heading{
    color: #fff;
    text-decoration: none;
}
.sub-heading{
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    line-height: 1.3;
    opacity: .9;
}

.big-icon.black{
    color: #000;
    border-color: rgba(0,0,0, .95);
}
.big-icon-link:hover .big-icon.black{
    color: #000;
    border-color: #000;
}
.wide-heading.black{
    color: rgba(0,0,0, .9);
}
.big-icon-link.black:hover,
.big-icon-link:hover .wide-heading.black{
    color: #000;
    text-decoration: none;
}
.sub-heading.black{
    color: rgba(0,0,0, .85);
}


/* HOMEPAGE BOTTOM MENU START*/
   #home-projects {
    min-height: 100%;
    position: relative;
    overflow:hidden;
}
#home-projects .backgrounds, #home-projects .backgrounds div, #home-projects ul {
 /*   left: 0;
    position: absolute;
    top: 0;*/
}
#home-projects .backgrounds {
    height: 100%;
/*    position: fixed;*/
    width: 100%;
    z-index: 1;
}
#home-projects .backgrounds div {
    background-position: center center;
    background-size: cover;
    height: 100%;
    opacity: 0;
    width: 100%;
}
#home-projects .backgrounds div.active {
    opacity: 1;
}
#home-projects ul {
    font-size: 3.625em;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    width: 100%;
    z-index: 3;
}
#home-projects ul li {
    border-top: 1px solid rgba(128, 128, 128, 0.2);
    overflow: hidden;
    width: 100%;
}
#home-projects ul li:last-child {
    border-bottom: 1px solid rgba(128, 128, 128, 0.2);
}
#home-projects ul a {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    color: white;
    display: block;
    overflow: hidden;
/*    padding:0.5em 0 0.5em 4%;*/
    text-decoration: none;
}
#home-projects ul a:hover {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
}

#home-projects ul a:hover span.meta {
    opacity: 1;

    transform: translate3d(0px, 0px, 0px);
}
#home-projects ul a:hover span.title {
    transform: translate3d(5%, 0px, 0px);
}
#home-projects ul a:hover img {
    opacity: 0.64;
   /* right: 4%;*/
    transform: translate3d(0px, 0px, 0px);
}
#home-projects ul span {
    float: left;
}
#home-projects ul span.meta {
    font-size: 0.33em;
    opacity: 0;
    position: absolute;
    transform: translate3d(-8%, 0px, 0px);
    width: 12.333em;
    left:3%;
    line-height: 19px;
    top:35%;
    letter-spacing: 2px;
}
#home-projects ul span.meta.five-lines {
    margin-top: -1em;
}
#home-projects ul span.meta span.date {
/*    font-style: italic;
    opacity: 0.6;*/
}
#home-projects ul span.title {
    font-weight: 300;
    left: 0;
    margin: 0 0 0 17%;
/*    position: absolute;*/
    text-transform: uppercase;
    transform: translate3d(0%, 0px, 0px);
    width: 82%;
   
}
#home-projects ul img {
 /*   margin-top: 0.361em;*/
    opacity: 0;
    position: absolute;
    right: 4%;
    top:27%;
    transform: translate3d(-150%, 0px, 0px);
}
#home-projects .backgrounds div {
    transition: opacity 0.5s ease-in-out 0s;
}

#home-projects span.meta {
    transition: opacity 0.35s ease-in-out 0s, transform 0.35s ease-in-out 0s;
}
#home-projects span.title {
    transition: transform 0.25s ease-in-out 0s;
}
#home-projects img {
    transition: opacity 0.35s ease-in-out 0s, transform 0.35s ease-in-out 0s;
    padding-top:2%;
}
.overlay > img{width:21%;}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
/*#home-projects { padding-top: 45px; }*/
#home-projects ul a {font-size:18px;}
#home-projects ul span.meta{font-size:0.4em; line-height: 10px;}
#ranch-menu ul a {font-size:18px;}
#ranch-menu ul span.meta{font-size:0.4em; line-height: 10px;}
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:103px;
        line-height: 103px;
        position:relative;
}
 #home-projects ul a {font-size:13px;}
    #home-projects ul span.meta{font-size: 0.4em;line-height: 10px; letter-spacing: 2px;}
#ranch-menu ul a {font-size:13px;}
#ranch-menu ul span.meta{font-size:0.4em; line-height: 10px;}
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:182px;
    line-height: 182px;
    position:relative;
    font-size:37px;
}
#home-projects ul a {font-size:20px;}
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:182px;
    line-height: 182px;
    position:relative;
    font-size:37px;
}
#home-projects ul a {font-size:20px;}
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:182px;
    line-height: 182px;
    position:relative;
    font-size:37px;
}
#home-projects ul a {font-size:20px;}
}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */

}
/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:197px;
        line-height: 197px;
        position:relative;
}
#home-projects ul a {font-size:13px;}
}

/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
/* Styles */

}

/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */

}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */

}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:103px;
        line-height: 103px;
        position:relative;
}
#home-projects ul a {font-size:13px;}
}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */

}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:103px;
        line-height: 103px;
        position:relative;
}
#home-projects ul a {font-size:13px;}
}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */

}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */

}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
/* Styles */

}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
/* Styles */

}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
/* Styles */

}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
/* Styles */

}
@media only screen and (max-width: 767px){
    #home-projects ul a {
       transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
       min-height:103px;
       line-height: 103px;
       position:relative;
    }
    #home-projects ul a img{display:none;}
}
@media only screen and (min-width: 480px) and (max-width:600px){
    #home-projects ul a {font-size:25px;}
    #home-projects ul span.meta{font-size: 0.3em;line-height: 15px;}
}
@media only screen and (min-width: 600px) and (max-width:767px){
    #home-projects ul a {font-size:32px;}
    #home-projects ul span.meta{font-size: 0.3em;line-height: 15px;}
}

@media only screen  and (min-width : 1024px) {
/* Styles */
    
#home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:197px;
        line-height: 197px;
        position:relative;
        font-size:48px;
        letter-spacing: 5px;
}
.ranch-hand-page  #detail-main div.title, .ranch-hand-page  .image-intro div.title {
    color: white;
    font-size: 4.625em;
    text-shadow: 0 2px 10px rgba(0, 30, 200, 0.1), 0 0 2px rgba(0, 0, 0, 0.05);
}
}
@media only screen  and (max-width : 1023px) {
    #home-projects ul a {letter-spacing: 2px;}
    
}
@media only screen and (min-width : 768px) and (max-width : 1024px) {
    #home-projects ul a {
    transition: padding 0.2s ease-in-out 0s, background-color 0.2s ease-in-out 0s;
    min-height:182px;
    line-height: 182px;
    position:relative;
    font-size:37px;
}}
/* HOMEPAGE BOTTOM MENU END*/

/*Homepage Footer START*/
.small-section-footer{
    padding: 8px 0;
}
/*Homepage Footer END*/