/*
Theme Name: Feed and Grow
Theme URI: http://www.feedandgrow.net
Author: Miss Marketing - Greens, s.r.o.
Author URI: http://missmarketing.sk
Description: Theme developed for - add info on client's business by MissMarketing.sk
Version: 1.0
Text Domain: feedandgrow

*/

/* Colors
    
    Black: #171717;
    Blue: #298be6;
    Dark blue: #
    White: #FCFCFC;
    Orange: #FF2D00;
*/


@font-face {
    font-family: 'rifficregular';
    src: url('fonts/riffic-webfont.eot');
    src: url('fonts/riffic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/riffic-webfont.woff2') format('woff2'),
         url('fonts/riffic-webfont.woff') format('woff'),
         url('fonts/riffic-webfont.ttf') format('truetype'),
         url('fonts/riffic-webfont.svg#rifficregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
    font-family: 'Roboto', sans-serif;
    font-size: 1em;
    background: #121212;
    color: #dbdbdb;
}

h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    font-family: 'rifficregular';
    font-weight: bold;
    color: #fcfcfc;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-top: 1em;
    margin-bottom: 0 !important;
}

h1 {
    font-size: 3em;
    line-height: 1;
}

h2 {
    margin: 0.8em 0 1.2em;
    color: #a0a0a0;
    font-size: 2.25em;
    line-height: 1.33;
}

h3 {
}

p {
    font-size: 1em;
    line-height: 1.7;
    margin-top: 1em;
    margin-bottom: 1em;
}

ul, ol, dl {
    margin: 1em 0 1em;
    line-height: 1.7;
}

a {
    color: #298be6;
}

a:hover,
a:focus {
    color: #298be6;
    text-decoration: underline;
}

.row {
    max-width: 75em;
}

label {
    color: #dbdbdb;
}

/* HEADER */

header {
    border-bottom: 2px solid #298be6;
    background: #000000;
}

.logo-holder {
    margin-top: 0.3em;
}

h1.site-title,
h2.site-title {
    font-size: 0.8em;
    color: #FCFCFC;
    display: inline-block;
    margin-left: 0.5em;
    margin-top: 1em;
}

img.logo {
    max-width: 2.8em;
    display: inline-block;
    margin-bottom: 0.5em;
}

/* NAVIGATION */

#nav-button {
    padding: 1em;
    margin: 0;
    border: 0;
    background: #3a3a3a;
    border-radius: 0;
}

nav.main-nav ul {
    margin-top: 1.2em;
    font-size: 0.9em;
}

nav.main-nav ul li a {
    color: #FCFCFC;
    padding: 1em;
    line-height: 3;
}

/* CONTENT */

.intro {
    background: url(images/screenshot-alpha-feed-and-grow-fish-simulator-shark.png) center center;
    background-size: cover;
    min-height: 35em;
    padding-bottom: 3em;
    color: #fdfdfd;
}

.intro h1,
.intro ul {
    text-shadow: 1px 1px #000;
}

.intro .columns {
    margin-top: 7em;
}

.turqoise,
#play-game-demo-full {
    background: #14FEB1;
    color: #3a3a3a;
    padding: 1em 0;
}

#play-game-demo-full h2,
#play-game-demo-full h5 {
    color: #3a3a3a;
}

.demo-info, .full-info {
    padding: 2em;
    margin-bottom: 1em;
}

.reviews-bg {
    background: url(images/slim-header.png) center center;
    background-size: cover;
    padding: 2em 0;
    font-style: italic;
}  

/* NEWS */

#news li {
    border-top: 1px solid #FCFCFC;
    padding: 1em 0;
}

p.categories-links {
    font-size: 0.7em;
    margin: 0.2em 0 0.2em;
}

p.categories-links a {
    color: #fcfcfc;
    font-style: italic;
}

p.categories-links a:hover {
    color: #298be6;
}

article.post p.entry-meta {
    font-size: 0.7em;
    margin-top: 1em;
    text-align: center;
}

#news h3 {
    margin-top: 0;
}

#news p {
    margin: 0;
}

#news .button {
    margin-top: 0.7em;
}

.temp-news p {
    padding: 1em 0;
}

.goals {
    font-size: 1em;
}

.goal-note {
    font-size: 0.75em;
}

.accordion .accordion-navigation > .content.active, .accordion dd > .content.active {
    background: #121212;
}

/* SINGLE / articles */

h1.article-title {
    text-align: center;
}

.featured-image {
    background-size: cover;
    min-height: 12em;
    margin-bottom: 0.5dem;
}

/* SIDEBAR */

/* FOOTER */

footer {
    background: #000000;
    padding: 3em 0;
    color: #dbdbdb;
}

footer p {
    font-size: 0.8em;
}

.footer-nav ul li,
ul.social-footer li {
    display: inline-block;
}

.footer-nav ul li a,
.social-footer li a {
    display: inline-block;
    font-size: 0.8em;
    padding: 1.2em;
    color: #dbdbdb;
}

footer h4 {
    color:#a0a0a0;
}

footer h3 {
    color: #298be6;
}

/* ELEMENTS */

button, .button {
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    background: transparent;
    border: 1px solid #FCFCFC;
    margin: 1em auto;
    color: #FCFCFC;
    border-radius: 3px;
}

button:hover,
button:focus,
.button:hover,
.button:focus {
    text-decoration: none;
    background: #fdfdfd;
    color: #3a3a3a;
    border: 1px solid #3a3a3a;
}

.cta {
    font-family: 'rifficregular';
    font-size: 1.3em;
    color: #fdfdfd;
    background: #000000;
    border: 1px solid #fdfdfd;
}

.embed-container { 
    position: relative; 
    padding-bottom: 56.25%; 
    height: 0; 
    overflow: hidden; 
    max-width: 100%; 
} 

.embed-container iframe, 
.embed-container object, 
.embed-container embed { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
}

.white {
    color:#FCFCFC;
}

.black {
    color: #000000;
}

.little-note {
    font-size: 0.85em;
    font-style: italic;
}

.copyright-footer p {
    font-size: 0.7em;
    font-style: italic;
    text-align: center;
}

.no-padding {
    padding: 0 !important;
}

/* TABS */

.tabs .tab-title.active a {
    background: transparent;
    color: #f5f5f5;
}

.tabs .tab-title > a {
    padding: 0.5em;
    background: transparent;
    color: #f5f5f5;
    font-size: 0.8em;
}

.tabs .tab-title > a:hover {
    background: transparent;
}

/* RESPONSIVE ISSUES */

// Small screens
@media only screen { } /* Define mobile styles */

/* max-width 640px, mobile-only styles, use when QAing mobile issues */
@media only screen and (max-width: 40em) { } 

/* ------------------------------------------
    Medium screens 
    min-width 641px, medium screens 
*/ 
@media only screen and (min-width: 40.063em) {
    .main-nav ul li {
            display: inline-block;
    }
    
    .submenu {
        position: absolute;
        text-align: left;
        margin-top: 0;
    }
    
    nav.main-nav ul.submenu li {
        display: block;
    }
    
    nav.main-nav ul.submenu li a {
        padding: 0.5em 0.5em 0.5em 0;
    }
    
    .reviews-bg {
        padding: 3em 0;
    }
} 

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 40.063em) and (max-width: 64em) { } 

/* ------------------------------------------
    Large screens
    min-width 1025px, large screens 
*/ 
@media only screen and (min-width: 64.063em) {
    img.logo {
        max-width: 100px;
    }
    
    h1.site-title,
    h2.site-title {
        font-size: 1.7em;
    }
    
    .main-nav {
        margin-top: 1.7em;
    }
    
    .main-nav ul li {
        display: inline-block;
        font-size: 0.9em;
    }
    
    ul.submenu {
        display: none;
    }
    
    .featured-image {
        min-height: 23em;
    }
    
    article.post h1 {
        text-align: center;
    }
    
    article.post p {
        width: 70%;
        margin: 0.5em auto;
    }


} 

/* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */
@media only screen and (min-width: 64.063em) and (max-width: 90em) { } 

/* ------------------------------------------
    XLarge screens
    min-width 1441px, xlarge screens
*/ 
@media only screen and (min-width: 90.063em) { }

/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
@media only screen and (min-width: 90.063em) and (max-width: 120em) { } 

/* ------------------------------------------ 
    XXLarge screens
    min-width 1921px, xxlarge screens
*/ 
@media only screen and (min-width: 120.063em) { }