/** body */
body {
    background-color: #ccc;
    background: radial-gradient(ellipse at bottom,#040404 0,#232e32 100%);
}

/** logo */
.navbar-brand .brand-name i {
  font-style: normal;
  color: #e91f62;
}

.navbar-brand .material-icons {
  color: #e91f62;
  line-height: 24px;
  margin-top: -4px;
  transform: rotate(-90deg);
}

/** signup nav btn */
.navbar .navbar-nav > li > a.btn-pricing {
    margin-left: 10px;
    margin-right: 10px;
}

@media (max-width: 767px) {
    .navbar .navbar-nav > li > a.btn-pricing {
        display: none;
    }
  }

.navbar.dark .navbar-nav > li > a.btn.btn-pricing:hover {
    background: #e91f62;
    border: 1px solid #e91f62;
}

.navbar.light .navbar-nav > li > a.btn-pricing {
    color: #fff;
}

/** login register cta */
.navbar-login li {
  margin-right: 10px;
}

.navbar-login li .btn i {
  margin-right: 7px;
}

/** mute button */
#btn-mute:hover {
    transform: none;
}
#btn-mute {
    padding: 21px;
    margin-left: 14px;
    position: fixed;
    bottom: 26px;
    width: 52px;
    border-radius: 5px;
    right: 110px;
    height: 52px;
    z-index: 10000;
    box-shadow: 0 4px 5px -1px rgba(0,0,0,0.5);
    transition: all ease-in-out 0.19s;
}

#btn-mute i.material-icons {
    top: -7px;
    left: -6px;
    font-size: 24px;
}

#btn-mute.btn:before {
    border-radius: 5px;
}

/** header */
.landing-page .header .title {
    color: #fff;
}

/** header video */
.landing-page .header .container {
  height: 45vh;
}

.landing-page .header:after, .landing-page .header:before, .landing-page .header, .landing-page .wrapper {
    background: transparent;
}

.landing-page .navbar-transparent {
  padding-top: 15px;
  padding-bottom: 15px;
  background: transparent;
}

.fullscreen-bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}

.fullscreen-bg__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.fullscreen-bg__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: url("../img/seedess-goddess.jpg") 0 0 no-repeat;
  background-size: cover;
}

@media (min-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    height: 300%;
    top: -100%;
  }
}

@media (max-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    width: 300%;
    left: -100%;
  }
}

@media (max-width: 767px) {
  .fullscreen-bg__video {
   display: none;
  }
}

/** navbar */

/** show navbar button all the time and collapse like mobile */
@media (min-width: 768px) {
  .navbar-collapse.collapse {
    display: none !important;
  }
  .navbar-collapse.collapse.in {
    display: block !important;
  }
  .navbar-toggle {
    display: block;
    float: right;
  }
}
.navbar {
    transition: all 0.1 ease-in-out 0s;
    visibility: visible;
}
.navbar .navbar-nav > li > a {
    opacity: 0.8;
}
.navbar .navbar-nav > li > a:hover {
    opacity: 1;
}
.navbar .navbar-nav > li > a:hover {
    color: #e91e63;
}
.navbar.light .navbar-nav > li > a:hover {
    color: #fff;
}
.navbar .navbar-brand .brand-inverse:hover {
    color: #f44336;
    margin-left: -3px;
}
.navbar.dark:not(.navbar-transparent) {
    background: #101010;
    background: radial-gradient(ellipse at bottom,#040404 0,#232e32 100%);
}
.navbar.light:not(.navbar-transparent) {
   background: #f44336;
   background: radial-gradient(ellipse at bottom,#f44336 0,#f55347 100%);
}
.navbar .navbar-brand .icon {
    color: #f44336;
}
.navbar.light .navbar-brand .icon {
    color: #fff;
}
@media (max-width: 768px) {
    .navbar.navbar-transparent {
        background-color: #3a2c70;
        overflow: hidden;
        min-height:auto;
    }
    .navbar .btn-just-icon {
        display: none;
    }

}
.navbar .navbar-nav>li>a.btn.btn-outline {
    background: transparent;
    box-shadow:none;
    border: 1px solid;
}

.navbar .navbar-nav > li > a {
    font-weight: 900;
    transition: all ease-in 0.19s;
}

.navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
    max-height: 400px;
}

/** Typography */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.text-primary {
    color: #9c27b0 !important;
}

.text-success {
    color: #4caf50 !important;
}

.text-danger {
    color: #f44336 !important;
}

.text-info {
    color: #03a9f4 !important;
}

h1.title, h2.title {
    font-size: 2.4em;
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h5.description:before, h5.description:after {
    background: transparent;
    content: '';
    width: 160px;
    border-bottom: 1px solid #f44336;
    display: block;
    margin: 15px auto;
    height: 0;
}

h5.description:after {
    width: 190px;
}

.navbar-brand, h1.title {
    font-family: "Roboto Condensed", "Roboto";
}

.navbar .navbar-brand {
    font-weight:600;
    font-size: 20px;
}

.navbar.light .navbar-brand * {
  color: #fff;
}

.description, .info p {
    color: #777777;
}

/** Icons */

.features .info .icon i.material-icons {
    font-size: 4.4em;
    border: 1px solid;
    padding: 20px;
    border-radius: 50%;
    cursor: pointer;
    transition: all ease-in .19s;
}

.features .material-icons:hover {
    border: 1px solid #fff;
    color: #fff;
}

.features .icon-primary .material-icons:hover {
    background: #9c27b0;
    box-shadow: 0 0 1px 3px #9c27b0;
}

.features .icon-success .material-icons:hover {
    background: #4caf50;
    box-shadow: 0 0 1px 3px #4caf50;
}

.features .icon-danger .material-icons:hover {
    background: #f44336;
    box-shadow: 0 0 1px 3px #f44336;
}

.features .icon-info .material-icons:hover {
    background: #03a9f4;
    box-shadow: 0 0 1px 3px #03a9f4;
}

i.seedess-icon {
  transform: rotate(-90deg);
}

/** section */

.section.dark {
    background-color: #000;
    background: radial-gradient(ellipse at center,#101010 0,#083b52 100%);
}

.section.dark-glass {
  background: radial-gradient(ellipse at center,#101010 0,#0c3e54cc 100%)
}

.section.colorful {
  background-color: #e91e63;
  background-color: #4caf50;
  background: radial-gradient(ellipse at center,#e91e63 0,#03a9f4 100%);
}

.section.colorful-inverse {
  background: radial-gradient(ellipse at center,#03a9f4 0,#4caf50c2 100%);
}

.section.dark .title, .section.dark .description, .section.dark .info, 
.section.dark .info .info-title, .section.dark .info p {
    color: #fff;
}

.section.light {
    /*background-color: #e6e6e6;*/
    background-color: rgb(255, 233, 233);
}

.section.transparent, .section.transparent .container {
    background: transparent;
}

.section.vh {
    min-height: 100vh;
    min-height: calc(100vh - 60px);
}

/* player */
#player {
    background: url(../img/forest-aurora.jpg);
}

/* api */
.section#api .info {
    max-width: 100%;
}

.section#api .info-horizontal .icon {
    margin-right: 20px;
}

#api .container {
    background: #fff;
    border-radius: 8px;
}


/* features */
.features {
    padding: 10px;
}

.info-horizontal .icon {
    float: left;
    margin-top: 24px;
    margin-right: 10px;
}
.info-horizontal .description {
    text-align: left;
    overflow: hidden;
}

/* streaming */
#streaming {
    background: #fff;
}

.section#streaming .features .icon i {
    font-size: 30px;
    padding: 10px;
}

/* pricing */
.section#pricing {
    /* background: url('../img/sunset-reflection.jpeg') 0 0 no-repeat; */
    border-bottom: 6px solid #e91e63;
}

#pricing .description, #pricing h2.title {
    color: #fff;
}

#pricing .btn-white {
  background-color: #03a9f4;
  color: #ffffff;
}

#pricing .card-description {
  margin: 20px 0;
  text-align: left;
}

#pricing .card-description ul {
  margin: 0;
  padding: 0;
}

#pricing .card-description li {
  list-style: none;
  padding: 10px;
}

#pricing .row {
  margin-top: 20px;
}

/* blog */
#blog .btn-readmore {
    display: block;
}


/** cards */

.card {
    display: inline-block;
    position: relative;
    width: 100%;
    border-radius: 3px;
    color: rgba(0,0,0, 0.87);
    background: #fff;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
}

.card-blog, .card-testimonial .card-description+.card-title, .card-testimonial .icon {
    margin-top: 30px;
}

.card {
    display: inline-block;
    width: 100%;
    margin-bottom: 30px;
    color: rgba(0,0,0,.87);
    background: #fff;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
}

.card, .card .card-image {
    position: relative;
    border-radius: 6px;
}

.card .card-image {
    height: 60%;
    z-index: 1;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: -30px;
}

.card, .card .card-image {
    position: relative;
    border-radius: 6px;
    transition: ease-in 0.19s;
}

.card .card-content {
    padding: 15px 30px;
    position: static;
    text-align: center;
}

.card .card-image .colored-shadow {
    transform: scale(.94);
    top: 22px;
    filter: blur(12px);
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: cover;
    z-index: -1;
    transition: opacity .19s;
    opacity: 0;
}

/** buttons */
.btn.btn-rose, 
.btn.btn-rose.active, 
.btn.btn-rose.active:focus, 
.btn.btn-rose.active:hover, 
.btn.btn-rose:active, .btn.btn-rose:active:focus, 
.btn.btn-rose:active:hover, 
.btn.btn-rose:focus, 
.btn.btn-rose:hover, 
.navbar .navbar-nav>li>a.btn.btn-rose, 
.navbar .navbar-nav>li>a.btn.btn-rose.active, 
.navbar .navbar-nav>li>a.btn.btn-rose.active:focus, 
.navbar .navbar-nav>li>a.btn.btn-rose.active:hover, 
.navbar .navbar-nav>li>a.btn.btn-rose:active, 
.navbar .navbar-nav>li>a.btn.btn-rose:active:focus, 
.navbar .navbar-nav>li>a.btn.btn-rose:active:hover, 
.navbar .navbar-nav>li>a.btn.btn-rose:focus, 
.navbar .navbar-nav>li>a.btn.btn-rose:hover, 
.open>.btn.btn-rose.dropdown-toggle, 
.open>.btn.btn-rose.dropdown-toggle:focus, 
.open>.btn.btn-rose.dropdown-toggle:hover, 
.open>.navbar .navbar-nav>li>a.btn.btn-rose.dropdown-toggle, 
.open>.navbar .navbar-nav>li>a.btn.btn-rose.dropdown-toggle:focus, 
.open>.navbar .navbar-nav>li>a.btn.btn-rose.dropdown-toggle:hover {
    background-color: #e91e63;
    color: #FFF;
}

.btn-rose, 
.navbar .navbar-nav>li>a.btn.btn-rose {
    box-shadow: 0 2px 2px 0 rgba(233,30,99,.14), 0 3px 1px -2px rgba(233,30,99,.2), 0 1px 5px 0 rgba(233,30,99,.12);
}

/** footer */
footer, footer.footer-big {
    padding: 15px 0 100px;
}

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

footer ul li {
    display: inline-block
}

footer ul li a {
    color: inherit;
    padding: 15px;
    font-size: 12px;
    border-radius: 3px;
    position: relative;
    display: block
}

footer ul li .btn {
    margin: 0
}

footer ul.links-horizontal:first-child a {
    padding-left: 0
}

footer ul.links-horizontal:last-child a {
    padding-right: 0
}

footer ul.links-vertical li {
    display: block;
    margin-left: -5px;
    margin-right: -5px
}

footer ul.links-vertical li a {
    padding: 5px
}

footer .social-buttons .btn,footer .social-buttons a {
    margin-top: 5px;
    margin-bottom: 5px
}

footer .footer-brand {
    float: left;
    height: 50px;
    padding: 15px;
    font-size: 18px;
    line-height: 20px;
    margin-left: -15px
}

footer .footer-brand:focus,footer .footer-brand:hover {
    color: #3C4858
}

.footer-black .copyright,.footer-black .footer-brand,.footer-black .footer-brand:focus,.footer-black .footer-brand:hover,.footer-black h4,.footer-black h5,.footer-black i,.subscribe-line.subscribe-line-image .title {
    color: #FFF
}

footer .copyright {
    padding: 15px 0
}

footer .copyright .material-icons {
    font-size: 18px;
    position: relative;
    top: 3px
}

footer .pull-center {
    display: inline-block;
    float: none
}

.footer-big {
    padding: 30px 0
}

.footer-big .content {
    text-align: left
}

.footer-big .social-feed i {
    font-size: 20px;
    display: table-cell;
    padding-right: 10px;
    float: left;
}

.footer-big .social-feed p {
    display: table-cell;
    vertical-align: top;
    overflow: hidden;
    padding-bottom: 10px;
    max-width: 300px;
}

.footer-big .gallery-feed img {
    width: 20%;
    margin-right: 5%;
    margin-bottom: 5%;
    float: left
}

.footer-white {
    background-color: #FFF
}

.footer-gray {
    background-color: #eee
}

.footer-black {
    background: #232323;
    background: -moz-radial-gradient(center,ellipse cover,#585858 0,#232323 100%);
    background: -webkit-gradient(radial,center center,0,center center,100%,color-stop(0,#585858),color-stop(100%,#232323));
    background: -webkit-radial-gradient(center,ellipse cover,#585858 0,#232323 100%);
    background: -o-radial-gradient(center,ellipse cover,#585858 0,#232323 100%);
    background: -ms-radial-gradient(center,ellipse cover,#585858 0,#232323 100%);
    background: radial-gradient(ellipse at center,#585858 0,#232323 100%);
    background-size: 550% 450%;
}

.footer-black a {
    color: #FFF;
    opacity: .86
}

.footer-black a:focus,.footer-black a:hover {
    opacity: 1
}

.footer-black hr {
    border-color: rgba(255,255,255,.2)
}

.social-line {
    padding: 15px 0
}

.social-line-big-icons [class*=col-] {
    border-right: 1px solid #eee
}

.social-line-big-icons [class*=col-]:last-child {
    border: 0
}

.social-line-big-icons .btn {
    margin: 0;
    width: 100%;
    padding-top: 30px;
    padding-bottom: 30px
}

/** particles animation */
#cdn {
  position: relative;
}

#cdn .col-md-4 {
  min-height: 400px;
}

@media (min-width: 767px) {
  #cdn .col-md-4 {
    position: relative;
  }

  #cdn .col-md-4 .info {
    position: absolute;
    z-index: 1;
  }
}

.particles-js-canvas-el {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
  opacity: 0.1;
}
body[data-active="home"] .particles-js-canvas-el {
    display: none;
}

/** pricing */

.no-scroll {
  overflow: hidden;
}

.page-modal {
  transition: all ease-in 0.2s;
  position: fixed;
  margin-top: 20px;
  opacity: 0.7;
}
.page-modal.active {
  display: block;
  opacity: 1;
  background: #fff;
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  overflow: auto;
}

.page-modal.active .card-content {
  padding: 10%;
}

/** form submit messages */
#message .container {
  padding-top: 100px;
}

/** todo */

.link-more, 
.nav > .nav-link-player, 
.nav > .nav-link-blog, 
.nav > .nav-link-api {
    display: none;
}

#player, #api, #blog {
    display: none;
}

/** pricing cards */
.card:hover {
    transform: scale(1.05);
    /* border: 1px dotted #25a9f4; */
    box-shadow: 0 4px 42px 0 rgba(0, 0, 0, 0.44), 0 2px 3px -2px rgba(0, 0, 0, 0.53), 0 1px 6px 0 rgba(0, 0, 0, 0.33);
}

.card:hover .icon i {
  transform: scale(1.2);
}

.card:hover .icon i.seedess-icon {
  transform: scale(1.2) rotate(-90deg);
}

.card .icon i {
  transition: all ease-in .19s .19s;
}

.card-pricing .icon i {
    display: inline-block;
    line-height: 70px;
    font-size: 50px;
    color: #25a9f4;
}

.card-pricing.card-primary .icon i {
    color: #e91e63;
}

.card-pricing.card-enterprise .icon i {
    color: #9c27b0;
}

.card-pricing .icon p {
    display: inline-block;
    margin: 0;
    line-height: 24px;
    padding: 0 10px;
}

.card-pricing .icon {
    text-align: center;
}

.card-pricing h6 {
    text-align: center;
}

.card-pricing h3.card-title {
    text-align: center;
    font-weight: 600;
}

.card-pricing li .material-icons {
    padding-right: 20px;
    float: left;
    /** icons one pixel up visual illusion */
    line-height: 19px; 
}

.card-pricing li {
    border-bottom: 1px solid #eee;
    line-height: 20px;
}

.card-pricing .cite {
    font-size: 12px;
    color: #999;
}

/** all cards */
.card:before {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 5px;
  top: -5px;
  content: "";
  -webkit-transform: skewY(-1deg);
  -ms-transform: skewY(-1deg);
  transform: skewY(-1deg);
  background-image: -webkit-gradient(linear, left top, right top, color-stop(-10%, rgba(255,255,255,0.1)), to(rgba(255,255,255,0.2)));
  background-image: linear-gradient(90deg, rgba(255,255,255,0.1) -10%, rgba(255, 255, 255, 0.2) 100%);
  border-radius: 10px
}

.card .card-content {
  overflow: hidden;
  position: relative;
  border-radius: 5px;
}

.card .card-content:before {
  width: 100%;
  height: 200px;
  position: absolute;
  left: 0px;
  top: -10px;
  content: "";
  -webkit-transform: skewY(-1deg);
  -ms-transform: skewY(-1deg);
  transform: skewY(-1deg);
  background: #2a9aa812;
  background: linear-gradient(60deg,#03a9f438,#80e0ff0f);
}

.card-opensource {
  margin-top: 20px;
  border-bottom: 4px solid #25a9f4;
}

.card-hosted {
  margin-top: 10px;
  border-bottom: 4px solid #e91e63;;
}

.card-enterprise {
  margin-top: 0px;
  border-bottom: 4px solid #9c27b0;
}

/** all buttons */
.btn {
  transition: all ease-in 0.19s;
}

.btn:hover {
  transform: scale(1.05);
}

.btn:before {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 2px;
  top: 0;
  content: "";
  background-image: -webkit-gradient(linear, left top, right top, color-stop(-10%, rgba(255,255,255,0)), to(rgba(255,255,255,0.1)));
  background-image: linear-gradient(90deg, rgba(255,255,255,0) -10%, rgba(255, 255, 255, 0.1) 100%);
  border-radius: 100px;
  z-index: -1;
}

.btn:before:hover {
  left: 0px;
}

/** all icons */
.features .info:hover .icon i {
  transform: scale(1.1);
}

.features .info:hover .icon i.material-icons.seedess-icon {
  transform: scale(1.1) rotate(-90deg);
}

.footer-transparent {
 background: transparent;
}

.fa-heart {
 color: #e91e63 !important;
}