/**
 *  ================================================
 *  I.01 - Reset default browser styles
 *  Based on Eric Meyer's CSS reset, v1.0 2008-02-12
 *  http://meyerweb.com/eric/tools/css/reset/ 
 *  ================================================
 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	margin-left:auto;
	margin-right:auto;
	padding: 0;
	border: 0;
	outline: 0;

	vertical-align: baseline;
	

}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }


/*------------------------Custom Resets -------------*/


h1{ text-transform:uppercase; font-weight:bold!important; color:#fff!important; line-height:1.2; text-shadow:5px 5px 3px rgba(0,0,0,1) }
h2{ text-transform:uppercase; font-size:36px!important}
p{ line-height:1.2; padding-bottom:15px}
.section{ margin-top:10vh}

.bg{ height:100%; width:100%; background-color:rgba(0,0,0,1); color:rgba(255,255,255,1); background-image: url(../images/bg.png); background-repeat:no-repeat; background-size:cover }
.hr{ background-color:rgba(255,255,255,1); height:3px; margin:0 30px}

.mt-2{margin-top:2vh}
.mt-5{margin-top:5vh}


/*menu*/
.navbar-brand{ padding:0!important; margin:0!important}
.navbar-expand-lg{padding:0!important}

.navbar-nav .nav-link{color:rgba(255,255,255,0.7)!important;}
.navbar-nav .nav-link:hover {color:rgba(255,75,0,1)!important;}
.navbar-nav .nav-link.active{ color:rgba(255,75,0,1)!important}

.navbar-expand-lg .navbar-nav .nav-link{ text-transform:uppercase; font-weight:bold; padding: 0 0 20px 30px;}

.navbar-toggler{ border-radius:0; padding:0; margin:35px 30px 30px 0; border:none;  }

/* hamburgher */
#nav-icon3{ width: 30px; height: 24px; position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); float:right;
-webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer;}
#nav-icon3 span{ display: block; position: absolute; height: 4px; width: 100%; background: rgba(255,255,255,1); border-radius: 2px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
#nav-icon3 span:nth-child(1) {top: 0px;}
#nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) {top: 10px;}
#nav-icon3 span:nth-child(4) {top: 20px;}
#nav-icon3.open span:nth-child(1) { top: 10px; width: 0%; left: 50%;}
#nav-icon3.open span:nth-child(2) {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
#nav-icon3.open span:nth-child(3) {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
#nav-icon3.open span:nth-child(4) {top: 10px; width: 0%; left: 50%;}

/*banner*/
.banner-phone{margin-top:3vh}
.banner-phone a{ background-color:rgba(255,75,0,1); color:#fff; padding:10px 20px; text-decoration:none; margin-right:10px; box-shadow:2px 2px 5px rgba(0,0,0,1)}
.banner-phone a:hover{background-color:rgba(255,75,0,0.8)}


/*banner central*/
.banner-center{ background-color:rgba(255,75,0,1); margin-top:10vh; text-align:center}
.banner-center h3{ color:rgba(255,255,255,1); font-size:21px; padding:0 45px}
.banner-center img{ height:140px}

/*paragraf style set*/
.paragraf-set h2{padding-bottom:1.2vh}
.paragraf-set p{ font-size:18px!important}

/*contact*/
.contact{ padding-top:5vh}
.contact h2{ text-align:center; color:rgba(255,255,255,1); font-weight:bold; margin-bottom:2vh}
.contact h3{color:rgba(255,255,255,1); font-weight:bold; margin-bottom:2vh}
.contact h4{color:rgba(255,255,255,1); text-align:center; margin-bottom:10vh}
.contact p{color:rgba(255,255,255,1); font-weight:bold;}
.btn-1{ border:none; margin-bottom:7vh; font-weight:bold; font-size:21px; color:rgba(255,255,255,1); background-color:rgba(0,0,0,1); padding:10px 30px; box-shadow:2px 2px 5px rgba(0,0,0,1) }
.btn-1:hover{background-color:rgba(0,0,0,0.8)}

.form-control{ margin-bottom:15px; background-color:rgba(255,255,255,0.9); border-radius:0; border-bottom:1px solid rgba(255,255,255,1)}
.banner-contact{background-image: url(../images/banner-contact.png); background-repeat: no-repeat; background-size: cover; background-position: bottom; align-content: center;}

/* devices min 1600 */
@media only screen and (min-width: 400px) {
	h1{ font-size:41px!important;}
	.nav-link{font-size:28px!important; }
	.navbar-nav{ height:95vh; padding-top:15vh}
	.bg-light{ background-image: linear-gradient( rgba(0,0,0,1)70%, rgba(0,0,0,0.9)); background-color:transparent!important }
	
	.banner-phone a{font-size:18px;}
	.navbar-brand img{ height:120px; margin-left:12px; position:absolute; z-index:5; margin:-46px 0 0 12px }
	.banner-main{background-image: url(../images/banner-main2.jpg); background-repeat: no-repeat; background-size: cover; min-height: 80vh; background-position: right bottom; align-content: center;}
	
	.avantaje{ margin-top:30px}
	.bg{ padding:15px 15px;}
	.bg h3{ font-size:18px; padding-top:30px; text-transform:uppercase}
	.bg .icon{ text-align:center}
	.icon img{ width:70%; margin-top:30px}
	.icon p{ float:left; font-size:36px;}
	
	.bg-banner-central{ padding:30px 0 26px 0;}
	}
	
/* devices min 1600 */
@media only screen and (min-width: 1400px) {
	h1{ font-size:3.6vw!important;}
	.nav-link{font-size:1.6vh!important;}
	.navbar-nav{ height:85px; padding:40px 0 30px 0}
	.bg-light{background-image: linear-gradient( rgba(0,0,0,1)70%, rgba(0,0,0,0.8)); background-color:transparent!important}
	.banner-phone a{font-size:1vw;}
	.navbar-brand img{ height:180px!important}
	.banner-main{background-image: url(../images/banner-main2.jpg); background-repeat: no-repeat; background-size: cover; min-height: 90vh; background-position: bottom; align-content: center;}
	
	.avantaje{ margin-top:0}
	.bg{ padding:30px 45px;}
	.bg h3{ font-size:21px; padding-top:30px; text-transform:uppercase}
	.bg .icon{ text-align:center}
	.icon img{ width:50%; margin-top:30px}
	.icon p{ float:left; font-size:36px;}
	
	.bg-banner-central{background-image: url(../images/bg-banner-orange.png); background-repeat:no-repeat; background-size: contain; background-position:right; padding:30px 0 40px 0;}
	}