body {
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.5;
  background-color: #2980b9;
}
@media only screen and (min-width: 1200px) {
  body {
    overflow-y: hidden;
  }
}
* {
  box-sizing: border-box;
}
a:focus {
  color: #e74c3c;
}
a:hover {
  color: #e74c3c;
}
a[target="_blank"] {
  color: #f8f9e9;
  text-decoration: underline;
}
a[target="_blank"]:hover {
  color: #e74c3c;
}
h1,
.section-header {
  font-size: 4em;
  color: #ecf0f1;
  line-height: 1;
  margin: 0 0 2rem 0;
  font-family: 'Poiret One', cursive;
  letter-spacing: 1px;
}
@media only screen and (min-width: 550px) {
  h1,
  .section-header {
    font-size: 5em;
  }
}
@media only screen and (min-width: 990px) {
  h1,
  .section-header {
    font-size: 4.8em;
  }
}
@media only screen and (min-width: 1200px) {
  h1,
  .section-header {
    font-size: 6em;
  }
}
h2 {
  font-size: 2.618em;
  color: #ecf0f1;
  letter-spacing: 0px;
  font-weight: 900;
  margin-bottom: 0.5em;
  margin-top: 0;
}
h3,
.blog-content h1 {
  margin-top: 0;
  margin-bottom: 1em;
  font-weight: bold;
  font-size: 2em;
}
h3.panel-title {
  font-size: 3em;
  color: #3498db;
  font-family: 'Raleway', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0px;
  font-weight: 500;
  margin-bottom: 2rem;
  word-break: break-all;
}
@media only screen and (min-width: 550px) {
  h3.panel-title {
    font-size: 4em;
  }
}
@media only screen and (min-width: 990px) {
  h3.panel-title {
    font-size: 4.16em;
    letter-spacing: 4px;
  }
}
@media only screen and (min-width: 1200px) {
  h3.panel-title {
    font-size: 4.16em;
  }
}
h4 {
  font-size: 1.6em;
  margin-bottom: 2rem;
  margin-top: 0;
  font-weight: 300;
  color: #3498db;
}
@media only screen and (min-width: 990px) {
  h4 {
    font-size: 2.16em;
  }
}
p {
  margin-bottom: 1.5rem;
}
.section-header {
  font-weight: normal;
}
.subheader {
  color: #ecf0f1;
  text-align: center;
  font-style: italic;
  display: block;
  margin: 1em 0;
  font-size: 1.3em;
  font-family: 'Raleway', sans-serif;
  line-height: 1;
}
@media only screen and (min-width: 550px) {
  .subheader {
    font-size: 1.5em;
  }
}
.subheader-author {
  display: block;
  text-align: center;
  font-size: 2em;
}
.text-left-large {
  font-size: 6rem;
  color: #fff;
}
.dark-readability p {
  letter-spacing: 1px;
  font-size: 0.8em;
  font-family: "Raleway", sans-serif;
}
@media only screen and (min-width: 990px) {
  .dark-readability p {
    font-size: 0.98em;
  }
}
.dark-line {
  border-color: #2c3e50;
}
.btn-outline {
  background-color: transparent;
  color: #fff;
  border-radius: 0;
  padding: 1rem 2rem;
  transition: 300ms;
  font-weight: 500;
  text-transform: uppercase;
  border: 2px solid #fff;
  font-family: 'Raleway', sans-serif;
}
.btn-outline.btn-confirm:hover {
  color: #55bf55;
  border-color: #55bf55;
}
.btn-outline.btn-cta:hover {
  color: #ecf0f1;
  border-color: #ecf0f1;
}
.sidebar {
  padding: 5rem;
  text-align: center;
  vertical-align: top;
  background-color: #2980b9;
}
.sidebar ul a {
  color: #2c3e50;
}
.sidebar .btn-outline {
  color: #2c3e50;
  border-color: #2c3e50;
}
.sidebar .nav-list {
  margin-top: 4em;
  letter-spacing: 2px;
  font-size: 1.1em;
  font-family: 'Raleway', sans-serif;
}
@media only screen and (min-width: 990px) {
  .sidebar .nav-list {
    margin-top: 6em;
  }
}
@media only screen and (min-width: 1500px) {
  .sidebar .nav-list {
    margin-top: 6em;
  }
}
.sidebar .nav-list a {
  transition: letter-spacing 450ms;
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  font-size: 2.2rem;
  text-transform: uppercase;
}
@media only screen and (min-width: 990px) {
  .sidebar .nav-list a {
    font-size: 2.5rem;
  }
}
@media only screen and (min-width: 1500px) {
  .sidebar .nav-list a {
    font-size: 2.4rem;
  }
}
.sidebar .nav-list a:hover {
  color: #ecf0f1;
  letter-spacing: 4px;
  text-decoration: none;
}
.sidebar .nav-list a:focus {
  text-decoration: none;
}
.sidebar .nav-list a.active:after {
  content: '';
  display: block;
  position: absolute;
  right: -25px;
  bottom: 50%;
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-right: 10px solid #2c3e50;
  border-bottom: 5px solid transparent;
}
.sidebar .nav-list .btn-dark {
  font-size: 2.2rem;
  background-color: transparent;
}
.sidebar .nav-list .btn-dark:hover {
  color: #e74c3c;
  border-color: #e74c3c;
}
.sidebar-footer {
  color: #2c3e50;
  display: inline-block;
  text-align: center;
  padding-top: 2em;
}
@media only screen and (min-width: 990px) {
  .sidebar-footer {
    padding-top: 6em;
  }
}
.sidebar-footer h3 {
  font-family: 'Reenie Beanie', cursive;
  padding-top: 3rem;
}
.sidebar-footer .main-cta-container {
  text-align: center;
  position: relative;
  padding-bottom: 4rem;
}
.sidebar-footer .main-cta-container .btn {
  display: inline-block;
}
@media only screen and (min-width: 1500px) {
  .sidebar-footer .main-cta-container .btn {
    font-size: 2.4rem;
  }
}
.social-icons {
  border: none;
  padding: 3rem 0 0 0;
}
.social-icons i.fa {
  font-size: 2.618em;
}
.social-icons li {
  display: block;
  vertical-align: top;
}
@media only screen and (min-width: 990px) {
  .social-icons li {
    display: inline-block;
  }
}
.social-icons a {
  color: #333;
  transition: 300ms;
  text-decoration: none;
}
.social-icons a:hover {
  color: #fff;
}
@media only screen and (min-width: 990px) {
  .height-100 {
    height: 100%;
  }
}
html {
  height: 100%;
}
.main-content {
  background-color: #2c3e50;
  color: #ddd;
  overflow-y: auto;
}
.main-content:before {
  content: '';
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(0,0,0,0.39);
}
.main-content .glyphicon {
  font-size: 8em;
  padding-bottom: 3rem;
}
.main-content .glyphicon.color-1 {
  color: #f8f9e9;
}
.main-content .paragraph-content {
  margin-bottom: 2em;
}
.main-content .paragraph-content p {
  line-height: 1.5em;
  font-size: 1em;
}
@media only screen and (min-width: 990px) {
  .main-content .paragraph-content p {
    font-size: 1em;
  }
}
.panel-heading-group {
  padding-bottom: 6rem;
}
.panel-dark {
  background-color: transparent;
  border: none;
  box-shadow: none;
  padding: 6rem 0;
}
@media only screen and (min-width: 990px) {
  .panel-dark {
    padding: 5rem 5rem;
  }
}
@media only screen and (min-width: 1200px) {
  .panel-dark {
    padding: 5rem 12rem;
  }
}
.panel-dark .panel-body {
  position: relative;
}
.panel-dark .panel-heading {
  padding-top: 3rem;
  padding-bottom: 2rem;
  border: none;
  text-align: center;
}
@media only screen and (min-width: 990px) {
  .panel-dark .panel-heading {
    padding-bottom: 6rem;
    padding-top: 0;
  }
}
.panel-dark p {
  font-weight: 500;
}
sup {
  top: -1.5em;
  font-size: 1rem;
  font-weight: 400;
  color: #555;
}
ul {
  list-style: none;
  margin-top: 0;
  padding: 0 1em 1em 1em;
}
ul li {
  padding: 0.5em;
}
ul li a {
  font-weight: 500;
}
ul + ul {
  margin-bottom: 4em;
  border-color: #666;
  margin-top: 0.5em;
  padding-bottom: 3em;
}
.searchbar input[type="search"] {
  display: inline-block;
  width: 90%;
  padding: 0.33em;
  border-radius: 3px;
}
.searchbar .glyphicon-search {
  padding-left: 0.5em;
  display: inline-block;
}
.float-left {
  float: left;
}
[class^="col-"] + .pad-right-0 {
  padding-right: 0;
}
.sponsors .social-icons {
  padding-top: 1em;
}
.youtube a:hover {
  color: #af1919;
}
.snapchat-ghost a:hover {
  color: #e2e532;
}
body .no-margin-bottom {
  margin-bottom: 0;
}
body .text-left {
  text-align: left;
}
body .text-right {
  text-align: right;
}
body .width--100 {
  width: 100%;
}
body .no-margin-top {
  margin-top: 0;
}
body .double-margin-top {
  margin-top: 2rem;
}
body .triple-margin-top {
  margin-top: 3rem;
}
body .single-margin-top {
  margin-top: 1rem;
}
body .octo-margin-top {
  margin-top: 8rem;
}
body .no-padding-top {
  padding-top: 0;
}
body .quad-padding-bottom {
  padding-bottom: 4rem;
}
body .double-padding-top {
  padding-top: 2rem;
}
body .quad-padding-top {
  padding-top: 4em;
}
body .octo-padding-right {
  padding-right: 8rem;
}
.absolute-centered {
  position: absolute;
  right: 50%;
  bottom: 50%;
  -webkit-transform: translateX(50%) translateY(50%);
      -ms-transform: translateX(50%) translateY(50%);
          transform: translateX(50%) translateY(50%);
}
.absolute-lower-half {
  position: absolute;
  right: 67%;
  bottom: 45%;
  -webkit-transform: translateX(50%) translateY(66%);
      -ms-transform: translateX(50%) translateY(66%);
          transform: translateX(50%) translateY(66%);
}
.col-left {
  padding-left: 3rem;
  padding-right: 4rem;
}
.col-right {
  padding-left: 4rem;
  padding-right: 3rem;
}
@font-face {
  font-family: 'Open Sans';
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Open-Sans-regular/Open-Sans-regular.eot");
  src: url("fonts/Open-Sans-regular/Open-Sans-regular.eot?#iefix") format('embedded-opentype'), local('Open Sans'), local('Open-Sans-regular'), url("fonts/Open-Sans-regular/Open-Sans-regular.woff2") format('woff2'), url("fonts/Open-Sans-regular/Open-Sans-regular.woff") format('woff'), url("fonts/Open-Sans-regular/Open-Sans-regular.ttf") format('truetype'), url("fonts/Open-Sans-regular/Open-Sans-regular.svg#OpenSans") format('svg');
}
@font-face {
  font-family: 'Open Sans';
  font-weight: 700;
  font-style: normal;
  src: url("fonts/Open-Sans-700/Open-Sans-700.eot");
  src: url("fonts/Open-Sans-700/Open-Sans-700.eot?#iefix") format('embedded-opentype'), local('Open Sans Bold'), local('Open-Sans-700'), url("fonts/Open-Sans-700/Open-Sans-700.woff2") format('woff2'), url("fonts/Open-Sans-700/Open-Sans-700.woff") format('woff'), url("fonts/Open-Sans-700/Open-Sans-700.ttf") format('truetype'), url("fonts/Open-Sans-700/Open-Sans-700.svg#OpenSans") format('svg');
}
@font-face {
  font-family: 'Raleway';
  font-weight: 100;
  font-style: normal;
  src: url("fonts/Raleway-100/Raleway-100.eot");
  src: url("fonts/Raleway-100/Raleway-100.eot?#iefix") format('embedded-opentype'), local('Raleway Thin'), local('Raleway-100'), url("fonts/Raleway-100/Raleway-100.woff2") format('woff2'), url("fonts/Raleway-100/Raleway-100.woff") format('woff'), url("fonts/Raleway-100/Raleway-100.ttf") format('truetype'), url("fonts/Raleway-100/Raleway-100.svg#Raleway") format('svg');
}
@font-face {
  font-family: 'Raleway';
  font-weight: 200;
  font-style: normal;
  src: url("fonts/Raleway-200/Raleway-200.eot");
  src: url("fonts/Raleway-200/Raleway-200.eot?#iefix") format('embedded-opentype'), local('Raleway ExtraLight'), local('Raleway-200'), url("fonts/Raleway-200/Raleway-200.woff2") format('woff2'), url("fonts/Raleway-200/Raleway-200.woff") format('woff'), url("fonts/Raleway-200/Raleway-200.ttf") format('truetype'), url("fonts/Raleway-200/Raleway-200.svg#Raleway") format('svg');
}
@font-face {
  font-family: 'Raleway';
  font-weight: 300;
  font-style: normal;
  src: url("fonts/Raleway-300/Raleway-300.eot");
  src: url("fonts/Raleway-300/Raleway-300.eot?#iefix") format('embedded-opentype'), local('Raleway Light'), local('Raleway-300'), url("fonts/Raleway-300/Raleway-300.woff2") format('woff2'), url("fonts/Raleway-300/Raleway-300.woff") format('woff'), url("fonts/Raleway-300/Raleway-300.ttf") format('truetype'), url("fonts/Raleway-300/Raleway-300.svg#Raleway") format('svg');
}
@font-face {
  font-family: 'Raleway';
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Raleway-regular/Raleway-regular.eot");
  src: url("fonts/Raleway-regular/Raleway-regular.eot?#iefix") format('embedded-opentype'), local('Raleway'), local('Raleway-regular'), url("fonts/Raleway-regular/Raleway-regular.woff2") format('woff2'), url("fonts/Raleway-regular/Raleway-regular.woff") format('woff'), url("fonts/Raleway-regular/Raleway-regular.ttf") format('truetype'), url("fonts/Raleway-regular/Raleway-regular.svg#Raleway") format('svg');
}
@font-face {
  font-family: 'Raleway';
  font-weight: 700;
  font-style: normal;
  src: url("fonts/Raleway-700/Raleway-700.eot");
  src: url("fonts/Raleway-700/Raleway-700.eot?#iefix") format('embedded-opentype'), local('Raleway Bold'), local('Raleway-700'), url("fonts/Raleway-700/Raleway-700.woff2") format('woff2'), url("fonts/Raleway-700/Raleway-700.woff") format('woff'), url("fonts/Raleway-700/Raleway-700.ttf") format('truetype'), url("fonts/Raleway-700/Raleway-700.svg#Raleway") format('svg');
}
@font-face {
  font-family: 'Reenie Beanie';
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Reenie-Beanie-regular/Reenie-Beanie-regular.eot");
  src: url("fonts/Reenie-Beanie-regular/Reenie-Beanie-regular.eot?#iefix") format('embedded-opentype'), local('Reenie Beanie'), local('Reenie-Beanie-regular'), url("fonts/Reenie-Beanie-regular/Reenie-Beanie-regular.woff2") format('woff2'), url("fonts/Reenie-Beanie-regular/Reenie-Beanie-regular.woff") format('woff'), url("fonts/Reenie-Beanie-regular/Reenie-Beanie-regular.ttf") format('truetype'), url("fonts/Reenie-Beanie-regular/Reenie-Beanie-regular.svg#ReenieBeanie") format('svg');
}
@font-face {
  font-family: 'Michroma';
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Michroma-regular/Michroma-regular.eot");
  src: url("fonts/Michroma-regular/Michroma-regular.eot?#iefix") format('embedded-opentype'), local('Michroma'), local('Michroma-regular'), url("fonts/Michroma-regular/Michroma-regular.woff2") format('woff2'), url("fonts/Michroma-regular/Michroma-regular.woff") format('woff'), url("fonts/Michroma-regular/Michroma-regular.ttf") format('truetype'), url("fonts/Michroma-regular/Michroma-regular.svg#Michroma") format('svg');
}
@font-face {
  font-family: 'Poiret One';
  font-weight: 400;
  font-style: normal;
  src: url("fonts/Poiret-One-regular/Poiret-One-regular.eot");
  src: url("fonts/Poiret-One-regular/Poiret-One-regular.eot?#iefix") format('embedded-opentype'), local('Poiret One'), local('Poiret-One-regular'), url("fonts/Poiret-One-regular/Poiret-One-regular.woff2") format('woff2'), url("fonts/Poiret-One-regular/Poiret-One-regular.woff") format('woff'), url("fonts/Poiret-One-regular/Poiret-One-regular.ttf") format('truetype'), url("fonts/Poiret-One-regular/Poiret-One-regular.svg#PoiretOne") format('svg');
}
ul.pagination {
  padding: 0 1rem 1rem 1rem;
}
.pagination {
  margin: 0 0 1rem 0;
}
.pagination>li>a {
  background-color: transparent;
  border-color: transparent;
  color: #ecf0f1;
  float: none;
}
@media only screen and (min-width: 990px) {
  .pagination>li>a {
    float: left;
  }
}
.pagination>li>a:hover {
  background-color: transparent;
  border-color: transparent;
  color: #e74c3c;
}
.pagination>.active>a {
  color: #e74c3c;
  background-color: transparent;
  border-color: transparent;
}
.pagination>.active>a:focus,
.pagination>.active>a:hover {
  color: #e74c3c;
  background-color: transparent;
  border-color: transparent;
}
.pagination>.disabled>a {
  background-color: transparent;
  border-color: transparent;
}
.pagination>.disabled>a:hover {
  background-color: transparent;
  border-color: transparent;
}
.home-view .glyphicon {
  font-size: 7rem;
}
.language {
  display: inline-block;
  padding: 1rem;
  width: 9rem;
  height: 3rem;
  position: relative;
}
.language:before {
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.language-php:before {
  background-image: url("../images/php-logo.png");
}
.language-bundle:before {
  background-image: url("../images/html-css-js.png");
}
.language-yeoman:before {
  background-image: url("../images/yeoman-logo.png");
  background-color: #fff;
}
.logo {
  display: inline-block;
  background-repeat: no-repeat;
  background-size: contain;
}
.logo-lr {
  height: 10rem;
  width: 21rem;
  background-image: url("../images/loginradius-logo-on-000.png");
}
@media only screen and (min-width: 770px) {
  .logo-lr {
    margin-top: 1rem;
  }
}
@media only screen and (min-width: 990px) {
  .logo-lr {
    width: 19rem;
  }
}
@media only screen and (min-width: 1200px) {
  .logo-lr {
    width: 22rem;
  }
}
@media only screen and (min-width: 1500px) {
  .logo-lr {
    width: 28rem;
  }
}
.logo-nait {
  background-image: url("../images/nonsense-nait.png");
  height: 11rem;
  width: 8rem;
}
@media only screen and (min-width: 990px) {
  .logo-nait {
    width: 7rem;
  }
}
.dropdown-container h3 {
  margin-bottom: 0;
  text-decoration: underline;
}
.dropdown-container ul {
  padding-left: 0;
  transition: 300ms;
  margin-top: 0;
}
.dropdown-container ul li {
  transition: 300ms;
}
.dropdown-container ul li:hover {
  padding-left: 2rem;
  cursor: pointer;
}
.dropdown-container ul li:hover i {
  opacity: 1;
}
.dropdown-container ul li i {
  opacity: 0;
  padding-left: 1rem;
  color: #ff0;
  transition: 300ms;
}
.credentials-row {
  padding-bottom: 4rem;
}
.input__label--hosi-color-1::after {
  border-bottom: 3px solid #29d;
}
.contact-form {
  padding: 1rem;
  width: 100%;
  position: relative;
  color: #fff;
  background-color: transparent;
}
.contact-form a {
  color: #ecf0f1;
}
.contact-form .input {
  display: block;
  margin-left: 0;
}
.contact-form h3 {
  padding-bottom: 3rem;
  color: #fff;
  font-weight: 900;
  font-size: 2.5rem;
}
@media only screen and (min-width: 990px) {
  .contact-form h3 {
    font-size: 3.8rem;
  }
}
.contact-form em {
  font-weight: bold;
  font-style: normal;
  font-size: 1.6rem;
}
@media only screen and (min-width: 990px) {
  .contact-form em {
    font-size: 1.8rem;
  }
}
.contact-form .arrow-down-icon:before {
  content: '';
  display: none;
  position: absolute;
  top: 15%;
  right: 25%;
  width: 50px;
  height: 50px;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url("../images/curved_arrow_down.svg");
}
.contact-form .arrow-down-icon.thick-underline {
  border-bottom: 0.88rem solid #fff;
  padding-bottom: 6px;
  margin-bottom: 1rem;
}
@media only screen and (min-width: 990px) {
  .contact-form .arrow-down-icon.thick-underline {
    margin-bottom: 2rem;
  }
}
.contact-form textarea {
  line-height: 0.7;
  resize: none;
}
.contact-form-footer .fa,
.contact-form-footer .glyphicon {
  color: #ecf0f1;
  padding-bottom: 0.5rem;
  display: inline-block;
  padding-right: 15px;
}
.contact-form-footer .fa {
  font-size: 1.9rem;
}
.contact-form-footer .glyphicon {
  font-size: 1.5rem;
}
.contact-form-footer p {
  color: #ecf0f1;
  font-size: 1.3rem;
  line-height: 1.5;
  margin-bottom: 2em;
}
@media only screen and (min-width: 990px) {
  .contact-form-footer p {
    font-size: 1.55rem;
  }
}
.contact-form-footer h3 {
  color: #ecf0f1;
}
.contact-form-footer input {
  color: #ecf0f1;
  font-weight: 400;
  background-color: transparent;
  border: none;
  width: 180px;
  display: inline-block;
}
@media only screen and (min-width: 990px) {
  .contact-form-footer input {
    width: 200px;
  }
}
.divider {
  width: 100%;
  display: block;
  border-bottom: 1px solid #ecf0f1;
  padding-top: 6rem;
  margin-bottom: 6rem;
  position: relative;
}
.divider:before {
  content: 'OR';
  font-size: 1.2rem;
  line-height: 1.5;
  display: block;
  position: absolute;
  right: 50%;
  bottom: 0;
  background-color: #2c3e50;
  -webkit-transform: translateX(50%) translateY(50%);
      -ms-transform: translateX(50%) translateY(50%);
          transform: translateX(50%) translateY(50%);
  border-radius: 50%;
  color: #ecf0f1;
  border: 2px solid #ecf0f1;
  padding: 0.8rem;
}
.input__field--hoshi {
  color: #fff;
}
.glyphicon-exclamation-sign {
  display: none;
  position: absolute;
  right: 0;
  top: 2rem;
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
}
.thick-underline {
  border-bottom: 0.88rem solid #000;
}
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
}
.blog-post-container {
  text-align: left;
  padding: 2rem;
  background-color: transparent;
  margin-bottom: 3rem;
  border: 2px solid #ecf0f1;
  cursor: pointer;
  color: #ecf0f1;
  transition: 300ms;
}
.blog-post-container:hover {
  background-color: #ecf0f1;
  color: #2c3e50;
}
.blog-post-container:hover h4 {
  color: #2c3e50;
  border-color: #2c3e50;
}
.blog-post-container:hover p {
  color: #2c3e50;
}
.blog-post-container:hover p:after {
  border-color: #2c3e50;
}
.blog-post-container h4 {
  margin-top: 0;
  transition: 300ms;
}
.blog-post-container p {
  transition: 300ms;
  position: relative;
  padding-bottom: 1rem;
  margin-bottom: 0;
}
.blog-post-container p:after {
  content: '';
  display: block;
  width: 33.33%;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  border-bottom: 2px solid #ecf0f1;
}
.blog-header {
  color: #ecf0f1;
  margin-bottom: 0.7rem;
  padding-bottom: 0.7rem;
  border-bottom: 7px solid #ecf0f1;
  font-weight: 900;
  font-size: 2.8rem;
  transition: 300ms;
  text-transform: initial;
}
@media only screen and (min-width: 990px) {
  .blog-header {
    font-size: 3.33rem;
  }
}
.blog-links {
  padding-top: 2rem;
}
@media only screen and (min-width: 990px) {
  .blog-links {
    padding-top: 6rem;
  }
}
.blog-links h4 {
  margin-top: 0;
}
.blog-links a {
  color: #ecf0f1;
}
.blog-links .examples-list {
  padding-left: 0;
}
.blog-time {
  display: block;
  font-size: 1rem;
  vertical-align: top;
  margin-bottom: 1.5rem;
}
.blog-padding {
  padding: 0;
}
@media only screen and (min-width: 990px) {
  .blog-padding {
    padding: 0 16rem;
  }
}
.blog-content h2 {
  font-family: 'Raleway', sans-serif;
  color: #ecf0f1;
  margin-top: 0;
  margin-bottom: 1em;
}
.blog-content h3 {
  margin-top: 1em;
  margin-bottom: 0.5em;
}
.blog-content ul {
  padding-bottom: 0;
}
.blog-content pre {
  color: #eee;
  background-color: #100d0d;
}
.back-button {
  position: absolute;
  top: 0;
  left: -3rem;
  font-size: 0.5rem;
  cursor: pointer;
  z-index: 10;
  font-weight: bold;
}
@media only screen and (min-width: 990px) {
  .back-button {
    font-size: 1rem;
    top: 0;
    left: 3rem;
  }
}
.back-button:hover {
  color: #e74c3c;
}
ul.nav-tabs {
  padding: 0 0 5px 0;
  border-bottom: none;
}
ul.nav-tabs li {
  padding: 0;
}
ul.nav-tabs li a {
  color: #ecf0f1;
  background-color: transparent;
  padding: 10px;
  border-radius: 0;
  transition: 300ms;
  margin-right: 4px;
  border: 2px solid #ecf0f1;
  margin-bottom: 4px;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}
@media only screen and (min-width: 990px) {
  ul.nav-tabs li a {
    margin-bottom: 0;
  }
}
ul.nav-tabs li a:hover,
ul.nav-tabs li a:focus {
  background-color: #ecf0f1;
  color: #2c3e50;
}
.pagination-label {
  letter-spacing: 1px;
  font-weight: bold;
  display: inline-block;
  padding-bottom: 2rem;
}
.pagination >.disabled >a:focus {
  background-color: transparent;
  border-color: transparent;
}
.pagination >.active >a:focus {
  border-color: transparent;
  background-color: transparent;
}
.blog-cms-container label {
  color: #ecf0f1;
  display: block;
}
.blog-cms-container input,
.blog-cms-container textarea,
.blog-cms-container select {
  color: #222;
  width: 100%;
}
.blog-cms-container textarea {
  height: 400px;
  line-height: 1.25;
  font-weight: normal;
}
.blog-cms-container .btn-outline {
  color: #ecf0f1;
}
.blog-cms-container .btn-outline:hover {
  color: #55bf55;
  border-color: #55bf55;
}
.addthis_inline_follow_toolbox {
  margin-top: 3rem;
}
.addthis_inline_follow_toolbox p {
  margin: 0 !important;
}
.addthis_default_style a {
  float: none !important;
}
.addthis_default_style a:hover {
  -webkit-transform: none !important;
      -ms-transform: none !important;
          transform: none !important;
}
.at-icon-wrapper {
  background-color: transparent !important;
  height: 48px !important;
  width: 48px !important;
  line-height: 48px !important;
  transition: 600ms !important;
  border-radius: 5px !important;
}
.at-icon-wrapper:hover .at-icon {
  fill: #ecf0f1 !important;
}
.at-icon {
  fill: #2c3e50 !important;
  width: 100% !important;
  height: 100% !important;
}
.ngdialog-overlay {
  background: rgba(0,0,0,0.86);
}
.ngdialog.ngdialog-theme-default .ngdialog-content {
  background: #2c3e50;
  border-radius: 0;
  margin: 0;
  position: absolute;
  top: 0;
  bottom: -300px;
  width: 80%;
}
@media only screen and (min-width: 990px) {
  .ngdialog.ngdialog-theme-default .ngdialog-content {
    margin-bottom: 0;
    width: 33.33%;
  }
}
.ngdialog-close:before {
  color: #f8f9e9;
  font-size: 6rem !important;
  top: 2rem !important;
  right: 2rem !important;
}
.ngdialog-close:hover:before {
  color: #e74c3c !important;
}
.horizontal-divider:before {
  content: '';
  width: 100%;
  display: block;
  border-top: 1px solid #ecf0f1;
  padding: 4rem 4rem;
}
.thanks-container {
  color: #ecf0f1;
  padding: 2rem;
}
.thanks-container h3 {
  padding-bottom: 1rem;
  color: #fff;
  font-weight: 900;
}
.thanks-container p {
  color: #f8f9e9;
}
.thanks-container .thick-underline {
  border-color: #fff;
}
.port-piece {
  transition: 100ms;
  padding: 15px;
  display: block;
}
.example-inner {
  transition: 300ms;
  padding: 1rem;
  color: #333;
  font-family: "Helvetica", "Helvetica-Neue", sans-serif;
}
.example-inner span {
  display: block;
  border-bottom: 7px solid #2c3e50;
  font-family: inherit;
  font-weight: 900;
  margin-bottom: 1rem;
  padding-bottom: 2px;
}
.skills-list {
  padding: 1rem 0 0 0;
}
.skills-list li {
  display: inline-block;
  position: relative;
  padding: 0 2rem 0 0;
}
.skills-list li:first-child:before {
  content: '';
  display: none;
}
.skills-list li:before {
  content: '•';
  display: block;
  color: #333;
  position: absolute;
  left: -15px;
  font-size: 1.6em;
  bottom: 50%;
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
}
ul.examples-list {
  padding: 0;
}
.work-examples-container [class^="col-"].paragraph-content {
  padding-bottom: 4rem;
}
h4.examples-header {
  font-size: 1.15em;
  margin-top: 2rem;
  font-weight: 900;
  color: #ecf0f1;
  font-family: "Raleway", sans-serif;
}
@media only screen and (min-width: 990px) {
  h4.examples-header {
    font-size: 1.33em;
  }
}
.page-portfolio .form-control {
  border-radius: 0;
}
.page-portfolio .nutritional-info-label {
  font-size: 1em;
  margin-bottom: 0;
}
.page-portfolio .nutritional-header {
  border-bottom: 0.667rem solid #333;
}
.page-portfolio .nutritional-header .nutritional-main-title {
  font-size: 1.218em;
}
.page-portfolio .nutritional-foot {
  border-top: 0.467rem solid #333;
  font-size: 0.998em;
  padding-bottom: 0;
  padding-top: 1rem;
}
.page-portfolio .piece-link-container {
  border: 2px solid #333;
  border-top: none;
  height: 55px;
  position: relative;
  z-index: 1;
}
.page-portfolio .piece-link-container:before {
  content: '';
  transition: 300ms;
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: rgba(51,51,51,0.99);
  z-index: 2;
}
.page-portfolio .portfolio-legend p {
  margin-bottom: 0.8rem;
  line-height: 1.1;
}
.port-piece .piece-link-container:hover .link-overlay {
  color: #3498db;
  letter-spacing: 3px;
}
.port-piece .link-overlay {
  transition: 300ms;
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  padding-top: 15px;
  text-decoration: none;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.port-piece .skills em {
  font-weight: 500;
}
.page-home {
  background: #2c3e50;
  color: #ecf0f1;
}
.page-contact {
  background: #00d291;
  color: #ecf0f1;
}
.page-portfolio {
  background: #2c3e50;
  color: #ecf0f1;
}
.page-blog {
  background: #2c3e50;
  color: #ecf0f1;
}
.no-animate {
  transition: none;
}
.ng-enter {
  z-index: 8888;
  -webkit-animation: slideInUp 300ms both ease-in;
          animation: slideInUp 300ms both ease-in;
}
@-webkit-keyframes rotateFall {
  0% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
  20% {
    -webkit-transform: rotateZ(10deg);
            transform: rotateZ(10deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: rotateZ(17deg);
            transform: rotateZ(17deg);
  }
  60% {
    -webkit-transform: rotateZ(16deg);
            transform: rotateZ(16deg);
  }
  100% {
    -webkit-transform: translateY(100%) rotateZ(17deg);
            transform: translateY(100%) rotateZ(17deg);
  }
}
@keyframes rotateFall {
  0% {
    -webkit-transform: rotateZ(0deg);
            transform: rotateZ(0deg);
  }
  20% {
    -webkit-transform: rotateZ(10deg);
            transform: rotateZ(10deg);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  40% {
    -webkit-transform: rotateZ(17deg);
            transform: rotateZ(17deg);
  }
  60% {
    -webkit-transform: rotateZ(16deg);
            transform: rotateZ(16deg);
  }
  100% {
    -webkit-transform: translateY(100%) rotateZ(17deg);
            transform: translateY(100%) rotateZ(17deg);
  }
}
@-webkit-keyframes slideOutLeft {
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
@keyframes slideOutLeft {
  to {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}
@-webkit-keyframes slideOutRight {
  to {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@keyframes slideOutRight {
  to {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}
@-webkit-keyframes rotateOutNewspaper {
  to {
    -webkit-transform: translateZ(-3000px) rotateZ(360deg);
            transform: translateZ(-3000px) rotateZ(360deg);
    opacity: 0;
  }
}
@keyframes rotateOutNewspaper {
  to {
    -webkit-transform: translateZ(-3000px) rotateZ(360deg);
            transform: translateZ(-3000px) rotateZ(360deg);
    opacity: 0;
  }
}
@-webkit-keyframes scaleUp {
  from {
    opacity: 0.3;
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
}
@keyframes scaleUp {
  from {
    opacity: 0.3;
    -webkit-transform: scale(0.8);
            transform: scale(0.8);
  }
}
@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes slideInRight {
  from {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@keyframes slideInLeft {
  from {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
}
@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes slideInUp {
  from {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes slideInDown {
  from {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}
@keyframes slideOutUp {
  from {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(100%);
            transform: translateY(100%);
  }
}
@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}
@keyframes slideOutDown {
  from {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%);
  }
}
.nutritional-info-label {
  border: 2px solid;
  color: #333;
  background-color: #ecf0f1;
  font-size: 1.66rem;
  font-family: "Helvetica", "Helvetica-Neue", sans-serif;
  border-collapse: initial;
  padding: 2rem;
  margin-bottom: 6rem;
}
@media only screen and (min-width: 990px) {
  .nutritional-info-label {
    margin-bottom: 0;
  }
}
.nutritional-header {
  border-bottom: 1.66rem solid #333;
  padding-bottom: 0.33rem;
  font-size: 1.4rem;
}
@media only screen and (min-width: 990px) {
  .nutritional-header {
    font-size: 1.66rem;
  }
}
.nutritional-header span {
  display: block;
  font-weight: 600;
}
.nutritional-header .nutritional-main-title {
  font-weight: 900;
  line-height: 1.1;
  font-size: 2.618em;
}
.nutritional-header .nutritional-secondary-title {
  margin-top: 1rem;
}
.nutritional-sub-title {
  font-size: 1.2rem;
  font-weight: 900;
}
.nutritional-body .technologies .row {
  transition: 100ms;
}
.nutritional-body .technologies .row:hover {
  color: #e74c3c;
}
.nutritional-foot,
.nutritional-body {
  padding-top: 0.33rem;
}
.nutritional-foot .row,
.nutritional-body .row {
  margin-left: 0;
  margin-right: 0;
}
.nutritional-foot .row [class*="col-"],
.nutritional-body .row [class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}
.nutritional-foot .underline,
.nutritional-body .underline {
  border-bottom: 2px solid #333;
}
.nutritional-foot .overline,
.nutritional-body .overline {
  border-top: 2px solid #333;
}
.nutritional-foot .thick-underline,
.nutritional-body .thick-underline {
  border-bottom: 0.88rem solid #333;
}
.nutritional-foot .no-border,
.nutritional-body .no-border {
  border-top: none;
}
.nutritional-foot em,
.nutritional-body em {
  font-weight: 900;
  font-style: normal;
}
.nutritional-foot span,
.nutritional-body span {
  padding-top: 2px;
  display: inline-block;
}
.text-right {
  text-align: right;
}
em {
  padding-right: 4px;
}
.nutritional-foot {
  border-top: 1.66rem solid #333;
  border-bottom: none;
  padding-bottom: 1rem;
}
.nutritional-foot .row {
  border-bottom: none;
}
.nutritional-foot .row .text-right:before {
  content: '';
  display: block;
  position: absolute;
  bottom: 50%;
  left: 0;
  -webkit-transform: translateY(50%);
      -ms-transform: translateY(50%);
          transform: translateY(50%);
  line-height: 0.75;
  width: 10px;
  height: 10px;
  background: #333;
  border-radius: 50%;
}
.nutritional-foot .footer-free-text {
  padding-top: 1rem;
}
.nutritional-foot .footer-free-text p {
  margin: 0;
  font-weight: 500;
  font-size: 1em;
}
.nutritional-foot a {
  color: #333;
  font-weight: 500;
}
.nutritional-foot .other-tech {
  margin-bottom: 1em;
}
.input {
  position: relative;
  z-index: 1;
  display: inline-block;
  margin: 0.5em;
  vertical-align: top;
}
.input__field {
  position: relative;
  display: block;
  float: right;
  padding: 0.8em;
  width: 60%;
  border: none;
  border-radius: 0;
  background: #f0f0f0;
  color: #aaa;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  -webkit-appearance: none;
}
.input__field:focus {
  outline: none;
}
.input__field.input-filled {
  outline: none;
}
.input__label {
  display: inline-block;
  float: right;
  padding: 0 1em;
  width: 40%;
  color: #fff;
  font-weight: bold;
  font-size: 1.5rem;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.input__label-content {
  position: relative;
  display: block;
  padding: 1.6em 0;
  width: 100%;
}
.graphic {
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
}
.icon {
  color: #ddd;
  font-size: 150%;
}
.input--hoshi {
  overflow: hidden;
}
.input__field--hoshi {
  margin-top: 1em;
  padding: 0.85em 0.15em;
  width: 100%;
  background: transparent;
  color: #fff;
}
.input__label--hoshi {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0 0.25em;
  width: 100%;
  height: calc(100% - 1em);
  text-align: left;
  pointer-events: none;
}
.input__label--hoshi::after {
  margin-top: 1px;
  border-bottom: 4px solid #f00;
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
  transition: -webkit-transform 450ms;
  transition: transform 450ms;
  transition: transform 450ms, -webkit-transform 450ms;
}
.input__label-content--hoshi {
  position: absolute;
}
.input__label--hoshi::after,
.input__label--hoshi::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 10px);
  border-bottom: 2px solid #fff;
}
.input__label--hoshi-color-1::after {
  border-color: #0af;
}
.input__label--hoshi-color-2::after {
  border-color: #3498db;
}
.input__label--hoshi-color-3::after {
  border-color: #f50;
}
.input-invalid ~ .input__label--hoshi-color-2::after {
  border-color: #e74c3c;
}
.input-invalid ~ .input__label--hoshi-color-2 .glyphicon-exclamation-sign {
  display: block;
}
.input__field--hoshi:focus + .input__label--hoshi::after,
.input__field--hoshi.input-filled ~ .input__label--hoshi::after {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.input__field--hoshi:focus + .input__label--hoshi .input__label-content--hoshi,
.input__field--hoshi.input-filled ~ .input__label--hoshi .input__label-content--hoshi {
  -webkit-animation: anim-1 450ms forwards;
  animation: anim-1 450ms forwards;
  color: #3498db;
}
.input__field--hoshi:focus + .input-invalid .input__label-content--hoshi,
.input__field.input-invalid ~ .input__label--hoshi .input__label-content--hoshi {
  color: #e74c3c;
}
@-webkit-keyframes anim-1 {
  50% {
    opacity: 0;
    -webkit-transform: translate3d(1rem, 0, 0);
    transform: translate3d(1rem, 0, 0);
  }
  51% {
    opacity: 0;
    -webkit-transform: translate3d(-1rem, -40%, 0);
    transform: translate3d(-1rem, -40%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, -40%, 0);
    transform: translate3d(0, -40%, 0);
  }
}
@-webkit-keyframes anim-1 {
  50% {
    opacity: 0;
    -webkit-transform: translate3d(1rem, 0, 0);
    transform: translate3d(1rem, 0, 0);
  }
  51% {
    opacity: 0;
    -webkit-transform: translate3d(-1rem, -40%, 0);
    transform: translate3d(-1rem, -40%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, -40%, 0);
    transform: translate3d(0, -40%, 0);
  }
}
@keyframes anim-1 {
  50% {
    opacity: 0;
    -webkit-transform: translate3d(1rem, 0, 0);
    transform: translate3d(1rem, 0, 0);
  }
  51% {
    opacity: 0;
    -webkit-transform: translate3d(-1rem, -40%, 0);
    transform: translate3d(-1rem, -40%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, -40%, 0);
    transform: translate3d(0, -40%, 0);
  }
}