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

body {
	font-family: 'Open sans', 'arial', sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: #ccc;
	line-height: 1.5;
	background-color: #ddd;
}

a {
	text-decoration: none;
	color: inherit;
}

h1,h2,h3,h4,h5,h6 {
	font-family: Panton Light italic Caps;
	margin-bottom: 12px;
	letter-spacing: 3px;
	color: #fff;
}

h1 strong {
	font-family: Panton Black italic Caps;
}

h1 {font-size: 22px;}
h2 {font-size: 18px;}
h3 {font-size: 16px;}
h4 {font-size: 14px;}
h5 {font-size: 12px;}
h6 {font-size: 12px;}

/*******************************************************************************
Sidebar */

/*Sidebar nav */

	.sidebar-nav {
	color: white;
	text-align: right;
	}

	.sidebar-nav .menu {
	line-height: 2;
	}

	.sidebar-nav .sub-menu {
	display: none;
	}

	.sidebar-nav .menu > .menu-item > a {
	font-family: Panton Light italic Caps;
	font-size: 16px;
	}

	.sidebar-nav .menu-item-has-children > a:after {
	content: "\f055";
	font-family: fontawesome;
	font-size: 14px;
	margin-left: 8px;
	}
	
	.sidebar-nav .menu-item-has-children > a.active:after {
	content: "\f056";
	}

	.sidebar-nav .menu > .menu-item > .sub-menu {
	margin: 20px 0 20px 20px;
	}

		.sidebar-nav .menu > .menu-item > .sub-menu > .menu-item {
		margin: 10px 0;
		}

			.sidebar-nav .menu > .menu-item > .sub-menu > .menu-item > a {
			font-size: 13px;
			font-weight: 100;
			text-transform: uppercase;
			}


				.sidebar-nav .menu > .menu-item > .sub-menu > .menu-item > .sub-menu {
				margin: 0px 0px 22px 12px;
				}


/*******************************************************************************
Header & footer */


	header, footer {
	position: absolute;
	left: 0;
	width: 100%;
	height: 110px;
	box-sizing: border-box;
	padding: 30px 60px 30px 60px;
	}

/*******************************************************************************
Header */

	header {
	top: 0;
	}

		header .logo {
		width: 50%;
		height: 100%;
		float: left;
		}


		header #logo-swarz {
		text-align: right;
		}

			header .logo img {
			height: 100%;
			width: auto;
			max-width: 220px;
			}

			#logo-swarz img {
			opacity: .25;
			}

/*******************************************************************************
Footer */

	footer {
	bottom: 0;
	}

	footer nav {
		height: 28px;
	}

	footer nav .menu,
	footer nav .icon {
		display: inline-block;
	}

	footer nav .menu {	
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	width: calc(100% - 90px);		
	display: inline-flex;
	justify-content: space-between;
	}

		footer nav .menu,
		footer nav .menu .menu-item,
		footer .menu .menu-item > a {
		height: 100%;
		}

	footer nav .menu .menu-item {
	font-family: Panton Light italic Caps;
	display: inline-block;
	}


		footer nav .menu .menu-item a:after {
		width: 100%;
		height: 1px;
		border: 0;
		}

		footer nav .menu .menu-item a.active:after {
		background: #fff;
		border: 0;
		height: 3px;
		}

	footer nav .icon {
	width: 30px;
	text-align: center;
	height: 100%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	}



/*******************************************************************************
Main */

	main {
	height: calc(100% - 240px) !important;
	top: 110px;
	}

	/*******************************************************************************
	Page */

			.page-container {
			display: flex;
			flex-direction: column;
			justify-content: center;
			height: 100%;
			}

	/*******************************************************************************
	Page Sellos de seguridad */

		/*Nav*/

			.page-nav .menu-item {
			display: none;
			}


			#page-menu {
			position: relative;	
			top: 35%;
			left: 100px;
			}

				#page-menu .menu-item {
				background-color: lightgray;
				border-radius: 100px;
				padding: 10px 22px;
				font-size: 13px;
				
				position: absolute;
				}

					#page-nav-top .menu-item:nth-child(2),
					#page-nav-bottom .menu-item:nth-child(3),
					#page-nav-bottom .menu-item:nth-child(4) {		
					display: table !important;
					color: #fff;
					}

					#page-nav-top .menu-item:nth-child(2) {right: 40%; }
					#page-nav-bottom .menu-item:nth-child(3) {right: 20%; }
					#page-nav-bottom .menu-item:nth-child(4) {right: 60%; top: 60px; }

				#page-menu .menu-item[title="sellos de seguridad"] {
				background-color: #549ee5;
				}

				#page-menu .menu-item[title="etiquetas y cintas de seguridad"] {
				background-color: #22f3b1;
				}

				#page-menu .menu-item[title="bolsas"] {
				background-color: #ffc600;
				}

					#page-menu .menu-item a {
					position: relative;	
					}

					#page-menu .menu-item a:after {
					background: #fff;
					width: 60px;
					height: 1px;
					border: 0;
					position: absolute;
					left: -100px !important;
					top: 50%;
					left: initial;
					}


/*******************************************************************************
Cols */


	.col {
		flex: 1;
	}

	.cols {
		display: flex;
		align-items: center;
		justify-content: center;
			}

			.col-container {
			height: inherit;
			box-sizing: border-box;
			padding: 22px;
			}


		.content-page .cols, 
		.content-page .col {
			height: 100%;
		}

		.content-page .col-left {background: #6c9f31; }

		.content-page .col-right {background: rgba(19, 19, 19, 0.67); }

		.content-page .col .col-container {
			height: inherit;
			display: flex;
			flex-direction: column;
			justify-content: center;
		}

		.content-page .col-right .col-container {
			align-items: center;
		}

		.content-page .col-left .col-container {
			align-items: flex-end;
		}
/*******************************************************************************
Content page */

	.col-header {
	width: 100%;
	text-align: center;
	}

		.col-header .attachment-thumbnail {
		border-radius: 190px;
		margin-bottom: 32px;
		}

		.col-header h1 {
		font-size: 30px;
		width: 100%;
		}


/*******************************************************************************
Slider */

		.slider {
		width: 80%;
		height: 500px;
		margin: auto;
		}

		.slider-cell {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: space-around;
		}
		.slider-cell * {
		-webkit-transition-delay: .75s !important;
		transition-delay: .75s !important;
		-webkit-transition: all .5s linear;
		transition: all .5s linear;
		opacity: 0;
		}

		.slider-cell.is-selected * {
		opacity: 1;
		}

		.slider-cell-image {
		-webkit-transition-delay: .75s !important;
		transition-delay: .75s !important;
		-webkit-transition: all .5s linear;
		transition: all .5s linear;
		opacity: 0 !important;
		}

			/* fade in lazy loaded image */
			.slider-cell-image.flickity-lazyloaded,
			.slider-cell-image.flickity-lazyerror {
			opacity: 1 !important;
			}