/*
=====================================================================
*   Woo v1.0 Layout Stylesheet
*   url: styleshout.com
*   05-02-2014
=====================================================================

   TOC:
   a. General and Common Styles
   b. Header Styles
   c. Hero Section
   d. Features Section
   e. Pricing Section
   f. Screenshots Section
   g. Call To Action Section
   h. Testimonials Section
   i. Subscribe Section
   j. Footer
   k. lightbox

   todo: check bug in mobile z-index

===================================================================== */
/* ------------------------------------------------------------------ */
/* a. General and Common Styles
/* ------------------------------------------------------------------ */

body {
    background: #fff;
}
/* for css animations */

.show {
    opacity: 1;
}
.js #mc_embed_signup input[type="email"],
.js #mc_embed_signup input[type="submit"] {
    opacity: 0;
}
/* ------------------------------------------------------------------ */
/* b. Header Styles
/* ------------------------------------------------------------------ */

.rdc-head {
    height: 64px;
    width: 100%;
    background: #fff url(../images/lines1.png) repeat-x bottom left;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 990;
}

header .logo {
    float: left;
    width: auto;
    z-index: 991;  
    position: relative;
}
header .logo a {
    display: block;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

header .header-social {
    font-size: 20px;
    font-weight: normal;
    line-height: 54px;
    color: #424a56;
    margin: 0 10px 0 0;
    padding: 0;
    float: right;
}
header .header-social li {
    display: inline-block;
    margin-right: 20px;
}
header .header-social li a {
    color: #000;
}
header .header-social li a:hover {
    color: #cc0000;
}
/* primary navigation
--------------------------------------------------------------------- */

#nav-wrap,
#nav-wrap ul,
#nav-wrap li,
#nav-wrap a {
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

#nav-wrap {
    font-family: 'Give You Glory', cursive;
    font-size: 16pt;
    float: left;
}
/* hide toggle button */

#nav-wrap > a {
    display: none;
}
ul#nav {
    min-height: 54px;
    width: auto;    
    text-align: left;
}
ul#nav li {
    position: relative;
    list-style: none;
    height: 64px;
    display: inline-block;
}
/* Links */

ul#nav li a {
    /* 8px padding top + 8px padding bottom + 38px line-height = 54px */
    
    display: inline-block;
    padding: 8px 8px;
    line-height: 38px;
    text-decoration: none;
    text-align: left;
    color: #cc0000;
    -webkit-transition: color .2s ease-in-out;
    -moz-transition: color .2s ease-in-out;
    -o-transition: color .2s ease-in-out;
    -ms-transition: color .2s ease-in-out;
    transition: color .2s ease-in-out;
}
ul#nav li a:hover {
    color: #000;
}
ul#nav li a:active {
    background-color: transparent !important;
}
ul#nav li.current a {
    color: #000;
}
/* ------------------------------------------------------------------ */
/* c. Hero Section
/* ------------------------------------------------------------------ */

#hero {
    background: #fff;
    overflow: hidden;
    background: #fff;
    padding-bottom: ;
}
/* For high-res devices */

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #hero {
        background: #fff;
        background-size: 200px 200px;
    }
}
#hero .row {
}
/* Hero Text */

.hero-text {
    text-align: center;
    margin: 80px 0 0 0;
}
/* ------------------------------------------------------------------ */
/* d. Features Section
/* ------------------------------------------------------------------ */

#features {
    background: #006699;
    padding: 50px 0;
    overflow: hidden;
    min-height: 100vh;
    color: #fff;
    border-top:10px solid #99ccff;
        border-bottom:10px solid #99ccff;
}
#features .feature {
    margin-bottom: ;
}
#features .right {
    float: right;
}
#features .left {
    float: left;
}


.row.feature{position:relative;}

.him{
	position:absolute;
	right:0;
}
.her{
	float: left;
	margin-top:-130px;
}

.clef {
    vertical-align: -15px;
margin-right:15px;
}


.entry-header {
    position: relative;
    background: none;
}
.entry-title {
margin-top:80px;
}
.entry-title a {
    color: #99ccff;
}
.entry-meta {
    font-weight: bold;
    border-bottom: 1px solid #99ccff;
}
.entry-content{
	margin-top:20px;
	}
.entry-meta a{
    color:#99ccff;
}
#archive-button {
    text-align: right;
    margin-top:120px;
}
#archive-button a {
    color: #fff;
    background: #0099cc;
    padding: .5em 1.5em;
    border: 2px solid #fff;
}
#archive-button a:hover {
    background: #222;
    -webkit-transition: background 0.3s ease-in-out;
    -moz-transition: background 0.3s ease-in-out;
    -o-transition: background 0.3s ease-in-out;
    transition: background 0.3s ease-in-out;
}

#testimonials iframe {
    height: 600px;
}
.bandcamp {
    background: #ffcc33;
    font-family: 'Shadows Into Light Two', cursive;
    color: #fff;
    padding: 10px;
    border: 2px solid white;
    font-size: 18pt;
    margin: 0;
    margin-bottom:10px;
    display:block;
}
.bandcamp:visited{
color: #fff;
}

#band-left {
    float: left;
    width: 48%;
}
#band-right {
    float: right;
    width: 48%;
}
#band-right img,
#band-left img {
    border: 2px solid white;
}
#band-right img:hover,
#band-left img:hover {
    border: 2px solid #cc0000;
}
#testimonials h3 {
    color: #fff;
    font-size: 12pt;
    margin: 0;
    font-family: tahoma, sans-serif;
text-align:left;
}
#features h1 {
    font-family: 'Shadows Into Light Two', cursive;
    color: #fff;
}
.fluid-video-wrapper {
    margin-top: 18px;
}
.feature-footer {
    margin-top: -50px;
    width: 880px;
}
/*----------------------------------------------*/
/*	e. Pricing Section
/*----------------------------------------------*/

#pricing {
    background: #fff no-repeat center;
    padding-top: 50px;
    padding-bottom: 77px;
    min-height: 100vh;
    border-bottom: 10px solid #ccc;
}
#pricing h1 {
    font-family: 'Shadows Into Light Two', cursive;
    color: #cc0000;

}
/* ------------------------------------------------------------------ */
/* c. Screenshots
/* ------------------------------------------------------------------ */

#screenshots {
    background: #ccc url(img/grey.png);
    padding-top: 96px;
    padding-bottom: 120px;
    min-height: 100vh;
        border-bottom: 10px solid #ccc;

}
/* For high-res devices */

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #screenshots {
        background: #fff url(img/grey_@2X.png);
        background-size: 397px 322px;
    }
}
/* Portfolio Content */

#screenshots-wrapper .columns {
    padding: 0;
}
.item .item-wrap {
    background: #fff;
    overflow: hidden;
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.item .item-wrap a {
    display: block;
    cursor: pointer;
}
/* overlay */

.item .item-wrap .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
    background: url(img/overlay-bg.png) repeat;
}
.item .item-wrap .link-icon {
    display: block;
    color: #fff;
    height: 30px;
    width: 30px;
    font-size: 18px;
    line-height: 30px;
    text-align: center;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -15px;
    margin-top: -15px;
}
.item .item-wrap img {
    vertical-align: bottom;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
/* on hover */

.item:hover .overlay {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
}
.item:hover .link-icon {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity=100);
}
.item:hover .item-wrap img {
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}
/* ------------------------------------------------------------------
/* h. Testimonials
/* ------------------------------------------------------------------ */

#testimonials {
    background: #669999;
    padding-top: 112px;
    padding-bottom: 66px;
    position: relative;
    width: 100%;
    overflow: hidden;
    text-align: center;
    min-height: 100vh;
    border-bottom: 10px solid #333;

}
/* For high-res devices */

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #testimonials {
        background: #444;
        background-size: 46px 29px;
    }
}
#testimonials h1 {
    color: #fff;
    text-align: left;
}
#testimonials .quote-left,
#testimonials .quote-right {
    position: absolute;
    top: 50%;
    color: #fff;
    font-size: 40px;
    margin-top: -25px;
}
#testimonials .quote-left {
    left: 5%;
}
#testimonials .quote-right {
    right: 5%;
}
#testimonials .text-container {
    width: 86%;
    margin: 0 auto;
}
/*	Blockquotes */

#testimonials blockquote {
    margin: 0 0px 30px 0px;
    padding-left: 0;
    position: relative;
}
#testimonials blockquote:before {
    content: none;
}
#testimonials blockquote p {
    font-family: 'opensans-semibold', sans-serif;
    font-style: normal;
    color: #fff;
    padding: 0;
    font-size: 26px;
    line-height: 42px;
}
#testimonials blockquote cite {
    display: block;
    font-size: 12px;
    font-style: normal;
    line-height: 18px;
    color: #fff;
}
#testimonials blockquote cite:before {
    content: "\2014 \0020";
}
#testimonials blockquote cite a,
#testimonials blockquote cite a:visited {
    color: #8B9798;
    border: none
}
/* Flex Slider
/* ------------------------------------------------------------------ */
/* Reset */

.flexslider a:active,
.flexslider a:focus {
    outline: none;
}
.slides,
.flex-control-nav,
.flex-direction-nav {
    margin: 0;
    padding: 0;
    list-style: none;
}
.slides li {
    margin: 0;
    padding: 0;
}
/* Necessary Styles */

.flexslider {
    position: relative;
    zoom: 1;
    margin: 0;
    padding: 0;
}
.flexslider .slides {
    zoom: 1;
}
.flexslider .slides > li {
    position: relative;
}
/* Hide the slides before the JS is loaded. Avoids image jumping */

.flexslider .slides > li {
    display: none;
    -webkit-backface-visibility: hidden;
}
/* Suggested container for slide animation setups. Can replace this with your own */

.flex-container {
    zoom: 1;
    position: relative;
}
/* Clearfix for .slides */

.slides:before,
.slides:after {
    content: " ";
    display: table;
}
.slides:after {
    clear: both;
}
/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */

.no-js .slides > li:first-child {
    display: block;
}
/* Slider Styles */

.slides {
    zoom: 1;
}
.slides > li {
    /*margin-right: 5px; */
    
    overflow: hidden;
}
/* Control Nav */

.flex-control-nav {
    width: 100%;
    text-align: center;
}
.flex-control-nav li {
    margin: 0 6px;
    display: inline-block;
    zoom: 1;
    *display: inline;
}
.flex-control-paging li a {
    width: 12px;
    height: 12px;
    display: block;
    background: #ddd;
    background: rgba(255, 255, 255, .3);
    cursor: pointer;
    text-indent: -9999px;
    border-radius: 20px;
    box-shadow: inset 0 0 3px rgba(255, 255, 255, .3);
}
.flex-control-paging li a:hover {
    background: #CCC;
    background: rgba(255, 255, 255, .7);
}
.flex-control-paging li a.flex-active {
    background: #fff;
    background: rgba(255, 255, 255, .9);
    cursor: default;
}
/* ------------------------------------------------------------------ */
/* i. Subscribe Section
/* ------------------------------------------------------------------ */

#subscribe {
    background: #222;
    padding-top: 96px;
    padding-bottom: 66px;
    overflow: hidden;
    text-align: center;
}
#subscribe a,
#subscribe a:visited {
    color: #fff;
}
#subscribe a:hover,
#subscribe a:focus {
    color: #11ABB0;
}
#subscribe h1 {
    color: #fff;
}
#subscribe p {
    color: #7A7A7A;
    text-align: center;
    padding: 0;
}
/* mailchimp signup form */

#mc_embed_signup {
    background: none;
    clear: both;
    display: block;
    margin: 6px auto 30px auto;
    width: 70%;
    text-align: center;
}
#mc_embed_signup:before,
#mc_embed_signup:after {
    content: " ";
    display: table;
}
#mc_embed_signup:after {
    clear: both;
}
#mc_embed_signup input[type="submit"] {
    float: right;
    height: 60px;
    margin: 0;
    padding: 0 20px;
    font-size: 16px;
    line-height: 60px;
    width: 47%;
    background: #cc0000;
}
#mc_embed_signup input[type="email"] {
    display: inline;
    float: left;
    height: 60px;
    margin: 0;
    padding: 18px 20px;
    font-size: 18px;
    line-height: 24px;
    font-family: 'montserrat-regular', sans-serif;
    width: 47%;
    text-align: center;
}
/* ------------------------------------------------------------------ */
/* j. Footer
/* ------------------------------------------------------------------ */

.header-social-footer {
    font-size: 20px;
    font-weight: normal;
    line-height: 54px;
    color: #424a56;
    margin: 0 10px 0 0;
    padding: 0;
    float: right;
}
.header-social-footer li {
    display: inline-block;
    margin-right: 20px;
}
.header-social-footer li a {
    color: #000;
}
.header-social-footer li a:hover {
    color: #cc0000;
}

footer {
    padding-top: 84px;
    margin-bottom: 60px;
    color: #333;
    font-size: 14px;
    line-height: 24px;
    position: relative;
}
footer a,
footer a:visited {
    color: #000;
}
footer a:hover,
footer a:focus {
    color: #c00;
}
footer .info {
    padding-right: 90px;
}
footer .right-cols .columns {
    padding-right: 5px;
    padding-left: 5px;
    width: 33.33333%;
    ;
    text-align: center;
}
footer .right-cols .columns p {
    margin-bottom: 6px;
}
footer h3 {
    font: 13px/24px 'opensans-semibold', sans-serif;
    margin-bottom: 0;
    font-weight: normal;
    color: #cc0000;
    letter-spacing: 1px;
}
footer h3:before {
    font-family: 'FontAwesome';
    margin: 0 0 6px 3px;
    font-size: 30px;
    line-height: 48px;
    text-align: center;
    color: #cc0000;
    display: block;
}
footer h3.address:before {
    content: "\f059";
}
footer h3.social:before {
    content: "\f0c0";
}
footer h3.contact:before {
    content: "\f0e0";
}
footer ul {
    margin: 0;
    padding: 0;
}
footer ul li {
    margin: 0;
    line-height: 24px;
}
footer ul li a,
footer ul li a:visited {
    color: #666;
}
footer ul li a:hover,
footer ul li a:focus {
    color: #c00;
}
/* copyright */

footer .copyright {
    clear: both;
    text-align: center;
    padding: 50px 0;
}
/* Go To Top Button */

#go-top {
    position: absolute;
    top: -24px;
    left: 50%;
    margin-left: -30px;
    text-align: center;
    z-index: 889;
}
#go-top a {
    text-decoration: none;
    border: 0 none;
    display: block;
    width: 60px;
    height: 60px;
    background: #525252;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    color: #fff;
    font-size: 21px;
    line-height: 60px;
    border-radius: 100%;
}
#go-top a:hover {
    background: #cc0000;
}
/* ------------------------------------------------------------------ */
/* k. lightbox
/* ------------------------------------------------------------------ */

#imagelightbox {
    cursor: pointer;
    position: fixed;
    z-index: 995;
    -ms-touch-action: none;
    touch-action: none;
    -webkit-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3);
    /* 50 */
    
    -moz-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3);
    /* 50 */
    
    box-shadow: 0 0 3.125em rgba( 0, 0, 0, .3);
    /* 50 */
}
/* activity indication */

#imagelightbox-loading,
#imagelightbox-loading div {
    border-radius: 50%;
}
#imagelightbox-loading {
    width: 2.5em;
    /* 40 */
    
    height: 2.5em;
    /* 40 */
    
    background-color: #444;
    background-color: rgba( 0, 0, 0, .5);
    position: fixed;
    z-index: 999;
    top: 50%;
    left: 50%;
    padding: 0.625em;
    /* 10 */
    
    margin: -1.25em 0 0 -1.25em;
    /* 20 */
    
    -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .3);
    /* 40 */
    
    -moz-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .3);
    /* 40 */
    
    box-shadow: 0 0 2.5em rgba( 0, 0, 0, .3);
    /* 40 */
}
#imagelightbox-loading div {
    width: 1.25em;
    /* 20 */
    
    height: 1.25em;
    /* 20 */
    
    background-color: #fff;
    -webkit-animation: imagelightbox-loading .5s ease infinite;
    -moz-animation: imagelightbox-loading .5s ease infinite;
    -o-animation: imagelightbox-loading .5s ease infinite;
    animation: imagelightbox-loading .5s ease infinite;
}
@-webkit-keyframes imagelightbox-loading {
    from {
        opacity: .5;
        -webkit-transform: scale( .75);
    }
    50% {
        opacity: 1;
        -webkit-transform: scale( 1);
    }
    to {
        opacity: .5;
        -webkit-transform: scale( .75);
    }
}
@-moz-keyframes imagelightbox-loading {
    from {
        opacity: .5;
        -moz-transform: scale( .75);
    }
    50% {
        opacity: 1;
        -moz-transform: scale( 1);
    }
    to {
        opacity: .5;
        -moz-transform: scale( .75);
    }
}
@-o-keyframes imagelightbox-loading {
    from {
        opacity: .5;
        -o-transform: scale( .75);
    }
    50% {
        opacity: 1;
        -o-transform: scale( 1);
    }
    to {
        opacity: .5;
        -o-transform: scale( .75);
    }
}
@keyframes imagelightbox-loading {
    from {
        opacity: .5;
        transform: scale( .75);
    }
    50% {
        opacity: 1;
        transform: scale( 1);
    }
    to {
        opacity: .5;
        transform: scale( .75);
    }
}
/* lightbox overlay */

#imagelightbox-overlay {
    background-color: #383838;
    background-color: rgba( 0, 0, 0, .8);
    position: fixed;
    z-index: 994;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
/* close button */

#imagelightbox-close {
    position: fixed;
    z-index: 999;
    top: 2.5em;
    /* 40 */
    
    right: 2.5em;
    /* 40 */
}
#imagelightbox-close i {
    display: block;
    background: #fff;
    padding: 10px;
    border-radius: 100%;
    -webkit-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5);
    /* 40 */
    
    -moz-box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5);
    /* 40 */
    
    box-shadow: 0 0 2.5em rgba( 0, 0, 0, .5);
    /* 40 */
}
a#imagelightbox-close {
    color: #333;
}
a#imagelightbox-close:hover,
a#imagelightbox-close:focus {
    color: #11ABB0;
}
/* lightbox caption */

#imagelightbox-caption {
    text-align: center;
    color: #fff;
    background-color: #000;
    position: fixed;
    z-index: 999;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.625em;
    /* 10 */
}
#imagelightbox-loading,
#imagelightbox-overlay,
#imagelightbox-close,
#imagelightbox-caption {
    -webkit-animation: fade-in .25s linear;
    -moz-animation: fade-in .25s linear;
    -o-animation: fade-in .25s linear;
    animation: fade-in .25s linear;
}
@-webkit-keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-moz-keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-o-keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@media only screen and (max-width: 41.250em) {
    /* 660 */
    
    #container {
        width: 100%;
    }
    #imagelightbox-close {
        top: 1.25em;
        /* 20 */
        
        right: 1.25em;
        /* 20 */
    }
}