/*
==========================================================
   THEME NAME: SUBSCRIBER
   THEME URI: http://themeforest.net/user/AZ-Design/
   DESCRIPTION: SUBSCRIBER is a Premium Landing Page.
   AUTHOR: AZ DESIGN
   VERSION: 1.1.0
   LICENSE: GNU General Public License
   LICENSE URI: license.txt
========================================================== */


/* 03. PROMO IMAGE AND SUBSCRIBE SECTION
========================================================== */

figure {
   position:relative;
   display:block;
   overflow:hidden;
   margin: 16px 0 0;
   cursor:pointer;
}
figure:hover figcaption {
   top:0;
   opacity:1;
   -webkit-transform:rotate(0);
   -moz-transform:rotate(0);
   -ms-transform:rotate(0);
   -o-transform:rotate(0);
   transform:rotate(0);
}

figcaption {
   position:absolute;
   top:-100%;
   width:100%;
   height:100%;
   background: #fcfcfc;
   color: #444;
   opacity:0;
   -webkit-transition:all .4s ease-out;
   -moz-transition:all .4s ease-out;
   -ms-transition:all .4s ease-out;
   -o-transition:all .4s ease-out;
   transition:all .4s ease-out;
   -webkit-transition-delay:.4s;
   -moz-transition-delay:.4s;
   -ms-transition-delay:.4s;
   -o-transition-delay:.4s;
   transition-delay:.4s;
   -webkit-transform:rotate(360deg);
   -moz-transform:rotate(360deg);
   -ms-transform:rotate(360deg);
   -o-transform:rotate(360deg);
   transform:rotate(360deg);
}

figure img {
   -webkit-transition:all 1.2s;
   -moz-transition:all 1.2s;
   -ms-transition:all 1.2s;
   -o-transition:all 1.2s;
   transition:all 1.2s;
}

figure:hover img {
   opacity: 0;
   -webkit-transform: rotate(720deg) scale(0);
   -moz-transform: rotate(720deg) scale(0);
   -ms-transform: rotate(720deg) scale(0);
   -o-transform: rotate(720deg) scale(0);
   transform: rotate(720deg) scale(0);
}

figcaption h3,figcaption p {
   position:relative;
   left:100%;
   margin-top:0;
   margin-bottom:0;
   padding:10px 20px;
   -webkit-transition:all .4s;
   -moz-transition:all .4s;
   -ms-transition:all .4s;
   -o-transition:all .4s;
   transition:all .4s;
}

figure:hover h3,figure:hover p {
   left:0;
}

figcaption h3 {
   margin-top:20px;
   background: #ff4629;
   color: #fff;
   -webkit-transition-delay:1s;
   -moz-transition-delay:1s;
   -ms-transition-delay:1s;
   -o-transition-delay:1s;
   transition-delay:1s;
}

figcaption p {
   -webkit-transition-delay:1.2s;
   -moz-transition-delay:1.2s;
   -ms-transition-delay:1.2s;
   -o-transition-delay:1.2s;
   transition-delay:1.2s;
}

figcaption a {
   padding:5px 10px;
   background: #353535;
   color:white;
   font-weight: bold;
   font-size: 1.2em;
}


/* 04. THREE-UP CONTENT BLOCKS SECTION
========================================================== */

.uptext {
   padding-bottom: 10px;
   text-transform: uppercase;
}

.mainseparator {
   position: absolute;
   top: 50%;
   z-index: 5;
   margin-top: -2px;
   width: 220px;
   height: 5px;
}

.separator {
   position: absolute;
   top: 50%;
   z-index: 5;
   margin-top: -1px;
   width: 70px;
   height: 3px;
}


/* 09. PRICING TABLES SECTION
========================================================== */
.round {
   display: block;
   margin: 0 auto;
   width: 100px;
   height: 100px;
   border: 5px solid #fff;
   -webkit-border-radius: 100px;
   -moz-border-radius: 100px;
   border-radius: 100px;
   background: #fff;
   -webkit-box-shadow: 0 5px 20px #ddd inset, 0 3px 0 #b6b6b6 inset;
   -moz-box-shadow: 0 5px 20px #ddd inset, 0 3px 0 #b6b6b6 inset;
   box-shadow: 0 5px 20px #ddd inset, 0 3px 0 #b6b6b6 inset;
   color: #616161;
   font: 34px/85px Georgia, Serif;
   font-weight: bold;
}

/* 10. FOOTER SECTION
========================================================== */
.footer-cover {
   padding: 0 0 50px 0;
   height: auto;
   background: url("http://railsapps.github.io/images/landing/bg-footer.png");
   color: #ddd;
}


/* 11. MEDIA QUERIES SECTION
========================================================== */
@media only screen and (max-width: 767px) {

   .mainseparator {
      visibility: hidden;
   }

   .footer-cover {
      padding: 20px 0;
      text-align: center;
   }

   blockquote {
      border: none;
   }
}


/* 15. THEME COLOR
========================================================== */
a:hover { color: #76b1c4; }

/* ALERT BOX */
div.alert-box { border-bottom: 1px solid #8bc; background: #577491; }

/* SEPARATORS */
.mainseparator { background-color: #8bc; }
.separator { background-color: #8bc; }

/* TABS */
.tabs.pill dd.active a { background-color: #88bbcc; }

/* PRICE TABLES */
.price-basic    { background-color: #8bc; }

/* FOOTER */
.footer-cover { border-top: 3px solid #8bc; }



/* 16. TWEAKS
========================================================== */

.uptext {
  margin-top: 12px;
  margin-bottom: -6px;
  color: #444;
  font-weight: bold;
  font-style: normal;
  font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  line-height: 1.1;
  font-size: 19px;
}

.toprow {
  margin-top: -20px;
}

figcaption h3 {
  background: black;
}

.pricing-table {
  max-width: 200px;
}

.pricing-table .bullet-item {
  padding: 0.8rem;
}

.tabs dd a {
  display: block;
  padding: 0px 23.8px;
  font-size: 12px;
}

.tabs dd.active a {
  border-right: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  cursor: default;
}

.tabs.pill dd a {
  background: #e9e9e9;
  color: #666;
  line-height: 26px;
  font-weight: bold;
}

.tabs.pill dd.active a {
  border: none;
  color: #fff;
}

.tabs.pill dd {
  margin-right: 10px;
}

.tabs.pill {
  padding-left: 15px;
  border-bottom: none;
  margin-top: -20px;
}

.tabs {
  display: block;
  margin-top: 30px;
  height: 40px;
}

.tabs-content {
  padding-left: 18px;
}

ul.checkmarks {
  margin-right: 0;
  margin-left: 0;
  list-style: none;
  font-size: 0.8rem;
  line-height: 1.5;
  text-indent: -0.5em;
  margin-left: 0.5em;
  margin-top: 0.5em;
}

div.alert.label {
  background-color: black;
}

ul.checkmarks li:before {
//  margin-top: 4px;
//  margin-right: 10px;
//  float: left;
//  font-family: "foundation-icons";
//  content: '\f10b';
//  font-size: 75%;
//  color: red;
}

.cta-panel{
  background: #fff5bb;
}

blockquote {
  border: none;
}

.testify p {
  margin-top: -8px;
  text-align: right;
  margin-right: -40px;
  margin-left: 0;
  font-size: 0.8em;
}

.copyright {
  margin-top: 10px;
  text-align: right;
  color: #8bc;
  font-size: 11px;
}

.features-list p {
  font-family: "Open Sans","Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #222;
  margin-bottom: 0;
  font-size: 0.9rem;
}

.features-list li {
  font-family: "Open Sans","Helvetica Neue","Helvetica",Helvetica,Arial,sans-serif;
  font-weight: 300;
  font-style: normal;
  color: #222;
  font-size: 0.9rem;
}

.img-circle {
  border-radius: 50%;
  padding: 0.3rem;
}

.pricing-table .cta-button {
background-color: #fff;
text-align: center;
padding: 0;
padding-top: 1.25rem;
}

.cta-button-highlight {
background-color: #008cba;
}

/* Change navbar color
========================================================== */

.top-bar {
  background:#577491;
  height: 30px;
  line-height: 30px;
  margin-bottom: 5px;
}
.top-bar-section ul {
  background:#577491;
}
.top-bar-section li a:not(.button) {
  color:white;
  background:#577491;
  height: 30px;
  line-height: 30px;
  font-weight: 200;
}
.top-bar-section li a:not(.button):hover {
  background:#008cba;
}
.navlinks {
  background: #577491;
  height: 20px;
  line-height: 20px;
  margin-top: -10px;
}
.navlinks ul {
  list-style-type:none;
}
.navlinks li {
  font-size: 0.8rem;
  display: inline;
  padding: 8px;
  color: #fff;
  text-decoration: none;
  height: 20px;
  line-height: 20px;
  font-weight: 200;
}
.navlinks li a {
  color: #fff;
  height: 20px;
  line-height: 20px;
}
.navlinks li a:hover {
  color: #76b1c4;
}