body {
	background: #fff;
}

.btn-azul {
	background: #2612cc;
	color: #fff;
	font-family: 'Space Grotesk', sans-serif;
	border-radius: 25px;
}

	.btn-azul:hover {
		color: #fff;
	}

.btn-azul-border {
	border: 1px solid #2612cc;
	color: #121213;
	background: #fff;
	font-family: 'Space Grotesk', sans-serif;
	border-radius: 25px;
}

/* Encabezado */
header {
	background: #2612cc;
}

/* MENU PRINCIPAL */
.menu_principal .navbar {
	background: none;
	border: none;
	box-shadow: none;
	margin-top: 15px;
	color: #FFF;
	font-size: 16px;
	font-family: 'Space Grotesk', sans-serif;
}

.menu_principal .navbar .navbar-collapse {
    text-align: right;
}

.menu_principal .navbar .navbar-nav {
    display: inline-block;
    float: none;
    vertical-align: top;
}

.menu_principal .navbar .navbar-nav li a { 
	margin-left: 8px; 
	color: #fff;
}
.menu_principal .navbar .navbar-nav li a:hover { 
	border-radius: 10px;
	color: #b7b6b6;
}

/* Revolucionar */
#revolucionar {
	height: 500px;
	background: url('../imagenes/fondo-inicio.webp') no-repeat 50% 0,linear-gradient(180deg,#2612cc 24.74%,#002a76 100%);
    color: #fff;
    position: relative;
}
	
	#revolucionar h1 {
		margin-top: 105px;
		font-size: 55px;
		font-family: 'Space Grotesk', sans-serif;
		text-align: center;
	}

		#revolucionar h1 span { border-bottom: 1px dotted #fff; font-weight: 1200; }

/* Te llamamos */
#llamamos {
	z-index: 999;
}

#vistaLlamamos {
	height: 100px;
	background-color: #fff;
	margin-top: -50px;
	z-index: 999;
	position: relative;
	border-radius: 25px;
	background-image: url('../imagenes/fondos/lineas.png');
	box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}

	#vistaLlamamos h3 {
		color: #b7b6b6;
		font-size: 22px;
		text-align: center;
		margin-top: 35px;
		font-family: 'Space Grotesk', sans-serif;
	}

	#vistaLlamamos button {
		margin-top: 25px;
		padding: 10px;
		box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
	}

/* Bienvenida */
#bienvenida {
	margin-top: 50px;
}

	#bienvenida h4 {
		font-family: 'Space Grotesk', sans-serif;
		text-transform: uppercase;
		font-size: 16px;
		color: #b7b6b6;
		margin-bottom: 5px;
	}

	#bienvenida h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #2612cc;
		margin-top: 0px;
	}

	#bienvenida p {
		font-family: 'Roboto', sans-serif;
		color: #333;
		font-size: 16px;
		text-align: justify;
	}

	#bienvenida img {
		margin-top: 15px;
	}

/* Soluciones */
#soluciones {
	background: #000000;
	margin-top: 50px;
	padding-bottom: 20px;
}

	#soluciones h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #ffffff;
		margin-top: 30px;
	}

	#soluciones p {
		color: #fff;
		font-family: 'Space Grotesk', sans-serif;
		font-size: 18px;
		font-weight: 800;
	}

		#soluciones p i {
			margin-bottom: 20px;
		}

		#soluciones p a {
			color: #fff;
			text-decoration: none;
			border-bottom: 1px dotted #fff;
		}

/* Footer */
footer {
	background: #fff;
}

	footer #enlaces {
		text-align: right;
		margin-top: 20px;
	}

	footer #enlaces a {
		color: #121213;
		text-decoration: none;
		border-bottom: 1px dotted #121213;
		margin-right: 15px;
	}

/* Contáctenos */
#contactenos {
	height: 200px;
	background: linear-gradient(180deg,#2612cc 24.74%,#002a76 100%);
    color: #fff;
    position: relative;
}
	
	#contactenos h1 {
		margin-top: 35px;
		font-size: 55px;
		font-family: 'Space Grotesk', sans-serif;
		text-align: center;
	}

.red {
	margin-top: 10px;
	background: linear-gradient(180deg,#2612cc 24.74%,#002a76 100%);
	box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
	color: #fff;
	text-align: center;
	padding: 20px 0px 20px 0px;
	border-radius: 25px;
}

	.red i {
		font-size: 50px;
	}

	.red h3 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 18px;
		font-weight: 800;
	}

#formulario {
	margin-top: 50px;
}

	#formulario h4 {
		font-family: 'Space Grotesk', sans-serif;
		text-transform: uppercase;
		font-size: 16px;
		color: #b7b6b6;
		margin-bottom: 5px;
	}

	#formulario h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #2612cc;
		margin-top: 0px;
		margin-bottom: 50px;
	}

	#formulario label {
		font-family: 'Roboto', sans-serif;
		color: #333;
		font-size: 16px;
	}

	#formulario input, #formulario textarea {
		border-color: #2612cc;
	}

	#formulario button {
		margin-top: 25px;
		padding: 10px;
		color: #fff;
	}

/* Mapa */
#mapa {
	margin-top: 30px;
}

/* Quienes somos */
#quienes {
	margin-top: 50px;
}

	#quienes h4 {
		font-family: 'Space Grotesk', sans-serif;
		text-transform: uppercase;
		font-size: 16px;
		color: #b7b6b6;
		margin-bottom: 5px;
	}

	#quienes h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #2612cc;
		margin-top: 0px;
	}

	#quienes p {
		font-family: 'Roboto', sans-serif;
		color: #333;
		font-size: 16px;
		text-align: justify;
	}

	#quienes p span {
		color: #2612cc;
	}

/* Eslogan */
#eslogan {
	background: #2612cc;
	color: #fff;
	margin-top: 50px;
	padding: 20px 0px 20px 0px;
}

/* Servicios */

#servicios {
	margin-top: 50px;
}

	#servicios #sunstyle h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #121213;
		margin-top: 30px;
	}

	#servicios #sunstyle p {
		font-family: 'Roboto', sans-serif;
		color: #333;
		font-size: 16px;
		text-align: justify;
	}

		#servicios #sunstyle p span {
			color: #2612cc;
		}

		#servicios #sunstyle i {
			color: #2612cc;
		}

#servicios_2 {
	background: #121213;
	margin-top: 50px;
	background-image: url('../imagenes/fondos/lineas.png');
	padding-bottom: 50px;
}

	#servicios_2 #modular h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #fff;
		margin-top: 30px;
	}

	#servicios_2 #modular p {
		font-family: 'Roboto', sans-serif;
		color: #fff;
		font-size: 16px;
		text-align: justify;
	}

		#servicios_2 #modular p span {
			color: #2612cc;
		}

		#servicios_2 #modular i {
			color: #2612cc;
		}

/* Como lo hacemos */
#como {
	margin-top: 50px;
	margin-bottom: 50px;
}

	#como h4 {
		font-family: 'Space Grotesk', sans-serif;
		text-transform: uppercase;
		font-size: 16px;
		color: #b7b6b6;
		margin-bottom: 5px;
	}

	#como h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #121213;
		margin-top: 0px;
	}

	#como h3 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 24px;
		font-weight: 800;
		color: #2612cc;
		margin-top: 0px;
		border-bottom: 1px dotted #2612cc;
	}

	#como i {
		color: #2612cc;
		font-size: 40px;
		margin-bottom: 10px;
	}

/* Soluciones */
#ultimos {
	padding-bottom: 40px;
}

	#ultimos h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #121213;
		margin-top: 30px;
	}

	#ultimos .trabajo {
		background-position: center;
		height: 350px;
		border-radius: 10px;
		box-shadow: 0 3px 3px rgba(0,0,0,0.7);
	}

		#ultimos .trabajo h3 {
			position: absolute;
			font-family: 'Space Grotesk', sans-serif;
			font-size: 24px;
			font-weight: 800;
			color: #fff;
			text-align: center;
			margin-top: 230px;
			margin-left: 10px;
		}

		#ultimos .trabajo p {
			position: absolute;
			margin-top: 270px;
			margin-left: 10px;
			font-family: 'Roboto', sans-serif;
			color: #fff;
			font-size: 16px;
			text-align: justify;
		}

#galeria-negra {
	background: #121213;
	margin-top: 50px;
	background-image: url('../imagenes/fondos/lineas.png');
	padding-bottom: 50px;
}

	#galeria h2, #galeria-negra h2 {
		font-family: 'Space Grotesk', sans-serif;
		font-size: 42px;
		font-weight: 800;
		color: #121213;
		margin-top: 30px;
	}

	#galeria .photos, #galeria-negra .photos {
	  padding-bottom:20px;
	}

	#galeria .item, #galeria-negra .item {
	  padding-bottom:30px;
	}

		#galeria .item img, #galeria-negra .item img {
			border-radius: 10px;
			box-shadow: 0 3px 3px rgba(0,0,0,0.7);
		}

.bckmodal {
	background: linear-gradient(180deg,#2612cc 24.74%,#002a76 100%);
	border: 2px solid #fff;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
	border-radius: 20px;
	color: #fff;
}

.btnenviomodal {
	background: #fff;
	color: #333;
}
	
	.btnenviomodal:hover {
		background: #fff;
		color: #333;
	}

.btncierremodal {
	background: #333;
	color: #fff;
	border: none;
}

	.btncierremodal:hover {
		background: #333;
		color: #fff;
		border: none;
	}

.caracteristicas_tejas {
	width: 50%;
	float: left;
}

@media (max-width: 992px){

	.caracteristicas_tejas {
		width: 100%;
		float: left;
	}

	#revolucionar h1 {
		margin-top: 50px;
		font-size: 40px;
		font-family: 'Space Grotesk', sans-serif;
		text-align: center;
	}

		#revolucionar h1 span { border-bottom: 1px dotted #fff; font-weight: 800; }

	#vistaLlamamos {
		height: 200px;
		margin-top: -100px;
	}

	footer {
		margin-bottom: 20px;
	}
}

/* Estilo del modal */
.mdlazul {
	padding: 20px;
	background: #2612cc;
	height: 100%;
}

.mdblanco {
	background: #fff;
	padding-bottom: 20px;
}

.mdblanco h2 {
	font-family: 'Space Grotesk', sans-serif;
	font-size: 42px;
	font-weight: 800;
	color: #121213;
	margin-top: 30px;
}

.enviomodal {
	background: #2612cc;
	color: #fff;
	font-family: 'Space Grotesk', sans-serif;
}

	.enviomodal:hover {
		background: #b7b6b6;
		color: #121212;
	}

.cierremodal {
	background: #1c1c1c;
	color: #fff;
	font-family: 'Space Grotesk', sans-serif;
}

	.cierremodal:hover {
		background: #b7b6b6;
		color: #121212;
	}