/*
Color 
institucional: faa518
Clarito: #fdbc51;
*/

@media (max-width: 768px) {
	.pc {display: none;}
	#sliter { width: 100%; float: center;  position: relative; z-index: 1; }
	#sliter li img { width: 100%; margin: auto;}
	
}
@media (min-width: 769px) {  
	.cel {display: none;}
	#slider { width: 100%; float: center;  position: relative; z-index: 1; }
	#slider li img { width: 100%; margin: auto;}

}


/*Slider
======================*/
.choose_mac{
    
}
.choose_mac .choose_slide {
    box-shadow: 0;
    border-radius: 0px;
}
.choose_mac .choose_item {
    border-radius: 0px;
    margin: 0px;
	overflow: hidden;
}
.choose_mac .choose_item img{
   width:100%;
    max-height: 100%;
    transition: all 0.6s;
}

.choose_mac .choose_item h2{
    padding-left: 2.5rem;
	font-size:2.5rem;
	line-height: 2.6rem;
    color:#334D87;
}


@media (min-width: 768px) {
  

.choose_mac .choose_item img{
   width:100%;
    max-height: 100%;
    transition: all 0.6s;
}

.choose_mac .choose_item h2{    
	text-align: center;
	font-size:2.5rem;
	line-height: 2.6rem;
    color:#334D87;
}
}


@media only screen and (min-width: 769px) and (max-width: 10000px) {
	#mobile_sec .menumobile { display: block!important; }
}

/* Tablets*/
@media only screen and (min-width: 768px) and (max-width: 1200px) {

	.10 {width: 20%; float: left; position: relative; margin: 2px;}	
	.encontra { width: 100%; padding: 5% 20%!important;}
	
	header { width: 100%; height: 105px; }
	header .Center { width: 100%; padding: 0px 2%; }
	header .site-logo { padding: 27px 0 0 1px;  position: relative; z-index: 1; }
	header .site-logo h1 { line-height: 33px; }	
	header.smaller .site-logo li a {font-size: 46px!important;  padding: 16px 20px; }

	.Navigation {  margin-right: 0px; }
	.Navigation li a { padding: 30px 20px; }

	.Banner_sec { width: 100%;  height: 515px;}
	.Banner_sec .Center {width: 100%; padding: 0px; }
	.Banner_sec .bannerside { top: 24px; }
	.Banner_sec .leftside { padding: 0px; width: 34%; }
	.Banner_sec .leftside h3 { font-size: 30px; }
	.Banner_sec .leftside p { padding: 10px  0px; font-size: 14px; line-height: 18px; }
	.Banner_sec .leftside img {width: 120%; top:55px;}
	.Banner_sec .rightside { width: 64%;}


	#Container { width: 100%; }

	.About_sec { width: 100%; padding: 50px 0px 30px; }
	.About_sec .Center { width: 100%; padding: 0px 2%; }
	.About_sec h2 { font-size: 30px; line-height: 40px; }
	.About_sec p { padding: 15px 0px; font-size: 15px; }

	.Services_sec { width: 100%; padding: 40px 0px 30px 0px; }
	.Services_sec .Center { width: 100%; padding: 0px 2%; }
	.Services_sec h2 { font-size: 36px; line-height: 40px; }
	.Services_sec p { padding: 15px 0px; font-size: 13px; }
	.Services_sec .Serviceside { width: 100%; padding: 50px 0 30px; }
	.Services_sec .Serviceside li { margin: 0px 2% 0px 0px; width: 47%; }

	.Services_sec .Serviceside li.Development a { background-size: 60%;}
	.Services_sec .Serviceside li.Development h4 { padding: 134px 0 0; }
	.Services_sec .Serviceside li.Development a:hover h4 { background-size: 60%;}

	.Services_sec .Serviceside li.Desdin a { background-size: 60%;}
	.Services_sec .Serviceside li.Desdin h4 { padding: 134px 0 0; }
	
	.Services_sec .Serviceside li.Desdin a:hover h4 { background-size: 60%;}

	.Services_sec .Serviceside li.Concept a { background-size: 60%;}
	.Services_sec .Serviceside li.Concept h4 { padding: 134px 0 0; }
	.Services_sec .Serviceside li.Concept a:hover h4 { background-size: 60%;}

	.Services_sec .Serviceside li.System a { background-size: 60%;}
	.Services_sec .Serviceside li.System h4 { padding: 134px 0 0; }
	.Services_sec .Serviceside li.System a:hover h4 { background-size: 60%;}



	.Contact_sec { width: 100%; }
	.Contact_sec .Center { width: 100%; padding: 70px 2% 30px 2%; }
	.Contact_sec h2 { font-size: 40px; line-height: 40px; }
	.Contact_sec p { padding: 15px 0px; font-size: 13px; }

	.Contact_sec .Map { width: 100%;}
	.Contact_sec .Map img { height: 250px; width: 100%; }
	
	.Get_sec { width: 100%; }
	.Get_sec .Mid { width: 100%; padding: 50px 2%; }
	.Get_sec .Leftside p { margin: 0 0 20px; } 
	.Get_sec .Leftside input.field { padding: 10px 20px; }
	.Get_sec .Leftside textarea { padding: 10px 20px; height: 105px; }
	.Get_sec .Leftside .button {-webkit-appearance: none; }

	.Get_sec .Rightside { padding-top: 0px; }
	.Get_sec .Rightside h3 { font-size: 40px; padding-bottom: 34px; }
	.Get_sec .Rightside address { padding: 0 0 23px 65px; }

	footer { width: 100%; }
	footer .Cntr { width: 100%; padding: 20px 2%; }
	

}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	.encontra { width: 100%; padding: 5% 20%!important;}
	.no-cel { display: none; }
	header { width: 100%; position: absolute; height: 105px;}
	header .Center { width: 100%;  }
	header .site-logo { padding: 10px 0% 0px 3%; position: relative; z-index: 1; }
	header .site-logo h1 { margin: 0px; line-height: 36px; }
	header.smaller { height: 105px;}
	header.smaller .site-logo { padding: 10px 0% 0px 3%; }
	header.smaller .site-logo h1 a { font-size: 36px!important;}
	header.smaller .site-logo p { padding: 0px; font-size: 18px; }
	
	.10 {width: 30%; float: left; position: relative; margin: 2px;}
	
	
	#mobile_sec { position: fixed; width: 100%; }
	#mobile_sec .mobile { display: block; position: relative; float: right;}
	#mobile_sec .menumobile { display: none; width: 100%; position: absolute; top: 55px; right: 0%; background: rgba(0, 0, 0, 0.5);  }
	#mobile_sec .menumobile .Navigation { width: 100%; float: none; }
	#mobile_sec .menumobile .Navigation ul { float: none;}
	#mobile_sec .menumobile .Navigation li { float: none; width: 100%; border-bottom: solid 1px #365374; }
	#mobile_sec .menumobile .Navigation li a { padding: 10px 21px; background: none; border-bottom: none; }
	#mobile_sec .menumobile .Navigation li:last-child { border-bottom: none; }
	
	
	.Banner_sec { width: 100%;  height: 315px;}
	.Banner_sec .Center {width: 100%; padding: 0px 3%; }
	.Banner_sec .bannerside { top: 105px; }
	.Banner_sec .rightside #slider li img {height: 50%; width: 50%; margin: auto;}	
	.Banner_sec .rightside #sliter li img {height: 50%; width: 50%; margin: auto;}	

	.bgcolor { height: 50px; }

	#Container { width: 100%; }

	.About_sec { width: 100%; padding: 50px 0px 30px; }
	.About_sec .Center { width: 100%; padding: 0px 3%; }
	.About_sec h2 { font-size: 30px; line-height: 30px; }
	.About_sec p { padding: 15px 0px; font-size: 14px; }
	

	.Services_sec { width: 100%; padding: 100px 0px 30px; }
	.Services_sec .Center { width: 100%; padding: 0px 3%; }
	.Services_sec h2 { font-size: 30px; line-height: 30px; }
	.Services_sec p { padding: 15px 0px; font-size: 13px; }
	.Services_sec .Serviceside { width: 100%; padding: 50px 0 30px; }
	.Services_sec .Serviceside li { margin: 0px 0% 3% 2%; float: none; display:inline-block; }


	
	.Contact_sec { width: 100%; }
	.Contact_sec .Center { width: 100%; padding: 80px 3%;}
	.Contact_sec h2 { font-size: 30px; line-height: 30px; }
	.Contact_sec p { padding: 15px 0px; font-size: 13px; }

	.Contact_sec .Map { width: 100%;}
	.Contact_sec .Map img { height: 200px; width: 100%; }
	
	.Get_sec { width: 100%; }
	.Get_sec .Mid { width: 100%; padding: 30px 3%; }
	.Get_sec .Leftside { width: 100%; float: right;}
	.Get_sec .Leftside p { margin: 0 0 20px; } 
	.Get_sec .Leftside input.field { padding: 10px 20px; }
	.Get_sec .Leftside textarea { padding: 10px 20px; height: 105px; }
	.Get_sec .Leftside .button { -webkit-appearance: none;  margin: 0px; padding: 12px 0px; }

	.Get_sec .Rightside { padding-top: 0px; width: 100%; }
	.Get_sec .Rightside h3 { font-size: 30px; padding-bottom: 20px; }
	.Get_sec .Rightside address { padding: 0 0 15px 65px; }
	.Get_sec .Rightside ul { padding: 10px 0 0 3px; }

	footer { width: 100%; }
	footer .Cntr { width: 100%; padding: 10px 3%; }
}


/*-------------- CELULARES --------------*/
@media only screen and (max-width: 479px) {

	.no-cel { display: none; }
	header { width: 100%; position: absolute; height: 120px; }
	header .Center { width: 100%;}
	header .site-logo { font-size: 36px!important; padding: 10px 0% 0px 3%; position: relative; z-index: 1; }
	header.smaller { height: 105px;}
	header.smaller .site-logo { padding: 10px 0% 0px 3%; }
	header.smaller .site-logo h1 a { font-size: 30px!important;}
	header.smaller .site-logo p { padding: 0px; font-size: 14px; }
	
	.chico {max-width: 10%; float: left; position: relative; margin: 2px;}
	.encontra { width: 100%; padding: 5% 15%!important;  background: rgba(245,241,225,1);}
	
	#mobile_sec { position: fixed; width: 100%;}
	#mobile_sec .mobile { display: block; position: relative; float: right; }
	#mobile_sec .menumobile { display: none; width: 100%; position: absolute; top: 55px; right: 0%; background: rgba(0, 0, 0, 0.5);  }
	#mobile_sec .menumobile .Navigation { width: 100%; float: none; }
	#mobile_sec .menumobile .Navigation ul { float: none;}
	#mobile_sec .menumobile .Navigation li { float: none; width: 100%; border-bottom: solid 1px #ff7800; }
	#mobile_sec .menumobile .Navigation li a { padding: 10px; background: none; border-bottom: none; }
	#mobile_sec .menumobile .Navigation li a:hover, #mobile_sec .menumobile .Navigation li a.active { background: #faa518; border-bottom: none; }
	#mobile_sec .menumobile .Navigation li:last-child { border-bottom: none; }

	
	.Banner_sec { width: 100%; height: 215px;}
	.Banner_sec .Center {width: 100%; padding: 0px; }
	.Banner_sec .bannerside { top: 90px; }
	.Banner_sec .bannerside img {height: 90%; width: 90%; margin: auto;}	

	.bgcolor { height: 50px; }

	#Container { width: 100%; }


	.About_sec{ width: 100%; padding: 110px 0px 0px;}
	.Services_sec{ width: 100%; padding: 30px 0px 0px;}
	.About_sec .Center { width: 100%; padding: 0px 3%; }
	.About_sec h3 { font-size: 25px; line-height: 30px; }
	.About_sec p { padding: 15px 0px; font-size: 13px; }
	
	.About_sec .mapas {width: 100%; padding: 0px;}
	.About_sec .mapas .centro {width: 100%; float: left; position: relative; margin: 10px;}
	.About_sec .mapas .centro img {}
	.About_sec .mapas .ze {width: 100%; float: left; position: relative; margin: 10px;}
	.About_sec .mapas .ze img {}
	
		/* ------------- medidas ------------- */
	.Services_sec{ padding: 70px 0px 90px 0px ; width: 100%; overflow: hidden; background: #852769; background-size: cover; }
	.Services_sec .Center { max-width: 1100px; margin: auto; overflow: hidden; text-align: center; }
	.Services_sec h2 { font-size: 30px; color: #fff; font-family: 'Montserrat', sans-serif; font-weight: 900; margin: 0px; text-transform: uppercase; line-height: 34px; }	
	.Services_sec p { padding: 15px 0px 10px 0px; font-size: 16px; color: #fff; margin: 0px; font-family: 'Montserrat', sans-serif; line-height: 25px; font-weight: 400; }
	.Services_sec .Line { border: solid 1px #fff; height: 2px; width: 100px; margin: 0 auto; }
	.Services_sec img {height: 50px;  margin: auto;}
	.Services_sec h3 { padding: 25px 0px;font-size: 16px; color: #F7ADAF; font-family: 'Montserrat', sans-serif; font-weight: 400; margin: 0px; line-height: 20px; }
	
	.Services_sec .izquierda { padding-top: 15px; width: 50%; float: left; }
	.Services_sec .derecha { padding-top: 15px; width: 50%; float: right;}
	.Services_sec .cuadrado { padding: 20px 10px; height: 180px;}
	
	.Pricing_sec .Center { width: 100%; padding: 0px 3%; }
	.Pricing_sec h2 { font-size: 30px; line-height: 30px; }
	.Pricing_sec p { padding: 15px 0px; font-size: 13px; }
	.Pricing_sec .Pricingside { width: 100%; padding: 30px 0 0 }
	.Pricing_sec .Pricingside li { height: 100%; width: 100%; margin: 0px; }
	.Pricing_sec .Pricingside li .Basic { width: 100%; float: none; }
	.Pricing_sec .Pricingside li .Basic h5 { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); writing-mode: lr-tb; }
	.Pricing_sec .Pricingside li .Dollar { width: 100%; float: none; }
	.Pricing_sec .Pricingside li .Band { width: 100%; float: none; border-bottom: solid 1px #ccc; background: none; height: 75px; }
	.Pricing_sec .Pricingside li .Order { width: 100%; float: none; }
	.Pricing_sec .Pricingside li:hover .Band { height: 75px; }
	
	.Contact_sec { width: 100%; }
	.Contact_sec .Center { width: 100%; padding: 60px 3% 30px;}
	.Contact_sec h2 { font-size: 30px; line-height: 30px; }
	.Contact_sec p { padding: 15px 0px; font-size: 13px; }

	.Contact_sec .Map { width: 100%;}
	.Contact_sec .Map img { height: 200px; width: 100%; }
	
	.Get_sec { width: 100%; }
	.Get_sec .Mid { width: 100%; padding: 30px 4%; }
	.Get_sec .Leftside { width: 100%; float: right;}
	.Get_sec .Leftside p { margin: 0 0 20px; } 
	.Get_sec .Leftside input.field { padding: 10px 20px; }
	.Get_sec .Leftside textarea { padding: 10px 20px; height: 105px; }
	.Get_sec .Leftside .button { margin: 0px; padding: 12px 0px; -webkit-appearance: none; }

	.Get_sec .Rightside { padding-top: 0px; width: 100%; }
	.Get_sec .Rightside h3 { font-size: 30px; padding-bottom: 10px; }
	.Get_sec .Rightside address { padding: 0 0 15px 47px; }
	.Get_sec .Rightside ul { padding: 10px 0 0 3px; }

	footer { width: 100%; }
	footer .Cntr { width: 100%; padding: 10px 3%; }	
}

@media only screen and (max-width: 1199px) {
	
	.encontra { width: 100%; padding: 5% 20%!important;}
	
	header,
	.Navigation li,
	.Navigation li:hover span, 
	.Navigation li.active span { 
		height: 87px; }
	header.smaller .Navigation li:hover span,
	header.smaller .Navigation li.active span {
		height: 105px;
	}
}
@media only screen and (max-width: 767px) {
	header { 
		height: 105px; 
		position: fixed;
	}
	.Navigation li {
		height: 45px;
	}
	.Navigation li:hover span, .Navigation li.active span {
		height: 45px;
	}
	.Navigation li span {
		border-bottom: none;
		background: none;
	}
	#mobile_sec .menumobile .Navigation li:hover, 
	#mobile_sec .menumobile .Navigation li.active {
		background: #faa518 none repeat scroll 0% 0%;
		border-bottom: medium none;
	}
	header.smaller .Navigation li {
		height: 45px;
	}
	.Banner_sec .leftside a {
		margin-top: 10px;
		margin-bottom: 20px;
	}
}