@charset "UTF-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Raleway:500,300);

/*   MENU   */
.menu-bkg {
	width: 100%;
	height: 100px;
	position:fixed;
	top:0;
	border-bottom:1px #EBEBEB solid;
	background-image: url(../img/bkg_menu.jpg);
	opacity: 0.95;
	background-position: center top;
	background-repeat: repeat-x;
	z-index: 10000;	
}

.menu-cont {
	margin: 0 auto;
	width: 1024px;
}

.logo_tcpip {
	width:172px;
	float:left;
	margin:0 25px 0 35px;
}

.links { 
	margin-right: 20px;
	float: left;	
}

.links a {
	font-size: 15px;
	font-weight: 500;
	height: 45px;
	float: left;
	margin: 30px 0 0 0;
	padding: 0 13px;
	color: #484747;
	text-decoration: none;
	border-right: 1px solid #D8D8D8;
}

.links a:hover {
	color: #A6A6A6;
}

.links a span {
	margin-top: 13px;
	display: block;
}

.tel {
	padding: 44px 25px 0 15px;
	font-weight: 300;
	display: block;
	float: left;
	font-family: Helvetica, Arial, sans-serif;
	color: #979797;
	font-size: 15px;
}

.ancla {
	margin-top: -100px;
	float: left;
}

/* MENU RESPONSIVO  */
.no-show {
	display: none;
}

header {
    background: #fff;
    margin:0 auto;
	width:1000px;
	font-size:16px;
	font-weight:400;
}

#logo{
    margin-left: 0;
    float: left;
    width: 200px;
    height: 75px;
    background: url(../img/logo_tcpip.png) no-repeat center;
    background-size: 144px auto;
    display: block;
}

nav {
    float: right;
    padding: 10px 5px;    
}

#menu-icon {
    display: hidden;
    width: 40px;
    height: 40px;
    background: #FF7C00 url(../img/menu-icon.png) center;
    border-radius: 4px;
}

nav a {
	text-decoration: none;
	color: #A6A6A6;
}

nav a:hover {
	color: #55B73E;
}

nav a:hover#menu-icon {
    background-color: #444;
    border-radius: 4px 4px 0 0;
}

nav ul {
    list-style: none;
}

nav li {
    display: inline-block;
    float: left;
    padding: 0 15px;
}

.current {
    color: #A6A6A6;
}

/*   SLIDER   */
.slide1 {
	background-image: url(../img/sliders/bkg1_slider.jpg);
}

.slide2 {
	background-image: url(../img/sliders/bkg2_slider.jpg);
}

.slide3 {
	background-image: url(../img/sliders/bkg3_slider.jpg);
}

.slider li {
	height: 630px;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}

.container-slider {
	width: 100%;
	margin: 0;
	float: left;
	display: block;
}

.flexslider {
	height: 630px;
}

/*   SERVICES   */
.services-bkg {
	background-image: url(../img/bkg_servicios.jpg);
	background-color: #F9F9F9;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}

.services-modules {
	width: 50%;
	padding: 0 0;
	float: left;
	text-align: center;
}

.services-modules img {
	padding: 0 0;
}

/*	CUSTOMERS	*/
.customers ul { 
	padding: 0;
}

.customers li {
	width: 240px;
	padding: 20px 0;
	text-align: center;
	float: left;
	margin: 0;
	list-style: none;
}

.customers h1 {
	padding-bottom: 5px;
}

.abajo {
	padding: 90px 0 40px 0;
}

/*   TECHNOLOGIES   */
.espacios {
	padding-bottom: 0;
	border-top: 1px #e9e9e9 solid;
}
.boxpop {
	float: left;
	width: 100%;
}
.bluebox {
	width:50%;
	background-color: #2E99D7;
	text-align: center;
	color: #FFF;
	text-align: center;
	font-size: 30px;
	display: table;
}
.ux-text, .scale-text, .ide-text {
	background-position: center center !important;
	background-repeat: no-repeat;
}
.ux-text {
	height: 302px;
	background-image: url(../img/embrace/tech_ux.png);
	float: left;
}
.scale-text {
	height: 552px;
	background-image: url(../img/embrace/tech_cloud.png);
	float: right;
}
.ide-text {
	height: 399px;
	background-image: url(../img/embrace/tech_ide.png);
	float: left;
}
.ux-text div { height: 55px; }
.scale-text div { height: 170px; }
.ide-text div { height: 80px; }

.bluebox span {
	font-size: 60px;
	display: block;
}
.imagebox {
	width: 50%;
	float: left;
}
.imagebox img {
	width: 100%;
}
.full {
	display: block
}
.responsive {
	display: none;
}


/*   TESTIMONIALS   */
.testimonials-bkg {
	background-image: url(../img/bkg_testimonials.jpg);
	background-color: #FAFAFA;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.container-test {
	width: 780px;
	margin: 0 auto;
	height: 450px;
}

.transbox {
	background-color: rgba(0, 0, 0, 0.04);
	width: 280px;
	padding: 40px;
	float: left;
}

.transbox:last-child {
	float: right;
}

.transbox p {
	font-size: 19px;					
	font-weight: 300;
	line-height: 22px;
	height: 240px;
	margin: 0 0 35px 0;
	color: #000000;
}

.text-photo {
	width: 50%;
	padding: 0;
	float: left;
}

.text-photo h1 {
	font-size: 20px;					
	font-weight: 500;
	text-align: left;
	color: #000000;
	padding: 34px 0 0 0;
}

.text-photo span {
	font-size: 19px;
	font-weight: 300;
	text-align: left;
	color: #000000;
}

.text-photo img {
	float: right;
}

/*	PARTNERS	*/
.partners li {
	width: 19%;
	padding: 10px 0 0 0;
	text-align: center;
	float: left;
	margin: 0;
	list-style: none;
}

.partners ul { 
	padding: 0;
}

.partners p {
	font-size: 18px;
	color: #A2A2A2;
}

.partners a {
	text-decoration: none;
}

/*   CONTACT   */
.contact-bkg {
	background-image: url(../img/bkg_mapa.jpg);
	background-color: #273A39;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}

.contact-photos {
	background-image: url(../img/fotos_oficina.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: cover;
}

.contact-office {
	width: 875px;
	padding: 20px 55px 0 55px;
	margin: 0 auto;
	text-align: left;
}

.module1 {
	float: right;
	width: 50%;
	text-align: center;
}

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

.module1 img {
	margin: 0 auto !important;
}

.white-text h1 {
	color: #FFFFFF;
	padding-bottom: 30px !important;
	width: 99%;
	margin: 0;
}

.module2 h1, .module2 p, .contact-message h1 {
	color: #EBEBEB;
}

.module2 h1 { 
	padding-bottom: 5px;
}

.module2 p { 
	line-height: 28px;
	font-size: 19px;
	padding-top: 5px;
}

.contact-message {
	width: 875px;
	text-align: left;
	float: left;
}

.contact-message h1 {
	padding: 43px 0 15px 0;
}

.contact-name, .contact-email {
	width: 391px;
	padding: 15px;
	background-color: #FFFFFF;
	float: left;
	font-size: 15px;
}

.contact-name {
	margin-right: 25px;
}

.contact-text {
	width: 843px;
	height: 185px;
	padding: 15px;
	background-color: #FFFFFF;
	float: left;
	margin: 25px 0 35px 0;
	font-size: 15px;
}

.contact-message a {
	color: #FFFFFF;
	background-color: #00CFFF;
	padding: 10px 25px;
	text-decoration: none;
	font-size: 23px;
	font-weight: 300;
}

.contact-message a:hover {
	background-color:#009ABE;
	color:#FFFFFF !important;
}


/* ----------------------- */


@media (max-width: 991px) {
	
	.menu-cont, .customers, .partners, .container-section, .contact-message, .container-photos, .container-section-serv, .technologies {
		width: 100%;
		float: left;
	}
	
/* 	MENU  */
	.logo_tcpip {
		margin: 0 0 0 35px;
	}
	
	.links {
		margin-right: 9px;
		float: right;
	}
	
	.links a {
		padding: 0 9px;
		border-right: none;
	}
	
	.tel {
		display: none;
	}
	
	.container-section h1 {
		padding: 0;
	}
	
/* 	MENU RESPONSIVO */
	.heador {
		display: none;
	}
	
	.no-show {
		display: none;
	}
	
	header {
	    margin:0 auto;
		width:100%;
	}
	.hidethis {
		display: none;
	}

/*   SERVICES   */
	.container-section-serv {
		padding-top: 30px;
	}

/*   CUSTOMERS   */
	.customers ul {
		padding-top: 15px;
		float: left;
	}
	
	.customers li {
		width: 33.33%;
		padding: 15px 0;
		float: left;
	}

	.customers img {
		width: 72%;
	}

/*   TECHNOLOGIES   */
	.technologies h1 {
		padding-bottom: 30px;
	}
	
	.ux-text { height: 270px; }
	.scale-text { height: 500px; }
	.ide-text { height: 340px; }
	
	.ux-text div { height: 40px; }
	.scale-text div { height: 160px; }
	.ide-text div { height: 60px; }
	
	
/*   TESTIMONIALS   */
	.container-test {
		padding-top: 35px;
	}
	
	.container-test {
		width: 90%;
		margin: 0 5%;
		height: auto;
	}
	
	.transbox {
		width: 90%;
		padding: 40px 5%;
		float: left;
	}
	
	.transbox:last-child {
		float: left;
		margin-top: 40px;
	}
	
	.transbox p {
		height: auto;
	}

/*   PARTNERS   */
	.partners img {
		width: 97%;
	}

/*   CONTACT   */
	.contact-office {
		width: 90%;
		padding: 20px 5% 0 5%;
		margin: 0 auto;
	}
	
	.module1 {
		float: right;
		width: 50%;
		text-align: center;
	}
	
	.module2 {
		width: 50%;
		float: left;
	}
	
	.contact-name, .contact-email, .contact-text {
		float: left;
		margin-bottom: 25px;
		width: 100%;
		padding: 20px 0;
	}
	
	.contact-name {
		margin-right: 0;
	}
	
	.contact-email {
		margin-left: 0;
	}
	
	.contact-text {
		margin: 0 0 35px 0;
	}
	
}


@media (max-width: 771px) {

/* 	MENU  */
	.menu-bkg {
		width: 100%;
		height: 100px;
		position: fixed;
		top: 0;
		border-bottom: 1 px #EBEBEB solid;
		opacity: 0.95;
		background-position: center top;
		background-repeat: repeat-x;
		z-index: 1000;
	}
	
	.menu-cont {
		display: none;
	}
	
/* 	MENU RESPONSIVO */
	.no-show {
		display: block;
	}
	
	header {
	    width: 100%;
	    height: 100px;
	    position: fixed;
	    top: 0;
	    left: 0;
	    z-index: 100;
		background-image: url(../img/bkg_menu.jpg);
    }
    
    #logo{
	    margin-left: 21px;
	    margin-top: 13px;
	    float: left;
	    background: url(../img/logo_tcpip.png) no-repeat center;
	    display: block;
	}
 
    #menu-icon {
        display: inline-block;
        margin: 20px 15px 0;
        padding: 0;
    }
    
    nav a {
        text-align: left;
        width: 100%;
        padding: 15px 0 15px 30px;
        margin: 0;
        display: block;
    }
    
    nav a:hover {
		background-color: #F8F8F8;     
    }
    
    nav ul, nav:active ul { 
        display: none;
        position: absolute;
        padding: 0;
        background: #fff;
        border-top: 1px solid #CCC;
        border-left: none !important;
        border-right: none !important;
        border: 1px solid #CCC;
        right: 0px;
        top: 69px;
        width: 100%;
        border-radius: 0;
    }
    
    nav li {
        border-bottom:1px solid #CCC;
        width: 100%;
		padding: 0;
    }

    nav li:last-child {
        border-bottom:0;
    }

    nav:hover ul {
        display: block;
    }
    
	.hidethis {
		display: block;
	}

/*   SLIDER   */
	.slide1 h4 {
		font-size: 44px;
		line-height: 47px;
	}
	
	.slide2 h4 {
		font-size: 44px;
		line-height: 50px;
		margin-top: 15px;
	}

/*   SERVICES   */
	.services-modules {
		width: 100%;
		float: left;
		text-align: center;
	}
	
	.container-section-serv h2 {
		font-size: 24px;
	}
	
	.espacio h2 {
		padding-bottom: 50px !important;
	}
	
	.services-modules h2 {
		padding-bottom: 35px;
	}
	
	.hire_down h2{
		padding-bottom: 0;
	}
	
/*   CUSTOMERS   */
	.customers img {
		width: 75%;
	}

/*   TECHNOLOGIES   */

	.espacios {
		border-bottom: 1px #e9e9e9 solid;
	}
	.bluebox {
		width:100%;
	}
	.imagebox {
		width: 100%;
	}
	.full {
		display: none;
	}
	.responsive {
		display: block;
	}
	
	.ux-text { padding: 60px 0; height: auto; }
	.scale-text { padding: 100px 0; height: auto; }
	.ide-text { padding: 60px 0; height: auto; }
	
	.ux-text div { height:0; }
	.scale-text div { height:0; }
	.ide-text div { height:0; }
	
	
/*   PARTNERS   */	
	.partners li {
		width: 33.33%;
		float: left;
	}

/*   CONTACT   */
	.module1 {
		width: 100%;
		float: right;
	}

	.module2 {
		width: 100%;
		float: left;
		text-align: center;
	}
	
	.contact-message h1 {
		text-align: center;
	}
	
	.module1 img {
		margin: 30px 0 30px 0;
		width: auto;
		display: inline;
	}
	
	.module2 h1 {
		margin-top: 30px;
	}
		
	.contact-text {
		margin: 0;
	}
	
	.contact-message a {
		width: 100%;
		display: block;
		float: left;
		text-align: center;
		color: #FFFFFF;
		background-color: #00CFFF;
		padding: 15px 0;
		margin-top: 25px;
		text-decoration: none;
		font-size: 23px;
		font-weight: 300;
	}
	
}


@media (max-width: 461px) {

/*   SLIDER   */
	.slide2 h4 {
		font-size: 35px;
		line-height: 41px;
	}
	
	.slide3 h4 {
		font-size: 43px;
		line-height: 47px;
	}

/*   CUSTOMERS   */
	.customers li {
		width: 50%;
	}
	
	.customers img {
		width: 80%;
	}

/*   TECHNOLOGIES   */

	.bluebox {
		font-size: 20px;
	}
	.bluebox span {
		font-size: 40px;
	}
/*   PARTNERS   */
	.partners li {
		width: 50%;
		float: left;
	}

/*   CONTACT   */
	.module2 h1 {
		margin-top: 40px;
	}
	
	.white-text h1 {
		padding-left: 10%;
		padding-right: 10%;
		width: 80% !important;
		color: #FFFFFF;
		padding-bottom: 30px !important;
		width: 99%;
		margin: 0;
	}

}