@charset "utf-8";
/*
Template Name: Brickary
Author: <a href="http://www.os-templates.com/">OS Templates</a>
Author URI: http://www.os-templates.com/
Licence: Free to use under our free template licence terms
Licence URI: http://www.os-templates.com/template-terms
File: Layout CSS
*/

@import url("fontawesome-4.6.3.min.css");
@import url("custom.flexslider.css?v=2");
@import url("frameworkV2.css?v=2");
@import url(../styles/bootstrap.min.css);
@import url(../styles/classy-nav.min.css);
/* Rows
--------------------------------------------------------------------------------------------------------------- */

@font-face {
	font-family: 'Nasalization';
	src: url('../font/nasalization-rg.otf');
}

*{
	font-family: 'Nasalization' !important;
	font-size: 15px;
}

.row0{border-bottom:1px solid;}
.row1, .row1 a{}
.row2, .row2 a{}
.row3, .row3 a{}
.row4, .row4 a{}
.row5, .row5 a{}


/* Top Bar
---------------------------------------- */
#topbar{padding:15px 0; font-size:.8rem; text-transform:uppercase;}

#topbar *{margin:0; padding:0; list-style:none;}
#topbar ul li{display:inline-block; margin-right:10px; padding-right:15px; border-right:1px solid;}
#topbar ul li:last-child{margin-right:0; padding-right:0; border-right:none;}
#topbar i{margin:0 5px 0 0; line-height:normal;}


/* Header
--------------------------------------------------------------------------------------------------------------- */
#header{}

#header #logo{margin:0px 0 0 0;}
#header #logo h1{margin:0; padding:0; font-size:22px; text-transform:uppercase;}


/* Page Intro
--------------------------------------------------------------------------------------------------------------- */
#pageintro{padding:150px 0 200px;}

#pageintro li article{display:block; max-width:75%; margin:0 auto; text-align:center;}
#pageintro li article *{margin:0;}
#pageintro li p:first-of-type{margin-bottom:10px; font-style:italic;}
#pageintro li .heading{margin-bottom:30px; font-size:3rem; word-wrap:break-word;}
#pageintro li p:nth-of-type(2){line-height:1.5rem;}
#pageintro li footer{margin-top:40px;}

#pageintro footer form{display:block; position:relative; max-width:50%; margin:0 auto; overflow:hidden;}
#pageintro footer input, #pageintro footer button{display:block; height:44px; border:none; border-radius:22px;}
#pageintro footer input{width:100%; padding:5px 40px 5px 15px;}
#pageintro footer button{position:absolute; top:1px; right:1px; width:42px; height:42px; font-size:16px; cursor:pointer; border-radius:50%;}
#pageintro footer button em{display:none;}


/* Content Area
--------------------------------------------------------------------------------------------------------------- */
.container{padding:80px 0;}

/* Content */
.container .content{}

.sectiontitle{display:block; margin-bottom:80px;}
.sectiontitle *{margin:0;}

#introblocks{position:relative; z-index:0;}
#introblocks > ul{display:block; margin:-200px 0 80px;}
#introblocks > ul > li{text-align:center;}
#introblocks > ul > li > article{display:inline-block; width:100%; max-width:320px; text-align:left;}
#introblocks > ul > li > article > div{padding:30px 20px;}
#introblocks > ul > li > article > div *{margin:0; padding:0;}
#introblocks > ul > li > article > div .heading{margin-bottom:10px; font-size:1.2rem;}
#introblocks > ul > li > article footer{border-top:1px solid;}
#introblocks > ul > li > article footer a{display:block; position:relative; width:100%; height:39px; line-height:39px; padding:0 20px; text-transform:uppercase;}
#introblocks > ul > li > article footer a::after{position:absolute; top:0; right:0; height:100%; padding:0 15px; font-family:"FontAwesome"; content:"\f105"; border-left:1px solid;}

#newsletter input, #newsletter button{border:1px solid; border-radius:22px;}
#newsletter input{display:block; width:100%; padding:8px;}
#newsletter button{padding:8px 18px 10px; border:none; text-transform:uppercase; font-weight:700; cursor:pointer;}

/* Comments */
#comments ul{margin:0 0 40px 0; padding:0; list-style:none;}
#comments li{margin:0 0 10px 0; padding:15px;}
#comments .avatar{float:right; margin:0 0 10px 10px; padding:3px; border:1px solid;}
#comments address{font-weight:bold;}
#comments time{font-size:smaller;}
#comments .comcont{display:block; margin:0; padding:0;}
#comments .comcont p{margin:10px 5px 10px 0; padding:0;}

#comments form{display:block; width:100%;}
#comments input, #comments textarea{width:100%; padding:10px; border:1px solid;}
#comments textarea{overflow:auto;}
#comments div{margin-bottom:15px;}
#comments input[type="submit"], #comments input[type="reset"]{display:inline-block; width:auto; min-width:150px; margin:0; padding:8px 5px; cursor:pointer;}

/* Sidebar */
.container .sidebar{}

.sidebar .sdb_holder{margin-bottom:50px;}
.sidebar .sdb_holder:last-child{margin-bottom:0;}


/* Footer
--------------------------------------------------------------------------------------------------------------- */
#footer{padding: 2px 0 25px 0; text-align:center;}

#footer .heading, #footer ul{margin-bottom:30px;}
#footer > ul:last-of-type{margin-bottom:0;}
#footer .faico a{border-radius:50%;}


/* Copyright
--------------------------------------------------------------------------------------------------------------- */
#copyright{padding:20px 0;}
#copyright *{margin:0; padding:0;}


/* Transition Fade
--------------------------------------------------------------------------------------------------------------- */
*, *::before, *::after{transition:all .3s ease-in-out;}
.mainav form *{transition:none !important;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Navigation
--------------------------------------------------------------------------------------------------------------- */
nav ul, nav ol{margin:0; padding:0; list-style:none;}

.mainav, #breadcrumb, .sidebar nav{line-height:normal;}
.mainav .drop::after, .mainav li li .drop::after, #breadcrumb li a::after, .sidebar nav a::after{position:absolute; font-family:"FontAwesome"; font-size:10px; line-height:10px;}

/* Top Navigation */
.mainav{}
.mainav ul{text-transform:uppercase;}
.mainav ul ul{z-index:9999; position:absolute; width:180px; text-transform:none;}
.mainav ul ul ul{left:180px; top:0;}
.mainav li{display:inline-block; position:relative; margin:0 15px 0 0; padding:0;}
.mainav li:last-child{margin-right:0;}
.mainav li li{width:100%; margin:0;}
.mainav li a{display:block; padding:30px 0;}
.mainav li li a{border:solid; border-width:0 0 1px 0;}
.mainav .drop{padding-left:15px;}
.mainav li li a, .mainav li li .drop{display:block; margin:0; padding:10px 15px;}
.mainav .drop::after, .mainav li li .drop::after{content:"\f0d7";}
.mainav .drop::after{top:35px; left:5px;}
.mainav li li .drop::after{top:15px; left:5px;}
.mainav ul ul{visibility:hidden; opacity:0;}
.mainav ul li:hover > ul{visibility:visible; opacity:1;}

.mainav form{display:none; margin:0; padding:0;}
.mainav form select, .mainav form select option{display:block; cursor:pointer; outline:none;}
.mainav form select{width:100%; padding:5px; border:1px solid;}
.mainav form select option{margin:5px; padding:0; border:none;}

/* Breadcrumb */
#breadcrumb{padding:120px 0 30px;}
#breadcrumb ul{margin:0 0 30px 0; padding:0 0 8px 0; list-style:none; text-transform:uppercase; border-bottom:1px solid;}
#breadcrumb li{display:inline-block; margin:0 6px 0 0; padding:0;}
#breadcrumb li a{display:block; position:relative; margin:0; padding:0 12px 0 0; font-size:12px;}
#breadcrumb li a::after{top:3px; right:0; content:"\f101";}
#breadcrumb li:last-child a{margin:0; padding:0;}
#breadcrumb li:last-child a::after{display:none;}
#breadcrumb .heading{margin:0; font-size:1.6rem;}

/* Sidebar Navigation */
.sidebar nav{display:block; width:100%;}
.sidebar nav li{margin:0 0 3px 0; padding:0;}
.sidebar nav a{display:block; position:relative; margin:0; padding:5px 10px 5px 15px; text-decoration:none; border:solid; border-width:0 0 1px 0;}
.sidebar nav a::after{top:9px; left:5px; content:"\f101";}
.sidebar nav ul ul a{padding-left:35px;}
.sidebar nav ul ul a::after{left:25px;}
.sidebar nav ul ul ul a{padding-left:55px;}
.sidebar nav ul ul ul a::after{left:45px;}

/* Pagination */
.pagination{display:block; width:100%; text-align:center; clear:both;}
.pagination li{display:inline-block; margin:0 2px 0 0;}
.pagination li:last-child{margin-right:0;}
.pagination a, .pagination strong{display:block; padding:8px 11px; border:1px solid; background-clip:padding-box; font-weight:normal;}

/* Back to Top */
#backtotop{ z-index:999; display:inline-block; position:fixed; visibility:hidden; bottom:20px; right:20px; width:36px; height:36px; line-height:36px; font-size:16px; text-align:center; opacity:.2; border-radius:50%; background-clip:padding-box;}
#backtotop i{display:block; width:100%; height:100%; line-height:inherit;}
#backtotop.visible{visibility:visible; opacity:.5;}
#backtotop:hover{opacity:1;}


/* Tables
--------------------------------------------------------------------------------------------------------------- */
table, th, td{border:1px solid; border-collapse:collapse; vertical-align:top;}
table, th{table-layout:auto;}
table{width:100%; margin-bottom:15px;}
th, td{padding:5px 8px;}
td{border-width:0 1px;}


/* Gallery
--------------------------------------------------------------------------------------------------------------- */
#gallery{display:block; width:100%; margin-bottom:50px;}
#gallery figure figcaption{display:block; width:100%; clear:both;}
#gallery li{margin-bottom:30px;}


/* Font Awesome Social Icons
--------------------------------------------------------------------------------------------------------------- */
.faico{margin:0; padding:0; list-style:none;}
.faico li{display:inline-block; margin:8px 5px 0 0; padding:0; line-height:normal;}
.faico li:last-child{margin-right:0;}
.faico a{display:inline-block; width:36px; height:36px; line-height:36px; font-size:18px; text-align:center; border-radius:50%; background-clip:padding-box;}

.faico a{color:#000000; background-color:#FFFFFF;}
.faico a:hover{color:#FFFFFF;}

.faicon-instagram:hover{background-color:#EA4C89;}
.faicon-facebook:hover{background-color:#3B5998;}
.faicon-google-plus:hover{background-color:#DB4A39;}
.faicon-linkedin:hover{background-color:#0E76A8;}
.faicon-twitter:hover{background-color:#00ACEE;}
.faicon-youtube:hover{background-color:red;}
.faicon-vk:hover{background-color:#4E658E;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Colours
--------------------------------------------------------------------------------------------------------------- */
body{color:#474747; background-color:#FFFFFF;}
a{color:#6677BC;}
a:active, a:focus{background:transparent;}/* IE10 + 11 Bugfix - prevents grey background */
hr, .borderedbox{border-color:#D7D7D7;}
label span{color:#FF0000; background-color:inherit;}
input:focus, textarea:focus, *:required:focus{border-color:#6677BC;}
.overlay{color:#FFFFFF; /*background-color:inherit;*/}
.overlay::after{color:inherit; background-color:rgba(0,0,0,.55);}

.btn, .btn.inverse:hover, a .icon, a.inverse:hover .icon{color:#FFFFFF; background-color:#6677BC; border-color:#6677BC;}
.btn:hover, .btn.inverse, a:hover .icon, a.inverse .icon{
	color:white; background-color:transparent !important; border-color:aliceblue;
	box-shadow: 0px 0px 30px transparent, 0px 0px 30px #6677BC;
}

.btn-cancel{
	background-color: #995f5f;
	border-color: #4e0000;
}


/* Rows */
.row0, .row0 a{color:#CBCBCB; background-color:#000000; border-color:rgba(255,255,255,.2);}
.row1{color:#FFFFFF; background-color:rgba(0,0,0);}
.row2, .row2 a{}
.row3{color:#474747; background-color:#FFFFFF;}
.row4{color:#CBCBCB; background-color:#000000;}
.row5, .row5 a{color:#474747; background-color:#FFFFFF;}

.coloured{color:#FFFFFF; background-color:#6677BC;}
.coloured .btn{color:inherit; background-color:transparent; border-color:inherit;}
.coloured .btn:hover{color:#6677BC; background-color:#FFFFFF;}


/* Top Bar */
#topbar, #topbar ul li{border-color:rgba(255,255,255,.2);}
#topbar > div:last-of-type li:first-child a{color:#6677BC;}


/* Header */
#header #logo a{color:inherit;}


/* Page Intro */
#pageintro footer input, #pageintro footer button{color:#000000; background-color:#FFFFFF;}
#pageintro footer button{color:#FFFFFF; background-color:#6677BC;}

.flex-direction-nav a{color:rgba(255,255,255,1);}
.flex-control-paging li a{background-color:rgba(255,255,255,1); border-color:rgba(255,255,255,0);}
.flex-control-paging li a.flex-active{background-color:rgba(255,255,255,0); border-color:rgba(255,255,255,1);}


/* Content Area */
#introblocks > ul > li > article{color:#474747; background-color:#FFFFFF;}
#introblocks > ul > li > article footer, #introblocks > ul > li > article footer a::after{border-color:#D7D7D7;}

#newsletter input, #newsletter button{color:#474747; border-color:#D7D7D7;}
#newsletter input{background-color:#FFFFFF;}
#newsletter input:focus{border-color:#6677BC;}
#newsletter button{color:#FFFFFF; background-color:#6677BC;}


/* Footer */
#footer .heading{color:inherit;}
#footer nav a{color:inherit;}
#footer nav li:first-child a, #footer nav a:hover{color:#6677BC;}


/* Navigation */
.mainav li a{color:inherit;}
.mainav .active a, .mainav a:hover, .mainav li:hover > a{color:#6677BC; background-color:inherit;}
.mainav li li a, .mainav .active li a{color:#FFFFFF; background-color:rgba(0,0,0,.6); border-color:rgba(0,0,0,.6);}
.mainav li li:hover > a, .mainav .active .active > a{color:#FFFFFF; background-color:#6677BC;}
.mainav form select{color:#FFFFFF; background-color:#000000; border-color:rgba(136,136,136,.5);/* #888888 */}

#breadcrumb ul{border-color:rgba(255,255,255,.2);}
#breadcrumb a{color:inherit; background-color:inherit;}
#breadcrumb li:last-child a{color:#6677BC;}

.container .sidebar nav a{color:inherit; border-color:#D7D7D7;}
.container .sidebar nav a:hover{color:#6677BC;}

.pagination a, .pagination strong{border-color:#D7D7D7;}
.pagination .current *{color:#FFFFFF; background-color:#6677BC;}

#backtotop{color:#FFFFFF; background-color:#6677BC;}


/* Tables + Comments */
table, th, td, #comments .avatar, #comments input, #comments textarea{border-color:#D7D7D7;}
#comments input:focus, #comments textarea:focus, #comments *:required:focus{border-color:#6677BC;}
th{color:#FFFFFF; background-color:#373737;}
tr, #comments li, #comments input[type="submit"], #comments input[type="reset"]{color:inherit; background-color:#FBFBFB;}
tr:nth-child(even), #comments li:nth-child(even){color:inherit; background-color:#F7F7F7;}
table a, #comments a{background-color:inherit;}


/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------ */


/* Media Queries
--------------------------------------------------------------------------------------------------------------- */
@-ms-viewport{width:device-width;}


/* Max Wrapper Width - Laptop, Desktop etc.
--------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width:978px){
	.hoc{max-width:95%;}
}

@media screen and (min-width: 978px){
	footer.hoc {
    	max-width: 100% !important;
	}

}

/* Mobile Devices
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:900px){
	.hoc{max-width:90%;}

	#topbar{}

	#header{padding:20px 0;}
	#header #logo{margin:0 0 0px 0;}

	.mainav{ margin: 0 0 -20px 0; }
	.mainav ul{}
	.mainav form{display:block;}

	#breadcrumb{}

	.container{}
	#comments input[type="reset"]{margin-top:10px;}
	.pagination li{display:inline-block; margin:0 5px 5px 0;}

	#footer{}

	#copyright{}
	#copyright p:first-of-type{margin-bottom:10px;}

	.mainav li{display:inline-block; position:relative; margin:0 0px 0 0; padding:0;}
	.fl_left, .fl_right{display:block; float:none;}

	.marginApoyanosTop {
		margin-top: 120px;
	}
}


@media screen and (max-width:750px){
	.flex-direction-nav .flex-prev, .flex-direction-nav .flex-next{display:none;}
	.flex-control-nav{display:block;}

	.imgl, .imgr{display:inline-block; float:none; margin:0 0 10px 0;}
	.fl_left, .fl_right{display:block; float:none;}
	.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:block; float:none; width:auto; margin:0 0 30px 0; padding:0;}

	#topbar{text-align:center;}
	#topbar ul{margin:0 0 15px 0;}
	#topbar div:last-child ul{margin:0;}

	#header{text-align:center;}
	#header #logo{margin:0 0 0px 0;}

	#introblocks > ul > li{margin-bottom:50px;}
	#introblocks > ul > li:last-child{margin-bottom:0;}

	.container{padding-bottom:50px;}/* Not neccessary - just looks better */
}


@media screen and (max-width:450px){
	#topbar ul li{margin-bottom:2px; padding-right:0; border-right:none;}

	#pageintro li footer form{max-width:none; width:100%;}
}


/* Other
--------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:650px){
	.scrollable{display:block; width:100%; margin:0 0 30px 0; padding:0 0 15px 0; overflow:auto; overflow-x:scroll;}
	.scrollable table{margin:0; padding:0; white-space:nowrap;}

	.inline li{display:block; margin-bottom:10px;}
	.pushright li{margin-right:0;}

	.font-x2{font-size:1.4rem;}
	.font-x3{font-size:1.6rem;}

	#pageintro li article{max-width:none; width:100%;}
	#pageintro li .heading{font-size:1.6rem;}
}

/* :: 4.0 Header Area CSS */
.header_area {
	position: fixed;
	z-index: 900;
	top: 0;
	left: 0;
	width: 100%;
	/* border-bottom: 1px solid #ebebeb; */
	-webkit-transition-duration: 500ms;
	transition-duration: 500ms; }
	@media only screen and (max-width: 767px) {
	  .header_area .classy-nav-container {
		-ms-flex-wrap: wrap;
		flex-wrap: wrap; } }
	@media only screen and (max-width: 767px) {
	  .header_area .classy-nav-container .classy-navbar-toggler {
		margin-left: auto;
		margin-right: 15px; } }
	.header_area .classy-navbar,
	.header_area .header-meta {
	  -webkit-box-flex: 0;
	  -ms-flex: 0 0 50%;
	  flex: 0 0 50%;
	  min-width: 50%;
	  width: 50%; }
	  @media only screen and (max-width: 767px) {
		.header_area .classy-navbar,
		.header_area .header-meta {
		  -webkit-box-flex: 0;
		  -ms-flex: 0 0 100%;
		  flex: 0 0 100%;
		  min-width: 100%;
		  width: 100%; } }
	.header_area .classy-navbar {
	  height: 85px;
	  padding: 5px 0 5px 5%; }
	  @media only screen and (max-width: 767px) {
		.header_area .classy-navbar {
		  height: 40px;
		  border-bottom: 1px solid #ebebeb; } }
	.header_area .header-meta {
	  height: 85px;
	  position: relative;
	  z-index: 1; }
	  @media only screen and (max-width: 767px) {
		.header_area .header-meta {
		  height: 40px; } }
	.header_area .classynav ul li a {
	  font-size: 16px !important;
	  color: #787878; }
	  .header_area .classynav ul li a:hover {
		color: #000000; }
	.header_area .classynav ul li .megamenu li a,
	.header_area .classynav ul li .dropdown li a {
	  font-size: 14px;
	  color: #787878; }
	  .header_area .classynav ul li .megamenu li a:hover,
	  .header_area .classynav ul li .dropdown li a:hover {
		color: #000000; }
	.header_area .search-area form {
	  position: relative;
	  z-index: 1;
	  height: 85px;
	  border-left: 1px solid #ebebeb; }
	  @media only screen and (max-width: 767px) {
		.header_area .search-area form {
		  height: 40px;
		  border-left: none; } }
	  .header_area .search-area form input {
		border: none;
		background-color: #ffffff;
		width: 200px;
		height: 85px;
		padding: 0 15px 0 60px;
		color: #787878;
		font-size: 14px;
		font-weight: 500;
		-webkit-transition-duration: 500ms;
		transition-duration: 500ms; }
		@media only screen and (max-width: 767px) {
		  .header_area .search-area form input {
			width: 170px;
			height: 40px;
			padding: 0 10px 0 30px; } }
		.header_area .search-area form input:focus {
		  outline: none !important;
		  width: 350px; }
		  @media only screen and (min-width: 768px) and (max-width: 991px) {
			.header_area .search-area form input:focus {
			  width: 300px; } }
		  @media only screen and (max-width: 767px) {
			.header_area .search-area form input:focus {
			  width: 170px; } }
		  @media only screen and (min-width: 480px) and (max-width: 767px) {
			.header_area .search-area form input:focus {
			  width: 270px; } }
		  @media only screen and (min-width: 576px) and (max-width: 767px) {
			.header_area .search-area form input:focus {
			  width: 300px; } }
	  .header_area .search-area form button {
		position: absolute;
		z-index: 10;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		left: 30px;
		background-color: transparent;
		border: none;
		color: #787878;
		font-size: 14px; }
		@media only screen and (max-width: 767px) {
		  .header_area .search-area form button {
			left: 10px;
			height: 40px; } }
	.header_area .favourite-area a,
	.header_area .user-login-info a,
	.header_area .cart-area a {
	  position: relative;
	  z-index: 1;
	  -webkit-box-flex: 0;
	  -ms-flex: 0 0 90px;
	  flex: 0 0 90px;
	  width: 90px;
	  display: block;
	  text-align: center;
	  border-left: 1px solid #ebebeb;
	  height: 100%;
	  line-height: 80px; }
	  @media only screen and (max-width: 767px) {
		.header_area .favourite-area a,
		.header_area .user-login-info a,
		.header_area .cart-area a {
		  -webkit-box-flex: 0;
		  -ms-flex: 0 0 50px;
		  flex: 0 0 50px;
		  width: 50px;
		  line-height: 40px; } }
	  .header_area .favourite-area a img,
	  .header_area .user-login-info a img,
	  .header_area .cart-area a img {
		max-width: 20px; }
	  .header_area .favourite-area a span,
	  .header_area .user-login-info a span,
	  .header_area .cart-area a span {
		font-family: "Ubuntu", sans-serif;
		font-size: 18px;
		color: #0315ff;
		font-weight: 700;
		position: absolute;
		top: -10px; }
		@media only screen and (max-width: 767px) {
		  .header_area .favourite-area a span,
		  .header_area .user-login-info a span,
		  .header_area .cart-area a span {
			font-size: 14px; } }
	.header_area.sticky {
	  position: fixed;
	  z-index: 900;
	  top: 0;
	  left: 0;
	  width: 100%;
	  box-shadow: 0 5px 30px rgba(0, 0, 0, 0.15); 
	  background-color:#fff;
	}
	.share{
		display:block;
		width:60px;
		height:60px;
		background:#6677BC;
		position:fixed;
		top:86%;
		left:97%;
		z-index:999;
		text-align:center;
		overflow:hidden;
		line-height:65px;
		font-size:1.5em;
		color:#fff;
		-moz-box-shadow: 0px 3px 9px rgba(0,0,0,.5);
		-webkit-box-shadow: 0px 3px 9px rgba(0,0,0,.5);
		box-shadow: 0px 3px 9px rgba(0,0,0,.5);
		border-radius:50px;
		-webkit-transform:translate(-50%,-50%);
		transform:translate(-50%,-50%);
		opacity: .5;
	}
	
	.share:hover{
		cursor:pointer;
		opacity: 1;
	}

	.share + .tooltip > .tooltip-inner {
		color: #FFFFFF; 
		padding: 15px;
		font-size: 20px;
	}

	.share_subase{
		display:block;
		width:60px;
		height:60px;
		background:#6677BC;
		position:fixed;
		bottom: 3%;
		left: 3%;
		z-index:999;
		text-align:center;
		overflow:hidden;
		line-height:65px;
		font-size:1.5em;
		color:#fff;
		-moz-box-shadow: 0px 3px 9px rgba(0,0,0,.5);
		-webkit-box-shadow: 0px 3px 9px rgba(0,0,0,.5);
		box-shadow: 0px 3px 9px rgba(0,0,0,.5);
		border-radius:50px;
		-webkit-transform:translate(-50%,-50%);
		transform:translate(-50%,-50%);
		opacity: .5;
	}
	
	.share_subase:hover{
		cursor:pointer;
		opacity: 1;
	}

	.share_subase + .tooltip > .tooltip-inner {
		color: #FFFFFF; 
		padding: 15px;
		font-size: 20px;
	}

	.BIA{
		display:block;
		position:fixed;
		bottom: 8%;
    	left: 91%;
		z-index: 1000;
	}

	.BIA > img{
		width: 100%;
	}

	@media (min-width: 1200px){
		.contentDivPodcast{
			max-width: 85% !important;
			margin-right: auto;
			margin-left: auto;
			padding: 80px 0;
		}

		.contentDivOrg{
			max-width: 85% !important;
			margin-right: auto;
			margin-left: auto;
			padding: 80px 0;
		}

		.contentDivPeriodico{
			max-width: 90% !important;
			margin-right: auto;
			margin-left: auto;
		}
		.card{
			/* width: 18rem; */
			margin-bottom:10px;
			height: 100%;
			width: 83%;
		}
	}

	@media(max-width: 400px){
		.nav-link {
			display: block;
			padding: 1.5rem 1rem;
		}

		.BIA{
			display:block;
			position:fixed;
			bottom: 8%;
			left: 80%;
			z-index: 1000;
		}
	}

	.div-sec-periodico{
		background-image: url('images/img-project/Fondo 1.png');
		background-position: top center;
		background-repeat: no-repeat;
		background-size: cover;
		background-attachment: fix;
	}

	@media(min-width: 1200px){

		.divImg{
			display: block;
			position: relative;		
			max-width: 100%;
			border-radius:15px;
		}

		.centrado{
			color:white;
			background-color: rgba(0,0,0,.8);
			display: block;
			position: absolute;
			bottom: -16px;
			transform: translate(0%, -10%);
			left: 0;
			padding: 20px;
			width: 750px;
			z-index: 100;
		}

		.centrado>a{
			color:white;
		}

		.divCentrado {
			margin-bottom: 15px;
		}

		.divImg2{
			display: block;
			position: relative;		
			max-width: 100%;
			border-radius:15px;
		}

		.centrado2{
			color:white;
			background-color: rgba(0,0,0,.7);
			display: block;
			position: absolute;
			bottom: -16px;
			transform: translate(0%, -10%);
			left: 0;
			padding: 20px;
			width: 100%;
			z-index: 100;
		}

		.centrado2>a{
			color:white;
		}
		
		.centrado2>a>h4{
		    font-size: 1rem !important;
		}

		#modal-body-lg-periodico>h4{
			text-transform: none !important;
		}

		#descApoyanos>h4{
			text-transform: none !important;
		}

		.divImgPeriodico{
			float: right;
			margin: 60px 15px 0em 32px;
			width: 600px;
			border-radius: 10px;
		}

		.divImgApoyanos{
			float: right;
			margin: 60px 15px 0em 32px;
			width: 600px;
			border-radius: 10px;
		}


		.centradoDivPer{
			color:white;
			background-color: rgba(0,0,0,.8);
			display: block;
			bottom: -16px;
			left: 0;
			padding: 3px 10px 0px 10px;
			z-index: 100;
		}

		.marginPeriodicoTop {
			margin-top: 100px;
		}

		.divImgPeriodicoTop{
			height: 200px;
		}
	}

	@media(min-width: 768px) and (max-width: 1200px){

		.divImg{
			display: block;
			position: relative;		
			/* max-width: 600px; */
			max-width: 100%;
			border-radius:15px;
		}

		.centrado{
			color:white;
			background-color: rgba(0,0,0,.8);
			display: block;
			position: absolute;
			bottom: -16px;
			transform: translate(2%, -10%);
			left: 0;
			padding: 20px;
			width: 600px;
			z-index: 100;
		}

		.centrado>a{
			color:white;
		}

		.divCentrado {
			margin-bottom: 15px;
		}

		.divImg2{
			display: block;
			position: relative;		
			max-width: 370px;
			border-radius:15px;
		}

		.centrado2{
			color:white;
			background-color: rgba(0,0,0,.7);
			display: block;
			position: absolute;
			bottom: -16px;
			transform: translate(0%, -10%);
			left: 0;
			padding: 20px;
			width: 100%;
			z-index: 100;
		}

		.centrado2>a{
			color:white;
		}

		#modal-body-lg-periodico>h4{
			text-transform: none !important;
		}

		.divImgPeriodico{
			float: right;
			margin: 60px 15px 0em 32px;
			width: 600px;
			border-radius: 10px;
		}

		.divImgApoyanos{
			float: right;
			margin: 60px 15px 0em 32px;
			width: 600px;
			border-radius: 10px;
		}


		.centradoDivPer{
			color:white;
			background-color: rgba(0,0,0,.8);
			display: block;
			bottom: -16px;
			left: 0;
			padding: 3px 10px 0px 10px;
			z-index: 100;
		}

		.marginPeriodicoTop {
			margin-top: 100px;
		}

		.divImgPeriodicoTop{
			height: 200px;
		}

	}
	

	@media(max-width: 767px){

		.h4, h4 {
			font-size: 1rem !important;
		}

		.divImg{
			display: block;
			position: relative;		
			max-width: 100%;
			border-radius:15px;
		}

		.centrado{
			color:white;
			background-color: rgba(0,0,0,.8);
			display: block;
			position: absolute;
			bottom: -16px;
			transform: translate(2%, -10%);
			left: 0;
			padding: 20px;
			width: 96%;
			font-size: 10px;
			z-index: 100;
		}

		.centrado>a{
			color:white;
		}

		.divCentrado {
			margin-bottom: 15px;
		}

		.divImg2{
			display: block;
			position: relative;		
			max-width: 100%;
			border-radius:15px;
		}

		.centrado2{
			color:white;
			background-color: rgba(0,0,0,.7);
			display: block;
			position: absolute;
			bottom: -16px;
			left: 0;
			padding: 20px;
			width: 100%;
			z-index: 100;
		}

		.centrado2>a{
			color:white;
		}

		#modal-body-lg-periodico>h4{
			text-transform: none !important;
		}

		.divImgPeriodico{
			float: right;
			width: 100%;
			border-radius: 10px;
		}


		.centradoDivPer{
			color:white;
			background-color: rgba(0,0,0,.8);
			display: block;
			bottom: -16px;
			left: 0;
			padding: 3px 10px 0px 10px;
			z-index: 100;
			/* float: right;
			margin: 1em 3em 1em 1em;
			width: 400px; */
		}

		.marginPeriodicoTop {
			margin-top: 110px;
		}

		.divImgPeriodicoTop{
			
		}
		
		#divOrg>div{
			margin-bottom: 20px;
		}

		.contentDivOrg{
			margin-top: 115px;
    		margin-left: 20px;
		}
	}

	.divDatosPagina{
		padding: 25px 0 !important;
	}

	.divFuturoCss{
		max-height: 600px;
    	overflow-y: auto;
	}

	.divFuturo > h4,h3,h2,h1,h5,h6{
		text-transform: none;
	}

	.cssDivsEntrevistas{
		overflow:auto;
		max-height: 500px;
		border-radius:5px;
		background-color:white;
		background-image:url('../../images/img-project/Fondo 2.png');
		background-repeat: no-repeat;
		background-size: cover;
	}

	.cssDivEntrevisContent{
		margin-top: 10px;
	}

	.cssDivEntrevisContent:hover{
		cursor: pointer;
		background-color: #f2f2f2;
	}

	.selectorVideo {
		border: 3px solid #6677BC;
    	border-radius: 10px;
	}
	
	.cssProduct {
		cursor:pointer;
		color: white;
		background-color: black;
	} 

	.cssProduct:hover{
		cursor: pointer;
		background-color: #0e142d;
	}


	/*

		CC 2.0 License Iatek LLC 2018
		Attribution required

	*/

	.imgDivSlider{
		height: auto;
		max-width: 75%;
	}

	.carousel-control-next, .carousel-control-prev{
		width: 5%;
		font-size: 25px;
	}

	.carousel-control-prev{
		color: white;
	}

	.titleDivCapitulosSerie{
		color:white;
		margin-bottom:20px;
	}

	@media (min-width: 768px) and (max-width: 991px) {
		/* Show 3rd slide on md  if col-md-4*/
		.carousel-inner .active.col-md-4.carousel-item + .carousel-item + .carousel-item + .carousel-item {
			position: absolute;
			top: 0;
			right: -33.3333%;  /*change this with javascript in the future*/
			z-index: -1;
			display: block;
			visibility: visible;
	  	}

		.cssDivVideoPrincipal{
			width: 100%;
			height: 500px;
		}

		.divContainerSerie{
			padding: 30px 0 30px 25px;
		}

  	}
  
  	@media (min-width: 576px) and (max-width: 768px) {
		/* Show 2 slide on md  if col-md-4*/
		.carousel-inner .active.col-sm-6.carousel-item + .carousel-item + .carousel-item {
			position: absolute;
			top: 0;
			right: -50%;  /*change this with javascript in the future*/
			z-index: -1;
			display: block;
			visibility: visible;
	  	}

		.titleDivCapitulosSerie{
			color:white;
			margin-bottom:20px;
			text-align: center;
		}

		.divContainerSerie{
			padding: 30px 0 30px 25px;
		}
  	}

	@media (min-width: 576px) {
		.carousel-item {
			margin-right: 0;
		}
	
		/* show 2 items */
		.carousel-inner .active + .carousel-item {
			display: block;
		}
		
		.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
		.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item {
			transition: none;
		}
	
		.carousel-inner .carousel-item-next {
			position: relative;
			transform: translate3d(0, 0, 0);
		}
		
		/* left or forward direction */
		.active.carousel-item-left + .carousel-item-next.carousel-item-left,
		.carousel-item-next.carousel-item-left + .carousel-item,
		.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item {
			position: relative;
			transform: translate3d(-100%, 0, 0);
			visibility: visible;
		} 
		
		/* farthest right hidden item must be abso position for animations */
		.carousel-inner .carousel-item-prev.carousel-item-right {
			position: absolute;
			top: 0;
			left: 0;
			z-index: -1;
			display: block;
			visibility: visible;
		}
		
		/* right or prev direction */
		.active.carousel-item-right + .carousel-item-prev.carousel-item-right,
		.carousel-item-prev.carousel-item-right + .carousel-item,
		.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item {
			position: relative;
			transform: translate3d(100%, 0, 0);
			visibility: visible;
			display: block;
			visibility: visible;
		}

		.cssDivVideoPrincipal{
			width: 100%;
			height: 300px;
		}

		.divContainerSerie{
			padding: 30px 0 30px 25px;
		}
	
	}

	@media (max-width: 576px) {
		.divContainerSerie{
			padding: 30px 0 30px 25px;
		}
		.cssDivVideoPrincipal{
			width: 100%;
			height: 300px;
		}

		
		.BIA{
			display:block;
			position:fixed;
			bottom: 8%;
			left: 83%;
			z-index: 1000;
		}
	}
  
	/*MD*/
	@media (min-width: 768px) {
	
		/* show 3rd of 3 item slide */
		.carousel-inner .active + .carousel-item + .carousel-item {
			display: block;
		}
	
		.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item {
			transition: none;
		}
		
		
		.carousel-inner .carousel-item-next {
			position: relative;
			transform: translate3d(0, 0, 0);
		}
		
		
		/* left or forward direction */
		.carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item {
			position: relative;
			transform: translate3d(-100%, 0, 0);
			visibility: visible;
		}
		
		/* right or prev direction */
		.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item {
			position: relative;
			transform: translate3d(100%, 0, 0);
			visibility: visible;
			display: block;
			visibility: visible;
		}
	

		.cssDivVideoPrincipal{
			width: 100%;
			height: 300px;
		}

		.divContainerSerie{
			padding: 30px 0 30px 25px;
		}
		
	}
  
  
	/*LG 6th*/
	@media (min-width: 991px) {
	
		/* show 4th item */
		.carousel-inner .active + .carousel-item + .carousel-item + .carousel-item {
			display: block;
		}
		
		.carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
			transition: none;
		}
		
	
	
		
		/* right or prev direction //t - previous slide direction last item animation fix */
		.carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
			position: relative;
			transform: translate3d(100%, 0, 0);
			visibility: visible;
			display: block;
			visibility: visible;
		}
	
	}

  
  	/*LG 6th*/
	@media (min-width: 991px) {
		
		.cssDivVideoPrincipal{
			width: 100%;
			height: 500px;
		}

		.divContainerSerie{
			padding: 30px 30px 30px 80px;
		}
	}

	.card-header {
		border-bottom: 1px solid rgb(255 255 255 / 13%);
	}

	::-webkit-scrollbar {
		width: 10px;
	}
	
	::-webkit-scrollbar-track {
		box-shadow: inset 0 0 5px rgb(133, 131, 131);
		border-radius: 10px;
	}
	
	::-webkit-scrollbar-thumb {
		background: #ada3a3;
		border-radius: 10px;
	}
	
	/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
		background: #5f5a5a;
	}


	.cssComentarios{
		background-color: #141414;
		border-radius: 15px;
		overflow: auto;
	}

	.cssComentarios textarea{
		color: #6677BC;
		background-color: #000;
	}

	.cssComentarios textarea:focus{
		color: white;
		background-color: #262626;
		border-color: #6677BC;
	}

	.cssComentarios div article{
		color:white;
	}

	.divOpiniones article b{
		color: #6677BC;
	}

	.divOpiniones article i{
		color: #6677BC;
    	font-size: 12px;
	}

	.divOpiniones article footer{
		margin-left: 7px;
	}

	.pointer{
		cursor: pointer;
	}
	
	
	.closeBg{
		background-color: transparent;
		color: white;
		cursor: pointer;
		font-size: 20px;
		border: none;
	}
	
	.bgNoBorder{
		/* .modal-header{
			border-bottom : none;
		}
		.modal-footer{
			border-top : none;
		} */
	}
	
	.bgTransparentModal{
		background-color: transparent;
	
		/* .modal-header{
			.closeBg{
				display: none;
			}
		}
		.modal-dialog{
			.bgNoBorder{
				height: 100%;
				width: 100%;
			}
		} */
	}
	
	.bgDarkModal{
		background-color: black;
		color: white;
	}
	
	.bgDarkImportant{
		background-color: black !important;
	}
	
	.ModalBlue{
		background-image: url('../../images/img-project/FondoAzul.png');
		text-align: justify;
		background-size: cover;
		font-family: sans-serif;
		box-shadow: 0px 0px 30px transparent, 0px 0px 60px #2f2bd6;
	}
	
	.ModalRed{
		background-image: url('../../images/img-project/FondoRojo.png');
		text-align: justify;
		background-size: cover;
		font-family: sans-serif;
		box-shadow: 0px 0px 30px transparent, 0px 0px 60px #d82b2b;
	}
	
	.ModalGray{
		background-image: url('../../images/img-project/Fondo 2.png');
		text-align: justify;
		background-size: cover;
		font-family: sans-serif;
		box-shadow: 0px 0px 30px transparent, 0px 0px 60px #ada3a3;
	}
	
	.ModalVirtual {
		background: transparent;
		/* border: 2px solid #2f2bd6; */
		box-shadow: 2px 2px 15px #000000 inset;
		text-align: center;
		color: #e8e8e8;
		display: flex;
		align-items: center;
		justify-content: center;
		font-family: 'Pacifico';
		transition: all 0.3s;
	}
	

	.swal-modal {
		background-color: #111;
		box-shadow: 0px 0px 30px transparent, 0px 0px 60px #ada3a3;
	}
	
	.swal-icon{
	
	}
	
	.swal-title{
		color: rgb(255 255 255 / 75%);
	}
	
	.swal-text {
		color: rgb(227 227 227 / 64%);
	}
	
	.swal-footer{
		
	}

	.swal-icon::before{
		display: none;
	}

	.swal-icon::after{
		display: none;
	}

	.swal-icon--success__hide-corners{
		display: none;
	}

	.swal_icon_device_left{
		background-image: url("./images/img-project/giphy_devide_left.gif");
    	background-size: cover;
	}

	.swal-icon img{
		width: 150px;
	}