ul{
	list-style: none;
	margin: 0px;
	padding: 0px;
}
.navbar-default {
    background-color: transparent;
    border-color: transparent;
}
.navbar-brand{
	height: auto;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: trasparent;
}
.navbar-collapse {
    margin-top: 20px;
	border-top: none;
}
/*----------------*/
@font-face{
	src: url(../font/GothamRounded-Medium.otf);
	font-family: 'GothamRounded-Medium';
}
@font-face{
	src: url(../font/GothamRounded-Book.otf);
	font-family: 'GothamRounded-Book';
}
@font-face{
	src: url(../font/GothamRounded-Bold.otf);
	font-family: 'GothamRounded-Bold';
}
@font-face{
	src: url(../font/GothamRounded-Medium.otf);
	font-family: 'GothamRounded-Medium';
}
body{
    font-family: 'GothamRounded-Book';
}
#loading {
  z-index: 10;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  position: absolute;
  background: #fff;
}
body.loading{
    overflow: hidden;
}
/*---- header ----*/
header .top-data {
    background-color: #FF9900;
    font-size: 14px;
    font-family: 'GothamRounded-Medium';
    padding-top: 4px;
    padding-bottom: 4px;
    height: 28px;
}
header .top-data, header .top-data a{
    color: #FFF;
    transition: all 0.2s ease-in;
}
header .top-data a:hover{
    text-decoration: none;
    opacity: 0.8;
}
.navbar-nav{
	margin-top: 20px;
}
.navbar-nav li a{
	font-family: 'GothamRounded-Medium';
	font-size: 14px;
    color: #000 !important;
    transition: all 0.25s ease-in;
}
.navbar-nav li a:hover{
    opacity: 0.7;
}
.navbar-nav li a.active{
	cursor: default;
	color: #FF9900 !important;
    background-color: transparent;
}
.navbar-nav li a.active:hover,.navbar-nav li a.active:focus,.navbar-nav li a.active:active{
	color: #FF9900 !important;
    opacity: 1 !important;
}
/*----- index ----*/
section.carusel{
    background-color: #F5F5F5;
    padding-top: 20px;
}
h4{
	font-family: 'GothamRounded-Bold';
	font-size: 62px;
    color: #FF9900;
    word-wrap: break-word;
}
#myCarousel{
     padding-bottom: 40px;   
}
#myCarousel .item img{
    margin: 0 auto;
}
#myCarousel .item .desc{
    padding-top: 20px;
}
#myCarousel .item p{
	font-family: 'GothamRounded-Book';
	font-size: 18px;
    margin-top: 20px;
    max-width: 360px;
}
#myCarousel .item p span{
	font-family: 'GothamRounded-Bold';
	font-size: 18px;
}
.carousel-indicators{
    bottom: 8%;
    left: 0%;
    width: auto;
    text-align: left;
    padding-left: 34%;
	margin-left: initial;
    z-index: 2
}
.carousel-indicators li{
	border-color: #FF9900 !important;
}	
.carousel-indicators .active{
	background-color: #FF9900 !important;
}
/**fade-effect**/
.modal .carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.modal .carousel-fade .carousel-inner .active {
  opacity: 1;
}
.modal .carousel-fade .carousel-inner .active.left,
.modal .carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}
.modal .carousel-fade .carousel-inner .next.left,
.modal .carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.modal.carousel-fade .carousel-control {
  z-index: 2;
}
/********************/
.why{
	text-align: center;
	padding-top: 110px;
    padding-bottom: 110px;
    background-color: #FF9900;
}
.why h3{
	margin-bottom: 120px;
	font-family: 'GothamRounded-Book';
	font-size: 50px;
	color: #FFF;
}
.why h3 b{
	font-family: 'GothamRounded-Bold' !important;
}
.why .setup p{
	font-family: 'GothamRounded-Medium';
	font-size: 18px;
	color: #FFF;
	max-width: 160px;
	margin: 0 auto;
	margin-top: 20px;
    margin-bottom: 40px;
}
.why .setup img{
	margin:0 auto;
}
/********************/
.us{
    background-color: #16BEBE;
    color: #FFF;
    font-family: 'GothamRounded-Book';
	font-size: 20px;    
    padding-top: 110px;
    padding-bottom: 110px;
}
.us img{
    margin-bottom: 40px;
}
.us p{
    margin-top: 20px;
    max-width: 570px;
    line-height: 30px;
}
/*------producto -----*/
.productos{
    text-align: center;
    padding-top: 40px;
    padding-bottom: 160px;
}
.productos p{
 	font-family: 'GothamRounded-Book';
	font-size: 18px;
    margin-top: 20px;
    max-width: 870px;
    margin: 0 auto;
    margin-bottom: 80px;
}
.productos .row{
   margin-bottom: 20px;
}
.productos .row p{
    font-size: 14px;
    margin-bottom: 0px;
}
.productos p.producto-nombre{
    font-family: 'GothamRounded-Bold';
}
.productos .item{
    transition: all 0.20s ease-in;
	padding-bottom: 20px;
}
.productos .item:hover{
    cursor: pointer;
    border: 4px solid #FF9900;
    border-radius: 8px;
}
.productos .item:hover > *{
    color: #FF9900;
}
.modal-backdrop{
    background-color: #0F7B7B;
}
.modal-content{
    box-shadow: none;
    -webkit-box-shadow: none;
}
.modal-product-description{
	text-align: center;
}
.modal-product-description p{
	font-family: 'GothamRounded-Book';
	font-size: 18px;
}
.modal-product-description p strong{
    font-family: 'GothamRounded-Bold';
}
.carousel-inner img{
	padding-left: 20px;
}
.close {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 2;
    opacity: 1;
    background: url(../img/cruz.svg) no-repeat !important;
    background-size: auto 100% !important;
}
/*****footer********/
footer{
	background-color:#0F7B7B;
	padding-top: 80px;
	padding-bottom: 240px;
    color: #fff;
	font-family: 'GothamRounded-Book';
}
footer .brand ul{
    max-width: 260px;
}
footer p.design{
    margin-top: 34px;
}
footer li{
    margin-bottom: 4px;
}
footer li img{
    margin-right: 2px;
}
footer a{
	color: #fff;
    transition: all 0.2s ease-in;
    font-family: 'GothamRounded-Bold';
}
footer a:hover{
	text-decoration: none;
	opacity: 0.75;
    color: #fff;
    cursor: pointer;
}
/******reponsive********/
@media (min-width: 1264px){
    .container {
        width: 1264px;
    }
}
@media screen and (min-width:1200px){
    #myCarousel .item .desc{
        padding-top: 100px;
    }
}
@media screen and (max-width:991px){
    footer .brand{
        margin-top: 40px;
    }
    h4{
        font-size: 40px;
    }
    .carousel-indicators {
        bottom: 0%;
        left: 16%;
    }
}
@media (min-width:768px) and (max-width: 991px){
    .navbar-right {
        float:inherit !important;
    }
}
@media (max-width:768px){
	.us img{
		margin: 0 auto;
		margin-bottom: 20px;
	}
}
@media (max-width: 425px){
	.productos.personalizadas h4{
		font-size: 34px !important;
		margin-bottom: 20px;
	}
	footer .col-md-6{
		margin-bottom: 40px;
	}
	footer{
		padding-bottom: 80px;
	}
}
