/*image preview plugin*/
/* CSS: (StyleSheet) */

.map {
	min-width: 400px;
	min-height: 250px;
	max-height: 250px;
	width: 400px;
	
}

#imgPreviewWithStyles {
    background: #222;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 15px;
    z-index: 999;
    border: none;
}
/* Text below image */
#imgPreviewWithStyles span {
    color: white;
    text-align: center;
    display: block;
    padding: 10px 0 3px 0;
}

/*bootstrap self implementation of 5 grid cols*/
.col-md-15{
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
    width: 20%;
    float: left;
}
@media (max-width: 992px) {
    .col-md-15 {
        width: 33.33333%;
        float: left;
    }
}

body {
    width: 100%;
    height: 100%;
    background: url('../images/bg.jpg') 0 0 repeat;
    background-position: top left;
}

html {
    width: 100%;
    height: 100%;
}
a, a:hover, a:focus, a:active,
h1, h2, h3, h4, h5, h6{
    color: #EE7C0C;
}

.btn-primary, .btn-primary, .btn-primary.focus, .btn-primary, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #ff8d1e;
    border-color: #dc720a;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #EE7C0C;
    border-color: #ba6009;
}

.width { max-width: 900px; }
.fill-height { height: 100%; }
.centered { float: none; margin: 0 auto; }
.fill-slide { 
    position: absolute; top:0; bottom:0; left:0; right:0; 
    padding-bottom: 9%; 
    padding-top: 100px;
    padding-right:100px;
}

.carousel p, .carousel h1, .carousel h2, .carousel h3, .carousel h4, .carousel h5, .carousel h6 {
    color:white;
}
.carousel, .carousel .item, .carousel .slide .active {
    height: 100%;
}
.carousel .carousel-inner {
    height: 100%;
}
.carousel-caption  {
    background: rgba(0,0,0,0.35);
    padding: 0;
    left:0; bottom:0; right:0;
    z-index:0;
}
.carousel-indicators {
    bottom:140px;
}
.carousel-indicators li{
    display: none;
}
.carousel-caption h2 {
    font-size: 5vw;
}
.carousel-caption p {
    font-size: 2vw;
}
.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.carousel-inner {
    height: 100%;
}
.slide-normal { width: 100%; height: 500px;}

footer {
    margin: 50px 0;
}

.navbar a{
    font-family: 'Open Sans';
    text-transform: uppercase;
}
.navbar {
    height: 100px;
    position: fixed; z-index: 1;
    top:0; left:0; right:0;
    margin: 0px; padding-right:100px;
    background: #F7F7F7;
    border-bottom: 1px solid #eee;
    /*-webkit-box-shadow: 0 4px 4px -2px rgba(0,0,0,0.5);
    -moz-box-shadow: 0 4px 4px -2px rgba(0,0,0,0.5);
    box-shadow: 0 4px 4px -2px rgba(0,0,0,0.5);*/
}
.navbar .logo {
    height: 100%; width: auto;
    line-height: 100px;
    float: left;
}
.navbar .logo img{
    height: 90%; width: auto;
}
.navbar ul {
    height: 100%; width: auto;
    line-height: 100px;
    float: right;
    padding: 0px; margin: 0px;
}
.navbar ul li {
    list-style: none;
    display:inline;
    margin: 0 0 0 10px;
    font-size: 16px;
}
.navbar ul li .glyphicon {
    
}
.navbar ul li a:not(.btn) {
    color: #262626;
}
.navbar ul li a:hover, 
.navbar ul li a:active, 
.navbar ul li a:focus, 
.navbar ul li a.current {
    color: #EE7C0C;
    text-decoration: none;
}
.toggle-responsive-menu { 
    display:none; 
    font-size:24px;
    width: 24px; height: 24px;
    float:right;
    margin-top: 30px;
    margin-right: 30px;
}
.toggle-responsive-menu,
.toggle-responsive-menu:focus,
.toggle-responsive-menu:active,
.toggle-responsive-menu:hover{
    color:#333;
}
.responsive-navbar { 
    z-index: 3;
    margin-top: 0;
    position: fixed;
    right: 0; top: 100px;
    width: 0;/*jquery animate width:232px efeito slide right to left*/
    background-color: #222;
}
.responsive-navbar ul {
    padding: 10px;
    width: 232px;
}
.responsive-navbar ul li{
    padding:10px;
    list-style: none;
}
.responsive-navbar ul li:last-child{
    border-bottom: none;
}
.responsive-navbar ul li a{
    width: 100%; height: 100%;
}
.responsive-navbar ul li a, 
.responsive-navbar ul li a:hover,
.responsive-navbar ul li a:active,
.responsive-navbar ul li a:focus{
    color:white;
    font-weight: 400;
    text-decoration: none;
    text-transform: uppercase;
}

.sidebar-shadow-fix {
    position: fixed; z-index:3;
    top: 98px; right:0; 
    height: 4px; width: 99px;
    background: #fff;
}
.sidebar a {
    /*font-family: 'Anton';*/
    /*font-family: sans-serif;*/
    font-family: Arial;
    font-size: 11px;
    font-weight: 100;
    text-transform: uppercase;
}
.sidebar {
    position: fixed; z-index:2;
    top:100px; right:0; bottom: 0;
    width: 100px;
    background: #fff;
    border-left: 1px solid #eee;
    overflow: hidden;
    /*-webkit-box-shadow: -4px 0 4px -2px rgba(0,0,0,0.5);
    -moz-box-shadow:    -4px 0 4px -2px rgba(0,0,0,0.5);
    box-shadow:         -4px 0 4px -2px rgba(0,0,0,0.5);*/
}
.sidebar ul {
    padding: 0px; margin: 0;
    width: 100%; height: 100%;
}
.sidebar ul li{
    width: 100%;
    height: 20%;
    list-style: none;
    background-color: rgba(0,0,0,0.1);
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    opacity: 0.8;
}
.sidebar ul li:hover, .sidebar ul li:focus, .sidebar ul li:active {
    opacity: 1;
}
.sidebar ul li a:hover, .sidebar ul li a:focus, .sidebar ul li a:active {
    text-decoration: none;
}
.sidebar ul li a{
    color:white;
    float:left;
    width: 100%; height: 100%;
}
.sidebar ul li a span{
    width: 100%;
    float: left;
    padding: 5px;
}

.page-content-bg {
    z-index: -2;
    position: fixed; 
    /*top:0; */
    left:0; bottom:0; right:100px;
    /*background-image: url(../images/wooden-floor.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 100% auto;*/
}
.page-content-bg img {
    width: 100%; height: auto;
    display: block;
    position: absolute;
    bottom: 0;
}
.page-content-bg-dog, .page-content-bg-cat {
    z-index: -1;
    position: fixed; /*left:20px; bottom: 0;*/
    /*top:100px;*/ left:20px; bottom:10px; right:120px;
    top:100%;
}
.page-content-bg-dog img {
    max-width: 135px; max-height: 250px;
    position: absolute; left:0; bottom:0;
}
.page-content-bg-cat img{
    max-width: 197px; max-height: 250px;
    position: absolute; right:0; bottom:0;
}
.page-content-bg-dog img, .page-content-bg-cat img{
    width: 35%; height: auto;
}
.bg-overlay-slide {
    z-index: 0;
    /*margin-top: 44%;44%*/
}

.page-content-wrapper {
    z-index:2;
    padding-top: 100px; padding-right: 100px;
    width: 100%; height: auto;
    float:left;
}

.page-content {
    background: #fff;
    padding: 10px;
    margin-bottom: 70px; margin-top: 15px;
    
    border: 1px solid #eee;
    
    -webkit-border-top-right-radius: 20px;
    -webkit-border-top-left-radius: 20px;
    -moz-border-radius-topright: 20px;
    -moz-border-radius-topleft: 20px;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    
    -webkit-border-bottom-right-radius: 20px;
    -webkit-border-bottom-left-radius: 20px;
    -moz-border-radius-bottomright: 20px;
    -moz-border-radius-bottomleft: 20px;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}
.page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6 {
    margin-top: 0;
}

.produtos-list {
    font-family: 'Droid Sans';
    margin: 15px 5px 15px 5px;
}
.produtos-list:last-child {
    margin-bottom: 0;
}
.produtos-list div[class^="col-md"] {
    text-align: left;
}
.produtos-list div[class^="col-md"] img {
    max-width: 100%; height: auto;
}
.produtos-list div[class^="col-md"] .text {
    text-align: center;
    padding-top: 5px;
}
.produtos-list div[class^="col-md"] a h3 {
    font-size: 14px;
}
.produtos-list div[class^="col-md"] a, .produtos-list div[class^="col-md"] a h3 {
    color:#262626;
}
.produtos-list div[class^="col-md"] a:active .text h3, 
.produtos-list div[class^="col-md"] a:focus .text h3, 
.produtos-list div[class^="col-md"] a:hover .text h3,
.produtos-list div[class^="col-md"] a:active .text, 
.produtos-list div[class^="col-md"] a:focus .text, 
.produtos-list div[class^="col-md"] a:hover .text {
    color:#EE7C0C;
}
.produtos-list div[class^="col-md"] a{
    float:left;
    border: 1px solid #eee;
    padding: 0px;
    max-width: 100%; 
    min-height: 225px; height: auto;
    text-decoration: none;
}
.produtos-list div[class^="col-md"] img.produto-img {
    height: 350px; width: auto;
}
.produtos-list-voltar {
    max-height: 55px;
}



/*Se quisermos o footer fixado.*/
.footer-content-wrapper {
    z-index:2;
    padding-right: 100px;
    width: 100%; height: auto;
    float:left;
    position: fixed; bottom:0;
}
.footer-content {
    text-align: center;
    background: #F7F7F7;
    padding: 10px;
    border: 1px solid #eee;
    height: 38px; line-height: 18px; font-size:12px;
    max-width: 300px; 
    z-index:2;
    
    -webkit-border-top-right-radius: 20px;
    -webkit-border-top-left-radius: 20px;
    -moz-border-radius-top-right: 20px;
    -moz-border-radius-top-left: 20px;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
}


@media(max-width:960px) {
    .navbar {
        padding: 0px;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        transition: background .5s ease-in-out,padding .5s ease-in-out;
    }
}
@media(min-height:650px) {
    /*rotate text if enough space*/
    .sidebar ul li a span {
        float:none;
        font-size: 1.577vh;
        font-weight: bold;
        text-align: right; 
        padding-top: 0; padding-bottom: 0;
        padding-left:5px; padding-right: 5px;
        margin-top: 2000%; width: 2000%;
        height: 24px; line-height: 24px;
        display: block;
        -o-transform-origin: top left;
        -o-transform: rotate(-90deg);
        -webkit-transform-origin: top left;
        -webkit-transform: rotate(-90deg);
        -moz-transform-origin: top left;
        -moz-transform: rotate(-90deg);
        transform-origin: top left;
        transform: rotate(-90deg);
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
}
@media(max-width:980px) {
    .navbar ul { display: none;}
    .toggle-responsive-menu {display:inline;}
}
@media(max-width:760px) {
    .sidebar { display:none; }
    .fill-slide{padding-right: 0;}
    .page-content-wrapper, .footer-content-wrapper{
        padding-right: 0;
    }
    .page-content-bg, .page-content-bg-dog, .page-content-bg-cat {
        right: 0;
    }
    .bg-overlay-slide {
        
    }
}


/* Sections - You can use these as guides or delete them - the scroller will work with any sort of height, fixed, undefined, or percentage based.
The padding is very important to make sure the scrollspy picks up the right area when scrolled to. Adjust the margin and padding of sections and children 
of those sections to manage the look and feel of the site. */
.section {
    height: 100%;
    /*padding-top: 150px;*/
    padding-bottom: 50px;
    text-align: center;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #fff;
}
.section img {
    max-width: 100%;/*responsive scale img*/
}

.intro-section {
    
}

.produtos-section {
    
}

.prod1-section {
    
}

.contact-section {
    background: #eee;
}

section .container .light-bg {
    background: rgba(255,255,255,0.4);
    padding: 25px;
}

.container-fluid{height:100%;display:table; width: 100%; padding: 0;}
.row-fluid {height: 100%; display:table-cell; vertical-align: middle;}
.centering { float:none; margin:0 auto;}
