@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,500,700,700i,900,900i');

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Light'), local('Roboto-Light'),
  url('/assets/fonts/roboto/subset-Roboto-Light.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-Light.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Light Italic'), local('Roboto-LightItalic'),
  url('/assets/fonts/roboto/subset-Roboto-LightItalic.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-LightItalic.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Regular'), local('Roboto-Regular'),
  url('/assets/fonts/roboto/subset-Roboto-Regular.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-Regular.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Medium'), local('Roboto-Medium'),
  url('/assets/fonts/roboto/subset-Roboto-Medium.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-Medium.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Bold'), local('Roboto-Bold'),
  url('/assets/fonts/roboto/subset-Roboto-Bold.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-Bold.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'),
  url('/assets/fonts/roboto/subset-Roboto-BoldItalic.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-BoldItalic.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Black'), local('Roboto-Black'),
  url('/assets/fonts/roboto/subset-Roboto-Black.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-Black.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'RobotoLocal';
  src: local('Roboto Black Italic'), local('Roboto-BlackItalic'),
  url('/assets/fonts/roboto/subset-Roboto-BlackItalic.woff2') format('woff2'),
  url('/assets/fonts/roboto/subset-Roboto-BlackItalic.woff') format('woff'),
  url('/assets/fonts/roboto/subset-Roboto-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
}

body {
  font-family: 'Roboto', 'RobotoLocal', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 1rem;
}

h3 {
  text-transform: uppercase;
  font-size: 2.25rem;
  font-weight: 300;
  line-height: 1.2;
  margin-bottom: 45px;
}

img { max-width: 100%; }

.btn {
  border-radius: 0;
  background: none;
}
.btn:active,
.btn:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.show>.btn-secondary.dropdown-toggle:focus,
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show>.btn-secondary.dropdown-toggle {
  background-color: #FFF;
  box-shadow: none;
  color: #000;
}

nav .btn-secondary {
  color: #fff;
  border-color: #fff;
}

.blockquote {
  font-size: 2.625rem;
  font-weight: 900;
  font-style: italic;
  line-height: 1;
}
.blockquote-footer::before {
  content: '';
  display: none;
}
.blockquote-footer {
  font-size: 1.5rem;
  font-weight: 700;
  font-style: italic;
  line-height: 1.2;
  margin: 14px 32px 0 0;
  color: #5f5f5f;
}

.btn-primary {
  background: #FFF;
  color: #05111E;
  border-color: #fff;
  border: none;
  font-size: 1.125rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 2px;
  line-height: 1;
  padding: 12px 50px;
}
.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):active {
  background: #507aa7;
  color: #FFF;
  box-shadow: 0px 0px 20px #5e35357a !important;
}
.btn-secondary {
  border-color: rgba(43, 43, 43, 0.35);
  color: #000;
}
.btn-secondary:hover {
  background: #507aa7;
  border-color: #507aa7;
  color: #FFF;
}

nav {
  height: 65px;
  background: #2D2D2D;
  font-size: 0.875rem;
  font-weight: 400;
  color: #fff;
}
nav p {
  float: left;
  margin: -2px 20px 0 0;
  line-height: 1.4;
  font-size: 13px;
}
nav .btn {
  font-size: 0.825rem;
  letter-spacing: 1px;
  width: 150px;
  height: 35px;
}

.logo {
  width: 145px;
  height: 45px;
  background: url('/images/logo-x2.png') no-repeat;
  background-size: 145px 45px;
  float: left;
  margin-right: 35px;
}
.logo-studio {
  width: 184px;
  height: 35px;
  background: url('/images/logo-studio-x2.png') no-repeat;
  background-size: 184px 35px;
  float: left;
  margin-top: 5px;
}

header {
  height: 829px;
  position: relative;
  background: url('/images/header.jpg') no-repeat;
  background-size: cover;
  background-position: center;
  margin-top: 65px;
  border-bottom: 5px solid #2D4B6B;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
header > .container {
  position: relative;
  height: 100%;
}
/* header:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(144, 73, 73, 0.4);
}
header .overlay {
  position: absolute;
  width: 100%;
  height: 45%;
  bottom: 0;
  background: -moz-linear-gradient(top, rgba(61,7,7,0) 0%, rgba(61,7,7,0.75) 100%);
  background: -webkit-linear-gradient(top, rgba(61,7,7,0) 0%,rgba(61,7,7,0.75) 100%);
  background: linear-gradient(to bottom, rgba(61,7,7,0) 0%,rgba(61,7,7,0.75) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003d0707', endColorstr='#bf3d0707',GradientType=0 );
} */
header .course-title,
header .course-price {
  z-index: 10;
}
header .course-title {
  text-align: left;
  position: absolute;
  top: 42%;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.course-title h1 {
  font-size: 3rem;
  font-weight: 300;
  color: #FFF;
  text-transform: uppercase;
}
.course-title span {
  padding: 0 12px;
  display: inline-block;
  position: relative;
}
.course-title .blue {
  background: #05111E;
  z-index: 11;
}
.course-title .blue:after {
  content: "";
  width: 171px;
  height: 57px;
  background: #2b4b6c;
  background: -moz-linear-gradient(left, #2b4b6c 0%, #2b4b6c 33%, #496c92 33%, #496c92 66%, #507aa7 66%, #507aa7 66%, #507aa7 100%);
  background: -webkit-linear-gradient(left, #2b4b6c 0%,#2b4b6c 33%,#496c92 33%,#496c92 66%,#507aa7 66%,#507aa7 66%,#507aa7 100%);
  background: linear-gradient(to right, #2b4b6c 0%,#2b4b6c 33%,#496c92 33%,#496c92 66%,#507aa7 66%,#507aa7 66%,#507aa7 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b4b6c', endColorstr='#507aa7',GradientType=1 );
  right: -171px;
  display: block;
  position: absolute;
  top: 0;
}
.course-title .white {
  color: #FFF;
  font-size: 2.25rem;
  font-weight: 700;
  z-index: 10;
  top: 25px;
  line-height: 1.2;
  text-transform: none;
  padding: 0;
}
header .course-price {
  max-width: 100%;
  margin: 0 auto;
  right: 0;
  left: 0;
  bottom: 22%;
  position: absolute;
}
.course-price .price {
  color: #FFF;
  font-size: 1.3125rem;
  line-height: 1.2;
  font-weight: 400;
  margin-top: -7px;
}
.course-price .price strong {
  font-size: 1.75rem;
  font-weight: 900;
}

.vertical-bar {
  width: 65px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: #2D4B6B;
}
.vertical-bar .first {
  top: 165px;
}
.vertical-bar .second {
  top: 75px;
}
.vertical-bar .third {
  top: 75px;
}
#screen-two .container,
#screen-three .container,
#screen-four .container {
  padding: 90px 0;
  position: relative;
}
#screen-two h2,
#screen-three h2,
#screen-four h2 {
  font-size: 1.5rem;
  font-weight: 300;
  margin-bottom: 20px;
}
#screen-two {
  background: rgba(223, 225, 228, 0.1);
  border-bottom: 5px solid #2D4B6B;
}
.course-block {
  font-size: 4rem;
  font-weight: 900;
  font-style: italic;
  color: #fff;
  line-height: 1;
  width: 65px;
  text-align: center;
  display: inline-block;
  position: relative;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.block-number {
  font-weight: 900;
  font-style: italic;
  font-size: 3rem;
  color: #FFF;
  background: #2d4b6b;
  position: relative;
  width: 100%;
  height: 75px;
  margin: 0 auto 25px;
}
.about {
  display: table;
  min-height: 400px;
  padding-top: 48px;
}
.about span {
  display: table-cell;
}
.about p {
  margin-bottom: 0.5rem;
}
.about .bio {
  font-size: 1.125rem;
  font-weight: 300;
  font-style: italic;
  line-height: 1.4;
  margin-bottom: 1.5rem;
}
.about .learn {
  text-transform: uppercase;
  color: #1A3450;
}
.about .learn strong {
  font-weight: 700;
}
.about ul {
  list-style: none;
  padding: 0;
  margin-bottom: 24px;
}
.about ul li {
  margin-bottom: 10px;
  position: relative;
  padding-left: 26px;
  font-weight: 400;
}
.about ul li:before {
  content: '';
  width: 14px;
  height: 14px;
  display: inline-block;
  background: #496B8F;
  margin-right: 12px;
  position: absolute;
  left: 0;
  top: 6px;
}

#screen-three {
  background: rgba(45, 75, 107, 0.05);
  border-bottom: 5px solid #2D4B6B;
}
#screen-three .vertical-bar {
  background: #1A3450;
}

#screen-four {
  background: rgba(223, 225, 228, 0.1);
  border-bottom: 5px solid #2D4B6B;
}

.date {
  font-size: 1.5rem;
  line-height: 1;
  font-weight: 400;
}
.date strong,
.time strong {
  font-weight: 700;
}
.time strong {
  margin-top: 12px;
  display: inline-block;
}

#screen-six {
  padding: 95px 0;
  background: url('/images/contact.jpg') no-repeat;
  background-size: cover;
  position: relative;
}
.contact {
  max-width: 420px;
  margin: 0 auto;
}
.contact h3 {
  color: #2B2B2B;
  text-transform: none;
  letter-spacing: 2px;
  z-index: 11;
}
form {
  z-index: 11;
}
form .form-control,
form .form-control:active,
form .form-control:focus {
  box-shadow: none;
  outline: none;
  border-radius: 0;
  background: transparent;
  border: 1px solid rgba(43, 43, 43, 0.35);
  color: #2B2B2B;
  font-weight: 300;
  font-size: 1.125rem;
  padding: 10px 16px 10px 30px;
  height: auto;
}
form .form-control:focus {
  background: #ffffff21;
}
.form-control::-webkit-input-placeholder { color: #2B2B2B; font-weight: 300; font-size: 1.125rem; }  /* WebKit, Blink, Edge */
.form-control:-moz-placeholder { color: #2B2B2B; font-weight: 300; font-size: 1.125rem; }   /* Mozilla Firefox 4 to 18 */
.form-control::-moz-placeholder { color: #2B2B2B; font-weight: 300; font-size: 1.125rem; }   /* Mozilla Firefox 19+ */
.form-control:-ms-input-placeholder { color: #2B2B2B; font-weight: 300; font-size: 1.125rem; }   /* Internet Explorer 10-11 */
.form-control::-ms-input-placeholder { color: #2B2B2B; font-weight: 300; font-size: 1.125rem; }   /* Microsoft Edge */
form .btn {
  font-size: 1rem;
  font-weight: 300;
  padding: .375rem 2.75rem;
}
form .custom-radio .custom-control-input:checked~.custom-control-label::before {
  background: #FC4745;
}
form .custom-control-input:focus~.custom-control-label::before {
  box-shadow: none;
}
.course-choice {
  font-weight: 400;
  color: #FFF;
}
form label {
  cursor: pointer;
}
form .messages .alert {
  border: none;
  border-radius: 0;
}
form .messages .alert-success {
  background: #fff;
  color: #2D2D2D;
}
.privacy {
  color: #2B2B2B;
  text-align: center;
  margin-top: 24px;
  font-size: 13px;
}
.tooltip {
  line-height: 1.4;
  font-size: 13px;
}
.tooltip-inner {
    max-width: 460px !important;
}

.footer {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: .5rem 1rem;
  background: #2D2D2D;
  color: #fff;
}

.footer p {
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.4;
}

/* Small devices (landscape phones, 576px and up) */
@media screen and (min-width: 576px) {
}
/* Medium devices (tablets, 768px and up) */
@media screen and (min-width: 768px) {
  .left-offset {
    display: flex;
  }
}
/* Large devices (desktops, 992px and up) */
@media screen and (min-width: 992px) {
  .left-offset {
    margin-left: 125px;
  }
}
/* Extra large devices (large desktops, 1200px and up) */
@media screen and (min-width: 1200px) {
}

/* Large devices (desktops, less than 1200px) */
@media screen and (max-width: 1199.98px) {
  header {
    height: 629px;
  }
  header .course-price {
    bottom: 15%;
  }
  .course-title .white {
    font-size: 1.75rem;
    width: 100%;
    text-align: center;
  }
  .course-title h1 {
    text-align: center;
  }
  .course-title .blue:after {
    display: none;
  }
}
/* Medium devices (tablets, less than 992px) */
@media screen and (max-width: 991.98px) {
  header {
    background-position: top center;
  }
  #screen-one {
    background: #fff;
  }
  .blockquote {
    font-size: 1.75rem;
  }
  .blockquote-footer {
    font-size: 1.25rem;
  }
  .time {
    margin-bottom: 35px;
  }
  .btn-primary {
    padding: 12px 25px;
  }
}
/* Small devices (landscape phones, less than 768px) */
@media screen and (max-width: 767.98px) {
  header .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    background: rgba(5, 17, 30, 0.45);
  }
  nav {
    height: auto;
  }
  nav .mob-branding {
    width: 100%;
    margin: 0 auto 12px auto;
  }
  nav .half {
    width: 50%;
    float: left;
  }
  nav .logo,
  nav .logo-studio {
    width: 100%;
    height: 45px;
    background-size: contain;
    background-position: center center;
  }
  nav .float-right {
    float: none !important;
    margin: 0 auto;
  }
  header {
    background-position: 50% 42px;
  }
  header .course-title {
    top: 40%;
  }
  .course-title h1 {
    font-size: 2rem;
  }
  .course-title .white {
    font-size: 1.25rem;
  }
  header .course-price {
    bottom: 5%;
  }
  header .course-price .text-left,
  header .course-price .text-right {
    text-align: center !important;
  }
  .course-price .text-center {
    margin-bottom: 25px;
  }
  .course-price .price {
    float: none !important;
  }
  .blockquote-footer {
    margin-right: 0;
  }
  #screen-one .row > .col-sm-12:last-of-type {
    text-align: center;
  }
  #screen-one .row > .col-sm-12:last-child button {
    margin-right: 0;
    float: none !important;
  }
  #screen-three .container, #screen-four .container {
    padding: 0 0 45px 0;
  }
  #screen-two .container {
    padding-bottom: 45px;
  }
}
/* Extra small devices (portrait phones, less than 576px) */
@media screen and (max-width: 575.98px) {
  header {
    background-position: -320px 42px;
  }
  header .course-title {
    top: 30%;
  }
  header .course-price {
    bottom: 10%;
  }
  #screen-six {
    background-position: -70px 0;
  }
}