@font-face {
    font-family: 'nexa_boldregular';
    src: url('fonts/nexa_bold/nexa_bold-webfont.eot');
    src: url('fonts/nexa_bold/nexa_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/nexa_bold/nexa_bold-webfont.woff') format('woff'),
         url('fonts/nexa_bold/nexa_bold-webfont.ttf') format('truetype'),
         url('fonts/nexa_bold/nexa_bold-webfont.svg#nexa_boldregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
  background: white;
}

body,
h1, h2, h4, h5, h6,
div,
.navbar ul li,
.navbar ul li a,
button,
input,
form,
blockquote {
    font-family: 'nexa_boldregular', 'Varela', "Trebuchet MS", Helvetica, sans-serif;
}

p, a, ul, li, h3 {
    font-family: Geneva, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
}

.uppercase {
  text-transform: uppercase;
}

span.i-b {
  display: inline-block;
}

.inline-margin-left {
  display: inline-block;
  margin-left: .5em;
}
.inline-margin-right {
  display: inline-block;
  margin-right: .5em;
}
.inline-margin-sides {
  display: inline-block;
  margin-left: .5em;
  margin-right: .5em;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}

.icon-bouncing {
    -moz-animation: bounce 2s infinite;
    -webkit-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
}

.scroll-arrow {
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -11.5px;
  font-size: 35px;
  cursor: pointer;
  color: rgba(255, 20, 108, .5);
}

.scroll-arrow:hover {
  color: rgba(255, 20, 108, 1);
}

@media(min-width: 768px) and (min-height: 595px) {
  .scroll-arrow {
    padding: 18px 18px 6px;
  }

  .scroll-arrow.lg {
    margin-left: -22.5px;
    font-size: 70px;
    bottom: 0;
  }
}

section {
  position: relative;
  overflow: hidden;
  color: rgb(0,229,197);
}

section .container.inner {
  padding: 0 15px 35px 15px;
}

h1.big {
  font-size: 1.8em;
  padding-top: 0;
}

h2.section-title {
  margin: 0;
  font-size: 1.3em;
  position: relative;
  text-transform: uppercase;
}

h5.position {
  margin-bottom: 15px;
}

.tri {
  width: 0;
  height: 0;
  border: 0 solid transparent;
  border-top-width: 30px;
  border-bottom-width: 30px;
  border-top-color: rgba(0,52,45,.08);
  border-top-color: rgb(0,229,197);

  position: absolute;
  bottom: -60px;
}

.section-title {
  color: rgb(249,255,254);
}

.title-wrapper {
  background: rgb(0,229,197);
  position: relative;
  margin-bottom: 50px;
}

i.section-bg {
  position: absolute;
  bottom: -50px;
  right: -10px;
  font-size: 300px;
}

img.section-bg {
  position: absolute;
}

#intro .section-bg {
  bottom: -3px;
  right: -13px;
}

#design .section-bg {
  bottom: -60px;
}

#svm .section-bg {
  bottom: -10px;
  right: -36px;
  opacity: .1;
}

#oniracom .section-bg {
  bottom: -60px;
  right: -20px;
}

a,
h4 a,
a:hover,
h4 a:hover,
a:focus,
h4 a:focus,
.stars {
  text-decoration: none;
  color: rgba(255, 20, 108, .7);
}

a {
  text-decoration: none;
}

.jw-transition,
a,
.scroll-arrow
 {
  -webkit-transition: color .4s ease, border-color .4s ease, background .4s ease, opacity .4s ease;
    -moz-transition: color .4s ease, border-color .4s ease, background .4s ease, opacity .4s ease;
    -o-transition: color .4s ease, border-color .4s ease, background .4s ease, opacity .4s ease;
    -ms-transition: color .4s ease, border-color .4s ease, background .4s ease, opacity .4s ease;
    transition: color .4s ease, border-color .4s ease, background .4s ease, opacity .4s ease;
}

a:hover {
  color: rgba(255, 20, 108, 1);
}

h3 {
  line-height: 2em;
}

section#edu h3 {
  margin-bottom: 15px;
  line-height: 1.5em;
}

section .container.inner,
.full-height,
table.section,
table.section tbody,
table.section tr,
table.section td {
  height: 100%;
  vertical-align: middle;
}

section#svm table.section td {
  vertical-align: text-top;
}

table.section td {
  /*padding-bottom: 60px;*/
}

section#edu p {
}

section#edu h3 {
  margin: 0;
}

.school:first-child {
  margin-bottom: 20px;
}

.school p {
  margin-bottom: 8px;
}

.divider {
  color: rgb(255, 20, 108);
  background: rgb(255, 20, 108);
}

.school-divider {
  height: 1px;
  width: 90px;
  border: none;
  margin: 15px 0;
  text-align: left;
}

.contact-divider {
  height: 1px;
  width: 90px;
  border: none;
  margin: 5px 0 15px 0;
  text-align: left;
}

.other-divider {
  height: 1px;
  width: 90px;
  border: none;
  margin: 25px 0;
  text-align: left;
}

.vert-divider {
  /*color: rgba(255,255,255,.3);*/
  padding: 0 10px;
  background: none;
  /*opacity: .5;*/
}

a#print {
  opacity: 1 !important;
  padding: 13px 22px;
  margin: 0;
  border: 4px solid rgb(0,229,197);
  border-radius: 15px;
  background: none;
  display: inline-block;
  color: rgb(0,229,197);
  line-height: 1.3;
  font-size: 1.1em;
}

a#print:hover {
  color: white;
  background: rgb(0,229,197);
}

a#print i {
  margin-right: 15px;
}

a#print:hover h5 {
  background: rgba(229,255,250,1);
}

.other-skill {
  display: inline-block;
  margin-right: 30px;
  text-align: center;
}

.other-skill h5 {
  padding: 0;
  margin: 0 0 5px 0;
}

section#design h6 {
  font-size: 4em;
  text-align: center;
  /*color: white;*/
  margin-bottom: 0;
  line-height: .9;
}

section#design h4 {
  font-size: 1.4em;
}

#intro h3 {
  font-weight: bold;
}

@media (max-width: 480px) {
  body { font-size: 15px }
}

@media (min-width: 481px) and (max-width: 767px) {
  body { font-size: 17px }
}

@media (min-width: 768px) and (max-width: 991px) {
  body { font-size: 18px }
}

@media (min-width: 992px) and (max-width: 1199px) {
  body { font-size: 20px }
}

@media (max-width: 767px) {

    h1.big {
      padding-top: 15px;
    }

    section {
      padding-bottom: 100px;
    }

    i.section-bg {
      color: rgba(0,0,0,.033);
      font-size: 150px;
      bottom: -20px;
    }

    img.section-bg {
      opacity: 0.033;
      max-height: 155px;
    }

    section#oniracom .section-bg {
      bottom: -10px;
    }

    .title-wrapper {
      padding: 0;
    }

    h2.section-title {
      text-align: left;
      padding: 15px 0;
    }

    .tri {
      border-left-width: 50px;
      border-right-width: 50px;
      left: 30px;
    }

    #intro h3 {
      font-size: 22px;
    }

}

@media (min-width: 768px) {

  #undergrad {
    margin-bottom: 20px;
  }

  i.section-bg {
    color: rgba(0,0,0,.06);
  }

  img.section-bg {
    opacity: 0.06;
  }

  h2.section-title {
    display: inline-block;
    width: 350px;
    text-align: center;
    padding: 15px 0 10px;
  }

  .tri {
    border-left-width: 175px;
    border-right-width: 175px;
  }

}

section#intro {
  padding-bottom: 50px;

  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 768px) and (min-height: 595px) {
  section#intro {
    padding-bottom: 0px;
  }
}

@media (min-width: 1200px) {
  body {
    font-size: 22px;
  }

  h1.big {
    font-size: 52px;
  }

  p {
    font-size: 18px;
  }

}

.stars {
  display: inline-block;
}

h5 {
  text-transform: uppercase;
}

@media(max-width: 767px) {
  .col-social-links > .clearfix {
    padding-bottom: 15px;
    text-align: center;
  }

  .social-link {
    margin: 0 5px;
  }
}

.social-link {
  display: inline-block;
}

@media(min-width: 768px) {

  .social-link {
    margin-left: 10px;
  }

  .col-social-links > .clearfix {
    padding-bottom: 10px;
    text-align: right;
  }

  #dev-social-links {
    margin-top: -35px;
  }
}

.badge-skill {
  display: inline-block;
  margin-right: .5em;
  margin-bottom: .8em;
  background: rgb(0,209,180);
  font-size: 1em;
}

@media(min-width: 992px) {
  .badge-skill {
    font-size: .9em;
  }
}

h6 {
  text-transform: uppercase;
}