body {
    font-family: "filson-soft",sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* Set padding to keep content from hitting the edges */

@media (min-width: 768px) {
    .portal-body {
        display: flex;
        min-height: 100vh;
        flex-direction: column;
    }

    .body-content {
        flex: 1;        
    }
}

.body-content {
    padding-left: 15px;
    padding-right: 15px;
}
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

a {
    color: #1fb6ff;
}

.container {
    width: 100%;
}

@media (min-width: 1200px) {
    .container{ max-width: 1340px;}
}
@media (min-width: 768px) {
    .portal-body .navbar {
       padding: 16px 0;
    }
    .navbar-right {
        padding-top: 10px;
    }
}

.sticky {
    position: sticky;
    top: 0;
}

.navbar-toggle .icon-bar {
    background: #7e9bae;
    display: block;
    width: 31px;
    height: 4px;
    border-radius: 6px;
}

.navbar-brand img {
    width: 165px;
}

@media (min-width: 768px) {
    .navbar-brand img {
        width: 225px;
    }
}

.portal-body .navbar {
    background-color: #fff;
    border-bottom: 1px solid #e8ebed;
}

.portal-body .navbar-inverse .navbar-brand {
    color: #FFF;
}

.portal-body .navbar-nav > li > a {
    color: #515151;
    font-weight: normal;
}

.nav > li > a:hover, .nav > li > a:focus{
    background: none;
}

@media (min-width: 768px) {
    .portal-body .navbar-nav > li > a {
        font-size: 14px;
        margin-right: 10px;
    }
}

@media (min-width: 1024px) {
        .portal-body .navbar-nav > li > a {
        font-size: 16px;
    }
    .portal-body .navbar-nav > li {
        padding-left: 16px;
    }
}

.portal-body .navbar-nav > li > a.navbarButton {
    color: white;
    background: #13ce66;
    border-radius: 6px;
}

@media (min-width: 768px) {

    .logged-in-nav {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        justify-items: center;
        align-content: center;
        padding-top: 10px;

    }

    .logged-in-nav a {
        font-size: 0.825em;
    }
}

.logged-in-nav .navbar-right {
    padding-top: 0;
}

h1 {
    margin-top: 0;
    color: #4d4d4d;
    font-weight: 400;
    margin: 1em 0;
}

h1 strong {
    font-weight: 600;
    color: #1fb6ff;
}

h2 {
    font-weight: 500;
    color: #567183;
    padding: 0.313em 0;
    margin-bottom: 0;
    line-height: 1.25em;
}

.form-holder {
    border: 1px solid #e8ebed;
    padding: 2em;
    margin: 0 auto;
    border-radius: 6px;
    max-width: 800px;
}

.form-holder h3 {
    margin-top: 0;
}

.text-danger {
    padding:15px 0;
}

.text-danger ul {
    color: #b94a48;
}

.button-group {
    padding: 20px 0 0;
    border-top: 1px solid #e8ebed;
    margin-top: 25px;
    display: flex;
    flex-wrap: wrap;
}
.button-group  a {
    flex: 1;
    margin: 5px;
}

@media (min-width: 768px) {
    .form-holder {
        margin-top:2em;
    }
}

@media (min-width: 1024px) {
    .form-holder {
        margin-top:3em;
    }
}

@media (min-width: 1200px) {
    .form-holder {
        margin-top:4em;
    }
}

.container .jumbotron {
    background: white;
    padding: 0;
}

.jumbotron h1 {
    color: #1fb6ff;
    font-weight: bold;
    padding: 0;
    margin: 0;
}

.jumbotron p {
    font-size: 1em;
    padding: 0.500em 0;
    color: #567183;
    font-weight: normal;
}

@media (min-width: 768px) {
    .jumbotron {
        width: 50%;
        padding: 2em 0;
    }

    .jumbotron h1 {
        
        margin: 0.5em 0;
    }

    .jumbotron p {
    font-size: 1.250em;
    }
}

.flex-header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom:1em
}

.flex-header  .right-button {
    float: right;
}

.flex-header h3, .flex-header h2 {
    margin: 1em 0;
}

.action-boxes {
    display:flex;
    flex-direction: column;
}

@media (min-width: 768px) {
    .action-boxes {
        flex-direction: row;
    }
}

.action-boxes >div {
    border: 1px solid #e8ebed;
    margin: 16px;
    display: flex;
    flex-direction: column;
    padding: 16px;
    border-radius: 6px;
}

@media (min-width: 768px) {
    .action-boxes > div {
        margin-top: 0;
    }
}

.action-boxes h2 {
    margin-top: 0;
    color: #333333;
    padding-top: 0;
}

.action-boxes p {
    font-size: 1em;
    color:#567183;
    line-height: 1.6em;
    font-size: 16px;
}

.flex-button {
    margin-top: 8px;
    -ms-flex: 1;
    flex: 1;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: end;
    text-decoration: none;
    align-items: flex-end;
    margin-bottom: 0;
    padding-bottom: 0;
}

.form-holder h2 {
    margin-top: 0;
    padding-top: 0;
}

.subscription-container .row{
    margin: 0 0 16px;
}

.sub-row
{
    margin-bottom: 5px;
    border: 1px solid #e8ebed;
    border-radius: 4px;
    padding: 5px 0;
}

.sub-row p {
    margin: 0;
}

.sub-row--active {
    border-left: 10px solid #13CE66;
}

.sub-row--trialing {
    border-left: 10px solid #1FB6FF;
}

.sub-row--deleted {
    border-left: 10px solid #8492A6;
}

.sub-row--past_due {
    border-left: 10px solid #FF4949;
}

.license-row {
    border: 1px solid #e8ebed;
    border-radius: 4px;
    padding: 5px 0;
    margin: 0 0 16px;

}

.license-row p {
    margin: 0 0 0.15em;
    color:#567183
}

.license-row--success {
    border-left: 10px solid #13CE66;
}

.license-row--info {
    border-left: 10px solid #1FB6FF;
}

.license-row--failed {
    border-left: 10px solid #FF4949;
}

.license-row p b {
    display:inline-block;
    width: 125px;
    color: #515151;
}

.pay-row {
    margin-bottom: 16px;
    border: 1px solid #e8ebed;
    border-radius: 4px;
    padding: 5px 0;
}

.pay-row p {
    margin: 0s;
}

.pay-row--success {
    border-left: 10px solid #13CE66;
}

.pay-row--info {
    border-left: 10px solid #1FB6FF;
}

.pay-row--failed {
    border-left: 10px solid #FF4949;
}

.row-button-holder {
    padding-top: 15px;
}

.license-row h4 {
    padding: 0;
    margin: 0.25em 0 0.25em;

}

.form-collection .form-group {
    margin: 0;
}

/*.btn-default,.btn-default:hover, .btn-default:focus {
    color: white;
    background: #13ce66;
    border-radius: 4px;
    border: none;
    padding: 8px 16px;
    font-size: 1.125em;
}

.btn-info, .btn-info:hover, .btn-info:focus {
    border: 2px solid #1fb6ff;
    color: #1fb6ff;
    background: #fff;
    border-radius: 4px;
    padding: 8px 16px;
    font-weight: normal;
    text-decoration: none;
}*/

footer {
     background: #3c4858;
}

footer p {
    color: #6d8b9f;
    margin: 0;
    padding: 16px;
    text-align: center;
}

@media (min-width: 768px) {
    footer p {
        font-size: 16px;
        font-weight: 200;
    }
}


.price-blocks{
  display:flex;
  flex-direction:column;
  margin-top:2em;
}

@media(min-width:768px){
  .price-blocks{
    flex-direction:row; 
  }
}

.price-blocks__item{
  flex:1;
  border-radius:6px;
  margin:20px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border: 1px solid #e8ebed;
}

.price-blocks__header{
  display:flex;
  padding:20px 20px;
  align-items:center;
  justify-content: space-between;
}

.price-blocks__item_monthly .price-blocks__header{
  background:#1fb6ff;
  color:#fff;
}

.price-blocks__item_enterprise .price-blocks__header{
  background:#2a3d54;
  color:#fff;
}

.price-blocks__item_solo .price-blocks__header{
  border-bottom:1px solid #e8ebed;
}

.price-blocks__label{
  font-weight:500;
}
.price-blocks__label b{
  font-size:1.5em;
  font-weight:bold;
  display:block;
  margin-bottom:8px;
}

.price-blocks__label span{
  opacity:0.7;
}

.price-blocks__price{
  display:flex;
  align-items:flex-end;
}

.price-blocks__amount{
  font-size:2em;
}

.price-blocks__amount-sub{
  opacity:0.5;
}

.price-blocks__body{
  background:#fff;
  font-size:0.825em;
  padding:10px 20px;
  flex:1;
}

.price-blocks__cta{
    background:#fff;
    padding:20px;
    padding-top:10px;
    display:flex;
}

.price-blocks__button-holder .button{
  border:1px solid ;
  border-radius:4px;
  color:black;
  padding:12px 15px;
  font-weight:bold;
}

.price-blocks__item_solo .button{
  
}

.price-blocks__item_monthly .button{
  background:#1fb6ff;
  color:white;
  border:#1fb6ff;
}

.price-blocks__item_enterprise .button{
  background:#2a3d54;
  color:white;
  border:#2a3d54;
}

.input-number {
	-webkit-user-select: none;
	user-select: none;
	padding: 12px;
	width: 84px;
	position: relative;
	box-shadow: inset 0 0 0 1px #DDD;
    border-radius: 4px;
}

#quantity, #currency {
    margin-right: 10px;
}

.price-blocks__cta .input-number {
    margin-right: 10px;
}

.input-number span {
	cursor: pointer;
	width: 11px;
	height: 6px;
	right: 10px;
	position: absolute;
}
.input-number .up {
	background: #FFF url("../icon-up.html") no-repeat center / 11px 6px;
	top: 10px;
}
.input-number .up:active {
	background: #FFF url("../icon-up-active.html") no-repeat center / 11px 6px;
}
.input-number .down {
	background: #FFF url("../icon-down.html") no-repeat center / 11px 6px;
	bottom: 10px;
}
.input-number .down:active {
	background: #FFF url("../icon-down-active.html") no-repeat center / 11px 6px;
}