body{
	font-family:"intrarumlight",sans-serif;;
	font-size:13px;
	line-height:20px;
	color:#6F7068;
	margin:0 auto;
	padding:0;
	background-color:#FAFAFA;
	}	

h1,h2,h3,h4,p {font-style:normal; font-weight:normal; margin:0; padding:0; color:#FFFFFF;}

h1{font-family:"intrarumthin",sans-serif; font-size:32px;line-height:38px; margin-bottom:20px;}
h2{font-family: 'intrarummedium';font-size:16px; line-height:21px; }
h3{font-size:13px;line-height:18px;}
h4{font-size:13px;line-height:14px;}
p{font-size:13px; line-height:18px;}

a {color:#6F7068; text-decoration:underline;}
a:hover{color:#6F7068;text-decoration:none; cursor:pointer;}

img, img a, img a:hover {border:0;}

strong {font-family:"intrarummedium",sans-serif;font-weight:normal; font-style:normal;}

@font-face{ 
	font-family: 'intrarumthin';
	src: url('../fonts/intrarum-thin-webfont.eot');
	src: url('../fonts/intrarum-thin-webfont.eot?iefix') format('eot'),
	     url('../fonts/intrarum-thin-webfont.woff') format('woff'),
	     url('../fonts/intrarum-thin-webfont.ttf') format('truetype'),
	     url('../fonts/intrarum-thin-webfont.svg#webfont') format('svg');
	font-weight:normal;
	font-style:normal;
}

@font-face{ 
	font-family: 'intrarumlight';
	src: url('../fonts/intrarum-light-webfont.eot');
	src: url('../fonts/intrarum-light-webfont.eot?iefix') format('eot'),
	     url('../fonts/intrarum-light-webfont.woff') format('woff'),
	     url('../fonts/intrarum-light-webfont.ttf') format('truetype'),
	     url('../fonts/intrarum-light-webfont.svg#webfont') format('svg');
	font-weight:normal;
	font-style:normal;
}


@font-face{ 
	font-family: 'intrarummedium';
	src: url('../fonts/intrarum-medium-webfont.eot');
	src: url('../fonts/intrarum-medium-webfont.eot?iefix') format('eot'),
	     url('../fonts/intrarum-medium-webfont.woff') format('woff'),
	     url('../fonts/intrarum-medium-webfont.ttf') format('truetype'),
	     url('../fonts/intrarum-medium-webfont.svg#webfont') format('svg');
	font-weight:normal;
	font-style:normal;
}

@font-face{ 
	font-family: 'intrarumbold';
	src: url('../fonts/intrarum-bold-webfont.eot');
	src: url('../fonts/intrarum-bold-webfont.eot?iefix') format('eot'),
	     url('../fonts/intrarum-bold-webfont.woff') format('woff'),
	     url('../fonts/intrarum-bold-webfont.ttf') format('truetype'),
	     url('../fonts/intrarum-bold-webfont.svg#webfont') format('svg');
	font-weight:normal;
	font-style:normal;
}

	
div, ul, li{
	display:block;
	margin:0;
	padding:0;
	list-style:none;}
	
#header{
position:relative;
display:inline;
float:left;
clear:both;	
margin:0;
padding:0;
width:100%;
height:100px;
background-color:#FFF;
/*min-width:900px;*/
}

#header-follow {
	position:fixed;
	top:0;
	margin:0;
	padding:0;
	width:100%;
	height:70px;
	background-color:#FFF;
	z-index:9999;
	/*min-width:900px;*/
	display:none;
}

#content{
position:relative;
display:inline;
float:left;	
clear:both;
margin:0;
padding:0 0 10px 0;
width:100%;
}

#footer {
position:relative;
display:inline;
float:left;	
clear:both;
margin:0;
padding:0;
width:100%;
height:180px;
background-color:#FFF;
/*min-width:740px;*/
}

.container {
max-width:1000px;
margin:0 auto;
}

/* HEADER *****************************************************/

#header a.logo,
#header-follow a.logo{
float:left;
margin:15px;
width:175px;
height:65px;
}

#header a.logo {background:url(../img/intrarum.png) center left no-repeat; background-size:contain;}
#header-follow a.logo {width:35px; height:40px; background:url(../img/intrarum.png) center left no-repeat; background-size:cover;}

#header ul.menu {float:right; margin:40px 35px 40px 0}
#header-follow ul.menu {float:right; margin:25px 35px 25px 0}

#header ul.menu li,
#header-follow ul.menu li {float:left; height:20px; margin-left:30px;}

#header ul.menu li a,
#header-follow ul.menu li a {text-transform:uppercase; font-size:13px; line-height:20px; font-family:"intrarumthin",sans-serif;text-decoration:none;}

#header ul.menu li a:hover,
#header-follow ul.menu li a:hover {text-decoration:none; color:#E65423;}

#header ul.menu li a.active,
#header-follow ul.menu li a.active{opacity:0.5}

/*#header ul.menu li.inicio a.active,
#header-follow ul.menu li.inicio a.active{color:#F00;}

#header ul.menu li.nosotros a.active,
#header-follow ul.menu li.nosotros a.active{color:#F02;}

#header ul.menu li.servicios a.active,
#header-follow ul.menu li.servicios a.active{color:#F03;}*/

#header ul.menu li.soluciones a,
#header-follow ul.menu li.soluciones a{opacity:0.3; cursor:default;}

#header ul.menu li.soluciones a:hover,
#header-follow ul.menu li.soluciones a:hover{opacity:0.3; color:#6F7068; cursor:default;}

/*#header ul.menu li.rrhh a.active,
#header-follow ul.menu li.rrhh a.active{color:#F04;}

#header ul.menu li.contacto a.active,
#header-follow ul.menu li.contacto a.active{color:#F05;}

#header ul.menu li.clientes a.active,
#header-follow ul.menu li.clientes a.active{color:#F06;}*/

/* CONTENT *****************************************************/

#content .box {
	position:relative;
	width:100%;
	margin:10px 0 0 0;
	float:left;
	clear:both;	
}

#content h2 {margin:30px 0 50px 30px; text-transform:uppercase; float:left; clear:both; width:}
#content h1 {width:650px; margin:0 0 50px 30px; float:left; clear:both;}
#content p {float:left;}
#content p.col1 {width:350px; margin:0 60px 0 30px}
#content p.col2 {width:350px; margin:0;}

#content #banner h1 {color:#6F7068;}
#content #clientes h2 {color:#6F7068; margin:30px; 0 0 30px;}

#banner .slider h1 {margin:50px 0 0 80px;}
#banner .slider h1 a{color:#E65423; text-decoration:none;}
#banner .slider h1 a:hover{color:#E65423; text-decoration:underline;}

#banner .slider li {height:400px;}

#banner .slider li.slide-01 {background-image:url(../img/banner-01.jpg)}
#banner .slider li.slide-02 {background-image:url(../img/banner-02.jpg)}
#banner .slider li.slide-03 {background-image:url(../img/banner-03.jpg)}

#content #banner .slider li.slide-01 h1 {color:#FFF; }

#banner {height:400px;}

#nosotros {background:url(../img/nosotros-back.png) center center no-repeat #338D89; height:530px;}

#nosotros .ribbon {position:absolute; width:125px; height:180px; top:20px; right:0; background:url(../img/ribbon.png)}

#servicios {background:url(../img/servicios-back.jpg) center center no-repeat #165871; height:500px;}

#rrhh {background:url(../img/rrhh-back.jpg) top center no-repeat #e35122; height:450px;}

#content #rrhh h2 {clear:both;}
#content #rrhh div.col1{width:300px; float:left; clear:both; margin:0 110px 0 30px}
#content #rrhh div.col2{width:400px; float:left;}
#content #rrhh div.col2 h1{width:380px; margin:0 0 20px 0;}
#content #rrhh div.col2 p {margin:0;}
#content #rrhh div.col2 ul {width:380px;}
#content #rrhh div.col2 li {width:380px; min-height:50px; float:left; clear:both; padding-left:50px; background:url(../img/plus.png) center left no-repeat; color:#FFF; font-size:14px; line-height:18px; margin:0 0 20px 0; }

#contacto {background:url(../img/contacto-back.jpg) bottom left no-repeat #54BB3F; height:350px;}

#contacto h1 a {color:#FFF;text-decoration:none;}
#contacto h1 a:hover {color:#FFF; text-decoration:underline;}
#contacto div.social {width:450px; float:left; margin:0 0 0 30px;}
#contacto div.social a {width:150px;float:left; color:#FFF; text-decoration:none;}
#contacto div.social a:hover {opacity:0.5}
#contacto div.social a img {float:left; margin-right:10px; }
#contacto #map_canvas {position:absolute; top:0; right:0; width:400px; height:350px;}

#clientes {background-color:#EBEBE9;height:240px;}


#clientes ul.brandwall {width:100%; float:left;}
#clientes ul.brandwall li {width:25%; height:90px; float:left;}
#clientes ul.brandwall li.margin {width:5%; height:90px; float:left;}

#clientes ul.brandwall li.cliente-01 {background:url(../img/cliente-01.gif) center center no-repeat; background-size:contain;}
#clientes ul.brandwall li.cliente-02 {width:35%; background:url(../img/cliente-02.gif) center center no-repeat; background-size:contain;}
#clientes ul.brandwall li.cliente-03 {background:url(../img/cliente-03.gif) center center no-repeat; background-size:contain;}

#content #nav {position:absolute; right:20px; bottom:20px; width:70px; height:30px; z-index:9999}

#content #nav .down {display:block; float:right; width:30px; height:30px; margin-right:10px; background: url(../img/controls2.png) no-repeat -30px 0;}
#content #nav .up {display:block; float:right; width:30px; height:30px; background: url(../img/controls2.png) no-repeat 0 0;}

#content #nav .down:hover {background-position:-30px -30px;}
#content #nav .up:hover {background-position:0 -30px;}

/* FOOTER *****************************************************/

#footer .logo {
float:left;
width:30px;
height:35px;
margin:20px 40px 0 20px;
}

#footer .logo img{
height:100%;
width:auto;
}

#footer ul.menu {
float:left;
width:300px;
height:80px;
margin:20px 20px 0 0;
}

#footer ul.menu li{
width:150px;
margin:0;
padding:0;
float:left;
}

#footer ul.menu li a{
width:100%;
margin:0;
padding:0;
float:left;
clear:both;
text-transform:uppercase;
font-size:13px;
line-height:20px;
text-decoration:none;
}

#footer ul.menu li a:hover {text-decoration:underline;}

#footer .copyright {
float:left;
width:280px;
height:20px;
margin:20px 20px 0 0;
}

#footer .contacto {
float:right;
width:200px;
height:80px;
margin:20px 20px 0 0;
}

#footer .contacto a{
color:#54BB3F;
text-decoration:none;
}

#footer .contacto a:hover{
text-decoration:underline;
}

#footer ul.social {
float:right;
width:90px;
height:25px;
margin:20px 20px 0 0;
}

#footer ul.social li{
float:right;
width:25px;
height:25px;
margin:0 0 0 5px;
background-color:#0C6;
}

/* RESPONSIVE 480x320 */

@media screen and (max-width: 1080px) {

.container {
max-width:900px;
margin:0 auto;
}
	
}


/* RESPONSIVE 480x320 */

@media screen and (max-width: 935px) {
	
#header .menu {display:none;}
#header-follow .menu {display:none;}

#footer .menu {display:none;}

.container { max-width:460px; margin:0 auto;}

#banner {height:200px;}
#banner .slider h1 {margin:20px 0 0 20px;}
#banner .slider li {height:200px; background-size:cover;}

#nosotros {height:470px;}
#servicios {height:470px;}
#rrhh {height:490px;}

#content #rrhh div.col1 {width:400px;margin:20px 0 0 20px;}
#content #rrhh div.col2{width:380px; margin:20px 0 0 20px}
#content #rrhh div.col2 li {width:380px; }

.bx-wrapper .bx-controls-direction a {top:20px; margin-top:0; width:30px; height:30px;}

.bx-wrapper .bx-prev {right:50px; left:auto; background: url(../img/controls.png) no-repeat 0 -120px;}
.bx-wrapper .bx-next {right:10px; background: url(../img/controls.png) no-repeat -30px -120px;}
.bx-wrapper .bx-prev:hover {background-position: 0 -150px;}
.bx-wrapper .bx-next:hover {background-position: -30px -150px;}

#content h2 {font-size:14px; line-height:20px; margin:20px 0 0 20px;}
#content h1 {width:350px; font-size:20px; line-height:25px; margin:20px 0 0 20px; }
#content p {font-size:12px; line-height:17px; }
#content p.col1 {width:200px; margin:30px 0 0 20px; }
#content p.col2 {width:180px; margin:30px 0 0 30px; }

#contacto div.social {width:240px; float:left; margin:30px 0 0 20px;}
#contacto div.social a {margin:0 0 10px 0;}
#contacto #map_canvas {display:none;}

#nosotros .ribbon {width:75px; height:108px; background:url(../img/ribbon2.png) no-repeat;}
	
}


/* RESPONSIVE 480x320 */

@media screen and (max-width: 935px) {
	
#header .menu {display:none;}
#header-follow .menu {display:none;}

#footer .menu {display:none;}

.container { max-width:460px; margin:0 auto;}

#banner {height:200px;}
#banner .slider h1 {margin:20px 0 0 20px;}
#banner .slider li {height:200px; background-size:cover;}

#nosotros {height:470px;}
#servicios {height:470px;}
#rrhh {height:490px;}

#content #rrhh div.col1 {width:400px;margin:20px 0 0 20px;}
#content #rrhh div.col2{width:380px; margin:20px 0 0 20px}
#content #rrhh div.col2 li {width:380px; }

.bx-wrapper .bx-controls-direction a {top:20px; margin-top:0; width:30px; height:30px;}

.bx-wrapper .bx-prev {right:50px; left:auto; background: url(../img/controls.png) no-repeat 0 -120px;}
.bx-wrapper .bx-next {right:10px; background: url(../img/controls.png) no-repeat -30px -120px;}
.bx-wrapper .bx-prev:hover {background-position: 0 -150px;}
.bx-wrapper .bx-next:hover {background-position: -30px -150px;}

#content h2 {font-size:14px; line-height:20px; margin:20px 0 0 20px;}
#content h1 {width:350px; font-size:20px; line-height:25px; margin:20px 0 0 20px; }
#content p {font-size:12px; line-height:17px; }
#content p.col1 {width:200px; margin:30px 0 0 20px; }
#content p.col2 {width:180px; margin:30px 0 0 30px; }

#contacto div.social {width:240px; float:left; margin:30px 0 0 20px;}
#contacto div.social a {margin:0 0 10px 0;}
#contacto #map_canvas {display:none;}

#nosotros .ribbon {width:75px; height:108px; background:url(../img/ribbon2.png) no-repeat;}
	
}


/* RESPONSIVE 320x480 */

@media screen and (max-width: 480px) {
	
#header .menu {display:none;}
#header-follow .menu {display:none;}

#footer .menu {display:none;}

.container { max-width:300px; margin:0 auto;}

#banner {height:200px;}
#banner .slider h1 {margin:20px 0 0 20px;}
#banner .slider li {height:200px; background-size:cover;}

#nosotros {height:600px;}
#servicios {height:550px;}
#rrhh {height:500px;}
#contacto {height:300px;}

#content #nosotros h1{width:240px;}

#content #rrhh div.col1 {width:260px;margin:20px 0 0 20px;}
#content #rrhh div.col2{width:215px; margin:20px 0 0 20px}

#content #rrhh div.col2 h1{width:250px; margin:0;}
#content #rrhh div.col2 li {width:250px; font-size:11px; line-height:16px; background-size:2%;
padding-left:15px;}

.bx-wrapper .bx-controls-direction a {top:20px; margin-top:0; width:30px; height:30px;}

.bx-wrapper .bx-prev {right:50px; left:auto; background: url(../img/controls.png) no-repeat 0 -120px;}
.bx-wrapper .bx-next {right:10px; background: url(../img/controls.png) no-repeat -30px -120px;}
.bx-wrapper .bx-prev:hover {background-position: 0 -150px;}
.bx-wrapper .bx-next:hover {background-position: -30px -150px;}

#content h2 {width:260px;font-size:12px; line-height:14px; margin:20px 0 0 20px;}
#content h1 {width:260px;font-size:18px; line-height:22px; margin:20px 0 0 20px; }
#content p {width:260px;font-size:11px; line-height:16px; }
#content p.col1 {width:260px; margin:20px 0 0 20px; }
#content p.col2 {width:260px; margin:20px 0 0 20px; }

#contacto div.social {width:240px; float:left; margin:20px 0 0 20px;}
#contacto div.social a {margin:0 0 10px 0;}
#contacto #map_canvas {display:none;}

#nosotros .ribbon {width:75px; height:108px; background:url(../img/ribbon2.png) no-repeat;}

#footer .contacto {margin:30px 80px 0 0;}

#footer {height:210px;}
	
}