/** ********************************************** **
	@Author			SMLXL Design
	@Website		www.smlxl.es

	TABLE CONTENTS
	-------------------------------
		01. Globals
		02. Boxed Layout
		03. Callout
		04. Slider
		05. Misc
		06. Maps
		07. Maintenance
		08. Error 404
		09. Coming Soon
		10. Word Rotator
		11. Item Box
		12. Timeline
		13. Portfolio
		14. Contact
		15. Onepage
		16. User Profile
		17. Comments
		18. Responsive
		--. DEMO ONLY

*************************************************** **/


/** 01. Globals
 **************************************************************** **/
html {
	overflow-x: hidden;
	overflow-y: auto;
}

html, body {
	min-height: 100%;
}

body {
	color:#666;
	background-color:#fff;
	font-family:'Open Sans', Arial, sans-serif;

	font-size:14px; line-height:23px;
	margin:0; padding:0 !important;
}
body.grey .divider .fa,
body.grey { /* grey background - YT style */
	background-color:#f1f2f7;
}

section {
	padding-top:60px;
	padding-bottom:60px;
}
	section.alternate .divider .fa,
	section.alternate {
		background-color:#F5F3F4;
	}
	body.grey section.alternate .divider .fa,
	body.grey section.alternate {
		background-color:#e9e9e9;
	}

	section.dark {
		color:#fff;
		background-color:#333;
	}



section header {
	display:block;
	margin-bottom:60px;
}
	section header p {
		margin:0;
		padding:0;
	}
	section header strong {
		font-weight:500;
	}
	section header h1,
	section header h2,
	section header h3 {
		margin-bottom:10px;
	}
figure {
	margin-bottom:20px;
}

input[type="color"], 
input[type="email"], 
input[type="number"], 
input[type="password"], 
input[type="tel"], 
input[type="url"], 
input[type="text"],
textarea, select {
	margin-bottom:10px;
}
.form-group input {
	margin:0;
}

.btn {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;
}

/* sticky header using bootstrap affix */
#header.sticky {
	display:block;
	left:0; right:0; 
	z-index:100;
}
#header.sticky.affix #topBar {
	display:none;
}
#header.sticky.affix.has-slider { /* slider above */
	top:0;
	margin-top:0 !important;
}





/** 02. Boxed Layout
 **************************************************************** **/
	body.boxed {
		background-color:#D7D6D6;
	}
	body.boxed #wrapper {
		position:relative;
	}
	body.boxed #wrapper,
	body.boxed #topBar, /* IE BUG */
	body.boxed footer {
		margin:auto;
		max-width:1170px;
	}
	body.boxed #wrapper {
		background-color:#fff;
		margin:30px auto !important;
		overflow:hidden;
		box-shadow:rgba(0,0,0,0.3) 0 0 6px;

		-webkit-border-radius: 6px;
		   -moz-border-radius: 6px;
				border-radius: 6px;
	}
	body.boxed #topBar {
		border-top:#333 4px solid;

		-webkit-border-radius: 6px;
		   -moz-border-radius: 6px;
				border-radius: 6px;	
	}
	body.boxed #header.sticky.affix {
		margin-top:-30px; /* wrapper margin */
	}

	body.boxed #header.sticky.affix #topNav.translucent {
		margin-top:30px !important;
	}

@media only screen and (max-width: 768px) {
	body.boxed #topBar,
	body.boxed #wrapper {
		margin:0 !important;
		-webkit-border-radius: 0;
		   -moz-border-radius: 0;
				border-radius: 0;
	}
}


/** 03. Callout
 **************************************************************** **/
.callout {
	z-index:10;
	background-color:#F6F6F6;
	padding:30px 0;
}
.callout.styleBackgroundColor h2,
.callout.styleBackgroundColor h3,
.callout.styleBackgroundColor h4,
.callout.styleBackgroundColor p {
	color:#fff;
}
.callout.styleBackgroundColor .btn {
	border-color:rgba(255,255,255,0.3);
}
.callout h2,
.callout h3,
.callout h4 {
	font-weight:300;
	margin:0 0 8px 0;
}
.callout p {
	margin:0;
	padding:0;
	font-size:16px;
	font-weight:300;
}
.callout .btn {
	margin-top:0;
}


.callout.dark,
.callout.dark h2,
.callout.dark h3,
.callout.dark h4,
.callout.dark p {
	color:#fff;
	background-color:#252525;
}

.callout.dark p {
	color:#b1b1b1;
	font-size:17px;
	max-width:960px;
	margin:auto;
}
.callout.dark.arrow-up,
.callout.dark.arrow-down {
	position:relative;
	padding:60px 0;
}

.callout.dark.arrow-down:after{
	content:' ';
	position:absolute;
	width: 0; height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #252525;
	left:50%; margin-left:-10px;
	bottom:-20px;
}
.callout.dark.arrow-up:after{
	content:' ';
	position:absolute;
	width: 0; height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #252525;
	left:50%; margin-left:-10px;
	top:-20px;
}

@media only screen and (max-width: 990px) {
	.callout h2,
	.callout h3,
	.callout h4 {
		font-size:18px;
		font-weight:600;
	}
	.callout .btn {
		margin-top:20px;
	}
}




/** 04. Slider
 **************************************************************** **/
div.slider {
	background-color:#171717;
	position:relative;
	z-index:1;

	-webkit-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
	   -moz-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
		 -o-box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
			box-shadow: 0 4px 0 rgba(0, 0, 0, 0.04);
}

div.slider a.btn {
	color:#fff;
}
div.slider a.btn-default {
	color:#000;
}


	.tp-bannertimer {
		background:#777 !important;
		background:rgba(0,0,0,0.1) !important;
		height:4px !important;
	  }


	.tparrows.round:before {
		font-family: 'revicons';
		color: #fff;
		font-style: normal;
		font-weight: normal;
		speak: none;
		display: inline-block;
		text-decoration: inherit;
		margin-right: 0;
		margin-top: 9px;
		text-align: center;
		width: 40px;
		font-size: 20px;
	}
		.tparrows {
		
		}
	.tparrows.round {

		cursor: pointer;

		background: rgba(0, 0, 0, 0.5) !important;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		width: 40px !important;
		height: 40px !important;

	}
	.tparrows:hover {
		color: #fff;
	}
	.tp-leftarrow.round:before {
		content: '\e824';
	}
	.tp-rightarrow.round:before {
		content: '\e825';
	}
	.tparrows.tp-rightarrow:before {
		margin-left: 1px;
	}
	.tparrows.round:hover {
		background: rgba(0, 0, 0, 1) !important;
	}


/* CUSTOM TEXT */
.tp-caption.default_white {
	font-size: 18px;
	line-height: 21px;
	font-weight: 300;
	color: #fff;
	text-decoration: none;
	background-color: transparent;
	padding: 0px;
}
.tp-caption.default_black {
	font-size: 18px;
	line-height: 21px;
	font-weight: 300;
	color: #000;
	text-decoration: none;
	background-color: transparent;
	padding: 0px;
}
.tp-caption.block_black {
	background-color:#000;
}
.tp-caption.block_white {
	background-color:#fff;
}
.tp-caption.block_white,
.tp-caption.block_styleColor,
.tp-caption.block_black {
	white-space: nowrap;
	line-height: 34px;
	border-width: 0px;
	margin: 0px;
	padding: 1px 10px;
	letter-spacing: 0px;
	font-size: 22px;
	color:#fff;
}
.tp-caption.block_huge {
	font-size:130px;
	line-height:130px;
}
.tp-caption.block_huge.text-white {
	color:#fff;
}
.tp-caption.block_huge.text-black {
	color:#000;
}

/*
	@Flex Slider
*/
.flexslider.flexFull .flex-direction-nav a, 
.flexslider.flexContent .flex-direction-nav a {
	display: block;
	width: 45px;
	height: 45px;
	margin: -22px 0 0 0;
	background: #333333;
	position: absolute;
	top: 50%;
	z-index: 10;
	cursor: pointer;
	font-size:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color: transparent;
	opacity: 1;
	-webkit-transition: all .3s ease;
}
.flexslider.flexFull .flex-direction-nav a.flex-next:after, 
.flexslider.flexContent .flex-direction-nav a.flex-next:after {
	content: "\e080";
}
.flexslider.flexFull .flex-direction-nav a.flex-prev:after, 
.flexslider.flexContent .flex-direction-nav a.flex-prev:after {
	content: "\e079";
}

.flexslider.flexFull .flex-direction-nav a.flex-prev:after, 
.flexslider.flexFull .flex-direction-nav a.flex-next:after, 
.flexslider.flexContent .flex-direction-nav a.flex-prev:after, 
.flexslider.flexContent .flex-direction-nav a.flex-next:after {
	font: 12px/1em 'Glyphicons Halflings';
	left: 16px;
	top: 16px;
	font-style: normal;
	position: absolute;
	display: inline-block;
	color: #fff;
}

/*
	@Layer Slider
*/
div.layerslider div.ls-slide>div.ls-l.fullvideo {
	width:100% !important;
	height:100% !important;
}
.ls-borderlessdark .ls-thumbnail-inner,
div.ls-thumbnail-slide-container {
	background-color:rgba(0,0,0,0.1) !important;
}

/*
	@OWL Slider
*/
#bar {
  width: 0%;
  max-width: 100%;
  height: 4px;
  background: #999;
}
#progressBar{
  width: 100%;
  background: rgba(0,0,0,0.05);
}
div.owl-carousel>div {
	position:relative;
}
div.owl-carousel .caption {
	position:absolute;
	left:0; right:0; bottom:0;
	color:#333; font-size:20px;
	background:rgba(0,0,0,0.2);
	text-shadow:#fff 1px 1px 1px;
	text-align:center;
	padding:3px; margin-right:1px;
	z-index:10;
}




/** 05. Misc
 **************************************************************** **/
#toTop {
	background-color: #333;
	border-radius: 4px 4px 0 0;
	color: #FFF;
	position: fixed;
	height: 35px; width: 48px;
	right: 6px; bottom: 0;
	text-align: center;
	text-transform: uppercase;
	opacity: 0.9;
	padding-top: 7px;
	text-decoration:none;
	display:none;
	z-index: 1000;

	-webkit-transition: all 0.2s;
	   -moz-transition: all 0.2s;
		 -o-transition: all 0.2s;
			transition: all 0.2s;
}
#toTop:before {
	font-family: "fontawesome";
	content: "\f077";
}
span.user-avatar {
	background:#eee;
	width:64px; height:64px;
	float:left;
	margin-right:10px;
}
	section.page-title {
		padding:20px 0 0 0; 
		display:block; 
		position:relative;
		background-color:rgba(0,0,0,0.03);
		border-bottom:rgba(0,0,0,0.03) 1px solid;

		background-repeat: no-repeat;
		background-position: 50% 50%;

		-webkit-background-size: cover;
		   -moz-background-size: cover;
			 -o-background-size: cover;
				background-size: cover;
	}
	body.grey section.page-title {
		background-color:#ddd;
	}
	section.page-title header {
		margin:0;
	}
	section.page-title h1 {
		font-size: 2.2em;
		line-height: 42px;
	}

	section.page-title ul.breadcrumb {
		display:block;
	}
	section.page-title h2 {
		margin:0 0 -1px 0;
		padding-bottom:15px;
		border-bottom:rgba(0,0,0,0.07) 1px solid;
		display:inline-block;
	}

	ul.has-icons>li>i {
		margin-right:6px;
		min-width:15px;
	}
.callout  ul.list-icon li:before {
	font-size:20px;
}

section.brands {
	padding:30px 0;
}

.dropdown-menu .label {
	color:#fff !important;
	margin-top:-2px;
}

/* alert - callout */
.alert-default h4 {
	margin-bottom:3px;
}
.alert-default p:last-child {
	margin:0;
}

/* bootstrap form icons */
.has-feedback .form-control-feedback {
	top:30px;
}

/* range picker buttons */
.range_inputs .btn {
	padding:6px;
}

/* color picker */
.colorpicker.inline:before {
	display:none;
}

/* form slider */
.slider.slider-horizontal,
.slider.slider-vertical {
	background: transparent;
}

/* sidebar */
.tab-post {
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:rgba(0,0,0,0.06) 1px solid;
}
.tab-post:last-child {
	border-bottom:0;
	margin-bottom:0;
	padding-bottom:0;
}
.tab-post .tab-post-link {
	font-size:13px;
	line-height:13px;
}
.tab-post small {
	display:block;
	font-size:10px;
}

/* sky-form */
.sky-form {
	margin-bottom:30px;
}

/* parallax */
.parallax {
	padding:60px 0;
	position:relative;
	background-color:rgba(0,0,0,0.8);
}
.parallax-overlay {
	position:absolute;
	left:0; right:0; top:0; bottom:0;
	background-image:url('../images/parallax_overlay.png');
	background-repeat:repeat;
	background-color:rgba(0,0,0,0.6);
	z-index:1;
}
.parallax .parallax-content {
	z-index:2;
}
@media only screen and (max-width: 1024px) {
	.parallax {
		background-attachment: scroll !important;
		background-position: center !important;
		background-size: 1024px 100% !important;
	}
}

/* footable */
.footable {
	-webkit-border-radius: 2px;
	   -moz-border-radius: 2px;
			border-radius: 2px;
}
.footable > thead > tr > th, .footable > thead > tr > td {
	background-image:none;
	background-color: rgba(0,0,0,0.03) !important;
}

/* search page */
form.search-big {
	margin-bottom:30px;
	margin-top:-30px;
	display:block;
}
form.search-big input {
	height:46px;
	border-width:1px;
	border: #c6c6c6 1px solid;
}
div.search-result {
	padding:20px 0;
	border-bottom:#eee 1px solid;
}
div.search-result h4 {
	margin:0;
	line-height:20px;
	font-weight:400;
}
div.search-result p {
	margin:0; padding:0;
}
div.search-result img {
	float:left; 
	margin-right:10px;
	margin-top:6px;
}
.search-title-aside {
	margin-top:20px;
	font-size:17px;
	line-height: 20px;
	color:#888;
	font-weight:400;
}
ul.search-history {
	border-bottom:#eee 1px solid;
	margin-bottom:0;
	padding-bottom:6px;
}


/* user profile */
.buttons-over-image {
	position:absolute;
	left:23px; top:8px;
}





/**	06. Maps
 *************************************************** **/
/* vectorial map */
#world-map {
	background-color:rgba(0,0,0,0.06);
	padding:0 3px 3px 0;
}

.jvectormap-zoomin, .jvectormap-zoomout {
	background: #333;
	width: 20px; height: 20px;
	padding: 4px 0;

	-webkit-border-radius: 50%;
	   -moz-border-radius: 50%;
			border-radius: 50%;
}

.jvectormap-zoomout {
	top: 40px;
}

/* gmaps.js */
#map, #panorama {
	height: 300px;
}




/**	07. Maintenance
 *************************************************** **/
.maintenance {
	padding: 20px;
	margin-top: 10%;
	background-color: rgba(0,0,0,0.05);
	font-family:'Open Sans';
	font-size:14px; 
	line-height:23px;
	text-align: center;
	font-weight:300;
}
.maintenance h1 {
	font-size:50px;
	line-height:50px;
	font-weight:300;
	margin-bottom:6px;
}
@media only screen and (max-width: 480px) {
	.maintenance h1 {
		font-size:40px;
		line-height:40px;
	}
}




/**	08. Error 404
 *************************************************** **/
.default-404 {
	font-size:170px;
	line-height:170px;
	color:rgba(0,0,0,0.3);
	text-align:center;
	display:block;
	margin-bottom:30px;
}

@media only screen and (max-width: 600px) {
	.default-e404 p {
		margin-bottom:60px;
	}
	.default-404 {
		display:none;
	}
}




/**	09. Coming Soon
 *************************************************** **/
.comingsoon {
	padding: 20px;
	margin-top: 10%;
	background-color: rgba(0,0,0,0.05);
	font-family:'Open Sans';
	font-size:14px; 
	line-height:23px;
	text-align: center;
	font-weight:300;
	color:#000;
}
.comingsoon hr {
	border:0;
	border-bottom:rgba(0,0,0,0.1) 2px solid;
}
.comingsoon h1 {
	font-size:50px;
	line-height:50px;
	font-weight:300;
	margin-bottom:6px;
}

.comingsoon span.countdown_amount {
	font-size: 50px !important;
	padding: 15px;
}
.comingsoon span.countdown_section {
	color: #fff;
	padding: 30px 45px;
	margin-bottom: 2px;
	background: rgba(0,0,0,0.05);
	text-align: center;
}
.comingsoon span.countdown_row span { 
	font-size: 16px;
	line-height: 19px;
	margin-right: 1px;
	text-align: center;
	display: inline-block;
}
.comingsoon .form-control {
	height:38px;
	border:0;

	-webkit-border-radius:0;
	   -moz-border-radius:0;
			border-radius:0;
}

@media only screen and (max-width: 960px) {
	.comingsoon span.countdown_amount {
		font-size:50px !important;
		padding:6px;
	}
	.comingsoon span.countdown_section {
		padding:20px;
	}
	.comingsoon span.countdown_row span {
		font-size:14px;
	}
}
@media only screen and (max-width: 550px) {
	.comingsoon h1 {
		font-size:40px;
		line-height:40px;
	}

	.comingsoon span.countdown_amount {
		font-size:20px !important;
		padding:6px;
	}
	.comingsoon span.countdown_section {
		font-size:12px;
		padding:10px;
	}
	.comingsoon span.countdown_row span {
		font-size:11px;
	}
}




/** 10. Word Rotator
 **************************************************************** **/
.word-rotator {
	visibility: hidden;
	width: 100px;
	height: 0;
	margin-bottom:-11px;
	display: inline-block;
	overflow: hidden;
	text-align: left;
	position: relative;
}
	h2 .word-rotator {
		bottom:2px;
		height: 42px !important;
	}
	h3 .word-rotator {
		bottom:9px;
		height: 24px !important;
	}
	h4 .word-rotator {
		bottom:5px;
		height: 27px !important;
	}
	h5 .word-rotator {
		bottom:7px;
		height: 18px !important;
	}
	p .word-rotator {
		bottom:5px;
	}
	p.lead .word-rotator {
		bottom:4px;
	}
.word-rotator.active {
	visibility: visible;
	width: auto;
}
.word-rotator .items {
	position: relative;
	width: 100%;
}
.word-rotator .items span {
	display:block;
	margin-bottom:0;
}




/** 11. Item Box
 **************************************************************** **/
.item-box {
	background:#f6f6f6;
	overflow:hidden;
	margin:16px 0;
	position:relative;
	display:inline-block;

	-webkit-border-radius:0;
	   -moz-border-radius:0;
			border-radius:0;
}
	.item-box.fullwidth {
		max-width:100%;
	}
	section.alternate .item-box {
		background-color:#fff;
	}


.item-box figure {
	width:100%;
	display:block;
	margin-bottom:0;
	overflow:hidden;
	position:relative;
	text-align:center;
}
	.item-box.fixed-box figure img {
		width:100%;
		height:auto;
	}
.item-box-desc {
	padding:10px 20px;
	overflow:hidden;
}
.item-box-desc p {
	margin-top:20px;
	display:block;
	overflow:hidden; 
	text-overflow:ellipsis;
	/*white-space: nowrap;*/
}
	.item-box.fixed-box .item-box-desc p {
		height:98px;
	}
.item-box-desc h4 {
	padding:0; margin:0;
}
.item-box .item-box-desc small {
	display:block;
}

.item-box.fixed-box .item-box-desc {
	height:256px;
}

.item-box.fixed-box figure {
	max-height:263px;
}
.item-box .socials {
	border-top:#eee 1px solid;
	text-align:center;
	display:block;
}


/* hover */
.item-box .item-hover {
	opacity: 0;
	filter: alpha(opacity=0);
	position:absolute;
	left:0; right:0; top:0; bottom:0;
	text-align:center;
	color:#fff;

	-webkit-transition: all 0.2s;
	   -moz-transition: all 0.2s;
		 -o-transition: all 0.2s;
			transition: all 0.2s;
}
.item-box .item-hover,
.item-box .item-hover button,
.item-box .item-hover a {
	color:#fff;
}
.item-box .item-hover .inner {
	position:absolute;
	display:block;
	left:0; right:0; top:50%;
	margin-top:-10px;
	z-index:100;
}
.item-box:hover .item-hover {
	opacity: 1;
	filter: alpha(opacity=100);
}

.nav-pills>li.active>a, 
.nav-pills>li.active>a:hover, 
.nav-pills>li.active>a:focus {
	color:#333;
	background-color:rgba(0,0,0,0.07);
}
.item-box .item-hover .overlay {
	background-color:rgba(127,127,127,0.6);
}



/** Box Content **/
.box-content.thumbnail {
	position:relative;
	max-width:255px;
	display:inline-block;
	margin-bottom:30px;
	border:0; padding:0;
	background:rgba(0,0,0,0.03);
}
.box-content.thumbnail:hover {
	background:rgba(0,0,0,0.08);
	border:0 !important;
}
.box-content.thumbnail .item-image {
	position:relative;
	display:inline-block;
	overflow:hidden;
}
.box-content.thumbnail  h3 {
	position:absolute;
	bottom:10px; left:0;
	text-align:left;
	font-size:18px;
	line-height:18px;
	color:#fff;
}
	.box-content.thumbnail img {
		width:100%; /* IE fix */
	}
.box-content.thumbnail  h3 span {
	display:inline-block;
	background-color:rgba(0,0,0,0.8);
	padding:10px 10px 20px 10px;
}
.box-content.thumbnail  h3 small {
	display:inline-block; color:#333;
	background:rgba(255,255,255,0.9);
	padding:3px; margin-top:-10px;
	position:absolute; bottom:-10px; left:10px;
}
.box-content.thumbnail p {
	font-size:12px;
	line-height:16px;
	text-align:left;
	height:80px;
	overflow:hidden; 
	text-overflow:ellipsis;
	border-bottom:#eee 1px solid;
	padding-bottom:10px;
	margin-bottom:6px;
}
@media only screen and (max-width: 480px) {
	.box-content.thumbnail  h3 {
		font-size:15px;
		line-height:15px;
	}
}

.box-content .item-image>img {
	-webkit-transition: all .2s ease 0s;
	   -moz-transition: all .2s ease 0s;
		 -o-transition: all .2s ease 0s;
			transition: all .2s ease 0s;
}

.box-content .item-image:hover>img {
	-webkit-transform: scale(1.1, 1.1);
	-moz-transform: scale(1.1, 1.1);
	-ms-transform: scale(1.1, 1.1);
	-o-transform: scale(1.1, 1.1);
	transform: scale(1.1, 1.1);
}




/** 2. NUEVA CLASE DEFINITIVA: .box-personal (Ancho libre de herencias) **/

/* Se comporta como .objetives: ocupa todo el ancho y se alinea perfectamente */
.box-content.box-personal {
    display: block;
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px; /* Separación respecto al siguiente recuadro de la lista */
    position: relative;
    background: rgba(0,0,0,0.03); /* Mantenemos el fondo gris original */
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}

/* Mantenemos el efecto hover de fondo oscuro al pasar el ratón */
.box-content.box-personal:hover {
    background: rgba(0,0,0,0.08);
}

/* Reducimos el padding interno alrededor de la foto y el texto */
.box-personal .caption {
    padding: 8px; 
}

/* Contenedor flexible principal (Foto izquierda, Texto derecha) */
.box-personal .row-flex {
    display: flex; 
    align-items: center; 
    flex-wrap: wrap;
    width: 100%;
}

/* Contenedor de la foto */
.box-personal .col-photo {
    margin-bottom: 5px;
    padding-right: 5px; 
}

/* Imagen de la ficha */
.box-personal .personal-img {
    display: inline-block; 
    margin-bottom: 0; 
    max-width: 120px; 
    height: 165px; 
    object-fit: cover; 
    border-radius: 4px;
}

/* --- ESTRUCTURA DE TEXTO Y COLORES CORPORATIVOS --- */

/* Línea 1: Nombre */
.box-personal .team-name {
    margin-top: 0;
}
.box-personal .team-name a {
    color: #00aec7; /* Tu color corporativo exacto */
    text-decoration: none;    
    font-size: 21px !important; /* <--- ¡AQUÍ CONTROLAS EL TAMAÑO! Puedes subirlo o bajarlo a tu gusto */
    font-weight: 600;           /* Le da un toque sutil de grosor sin llegar a ser una negrita tosca */
}
.box-personal .team-name a:hover {
    text-decoration: underline; 
}

/* Línea 2: El cargo en gris oscuro */
.box-personal .personal-title {
    display: block;
    margin-top: 5px; 
    margin-bottom: 5px;
    font-weight: bold; 
    color: #333;
    font-size: 18px !important; /* <--- ¡AQUÍ CONTROLAS EL TAMAÑO! Pon 15px o 16px según veas */
}

/* Línea 3: Fila para Email + Teléfono (Ajustamos el tamaño de letra) */
.box-personal .contact-row {
    display: block;
    margin-top: 10px;        /* Le damos un poco de separación con el cargo de arriba */
    margin-bottom: 4px;
    font-size: 18px !important; /* <--- ¡AQUÍ CONTROLAS EL TAMAÑO! Pon 15px o 16px según veas */
}

/* Separación horizontal entre email y teléfono */
.box-personal .contact-inline-item {
    display: inline-block;
    margin-right: 20px; 
}

/* Enlace del Email */
.box-personal .team-mail {
    color: #00aec7 !important; 
    text-decoration: none;   
    font-weight: normal;        /* Nos aseguramos de que no se quede con el grosor del nombre */
}
.box-personal .team-mail:hover {
    text-decoration: underline;
}

/* Línea 4: Oficina (Ajustamos el tamaño de letra igual que la anterior) */
.box-personal .office-row {
    display: block;
    font-size: 18px !important; /* <--- Pon el mismo tamaño que arriba para que vayan a juego */
}

/* Estilos de color para etiquetas fijas y valores */
.box-personal .contact-label {
    color: #666;
}
/* Forzamos a que los números de teléfono y despachos sean texto neutro e informático */
.box-personal .contact-value {
    color: #333333 !important; /* Un gris muy oscuro, casi negro. Si prefieres negro puro usa #000000 */
    font-weight: normal;       /* Nos aseguramos de que no herede negritas innecesarias */
}



/** 12. Timeline
 **************************************************************** **/
.timeline {
	position:relative;
	margin-bottom:60px;
}


/* left */
.timeline .timeline-left .item {
	background-color: rgba(0,0,0,0.06);
	border-right:rgba(0,0,0,0.06) 3px solid;
	padding:15px;
	margin-left:50px;
	margin-bottom:30px;
	position:relative;
}
.timeline .timeline-left .item:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-right-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; left:-20px;
}
.timeline .timeline-left .item:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; left:-50px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline-left:after {
	background: #ddd;
	z-index:0;

	content: "";
	display: block;
	left: 10px; top:0; bottom:0;
	position: absolute;
	width: 4px;
	opacity: 0.35;
}
.timeline  .timeline-left .timeline-centered-title {
	float:right;
	content:' ';
	clear:both;
	font-size:19px;
}

/* right */
.timeline .timeline-right .item {
	background-color: rgba(0,0,0,0.06);
	border-left:rgba(0,0,0,0.06) 3px solid;
	padding:15px;
	margin-right:50px;
	margin-bottom:30px;
	position:relative;
}
.timeline .timeline-right .item:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-left-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; right:-20px;
}
.timeline .timeline-right .item:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; right:-50px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline-right:after {
	background: #ddd;
	z-index:0;

	content: "";
	display: block;
	right: 10px; top:0; bottom:0;
	position: absolute;
	width: 4px;
	opacity: 0.35;
}
.timeline .timeline-right .item h4 {
	text-align:right;
}
.timeline .timeline-right .timeline-centered-title {
	float:left;
	content:' ';
	clear:both;
	font-size:19px;
}

/** centered **/
.timeline .timeline-centered .item {
	background-color: rgba(0,0,0,0.06);
	padding:15px;
	margin-bottom:30px;
	position:relative;
	margin-top:100px;
}
.timeline .timeline-centered .item:first-child {
	margin-top:0;
}
.timeline-centered:after {
	background: #ddd;
	z-index:0;

	content: "";
	display: block;
	top:0; bottom:0;
	position: absolute;
	width: 4px;
	opacity: 0.35;

	left: 50%;
	margin-left: 0;
	height:100%;
}
.timeline-centered .item {
	max-width:46%;

}
.timeline .timeline-centered .item.pull-right:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-right-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; left:-20px;
}
.timeline .timeline-centered .item.pull-right:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; left:-43px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline .timeline-centered .item.pull-left:after {
	right: 100%;
	border: solid transparent;
	content: " ";
	width: 0; height: 0;
	position: absolute;
	border-left-color: rgba(0,0,0,0.06);
	border-width: 10px;
	top: 10px; right:-20px;
}
.timeline .timeline-centered .item.pull-left:before {
	right: 100%;
	border: #ddd 5px solid;
	content: " ";
	position: absolute;
	top: 10px; right:-46px;
	background-color:#333;
	width:22px; height:22px;
	z-index:1;

}
.timeline .timeline-centered .item.pull-left h4 {
	text-align:right;
}
.timeline .timeline-centered .item.pull-right .timeline-centered-title {
	float:right;
	content:' ';
	clear:both;
	font-size:19px;
}
.timeline .timeline-centered .item.pull-left .timeline-centered-title {
	float:left;
	content:' ';
	clear:both;
	font-size:19px;
}

.timeline  .timeline-centered p {
	content:'';
	clear:both;	
}

@media only screen and (max-width: 768px) {
	.timeline-centered .item {
		width:100% !important;
		max-width:100% !important;
		margin:0 0 30px 0 !important;
	}
	.timeline .timeline-centered .item.pull-left,
	.timeline .timeline-centered .item.pull-right {
		float:none !important;
		display:block !important;
		position:relative !important;
	}
	.timeline .timeline-centered .item.pull-left h4 {
		text-align:left;
	}
	.timeline .timeline-centered .item.pull-right:after,
	.timeline .timeline-centered .item.pull-right:before,
	.timeline .timeline-centered .item.pull-left:after,
	.timeline .timeline-centered .item.pull-left:before,
	.timeline-centered:after {
		display:none;
	}
}



/** 13. Portfolio
 **************************************************************** **/
/* item list */
#portfolio .item-box-desc h4 {
	font-size:17px;
	max-height:32px;
	overflow:hidden;
}
	#portfolio .item-box figure img {
		width:100%;
		margin:auto;
	}

#portfolio .item-box-desc small {
	font-size:12px;
	margin-bottom:0;
}

#portfolio .item-box a {
	text-decoration:none;
}

/* Full Width */
#portfolio ul.fullwidth .isotope-item,
#portfolio ul.fullwidth .item-box {
	margin:0;
}
#portfolio ul.fullwidth .item-box .overlay,
#portfolio ul.fullwidth .item-box {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;
}
#portfolio ul.fullwidth .isotope-item {
	width:20%; /* 5 items / row - also, see responsive*/
	float:left;
}

#portfolio .project_quick_info span {
	padding:0 8px;
}
#portfolio .project_quick_info i.fa {
	padding-right:6px;
}


/* Full Center */
#portfolio ul.fullcenter {
	margin-left:15px;
	margin-right:15px;
}
#portfolio ul.fullcenter .isotope-item,
#portfolio ul.fullcenter .item-box {
	margin:0;
}
#portfolio ul.fullcenter .item-box .overlay,
#portfolio ul.fullcenter .item-box {
	-webkit-border-radius: 0;
	   -moz-border-radius: 0;
			border-radius: 0;
}
#portfolio ul.fullcenter .isotope-item {
	width:25%; /* 4 items / row - also, see responsive*/
	float:left;
}

@media only screen and (max-width: 960px) {
	#portfolio ul.fullwidth .isotope-item,
	#portfolio ul.fullcenter .isotope-item {
		width:33.333333333%;  /* 3 items / row */
	}
}
@media only screen and (max-width: 768px) {

}
@media only screen and (max-width: 479px) {
	#portfolio ul.fullwidth .isotope-item,
	#portfolio ul.fullcenter .isotope-item {
		width:100%;  /* 1 item / row */
	}
}




/** 14. Contact
 **************************************************************** **/
#gmap {
	width:100%;
	height:400px;
	display:block;

	z-index:1;
}
#gmap.gmap-half {
	height:250px;
}
#gmap.grayscale {
	-webkit-filter: grayscale(100%);
	   -moz-filter: grayscale(100%);
		-ms-filter: grayscale(100%);
		-o-filter: grayscale(100%);
		   filter: grayscale(100%);
		   filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
		   filter: gray; 
}



/** 15. Onepage
 **************************************************************** **/
.divider.onepage {
	max-width:300px;
}
.divider.onepage.center {
	margin: 60px auto;
}
.divider.half-margins.onepage.center {
	margin: 30px auto;
}
h1.font-dosis,
h2.font-dosis,
h3.font-dosis,
h4.font-dosis,
h5.font-dosis,
h6.font-dosis {
	font-family:'Dosis';
}

form.onepage input[type="text"], 
form.onepage input[type="password"], 
form.onepage input[type="email"], 
form.onepage input[type="phone"], 
form.onepage textarea, 
form.onepage textarea:focus, 
form.onepage select, 
form.onepage select:focus {
	border: #ddd 1px solid;
	margin: 0 !important;
	padding: 16px;
	font-size: 16px;
	box-shadow: none !important;
	background: #fff;
}
form.onepage .row div {
	padding-top: 4px;
	padding-right: 2px;
	padding-left: 2px;
}
form {
	padding-left:15px;
	padding-right:15px;
}
.onepage-slider-offset {
	padding-top:60px;
}
body.boxed .onepage-slider-offset {
	padding-top:30px;
}







/**	16. User Profile
 *************************************************** **/
.profile-buttons {
	background-color:rgba(0,0,0,0.05);
	padding:15px;
}
.profile-buttons h2 {
	margin:0; padding:0;
	font-size:30px;
	line-height:30px;
}
.profile-btn-link {
	padding:4px 10px !important;
	margin:0 !important;
	color:#999;
}
.profile-activity h6 {
	margin-bottom:6px;
	padding-left:15px;
	font-weight:bold;
}
.profile-activity p {
	font-size:13px;
	padding-left:15px;
}

.profile-tabs {
	border-top:rgba(0,0,0,0.1) 1px solid;
	padding-top:30px;
	margin-top:-1px;
}


time.datebox {
	font-size: 14px;
	display: block;
	position: relative;
	width: 35px;
	background-color: #fff;
	margin: 3px auto;
	border:1px solid;
}
time.datebox strong {
	padding: 2px 0;
	color: #fff;
	background-color:rgba(0,0,0,0.7);
	display:block;
	text-align:center;
}
time.datebox span {
	font-size: 15px;
	color: #2f2f2f;
	display:block;
	text-align:center;
}




/** 17. Comments
 *************************************************** **/
#comments {
	margin-top:60px;
}
#comments .comment {
	margin:40px 0;
}
#comments a.replyBtn {
	float:right;
	font-size:11px;
	text-transform:uppercase;
}
#comments span.user-avatar {
	background:#eee;
	width:64px; height:64px;
	float:left;
	margin-right:10px;
}

ul.comment {
	margin-bottom:30px;
}
li.comment {
	position:relative;
	margin-bottom:25px;
	font-size:13px;
}
li.comment p {
	margin:0; padding:0;
}
li.comment img.avatar {
	position:absolute;
	left:0; top:0;
	display:inline-block;
}
li.comment.comment-reply img.avatar {
	left:6px; top:6px;
}
li.comment .comment-body {
	position:relative;
	padding-left:60px;
}
li.comment.comment-reply {
	margin-left:60px;
	background-color:#fafafa;
	padding:6px;
	margin-bottom:6px;
}
li.comment a.comment-author {
	margin-bottom:6px;
	display:block;
}
li.comment a.comment-author span {
	font-size:15px;
}




/** 18. Responsive
 **************************************************************** **/
@media only screen and (max-width: 1216px) {
	.container {
		width:100%;
	}
}

@media only screen and (max-width: 990px) {
}

@media only screen and (max-width: 768px) {
	#header.sticky #topNav {
		max-height: 300px;
		overflow-y: auto;
		width:100%;
	}
}

@media only screen and (max-width: 480px) {
	.alert-default div.text-right {
		text-align:left;
	}
	.alert-default .btn {
		margin-top:20px;
	}

	/* centered page-title */
	section.page-title h2,
	section.page-title h2 span,
	section.page-title {
		text-align:center;
	}
}




/** --. DEMO ONLY
 **************************************************************** **/
/** feature-icons.html - icon text color - can be removed on production **/
.fa-hover a {
	display:block;
	padding:4px;
	text-decoration:none;
}
.fa-hover a:hover {
	background-color:#f3f3f3;
}
.fa-hover i {
	width:20px;
	margin-right:10px;
}
.fa-hover a span { 
	color:#666;
}
/** *** **/



.bs-glyphicons .glyphicon-class {
	display: block;
	text-align: center;
	word-wrap: break-word;
}
.bs-glyphicons .glyphicon {
	margin-top: 5px;
	margin-bottom: 10px;
	font-size: 24px;
}
.bs-glyphicons li {
	float: left;
	width: 25%;
	height: 115px;
	padding: 10px;
	font-size: 10px;
	line-height: 1.4;
	text-align: center;
	border: 1px solid #fff;
	background-color: #f9f9f9;
	cursor:pointer;
}
.bs-glyphicons li:hover {
	background-color:#f3f3f3;
}
@media (min-width: 768px) {
	.bs-glyphicons li {
		width: 12.5%;
		font-size: 12px;
	}
}

.iconExamples .example {
	text-align: center;
	cursor:pointer;
	padding:6px 3px;
}
.iconExamples .example:hover {
	background-color:#f3f3f3;
}
.iconExamples .example:before, 
.iconExamples .example:after {
	content: " ";
	display: table;
}
.iconExamples .example .icon {
	font-size: 20px;
	float: left;
	width: 35px;
}
.iconExamples .example .class {
	text-align: center;
	font-size: 13px;
	float: left;
	margin-top: 0;
	font-weight: 400;
	margin-left: 10px;
	color: #333;
}



/** *** **/
.grid-color span {
	display:block;
	padding: 10px 0;
	text-align: center;
	background-color:rgba(0,0,0,0.1);
}
.grid-demo [class*="col-"] {
	background: #fafafa;
	border: 1px solid;
	border-color: #ddd;
	padding: 10px;
	text-align: center;
	margin-bottom:20px;
}
.grid-demo .row {
	margin-left:0;
	margin-right:0;
}

/** *** **/
.linecon .icon {
	width: 12.5%;
	float: left;
	height: 115px;
	text-align: center;
	padding: 22px 10px;
	margin: 0 -1px -1px 0;
	border: 1px solid #fff;
	background-color: #f6f6f6;
	word-wrap: break-word;
	cursor:pointer;
}
.linecon .icon:hover {
	background-color:#f3f3f3;
}
.linecon .icon i {
	display: block;
	font-size: 30px;
	margin-bottom: 10px;
}





/* --- Contenedor del Buscador Ultra-Inmune --- */
#publicaciones {
    margin: 0;
}

.search-flex-container {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 12px !important; /* Espacio exacto entre campos */
    width: 100% !important;
}

/* Si Struts mete divs o celdas fantasma, los obligamos a ser elementos en línea */
.search-flex-container > * {
    display: inline-block !important;
    vertical-align: middle !important;
}

.search-flex-container label {
    margin: 0 !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

/* Control estricto de inputs */
.search-flex-container .form-control {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
}

.search-flex-container .w-year {
    width: 85px !important;
}

.search-flex-container .w-select {
    width: 200px !important;
}

/* --- TUS NUEVAS REGLAS MODIFICADAS --- */

/* Forzamos al nuevo select a medir más que el estándar de 200px */
.search-flex-container .w-select-lg {
    width: 320px !important; /* Ajusta los píxeles a tu gusto */
}

/* Forzamos al div divisor a romper el inline-block anterior */
.search-flex-container > .flex-break {
    display: block !important; 
    flex-basis: 100% !important;
    width: 100% !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Opcional: Para que el input de buscar texto se extienda y ocupe el espacio restante */
.search-flex-container .w-search-text {
    width: 350px !important; /* O el tamaño fijo que desees */
}

















/* Texto de resultados (en proyectos) */
.search-results-text {
    margin-bottom: 10px;
    font-size: 0.9em;
    color: #555;
}

/* --- Estilos de las Tarjetas de Lista (Común) --- */
.list-item-box {
    margin-bottom: 10px;
}

/* Línea 1: Autores / Referencias */
.item-top-line {
    margin: 0 0 2px;
    font-size: 0.85em;
    color: #888;
}

/* Línea 2: Títulos */
.item-title-line {
    margin: 0 0 2px;
}

/* Línea 3: Metadatos de Publicación / Investigadores principales */
.item-bottom-line {
    margin: 0;
    font-size: 0.85em;
    color: #888;
}


/* Estilos para la tabla de ficha de datos */
.tb_ficha {
    border-collapse: collapse;
    border: 0;
    margin-bottom: 20px;
    width: 100%;
}

/* Columna izquierda: Nombres de los ítems */
.tb_ficha td.pub_left, 
.tb_ficha td.epigrafe {
    width: 180px;         /* Ancho fijo para que no se pisen */
    min-width: 150px;     /* Evita que se encoja demasiado en móviles */
    padding: 6px 15px 6px 8px; /* El 15px de la derecha da el espacio de separación */
    vertical-align: top;  /* Alinea el texto arriba si el valor de la derecha ocupa varias líneas */
}

/* Columna derecha: Los valores */
.tb_ficha td:not(.pub_left):not(.epigrafe) {
    padding: 6px 8px;
    vertical-align: top;
}

/* Resumen de la publicación */
.pub_resume {
    text-align: justify;
    margin-top: 20px;
}

/* Separador decorativo */
.pub_separator {
    margin-top: 30px;
    margin-bottom: 25px;
    border: 0;
    border-top: 1px solid #ccc;
}

/* Ajustes para el botón Volver */
.btn_back {
    display: inline-block;
    margin-bottom: 30px;
}