body {

  overflow-x: hidden;

}

p {

  font-size: 20px;

}

p.small {

  font-size: 16px;

}

a,

a:hover,

a:focus,

a:active,

a.active {

  color: #3399ff;

  outline: none;

}

h1,

h2,

h3,

h4,

h5,

h6 {

  font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;

  text-transform: uppercase;

  font-weight: 700;

}

hr.star-light,

hr.star-primary {

  padding: 0;

  border: none;

  border-top: solid 5px;

  text-align: center;

  max-width: 250px;

  margin: 25px auto 30px;

}

hr.star-light:after,

hr.star-primary:after {

  content: "\f005";

  font-family: FontAwesome;

  display: inline-block;

  position: relative;

  top: -0.8em;

  font-size: 2em;

  padding: 0 0.25em;

}

hr.star-light {

  border-color: white;

}

hr.star-light:after {

  background-color: #3399ff;

  color: white;

}

hr.star-primary {

  border-color: #ff9900;

}

hr.star-primary:after {

  background-color: white;

  color: #ff9900;

}

.img-centered {

  margin: 0 auto;

}

header {

  text-align: center;

  background: #FDE4BF;

  color: white;

}

header .container {

  padding-top: 100px;

  padding-bottom: 50px;

}

header img {

  display: block;

  margin: 0 auto 20px;

}

header .intro-text .name {

  display: block;

  font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;

  text-transform: uppercase;

  font-weight: 700;

  font-size: 2em;

}

header .intro-text .skills {

  font-size: 1.25em;

  font-weight: 300;

}

@media (min-width: 768px) {

  header .container {

    padding-top: 200px;

    padding-bottom: 100px;

  }

  header .intro-text .name {

    font-size: 4.75em;

  }

  header .intro-text .skills {

    font-size: 1.75em;

  }

}

@media (min-width: 768px) {

  .navbar-fixed-top {

    padding: 25px 0;

    -webkit-transition: padding 0.3s;

    -moz-transition: padding 0.3s;

    transition: padding 0.3s;

  }

  .navbar-fixed-top .navbar-brand {

    font-size: 2em;

    -webkit-transition: all 0.3s;

    -moz-transition: all 0.3s;

    transition: all 0.3s;

  }

  .navbar-fixed-top.navbar-shrink {

    padding: 10px 0;

  }

  .navbar-fixed-top.navbar-shrink .navbar-brand {

    font-size: 1.5em;

  }

}

.navbar {

  font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;

  text-transform: uppercase;

  font-weight: 700;

}

.navbar a:focus {

  outline: none;

}

.navbar .navbar-nav {

  letter-spacing: 1px;

}

.navbar .navbar-nav li a:focus {

  outline: none;

}

.navbar-default,

.navbar-inverse {

  border: none;

}

section {

  padding: 100px 0;

}

section h2 {

  margin: 0;

  font-size: 3em;

}

section.success {

  background: #DEBFFD;

  color: white;

}

section.success a,

section.success a:hover,

section.success a:focus,

section.success a:active,

section.success a.active {

  color: #ff9900;

  outline: none;

}

@media (max-width: 767px) {

  section {

    padding: 75px 0;

  }

  section.first {

    padding-top: 75px;

  }

}

#portfolio .portfolio-item {

  margin-bottom: 25px;

  right: 0;

}

#portfolio .portfolio-item .primary {

  color: #DEBFFD;

}

#portfolio .portfolio-item .secondary {

  color: #DEBFFD;

}

#portfolio .portfolio-item .portfolio-link {

  display: block;

  position: relative;

  max-width: 400px;

  margin: 0 auto;

  text-align: center;

}

#portfolio .portfolio-item .portfolio-link .caption {

  background: rgba(153, 102, 204, 0.9);

  position: absolute;

  width: 100%;

  height: 100%;

  opacity: 0;

  transition: all ease 0.5s;

  -webkit-transition: all ease 0.5s;

  -moz-transition: all ease 0.5s;

}

#portfolio .portfolio-item .portfolio-link .caption:hover {

  opacity: 1;

}

#portfolio .portfolio-item .portfolio-link .caption .caption-content {

  position: absolute;

  width: 100%;

  height: 20px;

  font-size: 20px;

  text-align: center;

  top: 50%;

  margin-top: -12px;

  color: white;

}

#portfolio .portfolio-item .portfolio-link .caption .caption-content i {

  margin-top: -12px;

}

#portfolio .portfolio-item .portfolio-link .caption .caption-content h3,

#portfolio .portfolio-item .portfolio-link .caption .caption-content h4 {

  margin: 0;

}

#portfolio * {

  z-index: 2;

}

@media (min-width: 767px) {

  #portfolio .portfolio-item {

    margin: 0 0 30px;

  }

}

.btn-outline {

  color: white;

  font-size: 20px;

  border: solid 2px white;

  background: transparent;

  transition: all 0.3s ease-in-out;

  margin-top: 15px;

}

.btn-outline:hover,

.btn-outline:focus,

.btn-outline:active,

.btn-outline.active {

  color: #DEBFFD;

  background: white;

  border: solid 2px white;

}

.floating-label-form-group {

  position: relative;

  margin-bottom: 0;

  padding-bottom: 0.5em;

  border-bottom: 1px solid #eeeeee;

}

.floating-label-form-group input,

.floating-label-form-group textarea {

  z-index: 1;

  position: relative;

  padding-right: 0;

  padding-left: 0;

  border: none;

  border-radius: 0;

  font-size: 1.5em;

  background: none;

  box-shadow: none !important;

  resize: none;

}

.floating-label-form-group label {

  display: block;

  z-index: 0;

  position: relative;

  top: 2em;

  margin: 0;

  font-size: 0.85em;

  line-height: 1.764705882em;

  vertical-align: middle;

  vertical-align: baseline;

  opacity: 0;

  -webkit-transition: top 0.3s ease,opacity 0.3s ease;

  -moz-transition: top 0.3s ease,opacity 0.3s ease;

  -ms-transition: top 0.3s ease,opacity 0.3s ease;

  transition: top 0.3s ease,opacity 0.3s ease;

}

.floating-label-form-group::not(:first-child) {

  padding-left: 14px;

  border-left: 1px solid #eeeeee;

}

.floating-label-form-group-with-value label {

  top: 0;

  opacity: 1;

}

.floating-label-form-group-with-focus label {

  color: #DEBFFD;

}

form .row:first-child .floating-label-form-group {

  border-top: 1px solid #eeeeee;

}

footer {

  color: white;

}

footer h3 {

  margin-bottom: 30px;

}

footer .footer-above {

  padding-top: 50px;

  background-color: #DEBFFD;

}

footer .footer-col {

  margin-bottom: 50px;

}

footer .footer-below {

  padding: 25px 0;

  background-color: #233140;

}

.btn-social {

  display: inline-block;

  height: 50px;

  width: 50px;

  border: 2px solid white;

  border-radius: 100%;

  text-align: center;

  font-size: 20px;

  line-height: 45px;

}

.btn:focus,

.btn:active,

.btn.active {

  outline: none;

}

.scroll-top {

  position: fixed;

  right: 2%;

  bottom: 2%;

  width: 50px;

  height: 50px;

  z-index: 1049;

}

.scroll-top .btn {

  font-size: 20px;

  width: 50px;

  height: 50px;

  border-radius: 100%;

  line-height: 28px;

}

.scroll-top .btn:focus {

  outline: none;

}

.portfolio-modal .modal-content {

  border-radius: 0;

  background-clip: border-box;

  -webkit-box-shadow: none;

  box-shadow: none;

  border: none;

  min-height: 100%;

  padding: 100px 0;

  text-align: center;

}

.portfolio-modal .modal-content h2 {

  margin: 0;

  font-size: 3em;

}

.portfolio-modal .modal-content img {

  margin-bottom: 30px;

}

.portfolio-modal .modal-content .item-details {

  margin: 30px 0;

}

.portfolio-modal .close-modal {

  position: absolute;

  width: 75px;

  height: 75px;

  background-color: transparent;

  top: 25px;

  right: 25px;

  cursor: pointer;

}

.portfolio-modal .close-modal:hover {

  opacity: 0.3;

}

.portfolio-modal .close-modal .lr {

  height: 75px;

  width: 1px;

  margin-left: 35px;

  background-color: #ff9900;

  transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  /* IE 9 */

  -webkit-transform: rotate(45deg);

  /* Safari and Chrome */

  z-index: 1051;

}

.portfolio-modal .close-modal .lr .rl {

  height: 75px;

  width: 1px;

  background-color: #ff9900;

  transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  /* IE 9 */

  -webkit-transform: rotate(90deg);

  /* Safari and Chrome */

  z-index: 1052;

}

.portfolio-modal .modal-backdrop {

  opacity: 0;

  display: none;

}


.live-bruh-cams {
  font-size: 6rem;
  border-bottom-color: #2c3e50; 
  border-bottom-style: solid; 
  display: inline-flex;
}

.bruh {
  text-align: center;
}
button {
  display: inline-block;
  background-color: #7b38d8;
  border-radius: 10px;
  border: 4px double #cccccc;
  color: #eeeeee;
  text-align: center;
  font-size: 28px;
  padding: 20px;
  width: 200px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
}
button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}
button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}
button:hover {
  background-color: #f7c2f9;
}
button:hover span {
  padding-right: 25px;
}
button:hover span:after {
  opacity: 1;
  right: 0;
}

.blink {
  animation: blinker 0.06s linear infinite;
  color: #1c87c9;
  font-size: 30px;
  font-weight: bold;
  font-family: sans-serif;
  }
  @keyframes blinker {  
  50% { opacity: 0; }
  }
  .blink-one {
  animation: blinker-one 1s linear infinite;
  }
  @keyframes blinker-one {  
  0% { opacity: 0; }
  }
  .blink-two {
  animation: blinker-two 1.4s linear infinite;
  }
  @keyframes blinker-two {  
  100% { opacity: 0; }
  }

p{
  color: #233140;
}