@font-face {
    src: url(../fonts/Mohave-Light.ttf);
    font-family: 'Mohave-Light';    
} 
@font-face {
    src: url(../fonts/Mohave-Regular.ttf);
    font-family: 'Mohave-Regular';    
} 
@font-face {
    src: url(../fonts/Roboto-Regular.ttf);
    font-family: 'Roboto-Regular';    
} 

*{
  
   font-family: 'Roboto-Regular';
   font-size: 19px; 

}

html, body {
    overflow-x: hidden;
}
#getestimative{
         padding: 5px;
         background-color: #7B0406;
         text-align: center;
}
#getestimative p{
          font-size: 0.7rem;
          margin-bottom: 0px;
          color: #fff;;
}
.navbar-brand img{

            width: 200px;

}
.navbar-light .navbar-nav .nav-link{
      padding-right: -10px;
     font-family: 'Mohave-Regular';
     font-size: 19px;
     color: #000;

}
.navbar-light .navbar-nav .nav-link::after{
            content: "";
            display: block;
            margin: auto;
            height: 3px;
            width: 0px;
            top: 5px;
            background: transparent;
            transition: all 0.3s;
}
.navbar-light .navbar-nav .nav-link:hover::after{
            width: 100%;
            background: #020042;
}

.dropdown-item:hover{
   
       color: red;
       background-color: transparent;
       transition: 0.2s ease-in-out;

}
.navbar-toggler{
    
      margin-bottom: 15px;

}
#carousel-slide{
        position: relative;
}

#carousel-slide .info{
         position: absolute;
         width: 50%;
         height: 100%;
         left: 10%;
         top: 0px;
         display: flex;
         flex-direction: column;
         align-items: start;
         justify-content: center;
         z-index: 999;
}
#carousel-slide .info h2{
           color: #fff;  
           font-weight: 600;
}

#carousel-slide .info h3{
            color: #fff;
            font-size: 1.3rem;
}

#carousel-slide .info .btn-geral{
               background-color: #020042;
               color: #fff;
               padding: 10px 20px;
               text-decoration: none;
               font-size: 0.8rem;
               margin-top: 20px;
               border-radius: 20px;
               transition: 1s;
}
#carousel-slide .info .btn-geral:hover{
             opacity: 0.7;
             text-decoration: none;
}

#carousel-slide .carousel-inner .carousel-item{                   
                   height: 400px;
                   width: 100%;
                   background: url('../img/img1ok.jpg');   
                   background-size: cover;    
                   background-position: center;  
}

#carousel-slide .carousel-inner .carousel-item:nth-child(2){                   
                   height: 400px;
                   width: 100%;
                   background: url('../img/img2ok.jpg');   
                   background-size: cover;    
                   background-position: center;      
}

#about{
    margin-top: 60px;
}

#about .text h2{
        font-family: "Mohave-Regular";
        color: #7B0406;
}
#about .text h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 5px;
             background-color: #7B0406;
}

#about .text p{
           font-size: 1rem;
           padding-right: 10px;
           margin-bottom: 30px;
}
#about .btn-geral{
               background-color: #020042;
               color: #fff;
               padding: 10px 20px;
               text-decoration: none;
               font-size: 0.8rem;
               margin-top: 20px;
               border-radius: 20px;
               transition: 1s;
}
#about .btn-geral:hover{
             opacity: 0.7;
             text-decoration: none;
}

#about .image img{
          border-top-right-radius: 25px;
          border-bottom-left-radius: 25px;
}

#services{
        background-color: #020042;
        margin-top: 30px;
        padding: 40px 0px;
}
#services h2{
         color: #fff;
         margin-bottom: 20px;
}
#services h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 5px;
             background-color: #fff;
}
#services .text-services{
              color: #ffffffde;
              font-size: .9rem;
}
#services .list-services p{
             color: #fff;
             font-size: 1rem;
             display: flex;
}
#services .list-services .btn-services{
               background-color: #fff;
               color: #020042;
               padding: 10px 20px;
               text-decoration: none;
               font-size: 0.8rem;
               display: block;
               width: 160px;
               margin: 20px auto;
               border-radius: 20px;
               transition: 1s;
}
#services .list-services .btn-services:hover{
             opacity: 0.7;
             text-decoration: none;
}
#services .list-services i{
                  color: aqua;
                  margin-right: 10px;
}

#portfolio{
        padding: 40px 30px;
}

#portfolio h2{
        font-family: "Mohave-Regular";
        color: #7B0406;
}
#portfolio h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 5px;
             background-color: #7B0406;
}
#portfolio figcaption{
           margin-left: 10px;
           font-size: .9rem;
           color: #000;
}

#portfolio figcaption a{
              font-size: .8rem;
              color: #7B0406;
              text-decoration: none;
              transition: .9s;
              float: right;
}
#portfolio figcaption a:hover{
               color: #020042;
}
#portfolio .btn-geral{
               background-color: #020042;
               color: #fff;
               padding: 10px 20px;
               text-decoration: none;
               display: block;
               width: 160px;
               font-size: 0.8rem;
               margin: 20px auto;
               border-radius: 20px;
               transition: 1s;
}
#portfolio .btn-geral:hover{
             opacity: 0.7;
             text-decoration: none;
}
#testimonials{
        background-color: #020042;
        padding: 40px 30px;
}
#testimonials h2{
        font-family: "Mohave-Regular";
        color: #fff;
}
#testimonials h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 5px;
             background-color: #fff;
}
#testimonials p{
          color: #fff;
}
#testimonials .testi{
          background-color: #fff;
          min-height: 270px;
          padding: 30px 20px;
          border-radius: 20px;
} 
#testimonials .testi .text{
             color: #000;
             font-size: .9rem;
}
#testimonials .testi .name{
              color: #7B0406;
              font-size: .8rem;
              width: 100%;
              text-align: center;
}
.owl-nav{
        display: none;
}
.owl-dots{
        margin-top: 20px;
}
.owl-carousel button.owl-dot:focus{
        outline: none !important;
}

#page-header{
       padding: 70px 0px;
       background-image: url("../img/back-page.jpg");
       text-align: center;
}
#page-header h2{
        color: #fff;
}
#page-header h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 10px;
             background-color: #fff;
}
#page-header h2::after{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-left: 10px;
             background-color: #fff;
}
#page-header-project{
       padding: 70px 0px;
       background-image: url("../img/back-page.jpg");
       text-align: center;
}
#page-header-project h2{
        color: #fff;
}
#page-header-project h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 10px;
             background-color: #fff;
}
#page-header-project h2::after{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-left: 10px;
             background-color: #fff;
}
#contacts{
        min-height: 200px;
        padding: 40px 30px;
        margin-bottom: 40px;
}
#contacts p{
        font-size: 1.2rem;
        margin-bottom: 50px;
        text-align: center;
}
#contacts .icons{
         margin-bottom: 30px;
}
#contacts .icons .inner-icon{
          box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);
          margin-bottom: 20px;
          display: flex;
          flex-direction: column;
          align-items: center;
          padding-top: 20px;
          padding-left: 10px;
          padding-right: 10px;
          min-height: 200px;
}
#contacts .icons .inner-icon i{
              font-size: 1.7rem;
              color: #7B0406;
              margin-bottom: 15px;
}
#contacts .icons .inner-icon p{
               font-size: 1rem;
               color:#020042
}
#contacts .form input, #contacts .form textarea{
          margin-bottom: 10px;
          border-radius: 0px !important;
          font-size: .9rem;
}
#contacts .form textarea{
             height: 150px;
}
#contacts .form input:focus, #contacts .form textarea:focus{
               box-shadow: 0 0 0 0;
               border-color: #000;
               outline: 0;
}
#contacts .form input::placeholder{
               font-size: .9rem;
}
#contacts .form .btn-primary{
              background-color: #020042 !important;
              color: #fff;
              font-size: .9rem;
              border-radius: 0px;
              transition: 0.9s;
}
#contacts .form .btn-primary:hover{
                   opacity: 0.7;
}

#about-page{
        min-height: 200px;
        padding: 40px 30px;
        margin-bottom: 40px;
}
#about-page .description{
        font-size: 1.2rem;
        margin-bottom: 50px;
        text-align: center;
}
#about-page p{
         font-size: 1rem;
}
#about-page h2{
        color: #7B0406;
        width: 100%;
        text-align: center;
        margin-top: 40px;
        margin-bottom: 40px;
}
#about-page h2::before{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-right: 10px;
             background-color: #7B0406;
}
#about-page h2::after{
             content: "";
             display: inline-block;
             width: 30px;
             height: 3px;
             margin-bottom: 10px;
             margin-left: 10px;
             background-color: #7B0406;
}
#about-page .team{
            background-color: 	#DCDCDC;
}
#about-page h3{
         text-align: left;
         font-size: 1.3rem;
         margin-top: 20px;
         margin-top: 30px;
         margin-bottom: 10px;
         font-weight: 600;
}
#about-page h4{
          font-size: .9rem;
          margin-bottom: 40px;
}

#services-page{
        min-height: 200px;
        padding: 40px 30px;
        margin-bottom: 40px;
}
#services-page .description{
        font-size: 1.2rem;
        margin-bottom: 50px;
        text-align: center;
}
#services-page .inner-page-servi{
              padding-left: 30px;
              border-right: 1px solid #7B0406;
}
#services-page .inner-page-servi:nth-child(3){
                border-right: none;
}
#services-page .inner-page-servi i{
                       color: #020042;
                       margin-right: 6px;
}
#services-page .inner-page-servi p{
                       font-size: .9rem;
}
#services-page-phone{
            padding: 70px 20px;
            background-color: #020042;
            text-align: center;
}
#services-page-phone h2{
            color: #fff;
            font-size: 1.7rem;
            margin-bottom: 30px;
}
#services-page-phone h3{
               color: #DCDCDC;
               font-size: 1.3rem;
               margin-bottom: 30px;
}
#services-page-phone a{
                  background-color: aqua;
                  color: #000;
                  font-size: .8rem;
                  font-weight: bold;
                  padding: 10px 30px;
}
#portfolio-page{
        min-height: 200px;
        padding: 40px 30px;
        margin-bottom: 10px;
        border-bottom: 1px solid #000;
}
#portfolio-page .description{
        font-size: 1.2rem;
        margin-bottom: 50px;
        text-align: center;
}
#portfolio-page figcaption{
           margin-left: 10px;
           font-size: 1rem;
           color: #000;
}

#portfolio-page figcaption a{
              font-size: .9rem;
              color: #7B0406;
              text-decoration: none;
              transition: .9s;
              float: right;
}
#portfolio-page figcaption a:hover{
               color: #020042;
}
#project{
        min-height: 200px;
        padding: 40px 30px;
        margin-bottom: 10px;
        border-bottom: 1px solid #000;
}
#project .description{
        font-size: 1.2rem;
        margin-bottom: 50px;
        text-align: center;
}

#pre-footer{
     padding: 20px 0px;     
}
#pre-footer i{
        font-size: 15px;
}
#pre-footer h3{
        margin-top: 45px;
        font-size: 0.9rem;
        border-bottom: 1px solid black;
        padding-bottom: 10px;
        font-family: "Mohave-Regular";
        font-weight: 600;
}
#pre-footer p{
       font-family: "Roboto-Regular";
       margin-bottom: 10px;
       padding: 0px;
}
#pre-footer img{
         width: 200px;
         display: block;
         margin: 0 auto;
}
#pre-footer .footer1, #pre-footer .footer2, 
#pre-footer .footer3{
                 padding: 0px 10px;  
}
#pre-footer .footer3 ul{
            padding-left: 10px;
}
#pre-footer .footer3 ul li{
             list-style: none;
}
#pre-footer .footer3 ul li a{
             font-size: 0.9rem;
             color: #212529;
}
#pre-footer .footer3 ul li a:hover{
              opacity: 0.8;
}
#pre-footer .footer1 p, #pre-footer .footer2 p, 
#pre-footer .footer4 p{
           font-size: 0.9rem;
           margin-top: 10px;
}

footer{
   
   background-color: #020042;
   padding: 5px 0px;

}

.inner-footer{
       display: flex;
       justify-content: center;
       align-items: center;
}

footer p{

     font-size: 15px;
     color: white;
     margin-bottom: 0px;
     width: 100%;

}

/* responsivo */
@media screen and (max-device-width: 990px){
            .navbar-light .navbar-nav .nav-link::after{
                        content: "";
                        display: block;
                        margin-left: 1px;
                        height: 3px;
                        width: 0px;
                        top: 5px;
                        background: transparent;
                        transition: all 0.3s;
                }
                .navbar-light .navbar-nav .nav-link:hover::after{
                        width: 100%;
                        background: #020042;
                }       
}
@media screen and (max-device-width: 767px){
                #about .image{
                        margin-top: 20px;
                }
                #services .text-services{
                         margin-bottom: 30px;
                }
                #about-page .img1{
                          margin-bottom: 20px;
                }
                #services-page .inner-page-servi{
                              border-right: none;
                }
                #services-page .inner-page-servi p{
                                 font-size: 1.1rem;
                                 margin-bottom: 30px;
                }
}

@media screen and (max-device-width: 520px){
            #pre-footer .footer1, #pre-footer .footer2, 
            #pre-footer .footer3, #pre-footer .footer4{
                            padding: 0px 40px;
            }
           #carousel-slide .info h2{
                   font-size: 1.6rem;
            }
           #carousel-slide .info h3{
                    font-size: 1rem;
            }
            #about{
                 padding: 20px 40px;
            }
            #services{
                padding: 40px 40px;
           }
           #page-header-project h2{
                  font-size: 1.4rem;
                  padding: 5px;
            }
           #page-header-project h2::before, 
           #page-header-project h2::after{
                      display: none;
            }

}

@media screen and (max-device-width: 414px){

      .navbar-brand{

              width: 100%;
      }

      .navbar-brand img{

              width: 100%;

      }
      #services-page-phone h2{
               font-size: 1.5rem;
       }
      #services-page-phone h3{
               font-size: 1.1rem;
       }

}

@media screen and (max-device-width: 360px){

         .footer2 p{
                font-size: .8rem !important;
         }
         #services-page-phone h2{
               font-size: 1.3rem;
        }
        #services-page-phone h3{
               font-size: 1rem;
        }

}