body {
  overflow-x: hidden;
  font-family: 'Lato', sans-serif; background-color:#FFF; color:#371167; }
 

::-webkit-scrollbar {
    width: 6px;
}
  
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    border-radius: 10px;
}
 
::-webkit-scrollbar-thumb {
    background-color:#371167;
	
    border-radius: 10px;

}

::-webkit-scrollbar-thumb:hover {
    background: #000;
	
}

::-moz-selection {
  background: #transparent;
  text-shadow: none;
  color:#F00; }

::selection {
  background: transparent;
  text-shadow: none; color:#F00; }

img::selection {
  background: transparent; color:#F00; }

img::-moz-selection {
  background: transparent; color:#F00; }

.sha{
-moz-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
-webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
box-shadow: 0px 2px 5px rgba(0,0,0,0.5);	   		
}

#mainNav {
  background-color:#FFF; color:#000; 
  text-transform: uppercase; letter-spacing:4px;
  	  -moz-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
  box-shadow: 0px 2px 5px rgba(0,0,0,0.5);	   
  }
  #mainNav .navbar-toggler {
    font-size: 10px;
    right: 0;
    padding: 10px;
    text-transform:  ;
    color:#000;
    border: 0;
    background-color:;
    font-family: 'Lato', sans-serif; }
  #mainNav .navbar-brand {
    color: #000;
    font-family: 'Lato', sans-serif;  }
    #mainNav .navbar-brand.active, #mainNav .navbar-brand:active, #mainNav .navbar-brand:focus, #mainNav .navbar-brand:hover {
      color: #000;
	  -webkit-transition: all ease 0.5s;
-moz-transition: all ease 0.5s;
transition: all ease 0.5s;}
  #mainNav .navbar-nav .nav-item .nav-link {
    font-size: 10px ;
    font-weight: 700;
    padding: 10px;
    letter-spacing: ;
    color:#000 !important;
   font-family: 'Lato', sans-serif; 
   -webkit-transition: all ease 0.6s;
-moz-transition: all ease 0.6s;
transition: all ease 0.6s;		
	}
	
    #mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
    background-color:#371167;
    color: #FFF!important;		
		
		}

@media (min-width: 992px) {
  #mainNav {
    padding-top: 20px;
    padding-bottom:;
    -webkit-transition: padding-top 0.3s, padding-bottom 0.3s;
    -moz-transition: padding-top 0.3s, padding-bottom 0.3s;
    transition: padding-top 0.3s, padding-bottom 0.3s;
    border: none;
    background-color:transparent; background-image:url(../img/op.png)}
    #mainNav .navbar-brand {
      font-size: 10px;
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      transition: all 0.3s; }
    #mainNav .navbar-nav .nav-item .nav-link {
      padding: 1.1em 1em !important; color:#000!important;}
    #mainNav.navbar-shrink {
      padding-top: 0;
      padding-bottom: 0;
      background-color:#FFF;
	  -moz-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
  -webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.5);
  box-shadow: 0px 2px 5px rgba(0,0,0,0.5);	  
	   }
      #mainNav.navbar-shrink .navbar-brand {
        font-size: 14px;
        padding: 12px 0; } }
		 
.align{ text-align:center;}

@media (max-width: 992px) {.align{ text-align:left;}}

 
#roqstore-frame {width:100%; height:100%;}  

.slideanim {visibility:hidden;}
  .slide {
      animation-name: slide;
      -webkit-animation-name: slide;
      animation-duration: 1s;
      -webkit-animation-duration: 1s;
      visibility: visible;
  }
  @keyframes slide {
    0% {
      opacity: 0;
      transform: translateY(70%);
    } 
    100% {
      opacity: 1;
      transform: translateY(0%);
    }
  }
  @-webkit-keyframes slide {
    0% {
      opacity: 0;
      -webkit-transform: translateY(70%);
    } 
    100% {
      opacity: 1;
      -webkit-transform: translateY(0%);
    }
  }

  
  
.ul{list-style-image:url(../img/ico.png);}

hr{ border: 0.5px solid #371167; max-width:200px;}

.hr{ border: 0.5px solid #FFF; max-width:200px;}

.big{ max-width:100%;}  
.bg-color{ background-color:#371167; color:#FFF;}
.bg-black{ background-color:#000; color:#FFF;}
.blue{color:#B35100;}


.title{	
position: absolute;
width:100%;
z-index:100;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);		
}



.bg-pisos-laminados{ 

height:650px;
background-attachment:fixed;
background-image: url(../img/bg-piso-laminado.jpg);
background-repeat:no-repeat;
background-position:bottom center;
background-size:cover;
color:#FFF;		
	
}

.bg-pisos-vinilicos{

height:650px;		
background-attachment:fixed;
background-image: url(../img/bg-piso-vinilico.jpg);
background-repeat:no-repeat;
background-position: bottom center;
background-size:cover;
color:#FFF;		
	
}



.bg-persianas{

height:650px;		
background-attachment:fixed;
background-image: url(../img/bg-persianas.jpg);
background-repeat:no-repeat;
background-position: bottom center;
background-size:cover;
color:#FFF;		
	
}



.bg-rodapes{
height:650px;		
background-attachment:fixed;
background-image: url(../img/bg-rodapes.jpg);
background-repeat:no-repeat;
background-position:  bottom center;
background-size:cover;
color:#FFF;		
	
}



.bg-papel-de-parede{
height: 650px;		
background-attachment:fixed;
background-image: url(../img/bg-papeis-de-parede.jpg);
background-repeat:no-repeat;
background-position:  top center;
background-size:cover;
color:#FFF;		
	
}

.promo{	
margin-top:-530px; 
position:relative; 
z-index:1;	
}


.logos {
    background-image: url(../img/logomarcas/logomarcas.png);
    background-repeat: repeat-x;
    animation: slideleft 60000s infinite linear;
    -webkit-animation: slideleft 60000s infinite linear;
    background-size: cover;
    min-height:40px;
	margin-bottom:-20px; 
	position:relative; 
	z-index:1;
}
@keyframes slideleft {
    from {
        background-position: 0%;
    }

    to {
        background-position: 90000%;
    }
}

@-webkit-keyframes slideleft {
    from {
        background-position: 0%;
    }

    to {
        background-position: 90000%;
    }
}

.black{ color:#000; }	
.fix{ position:fixed; bottom:0; right:0;  z-index:999; margin-right:0px; padding:10px; } 
.mini{ font-size:12px !important;}
.mini-2{ font-size:12px !important;}

.b-left{ border-left: 1px solid #FFF;}
.white{color:#FFF;}
.intro{ padding:40px; max-width:100%;}
  

.back-color{ background-color: #CCC; padding:1px 20px 1px 20px;}

p {
  line-height: ; color:#371167; letter-spacing:3px; font-size:20px; }
.a {
  color: #371167; 
     -webkit-transition: all ease 0.6s;
-moz-transition: all ease 0.6s;
transition: all ease 0.6s;	}
  .a:hover {
     text-decoration:none; color:#000;}
	

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 400;
  font-family: 'Lato', sans-serif; letter-spacing:-1px; }
  

.big-font{font-size:30px;}  
  
@media (min-width: 768px) {.margin-zero{margin-top:-470px;  position: relative;}}  

@media (max-width: 768px) {.margin-zero{margin-top:-370px;}}  

@media (min-width: 768px) {.margin-zero-2{margin-top:-270px;}}  

@media (max-width: 768px) {.margin-zero-2{margin-top:-170px;}} 

section {
  padding: 100px 0; }
  section h2.section-heading {
    font-size: 40px;
    margin-top: 0;
    margin-bottom: 15px; }
  section h3.section-subheading {
    font-size: 16px;
    font-weight: 400;
    font-style: italic;
    margin-bottom: 75px;
    text-transform: none;
    font-family: 'Lato', sans-serif; }

@media (min-width: 768px) {
  section {
    padding: 150px 0; } }

.btn-primary-whats {
	
  background-color: transparent;
  border-color:  transparent;
  }
  		
.topo {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: auto;
}

		
.service-heading {
  margin: 15px 0;
  text-transform: none; }

.portfolio-modal {
  padding-right: 0px !important; }
  .portfolio-modal .modal-dialog {
    margin: 1rem;
    max-width: 100vw; }
  .portfolio-modal .modal-content {
    padding: 100px 0;
    text-align: center; color: #FFF; background-color:rgba(0,0,0,0.8);}}
    .portfolio-modal .modal-content h2 {
      font-size: 3em;
      margin-bottom: 15px; }
    .portfolio-modal .modal-content p {
      margin-bottom: 30px; }
    .portfolio-modal .modal-content p.item-intro {
	  color:#0C3C72;
      font-size: 16px;
      font-style: italic;
      margin: 20px 0 30px;
      font-family: 'Lato', sans-serif; }
    .portfolio-modal .modal-content ul.list-inline {
      margin-top: 0;
      margin-bottom: 30px; }
    .portfolio-modal .modal-content img {
      margin-bottom: 30px; }
    .portfolio-modal .modal-content button {
      cursor: pointer; }
  .portfolio-modal .close-modal {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 75px;
    height: 75px;
    cursor: pointer;
    background-color: transparent; }
    .portfolio-modal .close-modal:hover {
      opacity: 0.3; }
    .portfolio-modal .close-modal .lr {
      /* Safari and Chrome */
      z-index: 1051;
      width: 2px;
      height: 75px;
      margin-left: 35px;
      /* IE 9 */
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg);
      background-color: #FFF; }
      .portfolio-modal .close-modal .lr .rl {
        /* Safari and Chrome */
        z-index: 1052;
        width: 2px;
        height: 75px;
        /* IE 9 */
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        background-color: #FFF; }


.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.pulse:hover {
  animation: none;
}

@-webkit-keyframes pulse {
  25% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  75% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}
@keyframes pulse {
  25% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  75% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}


.logo-roqstore {
    margin: ;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
   -moz-transition: all 0.9s ease-in-out;
    -webkit-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
    }

.logo-roqstore:hover {
	cursor: pointer;
	-webkit-transform: scale(1.1, 1.1)  rotate(10deg);
    -ms-transform: scale(1.1, 1.1)  rotate(10deg);
    transform: scale(1.1, 1.1)  rotate(10deg);
    -moz-transition: all 0.9s ease-in-out;
    -webkit-transition: all 0.9s ease-in-out;
    -o-transition: all 0.9s ease-in-out;
    -ms-transition: all 0.9s ease-in-out;
    transition: all 0.9s ease-in-out;
    z-index:10;
    }

.fa-chevron-left{ 
color:#FFF; margin-right:70px;
-webkit-transition: all ease 0.9s;
-moz-transition: all ease 0.9s;
transition: all ease 0.9s;	}


.fa-chevron-left:hover{ 
color:#371167;
}

.fa-chevron-right{ 
color:#FFF; margin-left:70px;
-webkit-transition: all ease 0.9s;
-moz-transition: all ease 0.9s;
transition: all ease 0.9s;	}

.fa-chevron-right:hover{ 
color:#371167;
}

.map{
filter: grayscale(100%);
-webkit-transition: all ease 0.9s;
-moz-transition: all ease 0.9s;
transition: all ease 0.9s;}

.map:hover{
filter: grayscale(0%);
-webkit-transition: all ease 0.9s;
-moz-transition: all ease 0.9s;
transition: all ease 0.9s;}