:root{
    --main-color:#17a2b8 
}
*{
    font-family: 'Yanone Kaffeesatz', sans-serif;
}
body{
    overflow-y: scroll;
}
body::-webkit-scrollbar {
  width: 15px;               /* width of the entire scrollbar */

}

body::-webkit-scrollbar-track {
  background: rgb(255, 255, 255);        /* color of the tracking area */
}

body::-webkit-scrollbar-thumb {

  background-color: var(--main-color);/* color of the scroll thumb */
  border-radius: 100px;       /* roundness of the scroll thumb */
  border: 15px solid var(--main-color);;  /* creates padding around scroll thumb */
}
.titleMain{
    font-size:9vw;
    
}
.aboutMe{
    background-image: url("../img/fondoAboutMe2.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    
}
.img-perfil{
    width: 15rem;
}
.bg-black{
    background-color: black;
}
.marginIcon{
    margin:1.5rem 0.5rem;
}
.marginIconSkills{
    margin:2.5rem 3rem;
}
.servicesCars{
    min-height: 15rem;
    padding-top: 4rem;
    padding-bottom: 4rem;
    margin: 0.5rem;
    align-items: stretch;
}
.marginCards{
    margin:5rem auto;
}

.paddingConten{
    padding: 2.5rem;
}
.marginConten{
    margin: 7rem auto ;
}
.hover{
    z-index: 0;
    transition: transform 0.2s ease;
}
.hover:hover{
    z-index: 1;
    transform: scale(1.1);
}
.hoverNavBar{
    z-index: 0;
    transition: transform 0.8s ease;
}
.hoverNavBar:hover{
    z-index: 1;
    transform: scale(1.1);
    transition: transform 0.5s ease;
    color: #000 !important;
    background-color: #17a2b8 !important;
    border-radius: 15px;
}
#backToTop {
    display: inline-block;
    background-color: #FF9800;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 4px;
    position: fixed;
    bottom: 100px;
    right: 30px;
    transition: background-color .3s, 
    opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1;
    opacity: 1;
    visibility: visible;
  }
  #backToTop::after {
    content: "\f077";
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    font-size: 2em;
    line-height: 50px;
    color: #fff;
  }
  #backToTop:hover {
    cursor: pointer;
    background-color: #333;
  }
  #backToTop:active {
    background-color: #555;
  }
  /*
  #backToTop.show {
    opacity: 1;
    visibility: visible;
  }
  */