/* Body */
body{
    font-family: "Ubuntu", sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility;
    padding: 0;
    margin: 0;
    font-size: 1.1em;
    background: #141212;
    padding: 6.5em 0 0 0;
    line-height: 1.5;
}

::-webkit-scrollbar {
    width: 10px;
}
 
/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #141212; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: #1a1515; 
    -webkit-box-shadow: inset 0 0 6px #272323; 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:window-inactive {
    background: #1a1515; 
}
/* /Body */

/* Pre-loader */
.pre-loader{
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top:0;
    z-index: 999;
    background: #272323;
}

.pre-loader img{
    width: 75px;
    height: auto;
    border-radius: 50%;
}

.pre-loader .carreg{
    width: 300px;
    height: 220px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin:-110px 0 0 -150px;
    text-align: center;
}

.pre-loader .carreg p{
	margin-top: 1em;
    font-weight: 700;
    color: #fff;
    letter-spacing: 5px;
    animation: espacofonte 5s ease infinite;
}
@keyframes espacofonte {
  0% {letter-spacing: 5px}
  50% {letter-spacing: 0}
  100% {letter-spacing: 5px}
}

@-webkit-keyframes trocafundo {
    0%{background-position:0% 99%}
    50%{background-position:100% 2%}
    100%{background-position:0% 99%}
}
@-moz-keyframes trocafundo {
    0%{background-position:0% 99%}
    50%{background-position:100% 2%}
    100%{background-position:0% 99%}
}
@-o-keyframes trocafundo {
    0%{background-position:0% 99%}
    50%{background-position:100% 2%}
    100%{background-position:0% 99%}
}
@keyframes trocafundo { 
    0%{background-position:0% 99%}
    50%{background-position:100% 2%}
    100%{background-position:0% 99%}
}

/* /Pre-loader */



/* Menu */
nav{
    width: 100%;
    background: #0a0a0a;
    z-index: 10;
    padding: 1em 0;
    position: fixed;
    left: 0;
    top: 0;
    box-shadow: 0px 0px 7px rgb(53 130 182 / 30%);
}

nav img{
    width: 100%;
    height: auto;
    max-width: 130px;
}

nav ul{
    margin: 2em 0 0 0;
}

nav ul li{
    display: inline;
    margin: 0 0 0 2.5em;
    color: #fff;
    cursor: pointer;
    font-family: "Quicksand", sans-serif;
    transition: all 0.2s ease;
    border-bottom: 1px dotted transparent;
}

nav .call a{
    background: #2a9235;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    text-decoration: none;
    padding: 0.5em 1em;
    text-align: center;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

nav .call a:hover{
    color: #fff;
    background: #00c307;
    border: 1px solid #fff;
}

nav ul li:hover{
    border-bottom: 1px dotted #3582b6;
    color: #3582b6;
}

nav ul li.ativo{
    border-bottom: 1px dotted #3582b6;
    color: #3582b6;
}
/* /Menu  */

.quadriculado{
    background-image: url('../img/textura.png');
}

.quadriculado-gold{
    background-image: url('../img/textura-gold.png');
}

.joias, .home, .relogios{
    min-height: 62vh;
}


/* Home */

.home{
    padding: 5em 0 5em 0;
    overflow: hidden;
    background-image: url('../img/banner-1.png');
    background-position: center;
    background-size: cover;
}

.home img{
    width: 100%;
    height: auto;
}

.home h1, .home h2{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #3582b6;
    margin: 0 0 1em 0;
    font-size: 2.75em;
}

.home p{
    color: #fff;
    margin: 0 0 3em 0;
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
}

.home a{
    background: #2a9235;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    text-decoration: none;
    padding: 0.5em 2em;
    font-size: 1.1em;
    text-align: center;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.home a .maior{
    zoom: 1.3;
}


@keyframes tremor {
  0%, 100% {
    transform: translate(0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: translate(-1px, -1px);
  }
  20%, 40%, 60%, 80% {
    transform: translate(1px, 1px);
  }
}

.home a:hover{
    background: #00c307;
    border: 1px solid #fff;
}

.home a:hover .maior {
  display: inline-block;
  animation: tremor 1.5s infinite ease;
}

#imageContainer, #imageContainer1 {
    position: relative;
}

#imageContainer img{
    position: absolute;
    top: -2em;
    left: 0;
    display: none;
}

#imageContainer1 img {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}
/* /Home */

.brilho{
    background: linear-gradient(45deg, #a57c00   40%, #ffd700  50%, #a57c00   60%);
    background-size: 150% 150%;
    animation: gradient-animation 5s ease-in infinite backwards;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@keyframes gradient-animation {
   0% {
    background-position: 150% 0;
  }
  100% {
    background-position: -150% 0;
  }
}

.joias{
    padding: 4em 0 4em 0;
    overflow: hidden;
    background-image: url('../img/banner-2.png');
    background-position: center;
    background-size: cover;
}

.joias img{
    width: 100%;
    height: auto;
    border-radius: 40px;
    margin: 2em -1em 0 2em;
}

.joias h2{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    margin: 0 0 1em 0;
    font-size: 2.75em;
}

.joias p{
    color: #fff;
    margin: 0 0 3em 0;
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
}

.joias a{
    background: #2a9235;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    text-decoration: none;
    text-align: center;
    padding: 0.5em 2em;
    font-size: 1.1em;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.joias a .maior{
    zoom: 1.3;
}


@keyframes tremor {
  0%, 100% {
    transform: translate(0);
  }
  10%, 30%, 50%, 70%, 90% {
    transform: translate(-1px, -1px);
  }
  20%, 40%, 60%, 80% {
    transform: translate(1px, 1px);
  }
}

.joias a:hover{
    background: #00c307;
    border: 1px solid #fff;
}

.joias a:hover .maior {
  display: inline-block;
  animation: tremor 1.5s infinite ease;
}

.joias .imageContainer {
    position: relative;
}

.joias .imageContainer img {
    position: absolute;
    top: -2em;
    left: 0;
    display: none;
}


.brilho-prata{
    background: linear-gradient(45deg, #969696   40%, #fff  50%, #969696   60%);
    background-size: 150% 150%;
    animation: gradient-animation 5s ease-in infinite backwards;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@keyframes gradient-animation {
   0% {
    background-position: 150% 0;
  }
  100% {
    background-position: -150% 0;
  }
}

.relogios{
    padding: 4em 0 4em 0;
    overflow: hidden;
    background-image: url('../img/banner-3.png');
    background-position: center bottom;
    background-size: cover;
}

.relogios img{
    width: 100%;
    height: auto;
    border-radius: 40px;
    margin: 2em -1em 0 2em;
}

.relogios h2{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    margin: 0 0 1em 0;
    font-size: 2.75em;
}

.relogios p{
    color: #fff;
    margin: 0 0 3em 0;
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
}

.relogios a{
    background: #2a9235;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    text-decoration: none;
    padding: 0.5em 2em;
    font-size: 1.1em;
    text-align: center;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.relogios a:hover .maior {
  display: inline-block;
  animation: tremor 1.5s infinite ease;
}

.relogios a .maior{
    zoom: 1.3;
}

/* Sobre */
.about{
    padding:4em 0;
}

.about h2{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #3582b6;
    margin: 0 0 1em 0;
    font-size: 2.5em;
}

.about p{
    color: #fff;
    margin: 0 0 2em 0;
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
}

.about img{
    width: 100%;
    height: auto;
    border-radius: 40px;
    margin: 2em -1em 0 2em;
}

.about a{
    background: #2a9235;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    text-decoration: none;
    padding: 0.5em 2em;
    font-size: 1.1em;
    text-align: center;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.about a:hover{
    background: #00c307;
    border: 1px solid #fff;
}

.about a:hover .maior {
  display: inline-block;
  animation: tremor 1.5s infinite ease;
}

.about a .maior{
    zoom: 1.3;
}

/* /Sobre */

/* Services */
.services{
    padding:4em 0;
    background-image: url('../img/fundo.jpg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}

.services h2{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #3582b6;
    margin: 0 0 1em 0;
    font-size: 2.5em;
}

.services h3{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    margin: 1em 0 0 0;
    font-size: 1.2em;
    padding: 0 0 0.5em 0;
}

.services ul{
    padding: 0 0 0 4.5em;
    margin: -0.5em 0 2em 0;
}

.services p, .services li{
    color: #fff;;
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
    list-style-type: none;
    margin: 0 0 0.25em 0;
}

.services .border-icon{
    font-size: 1em;
    margin: 0 0.75em 0 0;
    display: inline-block;
    border-radius: 50%;
    height: 3em;
    width: 3em;
    text-align: center;
    line-height: 3;
}

.serv-cel{
    color: #3582b6;
}

.serv-cel .border-icon{
    border: 1px solid #3582b6;
}

.serv-joia{
    color: #a57c00;
}

.serv-joia .border-icon{
    border: 1px solid #a57c00;
}

.serv-rel{
    color: #969696;
}

.serv-rel .border-icon{
    border: 1px solid #969696;
}

.serv-out{
    color: #838d5f;
}

.serv-out .border-icon{
    border: 1px solid #838d5f;
}



/* /Services */

/* Local  */
.local{
    background: #141212;
    padding:4em 0;
}

.local h2{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #3582b6;
    margin: 0 0 1em 0;
    font-size: 2.5em;
}

.local h3{
    font-family: "Ubuntu", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #fff;
    margin: 0 0 1em 0;
    font-size: 1.2em;
}

.local p{
    color: #fff;
    margin: 1.3em 0 0 0;
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
}

.local img{
    width: 100px;
    height: auto;
}

.local .quadriculado{
    margin: -2em 0 3em 0;
}

.local iframe{
    border: 0;
    padding: 2em 0 0 2em;
    margin: 0 -2em -2em 0;
    width: 100%;
    height: 350px;
    border:0;
    filter: grayscale(50%) invert(92%) contrast(83%);
}

.local .botao{
    background: #2a9235;
    color: #fff;
    font-weight: 500;
    font-style: normal;
    text-decoration: none;
    padding: 0.5em 2em;
    font-size: 1em;
    text-align: center;
    border-radius: 5px;
    border: 1px solid transparent;
    transition: all 0.2s ease;
    display: inline-block;
    margin: 1em 1em 1em 0;    
}

.local .botao:hover{
    background: #00c307;
    border: 1px solid #fff;
    text-decoration: none;
}

.local .icone{
    color: #3582b6;
    display: inline-block;
    width: 1.3em;
}

.local a{
    color: #fff;
    text-decoration: none;
}

.local a:hover{
    text-decoration: underline;
}

.local address{
    display: inline-block;
    color: #fff;
    margin: 0;
}
/* /Local */


/* Footer */

footer{
    padding:2em 0;
    background: #0a0a0a;
    position: relative;
    color: #fff;
    width: 100%;
    margin: 0;
}

footer .topo{
    float: right;
    position: relative;
    z-index: 10;
    cursor: pointer;
    font-size: 2em;
    color: #d6d6b9;
    margin-top: -1em;
    transition: all .2s ease;
}

footer .topo:hover{
    color: #fff;
}

footer img{
    width: 100%;
    height: auto;
}

footer p{
    font-weight: 300;
    font-family: "Quicksand", sans-serif;
    color: #fff;
    margin: 0 0 0 0;
}


/* /Footer */


@media (max-width: 575.98px) { 
   
}

@media (max-width: 767.98px) { 
    
}

@media (max-width: 991.98px) { 
    body{
        font-size: 1em;
    }
    .hide{
        display: none;
    }
    nav ul{
        margin: 1em 0 0 0;
        padding: 0;
    }
    nav img {
        min-height: 75px;
        width: auto;
    }
    .joias, .home, .relogios{
        min-height: 70vh;
        padding: 8em 0 7em 0;
    }
    .joias h2, .home h1, .home h2, .relogios h2{
        font-size: 1.75em;
    }
    .about h2, .local h2, .services h2{
        font-size: 1.5em;
    }
    .about a, .home a, .joias a, .relogios a{
        width: 100%;
        display: block;
    }
    .about img{
        margin: 2em 0;
    }
    .carousel-control-prev, .carousel-control-next{
        display: none;
    }
    .about .quadriculado{
        margin-top: 2em;
    }
    .local .quadriculado{
        margin: 2em 0 0 0;
    }
    .local iframe{
        padding: 0;
    }
    
}

@media (max-width: 1199.98px) { 
    
}

@media (min-width: 991.98px) { 
    .banner-desk{
        display: block;
    }
    .banner-mobile{
        display: none;
    }
}

@media (max-width: 991.98px) { 
    .banner-desk{
        display: none;
    }
    .banner-mobile{
        display: block;
    }
    .banner-mobile img{
        width: 100% !important;
        margin: 0 !important;
    }
    .banner-mobile .joias, .banner-mobile .home, .banner-mobile .relogios{
        min-height: initial;
        padding: 4em 0;
        height: 19.5em;
    }
    .banner-mobile .joias h2, .banner-mobile .home h1, .banner-mobile .home h2, .banner-mobile .relogios h2{
        font-size: 1.5em;
    }
    
}