/*
	Este archivo contiene todas las modificaciones de clases hechas específicamente para Enrcom
	Lista de colores del tema principal de Enrcom:
		Dark green: #58920b;
		Main green: #93c027;
		Light green: #bdd57c;
		Lighter green: #d5dcc2;
		Main brown: #7e745e;
		Light brown: #caba97;
		Dark pruple: #6f3488;
		Light pruple: #ba7cd5;
		Light blue: #a2daff;
*/

/* Margins and paddings */
.nmt { margin-top: 0px !important; }
.nmr { margin-right: 0px !important; }
.nmb { margin-bottom: 0px !important; }
.nml { margin-left: 0px !important; }

.npt { padding-top: 0px !important; }
.npr { padding-right: 0px !important; }
.npb { padding-bottom: 0px !important; }
.npl { padding-left: 0px !important; }

.m5 { margin: 5px; min-width: 1px; }
.m10 { margin: 10px; min-width: 1px; }
.m15 { margin: 15px; min-width: 1px; }
.m20 { margin: 20px; min-width: 1px; }
.m25 { margin: 25px; min-width: 1px; }
.m30 { margin: 30px; min-width: 1px; }
.m40 { margin: 40px; min-width: 1px; }
.m50 { margin: 50px; min-width: 1px; }

.mt5 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt15 { margin-top: 15px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }

.mr5 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr25 { margin-right: 25px; }
.mr30 { margin-right: 30px; }
.mr40 { margin-right: 40px; }
.mr50 { margin-right: 50px; }

.mb5 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }

.ml5 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml15 { margin-left: 15px; }
.ml20 { margin-left: 20px; }
.ml25 { margin-left: 25px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }
.ml50 { margin-left: 50px; }

.p5 { padding: 5px; }
.p10 { padding: 10px; }
.p15 { padding: 15px; }
.p20 { padding: 20px; }
.p25 { padding: 25px; }
.p30 { padding: 30px; }
.p40 { padding: 40px; }
.p50 { padding: 50px; }

.pt5 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt15 { padding-top: 15px; }
.pt20 { padding-top: 20px; }
.pt25 { padding-top: 25px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pt50 { padding-top: 50px; }

.pr5 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr15 { padding-right: 15px; }
.pr20 { padding-right: 20px; }
.pr25 { padding-right: 25px; }
.pr30 { padding-right: 30px; }
.pr40 { padding-right: 40px; }
.pr50 { padding-right: 50px; }

.pb5 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb15 { padding-bottom: 15px; }
.pb20 { padding-bottom: 20px; }
.pb25 { padding-bottom: 25px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pb50 { padding-bottom: 50px; }

.pl5 { padding-left: 5px; }
.pl10 { padding-left: 10px; }
.pl15 { padding-left: 15px; }
.pl20 { padding-left: 20px; }
.pl25 { padding-left: 25px; }
.pl30 { padding-left: 30px; }
.pl40 { padding-left: 40px; }
.pl50 { padding-left: 50px; }

/* Bootstrap missing classes (the task of finding all hidden/visible classes in another bootstrap distro is still pending) */
.hidden-tablet {
	display: inherit;
}

.visible-large,
.visible-desktop,
.visible-tablet,
.visible-phone {
	display: none !important;
}

.landing-page .navbar-wrapper .navbar {
	padding-left: 30px !important;
	padding-right: 30px !important;
}
.landing-page .navbar-wrapper .navbar-scroll, .md-skin.landing-page .navbar-default.navbar-scroll {
	background-color: #58920b !important;
	border-bottom: #ffffff !important;
}

.landing-page .navbar-wrapper .navbar-brand {
	background-color: transparent !important;
}

#main-showcase {
	background: url( '../img/backgrounds/enrcom_showcase_bg.png' ) no-repeat;
	background-position: center -50px;
	background-size: auto 100%;
}
#main-showcase .showcase-container {
	padding: 100px 0;
}
#main-showcase .showcase-container .showcase-info, #platform .platform-info {
	padding: 120px 60px 0 60px;
}
.showcase-image img, .platform-image img, #smart-sensors img, .sensor-assets-container img, #our-values .value-container .icon-container img {
	max-width: 100%;
	height: auto;
	border: 0;
}

/* Showcase */
#main-showcase .showcase-container h1 {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	font-size: 44px;
	color: #cae684;
	line-height: 1.2;
	padding-bottom: 25px;
}
#main-showcase .showcase-container p {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 18px;
	color: #ffffff;
	line-height: 2.2rem;
	padding-bottom: 25px;
}
.landing-page .carousel-caption {
	z-index: 10;
}
.landing-page .carousel-caption {
	position: absolute;
	top: 100px;
	left: 0;
	bottom: auto;
	right: auto;
	text-align: left;
}
.landing-page .carousel-caption {
	position: absolute;
	top: 100px;
	left: 0;
	bottom: auto;
	right: auto;
	text-align: left;
}
.landing-page .carousel-caption.blank {
	top: 140px;
}
.landing-page .carousel-caption h1 {
	font-weight: 700;
	font-size: 38px;
	text-transform: uppercase;
	text-shadow: none;
	letter-spacing: -1.5px;
}
.landing-page .carousel-caption p {
	font-weight: 700;
	text-transform: uppercase;
	text-shadow: none;
}
.landing-page .caption-link {
	color: #fff;
	margin-left: 10px;
	text-transform: capitalize;
	font-weight: 400;
}
.landing-page .caption-link:hover {
	text-decoration: none;
	color: inherit;
}

.button {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 20px;
	text-transform: uppercase;
	color: #ffffff;
	background-color: #8cb23c;
	border-radius: 25px;
	padding: 10px 30px;
	box-shadow: 0px 1px 2px rgba( 0,0,0,0.35 );
	text-decoration: none;
	transition: all .7s cubic-bezier( .175,.885,.32,1.275 );
}
.button:hover {
	color: #ffffff;
	background-color: #93c027;
	border: none;
}
button {
	cursor: pointer;
	border: none;
}

/* Our values section */
#our-values {
	display: block;
	width: 100%;
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#our-values .fluid-container, #smart-sensors .fluid-container {
	display: block;
	padding: 0 30px 50px 30px;
}
#our-values h2, #our-values p, #our-values h3,
#smart-sensors h2, #smart-sensors p, #smart-sensors h3 {
	text-align: center;
}
.headline-description h2 {
	font-size: 44px;
	color: #68951d;
	font-weight: 100;
	margin-bottom: 15px;
	padding-bottom: 15px;
	margin-top: 0px;
	padding-top: 35px;
}

#our-values .headline-description p, #smart-sensors .headline-description p, #platform p {
	font-weight: 400;
	font-size: 20px;
	color: #7e745e;
	line-height: 2.2rem;
	padding-bottom: 25px;
	margin-bottom: 25px;
}
.headline-description {
	max-width: 1110px;
	margin: 0 auto;
}
#our-values .value-container {
	background: #93c027;
	background: -moz-radial-gradient(center, ellipse cover, #93c027 0%, #93c027 100%); /* FF3.6-15 */
	background: -webkit-radial-gradient(center, ellipse cover, #93c027 0%,#93c027 100%); /* Chrome10-25,Safari5.1-6 */
	background: radial-gradient(ellipse at center, #93c027 0%,#93c027 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#93c027', endColorstr='#93c027',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	border-radius: 6px;
	box-shadow: 0px 2px 6px rgba( 0,0,0,0.6 );
	margin-left: 15px;
	margin-right: 15px;
	max-width: calc( 20% - 30px );
	transition: all 4.2s cubic-bezier( .175,.885,.32,1.275 );
}
.offset-1 {
	margin-left: 8.333333% !important;
}
#our-values .value-container:hover {
	background: #bdd57c; /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover, #bdd57c 0%, #93c027 100%); /* FF3.6-15 */
	background: -webkit-radial-gradient(center, ellipse cover, #bdd57c 0%,#93c027 100%); /* Chrome10-25,Safari5.1-6 */
	background: radial-gradient(ellipse at center, #bdd57c 0%,#93c027 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bdd57c', endColorstr='#93c027',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#our-values .value-container .icon-container {
	margin: 10% auto;
	display: block;
	max-width: 75%;
	transition: all .7s cubic-bezier( .175,.885,.32,1.275 );
}
#our-values .value-container:hover .icon-container {
	max-width: 85%;
	margin: 5% auto;
}
#our-values .value-container .value-spacer {
	padding: 25px;
}
#our-values .value-container h3 {
	color: #7e745e;
	font-weight: 400;
	font-size: 20px;
}
#our-values .value-container p {
	font-weight: 400;
	font-size: 15px;
	color: #ffffff;
	line-height: 1.6rem;
	padding: 15px 0;
}

/* Platform section */
#platform .platform-info {
	font-size: 44px;
	color: #68951d;
	font-weight: 100;
	margin-bottom: 15px;
	padding-bottom: 15px;
	margin-top: 0px;
	padding-top: 175px;
}

/* Vision section */
#vision {
	background: transparent url( '../img/backgrounds/enrcom_sw_divider_image_01.jpg' ) no-repeat;
	background-position: center;
	background-size: 100% auto;
	padding: 100px 0;
	position: relative;
	z-index: 10;
}
.vision-container {
	display: block;
	padding: 60px 0px 60px 60px;
	background-color: rgba( 0,0,0,0.25 );
	position: relative;
}
.vision-container:after {
	width: 0;
	height: 0;
	border-top: 138px solid transparent;
	border-left: 150px solid rgba( 0,0,0,0.25 );
	border-bottom:138px solid transparent;
	content: '';
	position: absolute;
	right: -150px;
	top: 0;
}
.landing-page .vision-container p {
	color: #ffffff;
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	font-size: 19px;
	line-height: 2.2rem;
	padding-bottom: 0px;
}
.triangle-left {
	width: 0;
	height: 0;
	border-bottom: 150px solid #ffffff;
	border-right: 150px solid transparent;
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 30;
}
.triangle-left:after {
	width: 0;
	height: 0;
	border-bottom: 150px solid #8cb23c;
	border-right: 150px solid transparent;
	content: '';
	position: absolute;
	bottom: -200px;
	left: 0;
}
.triangle-right {
	width: 0;
	height: 0;
	border-top: 150px solid #ffffff;
	border-left: 150px solid transparent;
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	z-index: 30;
}
.triangle-right:after {
	width: 0;
	height: 0;
	border-top: 150px solid #a2daff;
	border-left: 150px solid transparent;
	content: '';
	position: absolute;
	top: -200px;
	right: 0;
}

/* Smart sensors section */
#smart-sensors {
	padding-top: 100px;
	background: url( '../img/backgrounds/enrcom_sensors_intro_bg.png' ) no-repeat;
	background-position: center;
	background-attachment: fixed;
	background-size: 100% auto;
}
.smart-sensors-img-container {
	max-width: 60%;
	margin: 0 auto;
}
.sensors-container-outer {
	max-width: 70%;
	margin: 0 auto;
}
.sensors-container {
	margin: 0 60px;
}
.sensor-assets-container {
	position: relative;
	text-align: center;
	display: block;
	margin-top: 80px;
}
.sensor-image-container {
	position: relative;
	display: block;
}
.sensor-icon-container {
	position: absolute;
	bottom: -60px;
	width: 120px;
	height: 120px;
	padding: 10px;
	background-color: #ffffff;
	border-radius: 50%;
	margin: 0 auto;
	left: 50%;
	content: '';
	transform: translateX( -50% );
	-moz-transform: translateX( -50% );
	-webkit-transform: translateX( -50% );
	-o-transform: translateX( -50% );
	z-index: 20;
}
.sensor-container {
	background-color: rgba( 255, 255, 255, 0.55 );
}
.sensor-information {
	margin-top: 75px;
}
.sensor-information h3 {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	font-size: 30px;
	line-height: 1.2;
	margin-bottom: 5px;
	padding-bottom: 10px;
	color: #93c027;
}
.sensor-information p {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
    font-size: 15px;
    color: #7e745e;
    line-height: 1.6rem;
    padding: 15px 0;
}

/* Contact section */
#contact {
	background-color: #666666;
}
.contact-spacer {
	display: block;
	max-width: 1110px;
	padding: 50px;
	margin: 0 auto;
}
#contact h2 {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	font-size: 30px;
	line-height: 1.2;
	margin-bottom: 5px;
	padding-bottom: 10px;
	color: #93c027;
	text-align: center;
}
#contact p {
	text-align: center;
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
    font-size: 15px;
    color: #ffffff;
    line-height: 1.6rem;
    padding: 15px 0;
}
#contact label {
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #bdd57c;
	font-size: 20px;
	font-weight: 200;
}

.help-block {
	padding: 0 !important;
	margin-bottom: 0;
}
.text-danger ul {
	background-color: #880606;
	list-style-type: none;
	margin-bottom: 0px;
}
.text-danger ul li {
	margin: 0;
	padding: 10px 15px;
	color: #ffffff;
	text-align: left;
}

/* Footer section */
footer {
	background-color: #322d32;
	color: #ffffff;
	padding: 25px 0;
}
footer p {
	padding-bottom: 0;
	margin-bottom: 0;
}

/* Special columns */
.col-20 {
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
	-ms-flex: 0 0 20%;
    flex: 0 0 20%;
	max-width: 20%;
}
.col-33 {
	position: relative;
	width: 100%;
	min-height: 1px;
	padding-right: 15px;
	padding-left: 15px;
	-ms-flex: 0 0 33.3333336%;
    flex: 0 0 33.3333336%;
	max-width: 33.3333336%;
}

/* Mediaqueries */
@media ( max-width: 1600px ) {
	#main-showcase .showcase-container .showcase-info, #platform .platform-info {
		padding: 75px 30px 0 30px !important;
	}
	#vision {
		padding: 80px 0 !important;
	}
	.vision-container:after {
		border-top-width: 138px;
		border-left-width: 130px;
		border-bottom-width: 138px;
		right: -130px;
	}
}
@media ( max-width: 1580px ) {
	.vision-container:after {
		border-top-width: 155.5px;
		border-left-width: 130px;
		border-bottom-width: 155.5px;
		right: -130px;
	}
}
@media ( max-width: 1420px ) {
	#main-showcase .showcase-container p, #platform .platform-info p, .landing-page .vision-container p {
		font-size: 15.5px;
		line-height: 1.75rem;
	}
	#main-showcase .showcase-container h1, #platform .platform-info h1 {
		font-size: 30px;
	}
	.landing-page .value-container .value-spacer {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
	#our-values .value-container h3 {
		font-size: 18px;
	}
	#our-values .value-container p {
		font-size: 13.6px;
	}
	.col-20 {
		padding-left: 8px;
		padding-right: 8px;
	}
	.triangle-left, .triangle-left:after, .triangle-right, .triangle-right:after {
		border-width: 120px;
	}
	.triangle-left:after {
		bottom: -170px;
	}
	.triangle-right:after {
		top: -170px;
	}
	.vision-container {
		padding: 40px 0 40px 40px;
	}
	.vision-container:after {
		border-top-width: 104px;
		border-left-width: 120px;
		border-bottom-width: 104px;
		right: -120px;
	}
}
@media ( max-width: 1282px ) {
	.vision-container:after {
		border-top-width: 118px;
		border-left-width: 120px;
		border-bottom-width: 118px;
		right: -120px;
	}
}
@media ( min-width: 1200px ) {
	.visible-large {
		display: inherit !important;
	}
	.visible-desktop {
		display: inherit !important;
	}
	.hidden-large {
		display: none !important;
	}
	.hidden-desktop {
		display: none !important;
	}
}
@media ( max-width: 1200px ) {
	.visible-desktop {
		display: inherit !important;
	}
	.hidden-desktop {
		display: none !important;
	}
	#main-showcase {
		background-size: 140% auto;
	}
	#main-showcase .showcase-container {
		padding: 75px 0 !important;
	}
	#main-showcase .showcase-container .showcase-info, #platform .platform-info {
		padding: 60px 30px 0 10px !important;
	}
	.value-container {
		max-width: 20% !important;
		margin-left: 0px !important;
		margin-right: 0px !important;
		box-shadow: none !important;
		border-right: 1px solid rgba( 255, 255, 255, 0.25 );
		border-radius: 0px !important;
	}
	.value-container:last-child {
		border: none !important;
	}
	#our-values .row {
		margin-left: -30px !important;
		margin-right: -30px !important;
	}
	#our-values .headline-description p, #smart-sensors .headline-description p, #platform p {
		font-size: 16px;
	}
	.headline-description {
		max-width: 75%;
	}
	#our-values .headline-description p {
		line-height: 1.8rem;
	}
	.platform-image {
		padding-top: 94px;
	}
	#vision {
		padding: 40px 0 !important;
	}
	.vision-container:after {
		border-top-width: 104px;
		border-left-width: 100px;
		border-bottom-width: 104px;
		right: -100px;
	}
	.triangle-left, .triangle-left:after, .triangle-right, .triangle-right:after {
		border-width: 80px;
	}
	.triangle-left:after {
		bottom: -110px;
	}
	.triangle-right:after {
		top: -110px;
	}
	.hidden-tablet {
		display: none;
	}
	.row {
		margin-left: 0px !important;
		margin-right: 0px !important;
	}
	.sensors-container-outer {
		max-width: 100%;
	}
}
@media ( max-width: 1097px ) {
	.vision-container:after {
		border-top-width: 118px;
		border-left-width: 90px;
		border-bottom-width: 118px;
		right: -90px;
	}
}
@media ( max-width: 992px ) {
	.visible-tablet {
		display: inherit !important;
	}
	.hidden-tablet {
		display: none !important;
	}
	#main-showcase {
		background-size: auto 100%;
	}
	#main-showcase .showcase-container .showcase-info {
		padding: 50px 0 0 0  !important;
		max-width: 65%;
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}
	#main-showcase .showcase-image {
		max-width: 50%;
		margin-left: auto;
		margin-right: auto;
	}
	.container {
		max-width: 94%;
	}
	.value-container {
		max-width: calc( 25% - 30px ) !important;
		-ms-flex: 0 0 25%;
		flex: 0 0 25%;
		max-width: 25%;
	}
	.vision-container {
		padding: 60px;
	}
	.vision-container:after {
		border: 0px;
		right: 0;
		display: none;
	}
	.sensors-container {
		margin: 0 30px;
	}
}

@media ( max-width: 992px ) {
	.visible-phone {
		display: inherit !important;
	}
	.hidden-phone {
		display: none !important;
	}
	#vision {
		padding: 0px !important;
		background-size: cover;
	}
	.vision-container {
		padding: 85px 80px !important;
	}
	.vision-container p {
		text-align: center;
	}
}
@media ( max-width: 767px ) {
	#main-showcase {
		background-size: cover;
	}
	#main-showcase .showcase-container {
		padding: 75px 0 0 0 !important;
	}
	#main-showcase .showcase-container .showcase-info {
		padding: 25px 0 145px 0 !important;
		max-width: calc( 100% - 50px );
	}
	#main-showcase .showcase-image {
		max-width: 65%;
	}
	.headline-description {
		max-width: 100%;
	}
	.headline-description h2 {
		padding-top: 0px !important;
		margin-top: 0px !important;
	}
	#our-values .fluid-container, #smart-sensors .fluid-container {
		overflow: hidden;
		max-width: 100%;
	}
	.values-container-outer, .sensors-container-outer {
		max-width: 100%;
		overflow-x: scroll;
	}
	.values-container, .sensors-container {
		width: 260%;
		padding-left: 30px;
		padding-right: 30px;
	}
	.value-container, .sensor-container, .col-33 {
		max-width: calc( 16.6666667% - 30px ) !important;
		-ms-flex: 0 0 16.6666667%;
		flex: 0 0 16.6666667%;
		max-width: 16.6666667%;
	}
	.value-container, .sensor-container {
		margin-left: 15px !important;
		margin-right: 15px !important;
	}
	.col-20.fourth-child, .col-20:last-child {
		margin-top: 0px;
	}
	.features-image-container {
		max-width: 50%;
		margin: 0 auto;
	}
	#platform .platform-image {
		max-width: 40%;
		margin: 0 auto;
		padding-top: 10px;
	}
	#platform .platform-info {
		text-align: center;
		padding: 60px 30px 0 30px !important;
	}
	.vision-container {
		padding: 60px 30px !important
	}
}
@media ( max-width: 680px ) {
	.values-container {
		width: 400%;
		padding-left: 30px;
		padding-right: 30px;
	}
	.sensors-container {
		width: 400%;
		padding: 0;
	}
	#smart-sensors .headline-description p {
		line-height: 1.8rem;
	}
}