﻿/*=============================================================
Authour URL: www.designbootstrap.com
 http://www.designbootstrap.com/
License: MIT
http://opensource.org/licenses/MIT
100% Free To use For Personal And Commercial Use.
IN EXCHANGE JUST TELL PEOPLE ABOUT THIS WEBSITE

GOOGLE FONT   ============================================================ */

@import url(https://fonts.googleapis.com/css?family=Ubuntu); /* FREE GOOGLE FONT */
@import url(https://fonts.googleapis.com/css?family=Oswald); /* FREE GOOGLE FONT */

/* =============================================================
GENERAL STYLES
============================================================ */
body {
font-family: 'BandaRegular', sans-serif;
color: #fff; background:#F3F3F3
}

section {
padding-top: 40px;
padding-bottom: 40px;
}

.pad-bottom {
padding-bottom: 30px;
}

.header {
font-family: 'BandaRegular', sans-serif;
padding-bottom: 50px;
}

.header hr {
width: 100%;
border-top: 2px solid rgb(255, 153, 0);
}
.erb-image-wrapper{
    max-width:100%;
    height:auto;
    position: relative;
    display:block;
    margin:0 auto; float: left;}
.erb-image-wrapper img{
    max-width:100% !important;
    height:auto;
    display:inline-block; text-align:left !important }

/* =============================================================
CUSTOM BUTTON STYLES
============================================================ */
.button-custom {
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
margin: 25px 5px 5px 0px;
margin: 5px;
}

.btn-custom-one {
	background-color: #FFF;
	color: #FF6600;
	border: 2px solid rgb(255, 153, 0);
}

.btn-custom-one:hover {
background-color: rgb(255, 153, 0);
text-decoration: none;
color: #fff;
}

.btn-custom-two {
	color: #FFF;
	color: #FFF;
	background-color: #b58d31;
	font-size: 24px
}

.btn-custom-two:hover {
	text-decoration: none;
	color: #333;
	background-color: #FC0;
}
.btn-custom-three {
color: #FFF;background-color:#B58D31;
}
@media screen and (max-width: 699px) and (min-width: 220px) {
	.btn-custom-two {font-size: 16px}
.btn-custom-three {
color: #FFF;background-color: rgb(0, 0, 0);
}	}
.btn-custom-three:hover {
background-color: rgb(255, 255, 255);
text-decoration: none;
color: #B58D31;
}

/* =============================================================
MENU SECTION STYLES
============================================================ */
.navbar-inverse {
background-color: rgba(255, 255, 255, 0.8);
border-color: transparent; border-bottom:1px solid #CCC
}
.navbar-brand img {margin-top: -15px;}

.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
background-color: rgba(0,0,0, 0);
}



.navbar-inverse .navbar-nav > li > a {
	font-size: 0.75em;
	font-weight: 800;
	padding: 2px ;
	letter-spacing: 0.9px;
	margin: 8px ;
	color: #333;
}
.simular {
	color:#FFF!important;
	background-color:#b58d31;
	padding:10px 20px !important
}
.navbar-inverse .navbar-nav > li > a:hover{	background: rgba(255, 153, 0, 0.7); position:relative; background-position:20px 20px}
.navbar-inverse .navbar-nav > li a span { clear:both}
.navbar-inverse .navbar-nav > li a img{ padding:5px;  z-index:100; clear:both}

.navbar-inverse .navbar-brand, .navbar-inverse .navbar-brand:hover {
color: #fff;
font-weight: 900;
font-family: 'Oswald', sans-serif;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
border-color: transparent; margin-top:30px
}
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
background-color: rgb(255, 153, 0);
}
.navbar-inverse .navbar-toggle {
border-color: rgb(255, 255, 255);
}


/* =============================================================
HOME SECTION STYLES
============================================================ */

#home {
text-align: center;
padding-top: -120px;
padding-bottom: 60px;
}

#home .social {
display: block;
margin: 50px 20px;
}

/*Carousel Slider*/

#carousel-slider {
padding: 20px 20px 5px 10px;
}

#carousel-slider h3 {
line-height: 50px;
font-family: 'BandaLight', sans-serif;
font-size:50px; background-color: rgba(0, 0, 0, 0.05);
}

#carousel-slider p {
color: rgb(20,20,20);
font-size: 16px;
line-height: 25px;
margin: 25px 20px;
}

/* =============================================================
SERVICES SECTION STYLES
============================================================ */
#services { background: #FFF}

#services .services-wrapper {
	padding: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-bottom: 40px;
background-color: rgba(255, 255, 255, 0.8);
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

/*#services .services-wrapper:hover {
background-color: rgba(48, 54, 0, 0.1);
}*/


#services h3 {
font-family: 'BandaRegular', sans-serif; display:inline-block
}

#services .services-wrapper i {
margin: 5px;
color: rgb(255, 153, 0);
font-size: 60px;
}


/*============================
PRICING SECTION STYLES
==============================*/

.light-pricing {
margin-bottom: 30px;
margin-top: 50px;
text-align: center;
box-shadow: 0 0 5px rgba(0, 0, 0, .5);
background-color: rgba(255, 153, 0, 0.8);
color: #fff;
line-height: 30px;
cursor: pointer;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

.light-pricing:hover {
background-color: rgba(0, 0, 0, 0.8);
}

.light-pricing ul {
list-style: none;
margin: 0;
text-align: center;
padding-left: 0px;
}

.light-pricing ul li {
padding: 10px; 
cursor: pointer;
color:#FFF
}
.light-pricing p {
padding: 10px; 
cursor: hand;
color:#FFF
}

.light-pricing p i {
margin-right: 5px;
}

.light-pricing ul li i {
margin-right: 5px;
}


.light-pricing .price {
padding: 40px 20px 20px 20px;
font-size: 60px;
font-weight: 900;
}

.light-pricing .price small {
color: #000;
display: block;
font-size: 15px;
margin-top: 22px;
}

.light-pricing .type { font-family:BandaLight;	
background-color: rgba(255, 255, 255, 0.9);
padding: 30px 20px;
font-weight: 900;
font-size: 20px;
color: rgb(255, 153, 0);
}
.light-pricing .type p i { 	
padding: 10px;
font-weight: 900;
font-size: 100px;
color: rgb(255, 153, 0);
}

.light-pricing .pricing-footer {padding: 20px;}

.db-attached > .col-lg-4,
.db-attached > .col-lg-3,
.db-attached > .col-md-4,
.db-attached > .col-md-3,
.db-attached > .col-sm-4,
.db-attached > .col-sm-3 {
padding-left: 5px;
padding-right: 0;
}

.light-pricing.popular {
margin-top: 10px;
}

.light-pricing.popular .price {
padding-top: 80px;
}


/*============================
WORK SECTION STYLES
==============================*/
#work { background: #FFF}
#work h3 {color:#B58D31; font-size:24px}

#work .caegories a.active {
background-color: transparent;
color: #fff;
}

.isotope .isotope-item {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
transition-duration: 0.8s;
}

#work .work-wrapper {
padding: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin-bottom: 40px;
background-color: rgba(255, 255, 255, 1);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}



#work .work-wrapper h4 {
padding-top: 10px;
}

#work .work-wrapper p { text-align:left;}
#work .work-wrapper ul { text-align:left;}

/*============================
TEAM SECTION STYLES
==============================*/
#team {background:#FFF}



#team .services-wrapper {
	padding: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
background-color: rgba(255, 255, 255, 1);
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;

}

/*#team .services-wrapper:hover {
background-color: rgba(48, 54, 0, 0.05);
}*/

.team-wrapper {
overflow-x: hidden;
position: relative;
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-ms-transform: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
margin-bottom:30px;
}
.team-wrapper:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
transform: scale(1.1);
}
.team-wrapper .team-inner {
background-size: cover;
background-position: center;
-moz-background-size: cover;
-webkit-background-size: cover;
padding: 150px 0 10px;
/*background-image: url('../img/girl-big.jpg');*/
border-top: 1px solid #fff;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
border-radius: 10px 10px 0px 0px;
}

.team-wrapper > .team-inner > a {
color: rgb(255, 153, 0);
width: 80px;
height: 80px;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
margin: 0 auto -50px;
display: block;
color: rgb(255, 153, 0);
z-index: 999;
font-size: 40px;
padding: 15px 22px;
background-color: #fff;
-webkit-transition: all 0.8s ease-in-out;
-moz-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

.team-wrapper > .team-inner > a:hover {
color: #fff;
text-decoration: none;
background-color: rgb(255, 153, 0);
}


.team-wrapper .description {
padding: 30px 20px 20px;
text-align: center;
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
}

.team-wrapper .description h5 {
color: rgb(255, 153, 0);
}



/*============================
CONTACT SECTION STYLES
==============================*/

#contact .contact-wrapper {
background-color:rgba(237, 49, 37, 0.7);
padding: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin-bottom: 40px;
min-height:200px;
}
#service-contact .formulario {
background-color:rgba(237, 49, 37, 0.7);
padding: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin-bottom: 40px;
min-height:200px;
}
#contact .contact-wrapper h3 {
color:rgb(255, 153, 0);
}
#contact .social-below {
display: block;
margin-top: 5px;
}
#testimonials-3 {
    background-image: url(../img/back_afiliados.jpg);
    height: 550px; margin-top:100px; background-position: 25% -73px;}
	
@media screen and (max-width: 699px) and (min-width: 220px) {
#testimonials-3 {
    background-position: -220px -73px;}
}
#testimonials-3 p {
	color:#333;
	font-weight:700 !important;
	text-align: left; margin-left:5px
}
.pad-top40 {
    padding-top: 200px;
}
.pad-top100 {
    padding-top: 100px;
}

.pad-top150 {
	padding-top: 120px;
}

.footer-div {
padding-top:25px;
}
.footer-div a,.footer-div a:hover {
font-size:10px;

color:#fff;
text-decoration:none;
}

/*============================
GRID SECTION STYLES
==============================*/
#grid { background:url(../img/backg_porque_tile.png) repeat;}
#grid h6 {color:#666666}

#grid .services-wrapper {
padding: 20px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
margin-bottom: 40px;
background-color: rgba(255, 255, 255, 0.8);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}


/*============================
RETIRAR SECTION STYLES
==============================*/

#retirar {background: #FFF}
#retirar .services-wrapper {
	padding: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-bottom: 40px;
background-color: rgba(255, 255, 255, 1);
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
#retirar .services-wrapper-caja {
	padding: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-bottom: 40px;
	background-color: rgba(255, 255, 255, 0.8);
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
#retirar .services-wrapper img{
	position:relative;  
}
#retirar .services-wrapper-caja img{
	position:relative; 
}

/*============================
footer SECTION STYLES
==============================*/
.footerinferior {
	padding-top: 15px; margin:0; width:100%;	background-color: rgba(0,0,0, 0.8); color:#FFF; height:90px; position:absolute; margin-bottom:-20px 	
}
.footerinferior h5 { text-align:center; margin:0}
.footerinferior p { text-align:center;}
.footerinferior img { margin-right:10px}

/**************** VIDEO **********************/
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*===========================
  --- Contact ----
=========================== */

.validation {
	display:none;
	margin: 0 0 20px;
	font-weight:400;
	font-size:13px;
}

#sendmessage {
	border:1px solid #fff;
	display:none;
	text-align:center;
	padding:15px 12px 15px;
	margin:10px 0;
	font-weight:600;
	margin-bottom:30px;
}

#sendmessage.show,.show  {
	display:block;
}

#contact-form {
	position: relative;
	z-index: 999;
}

#contact-form input[type=text],#contact-form input[type=email], .contactForm textarea {
	width: 100%;
	background: rgba(227, 231, 228, 1);
	font-family: 'Ubuntu', sans serif;
	border: 0;
	font-size:14px;
	text-align: left;
	vertical-align: middle;
	padding:0 10px;
}
#contact-form input[type=text]:focus,#contact-form input[type=email]:focus, .contactForm textarea:focus {
	background: rgba(101, 106, 100, 1);
	color: #eff1ef;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	transition: background 0.25 ease-in;
	-moz-transition: background 0.25 ease-in;
	-webkit-transition: background 0.25 ease-in;
}
#contact-form input[type=text],#contact-form input[type=email] {
	height: 60px;
	margin-bottom:30px;
}
#contact-form input[type=submit] {
	color: #fff;
	width: 185px;
	height: 60px;
	text-shadow: none;
	font-size: 14px;
	padding:0.5em;
	letter-spacing: 0.05em;
	margin: 0 0 20px 0;
	display: block;
	border: 0;
	text-transform: none;
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}
#contact-form input[type=submit]:hover, #contact-form input[type=submit]:active {
	background: #43413e !important;
}
#contact-form textarea {
	padding-top: 1em;
}

textarea.form-control {
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
}

div.cform-response-output {
	max-width: 60%;
	text-align: center;
	margin-left: 40% !important;
	margin-top: 0.5em !important;
	padding: 0.5em !important;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
.cform-not-valid-tip {
	color: #888;
	border: 1px dotted #ad3729 !important;
	width: 100% !important;
	left: 0 !important;
	padding: 0.5em !important;
	font-family: 'Ubuntu', sans-serif;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
.line-btn,
input[type="submit"],
button[type="submit"] {
  font-weight: bold;
  color: #fff;
    background-color: rgb(255, 153, 0);
    border: 2px solid rgb(255, 255, 255);
  height: 50px;
  padding: 0 50px;
  cursor: pointer;
  white-space: nowrap;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  -webkit-transition: all 0.2s ease-in-out 0s;
  -moz-transition: all 0.2s ease-in-out 0s;
  -o-transition: all 0.2s ease-in-out 0s;
  -ms-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
  display: inline-block;
}
.line-btn.green,
input[type="submit"].green,
button[type="submit"].green {
  background: rgba(255,153,0,1);
  border: none;
  color: #ffffff;
}


.iconossociales {    position: fixed;    right: 0;    bottom: 100px;    height: 330px;    width: 80px;
    margin: 0;    padding: 10px;    background-color: #B58D31; z-index:1000; font-size:11px; text-align:center}
.iconossociales-retiro {    position: fixed;    right: 0;    bottom: 100px;    height: 300px;    width: 80px;
    margin: 0;    padding: 10px;    background-color: #327E77; z-index:1000; font-size:11px; text-align:center}
.iconossociales a { display:inline-block}
.switchaudiencia {  color: #FFF; border: 1px solid #FFF;    padding: 5px; }
.switchaudiencia:hover { text-decoration:underline !important; color:#FFFFFF}
.floaterderecha {float:right}
.margender {margin-right: 30px;}
.margenizq {margin-left: 30px;}
