@charset "UTF-8";

.row { max-width: 1200px; }

.color-white { color: #FFF !important; }
.color-orange { color: #ffbb37 !important; }

#backgroundFixed{
    background: url(../img/backgroundOptimized.png) top;
    height:115%;
    width:105%;
    position:fixed;
    margin-top: -70px;
    z-index: -1;
}

.fa {
    padding-top: 6px;
    padding-bottom: 6px;
}

.big-icon {
    font-size: 36px !important;
}

.smallDot {
    font-size: 14px !important;
    margin-bottom: 4px;
}

hr {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    height: 2px;
    background-color:#ffbb37;
    color:#f3f6db;
    border: 0 none;
}

.animated {
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.animated.fadeIn {
    -webkit-animation-name: fadeIn;
    -moz-animation-name: fadeIn;
    -o-animation-name: fadeIn;
    animation-name: fadeIn;
}

@-webkit-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(30px);
    }

    80% {
        -webkit-transform: translateX(-10px);
    }

    100% {
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -moz-transform: translateX(-2000px);
    }

    60% {
        opacity: 1;
        -moz-transform: translateX(30px);
    }

    80% {
        -moz-transform: translateX(-10px);
    }

    100% {
        -moz-transform: translateX(0);
    }
}

@-o-keyframes bounceInLeft {
    0% {
        opacity: 0;
        -o-transform: translateX(-2000px);
    }

    60% {
        opacity: 1;
        -o-transform: translateX(30px);
    }

    80% {
        -o-transform: translateX(-10px);
    }

    100% {
        -o-transform: translateX(0);
    }
}

@keyframes bounceInLeft {
    0% {
        opacity: 0;
        transform: translateX(-2000px);
    }

    60% {
        opacity: 1;
        transform: translateX(30px);
    }

    80% {
        transform: translateX(-10px);
    }

    100% {
        transform: translateX(0);
    }
}

.animated.bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    -moz-animation-name: bounceInLeft;
    -o-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateX(-30px);
    }

    80% {
        -webkit-transform: translateX(10px);
    }

    100% {
        -webkit-transform: translateX(0);
    }
}

@-moz-keyframes bounceInRight {
    0% {
        opacity: 0;
        -moz-transform: translateX(2000px);
    }

    60% {
        opacity: 1;
        -moz-transform: translateX(-30px);
    }

    80% {
        -moz-transform: translateX(10px);
    }

    100% {
        -moz-transform: translateX(0);
    }
}

@-o-keyframes bounceInRight {
    0% {
        opacity: 0;
        -o-transform: translateX(2000px);
    }

    60% {
        opacity: 1;
        -o-transform: translateX(-30px);
    }

    80% {
        -o-transform: translateX(10px);
    }

    100% {
        -o-transform: translateX(0);
    }
}

@keyframes bounceInRight {
    0% {
        opacity: 0;
        transform: translateX(2000px);
    }

    60% {
        opacity: 1;
        transform: translateX(-30px);
    }

    80% {
        transform: translateX(10px);
    }

    100% {
        transform: translateX(0);
    }
}

.animated.bounceInRight {
    -webkit-animation-name: bounceInRight;
    -moz-animation-name: bounceInRight;
    -o-animation-name: bounceInRight;
    animation-name: bounceInRight;
}

/* Home Page */ 
.summary {
    padding-top: 20px;
    padding-bottom: 10px;
}

.bottom-padding-card {
    padding-bottom: 10px;
}

.course-align {
    text-align: left;
}

.profile-card #profile-pic{
    width: 65%;
    margin-top: 5%;
    margin-left: 15%;
    height: auto;
    border-radius: 50%;
    border: 3px solid #ffbb37;
}

.top-div-home {
    padding-top: 1.75%;
}

.profile-card {
  padding-top: 15px;
  padding-bottom: 15px;
  border-radius: 8px;
  border: 3px solid #ffbb37;
  background: rgba(41,44,47,.85) ; 
  overflow: hidden;
}
.profile-card h2 {
  font-family: "Proxima Nova","proxima-nova","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 400;
  color: #fff;
  font-size: 30px;
  line-height: 26px;
}
.profile-card h2 span {
  font-size: 20px;
  color: #292c2f;
  display: block;
}

.profile-card .centerItem {
    margin-top: 40px;
}

.profile-card p {
    font-size: 16px;
    margin-bottom: 0;
    color: #fff;
}

.profile-card i {
    font-size: 26px;
    vertical-align: middle;
    padding-right: 5px;
    color: #ffbb37;
}

.progress-text-left {
    left: 25% !important;
    font-weight: normal !important;
    text-align: left !important;
}

.mobile-education-text {
        padding-bottom: 8px;
} 

.skillsDiv {
    margin-top: -5px;
}

.skills {
    padding-bottom: 7px;
}
@media only screen and (max-width: 1050px) {
    .profile-card .centerItem {
        margin-top: 25px;
    }
    
    .profile-card #profile-pic{
        width: 70%; 
        height: auto;
        border-radius: 50%;
        border: 3px solid #ffbb37;
    }
    
    .top-div-home {
        padding-top: 1.75%;
    }
}

@media only screen and (max-width: 1025px) {
    .course-align {
        text-align: center;
    }
}

@media only screen and (max-width: 950px) {
    .profile-card .centerItem {
        margin-top: 20px;
    }
    
    .profile-card #profile-pic{
        width: 80%; 
        height: auto;
        border-radius: 50%;
        border: 3px solid #ffbb37;    
    }
    
    .top-div-home {
        padding-top: 1.50%;
    }
}

@media only screen and (max-width: 800px) {
    .profile-card .centerItem {
        margin-top: 5px;
    }
    
    .profile-card #profile-pic{
        width: 60%; 
        height: auto;
        border-radius: 50%;
        border: 3px solid #ffbb37;
    }
    
    .top-div-home {
        padding-top: 1.50%;
    }
}

@media only screen and (max-width: 630px) {
    .profile-card #profile-pic{
        margin-left: auto;
        margin-right: auto;
        width: 50%; 
        height: auto;
        border-radius: 50%;
        border: 3px solid #ffbb37;
    }

    .profile-card h2 {
        padding-top: 4%;    
        text-align: center;
    }
    
    .profile-card p {    
        text-align: center;
    }
    
    .top-div-home {
        padding-top: 0px;
        padding-bottom: 0px;
    }
    
    .mobile-education-text {
        padding-top: 10px;
        padding-bottom: 15px;
    }
    
    .summary {
        padding-top: 30px;
        padding-bottom: 10px;
    }
    
}
/* End Home Page */

/* Nav Bar */ 
#header-logo {
   vertical-align: -webkit-baseline-middle;
}

.menu-hover:hover {
    color: #ffbb37 ;
}

.title-bar {
  background: #292c2f;
  padding: 0.9rem; 
}

.top-bar {
    background: #292c2f;
    background-color: #292c2f; !important
}

.top-bar ul {
    background: #292c2f; 
    background-color: #292c2f;!important
}

.top-bar ul li {
    background: #292c2f;
    background-color: #292c2f;!important
}

.top-bar ul li a {
    color: #fff; 
}

.menu-text {
  color: #fff; }
  @media only screen and (max-width: 40em) {
    .menu-text {
      display: none !important; } }

@media only screen and (min-width: 40em) {
  .top-bar .menu:last-child {
    border-left: 1px solid #4e4e4e; }

  .top-bar .menu:first-child {
    border-left: none; }

  .top-bar .menu li:not(:last-child) {
    border-right: 1px solid #4e4e4e; } }
.dropdown.menu .submenu {
  border: none; }

.dropdown.menu .is-dropdown-submenu-parent.is-right-arrow > a::after {
  border-color: #fff transparent transparent; }

.is-drilldown-submenu-parent > a::after {
  border-color: transparent transparent transparent #fff; }

.js-drilldown-back::before {
  border-color: transparent #fff transparent transparent; }


/* End Nav Bar */ 

/* Footer */
.footer {
    background-color: #292c2f;
    margin-top: 2%;
}

.footer p{
    text-align: left;
    font-size: 1.2rem;
    margin-bottom: 0;
}
/* End Footer */