/* ==============================================================

Template name : Gotte multi purpose landing page with flat design
Categorie : Landing page
Author : Nce18cex
Version : v1.0.0
Created : 1 January 2014
Last update : 12 January 2014

-----------------------------------------------------------------
CSS structure
-----------------------------------------------------------------

01. Home
02. Intro
03. Info
04. Scrolltop
05. Header
06. Navigation
07. About
08. Testimoni
09. Services
10. Gallery
11. Request form
12. Contact
13. Footer
14. Social network
15. Clear spacer
16. Custom top spacer
17. Custom bottom spacer
18. Custom left spacer
19. Custom right spacer
20. Custom responsive

============================================================== */

/*
Home
=========================== */
#home {
	background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(../img/home-image-min.png) no-repeat center center fixed;
	color: #fff;
	padding: 80px 0 0 0;
	font-size: 14px;
	line-height: 22px;
}



.logo{
	display:inline-block;
	margin:0 0 40px 0;
}

/*
Intro
=========================== */
.intro{
	padding-bottom:40px;
	margin-bottom:120px;
}

.intro-divider{
	background:url(../img/intro-bg.png) no-repeat center center;
	margin:20px 0 30px 0;
	display:block;
	width:100%;
	height:24px;
}

/*
Info
=========================== */
.info{
	position:absolute;
	width:40%;
	-moz-transition: all .25s ease-in-out;
	-webkit-transition: all .25s ease-in-out;
	-o-transition: all .25s ease-in-out;
	transition: all .25s ease-in-out;
}

.arrow-info{
	width:197px;
	height:63px;
	display:block;
}

.info-act{
	background:none;
	font-size:14px;
	line-height:14px;
	border:1px solid #fff;
	border-radius:1px;
	color:#fff;
	padding:10px 25px 10px 25px;
}

.info-act:hover,
.info-act:focus,
.info-act:active{
	outline:none;
	text-decoration:none;
	border:1px solid #fff;
	background:#fff;
}

/* info on top left */
.info.topleft{	
	text-align:left;
	top:0;
	left:0;
}

.topleft .arrow-info{
	background:url(../img/arrow-info.png) no-repeat 0 0;	
	float:right;
	margin:-40px 40px 0 0;
}

/* info on top right */
.info.topright{
	text-align:right;
	top:0;
	right:0;
}

.topright .arrow-info{
	background:url(../img/arrow-info-r.png) no-repeat 0 0;	
	float:left;
	margin:-40px 0 0 0;
}

/* info on bottom left */
.info.botleft{	
	width:30%;
	text-align:left;
	bottom:180px;
	left:0;
}

.botleft .arrow-info{
	background:url(../img/arrow-info-bt.png) no-repeat top right;	
	float:right;
	width:100%;
	margin:0;
}

/* info on bottom right */
.info.botright{	
	width:30%;
	text-align:right;
	bottom:180px;
	right:0;
}

.botright .arrow-info{
	background:url(../img/arrow-info-br.png) no-repeat top left;	
	float:left;
	width:100%;
	margin:0 0 0 -60px;
}

/*
Scrolltop
=========================== */
.scrolltop ul{
	float:left;
	width:100%;
	overflow:hidden;
	padding:0;
	margin:;
}

.scrolltop ul li{
	float:left;
	width:100%;
	list-style:none;
	display:block;
	padding:0;
	margin:0;	
}

.scrolltop h3{
	
	line-height:72px;
	text-transform:uppercase;
}

.scrolltop p{
	font-size:25px;
	line-height:42px;
	text-transform:uppercase;	
	margin-bottom:0;
}

/*
Header
=========================== */
header{
	position:relative;
	background:#383f45;
	color:#fff;
	margin:0;
	padding:0;
}

/*
Navigation
=========================== */
.nav-fixed {
	position: fixed;
	top:0;
	z-index:9999;
}

.sticky {
	position: fixed;
	top: 0;	
	width:100%;
	animation:thedrop 1s 1;
	-moz-animation:thedrop 1s 1;
	-webkit-animation:thedrop 1s 1;
	z-index:9999;
}

.sticky .nav-above {
	position: absolute;
	top:0;
	left:0;
	right:0;
	height:auto;
}

/*
About
=========================== */
#about {
	background: linear-gradient(#fff, #b6b6b6bf),url(../img/About-min.png) repeat 0 0;
	color: #383f45;
	margin: 0;
	padding: 120px 0 0 0;
}

/*
Testimoni
=========================== */
#testimoni{
	position:relative;
	background-image:url(../img/pattern3.png);
	background-repeat:repeat;
	background-position:0 0;
	background-color: #2b343c;
	color:#fff;
}

.testimoni-wrapp{
	position:relative;
	font-family:'georgia',serif;
	color:#b6b6b6;
	font-size:30px;
	font-style:italic;
	line-height:1.5em;
	border-radius:2px;
	text-align:center;
}

.clent-info{
	font-family: 'Open Sans', sans-serif;
	color:#fff;
	font-size:18px;
}

.clent-info a{
	font-weight:300;
	margin-left:10px;
}

/*
Services
=========================== */
#services {
	background: linear-gradient(#fff, rgba(0, 0, 0, 0.5)),url(../img/servicios-min.png) repeat 0 0;
	color: #2b343c;
	margin: 0;
}

.service-icon{
	width:220px;
	height:194px;
	padding-top:10px;
	border-radius:2px;
}

.service-icon.default-icon{
	background:#39434c;
	border-bottom:10px solid #2b343c;
}

.service-icon.secondary-icon,
.service-icon.tertiary-icon{
	border-bottom:10px solid;
}

/*
Gallery
=========================== */
#gallery {
	background-image: linear-gradient(rgba(255, 255, 255, 0.75), rgba(0, 0, 0, 0.5)),url(../img/FondoGaleria-min.png);
	background-repeat: repeat;
	background-position: 0 0;
	background-color: #2b343c;
	color: #fff;
	margin: 0;
	padding: 120px 0 80px 0;
}

.gallery-img-wrapper{
	position:relative;
	overflow:hidden;
	width:100%;
	height:auto;
	margin:0;
}

.caption-wrapper{
	position:absolute;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	z-index:1;	
	top:100%;
}

.caption-bg{
	position:absolute;
	display:block;
	width:100%;
	height:100%;
	opacity:0.9;
	z-index:2;
}

.caption-text{
	position:absolute;
	z-index:4;
	width:100%;
	height:auto;
	text-align:center;
	font-size:14px;
	line-height:20px;
	color:#fff;
	top:25%;
}

.caption-text p{
	opacity:0.9;
}

.zoom{
	background:url(../img/zoom.png) no-repeat 0 0;
	width:44px;
	height:44px;
	display:inline-block;
	overflow:hidden;
	text-indent:-9999px;
	margin-bottom:15px;
	opacity:0.9;
}

.zoom:hover{
	opacity:1;
}

.gallery-title {
	text-align: center;
	background: #f5eb72;
	color: #161616;
	padding: 5px 15px 5px 15px;
	font-size: 16px;
	margin: 0 0 30px 0;
}

/*
Request form
=========================== */
.request-form{
	float:left;
	color:#2f2f2f;
	font-size:14px;
	width:100%;
	background:#fff;
	position:relative;
	margin:0;
	padding:20px;
	border-radius:2px;
	-webkit-box-shadow: 15px 15px 0 rgba( 56, 63, 69, 0.3);
	   -moz-box-shadow: 15px 15px 0 rgba( 56, 63, 69, 0.3);
	        box-shadow: 15px 15px 0 rgba( 56, 63, 69, 0.3);	
}

.request-form h3{
	color:#2f2f2f;
	font-size:36px;
	line-height:46px;
}

.request-form h3 strong{
	font-weight:700;
}

ul.listcontrol{
	float:left;
	width:100%;
	margin:0;
	padding:0;
}

ul.listcontrol li{
	float:left;
	width:100%;
	position:relative;
	list-style:none;
	margin:0 0 20px 0;
	padding:0;
	background:none;
}

ul.listcontrol li label{
	color:#2f2f2f;
	font-weight:400;
	font-size:18px;
	padding:0;
	background:none;
	background-image:none;
}

ul.listcontrol li .form-control{
 height:45px;
  border-radius:2px;
  border:1px solid #7e7e7e;
  color:#161616;
  opacity:0.7;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

ul.listcontrol li .form-control:focus{
	border:1px solid;
}

#sendrequest{
	display:none;
}

#sendrequest.show,.show  {
	display:block;
}

/*
Contact
=========================== */
.contact-wrapper
{
	color: #383f45;
	background: url(../img/fondocontacto-min.png) repeat 0 0;
}



ul.listForm{
	width:100%;
	padding:0;
	margin:0;	
	list-style:none;
}

ul.listForm li {
	float:left;
	width:49%;
	margin:0 1% 15px 0;
}

ul.listForm li.list-block{
	width:99%;
	margin:0 1% 15px 0;
}

ul.listForm label{
	font-weight:400;
	display:block;
	color:#fff;
}

ul.listForm label span{
	font-weight:300;
	font-style:italic;
}

ul.listForm .form-control{
	height:45px;
}

ul.listForm textarea.form-control{
	height:160px;
}

.validation {
	display:none;
	margin-top: 5px;
}

#sendmessage{
	display:none;
}

#sendmessage.show,.show  {
	display:block;
}

.contact-detail h5{
	color:#2b343c;
	padding-bottom:10px;
	border-bottom:1px solid #fff;
}

.contact-detail label{
	font-weight:400;
	display:block;
	font-size:14px;
}

.contact-detail label i{
	margin-right:5px;
}

.contact-detail p{
	margin-bottom:20px;
}

.listForm .form-control
{
	border: 1px outset black;
}

/*
Footer
=========================== */
footer{
	background:url(../img/pattern2.png) repeat 0 0;
	color:#fff;
	text-align:center;
	padding:60px 0 50px 0;
}

.subscribe-form{
	width:100%;
	position:relative;
	margin:30px 0 20px 0;
}

input.subscribe{
	position:relative;
	width:100%;
	border:none;
	background:#fff;
	padding:20px;
	border-radius:2px;
}

.subscribe-button{
	position:absolute;
	border-radius:2px;	
	border:none;
	padding:20px;
	font-size:16px;
	line-height:18px;
	color: #383f45;
	font-weight:400;
	right:0;
	top:0; 	
}

.subfooter{
	background:#383f45;
	color:#fff;
	text-align:center;
	font-weight:12px;
	line-height:12px;
	padding:40px 0 20px 0;
}

/*
Social network
=========================== */
.social-network{
	text-align:center;
}

.social-link {
	background-repeat: no-repeat;
	background-position: 0 0;
	display: inline-block;
	height: 43px;
	width: 40px;
	text-indent: -9999px;
	margin: 0 5px 10px 5px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.social-link:hover {background-position: 0 -43px;}

.facebook {background: url(../img/social/fb.png) no-repeat;}
.googleplus {background: url(../img/social/google.png) no-repeat;}
.dribble {background: url(../img/social/dribble.png) no-repeat;}
.flickr {background: url(../img/social/flickr.png) no-repeat;}
.twitter {background: url(../img/social/twitter.png) no-repeat;}

/*
Heading
=========================== */
.heading{
	font-weight:700;
	text-transform:uppercase;
	margin-bottom:40px;
}

.heading.centered{
	background:url(../img/heading-center.png) no-repeat bottom center;
	text-align:center;
	padding-bottom:45px;
}

/*
Helper
=========================== */
.container-wrapper{
	padding:120px 0 80px 0;
}

.dark-bg{
	background: #2b343c;
}

/*
Scroller
=========================== */
#cbp-so-scroller,
.cbp-so-scroller{
	position:relative;
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	overflow: hidden;
}	
}

/* Clear floats of children */
.cbp-so-section:before,
.cbp-so-section:after {
	content: " ";
	display: table;
}

.cbp-so-section:after {
	clear: both;
}

/* Sides */
.cbp-so-side {
	overflow: hidden;
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	-moz-transition: -moz-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}

/* Clear floats of children */
.cbp-so-side:before,
.cbp-so-side:after {
	content: " ";
	display: table;
}

.cbp-so-side:after {
	clear: both;
}

/* Initial state (hidden or anything else) */
.cbp-so-init .cbp-so-side {
	opacity: 0;
}

.cbp-so-init .cbp-so-side-left {
	-webkit-transform: translateX(-80px);
	-moz-transform: translateX(-80px);
	transform: translateX(-80px);
}

.cbp-so-init .cbp-so-side-right {
	-webkit-transform: translateX(80px);
	-moz-transform: translateX(80px);
	transform: translateX(80px);
}

/* Animated state */
/* add you final states (transition) or your effects (animations) for each side */
.cbp-so-section.cbp-so-animate .cbp-so-side-left,
.cbp-so-section.cbp-so-animate .cbp-so-side-right {
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	transform: translateX(0px);
	opacity: 1;
}

/*
Clear spacer
=========================== */
.marginnone{
	margin:0;
}

.margintop-clear{
	margin-top:0;
}

.marginbot-clear{
	margin-bottom:0;
}

/*
Custom top spacer
=========================== */
.margintop5{
	margin-top:5px;
}

.margintop10{
	margin-top:10px;
}

.margintop15{
	margin-top:15px;
}

.margintop20{
	margin-top:20px;
}

.margintop25{
	margin-top:25px;
}

.margintop30{
	margin-top:30px;
}

.margintop35{
	margin-top:35px;
}

.margintop40{
	margin-top:40px;
}

.margintop45{
	margin-top:45px;
}

.margintop50{
	margin-top:50px;
}

.margintop55{
	margin-top:55px;
}

.margintop60{
	margin-top:60px;
}

/*
Custom bottom spacer
=========================== */
.marginbot5{
	margin-bottom:5px;
}

.marginbot10{
	margin-bottom:10px;
}

.marginbot15{
	margin-bottom:15px;
}

.marginbot20{
	margin-bottom:20px;
}

.marginbot25{
	margin-bottom:25px;
}

.marginbot30{
	margin-bottom:30px;
}

.marginbot35{
	margin-bottom:35px;
}

.marginbot40{
	margin-bottom:40px;
}

.marginbot45{
	margin-top:45px;
}

.margintop50{
	margin-top:50px;
}

.marginbot55{
	margin-top:55px;
}

.marginbot60{
	margin-top:60px;
}

/*
Custom left spacer
=========================== */
.marginleft5{
	margin-left:1px;
}

.marginleft10{
	margin-left:10px;
}

.marginleft15{
	margin-left:15px;
}

.marginleft20{
	margin-left:20px;
}

/*
Custom right spacer
=========================== */
.marginright5{
	margin-right:1px;
}

.marginright10{
	margin-right:10px;
}

.marginright15{
	margin-right:15px;
}

.marginright20{
	margin-right:20px;
}

/*
Custom responsive
=========================== */
@media (min-width: 1200px) {

}
@media (min-width: 768px) and (max-width: 990px) {
	.collapse {
	  display: inline-block;
	  float:left;
	}
	.accordion-body.collapse{
	  display: none;
	  float:none;
	  width:auto;	
	}
	.accordion-body.collapse.in {
	  display: block;
	}	
	.navbar .navbar-collapse .nav{
		width:100%;
	}
	.navbar .navbar-collapse .nav li{
		display:none;
	}
	.navbar .navbar-collapse .nav select{
		display:block;
		width:250px;	
	}
	#about{
		padding:120px 0 100px 0;
	}
	#about .heading{
		margin-top:40px;
	}
	.arrow-info{
		display:none;
	}
	.request-form{
		margin:-100px 0 80px 0;
	}
}

@media (max-width: 767px) {
	.collapse {
	  display: inline-block;
	  float:left;
	}
	.accordion-body.collapse{
	  display: none;
	  float:none;
	  width:auto;	
	}
	.accordion-body.collapse.in {
	  display: block;
	}	
	.navbar .navbar-collapse .nav{
		float:left;	
		width:100%;
		border:none;
		margin:0;
	}
	.navbar .navbar-collapse .nav li{
		display:none;
	}
	.navbar .navbar-collapse .nav select{
		display:block;
		width:250px;	
		margin:0;
	}
	.navbar-inverse .collapse{
		float:right;
		width:auto;
		position:relative;
		border:none;
		box-shadow:none;
		z-index:0;	
		padding:0;
		margin:3px 0 0 30px;
	}
	.navbar-inverse .navbar-header{
		float:left;
		width:auto;
		margin-left:10px;
	}
	#about{
		padding:120px 0 100px 0;
	}
	#about .heading{
		margin-top:40px;
	}
	.mobile-responsive{
		width:100%;
		height:auto;
	}
	.info,
	.info.topleft,
	.info.topright,
	.info.botleft,
	.info.botright{
		display:none;
	}
	.request-form{
		margin:-100px 0 80px 0;
	}	
}

@media only screen and (max-width: 558px) {
	.navbar-inverse .navbar-header{
		float:left;
		width:100%;
		margin:0;
		text-align:center;
	}
	.navbar-inverse .navbar-header .navbar-brand{
		float:none;
		margin:0;
		padding:0;
	}
	.navbar-inverse .collapse{
		margin:20px 0 0 0;
		padding:0;
		width:100%;
	}
	.navbar .navbar-collapse .nav select{
		width:100%;
	}
	#about, #gallery, .container-wrapper{
		padding:180px 0 80px 0;
	}
	#about .heading{
		margin-top:40px;
	}		
}

.card {
	box-shadow: 0 4px 8px 0 rgba(230, 167, 23, 0.60);
	color: #fff ;
	max-width: 300px;
	margin: auto;
	text-align: center;
	font-family: arial;
}

.price {
	color: grey;
	font-size: 22px;
}

.card button {
	border: none;
	outline: 0;
	padding: 12px;
	color: white;
	background-color: #000;
	text-align: center;
	cursor: pointer;
	width: 100%;
	font-size: 18px;
}

	.card button:hover {
		opacity: 0.7;
	}




/* PPortafolio */
*{
  box-sizing: border-box;
}

bedy {
  background-color: #f1f1f1;
  padding: 20px;
  font-family: Arial;
}

/* Center website */
.mein {
	max-width: 1000px;
	margin: auto;
}

h1 {
	font-size: 50px;
	word-break: break-all;
}

.row {
	margin: 10px -16px;
}

	/* Add padding BETWEEN each column */
	.row,
	.row > .column {
		padding: 8px;
	}

/* Create three equal columns that floats next to each other */
.column {
	float: left;
	width: 33.33%;
	display: none; /* Hide all elements by default */
}

/* Clear floats after rows */
.row:after {
	content: "";
	display: table;
	clear: both;
}

/* Content */
.content {
	background-color: white;
	padding: 10px;
}

/* The "show" class is added to the filtered elements */
.show {
	display: block;
}

/* Style the buttons */
.btn {
	border: none;
	outline: none;
	padding: 12px 16px;
	cursor: pointer;
}

	.btn:hover {
		background-color: #ddd;
	}

	.btn.active {
		background-color: #666;
		color: white;
	}

/* end PPortafolio */


/*#region What */
.last-section {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-bottom: 40px;
}

	.last-section img {
		width: 48%;
	}

	.last-section .contenedor-textos-main {
		width: 40%;
	}


.cta {
	display: inline-block;
	text-decoration: none;
	background-image: linear-gradient(45deg, #ff9a9e 0%, #fad0c4 99%, #fad0c4 100%);
	padding: 12px 15px;
	border-radius: 8px;
	color: #fff;
}



#app-messenger, #app-whatsapp {
	position: fixed;
	right: 24px;
	bottom: 25px;
	width: 60px;
	z-index: 1000;
	display: none;
}

#app-whatsapp {
	bottom: 95px;
	display: block;
}

	#app-messenger i, #app-whatsapp i {
		font-size: 63px;
	}

	#app-whatsapp i {
		color: rgb(37, 211, 102);
	}

#app-messenger i {
	color: #0084ff;
}



.header-section .float {
	position: fixed;
	top: 510px;
	width: 60px;
	height: 60px;
	right: 10px;
	background-color: #25d366;
	border-radius: 50px;
	text-align: center;
	box-shadow: 2px 2px 3px #999;
	z-index: 100;
}


/*#endregion */