@media (min-width: 0px) and (max-width: 575px) {
	body{font-size: 16px; line-height: 26px}
	.home-main-title { font-size: 28px;line-height:28px; color: #fff; padding-top: 35px; text-align: center; padding-bottom: 5px}
	.home-main-title br{ display:none}
	.scroll-section{ display: none;}
	.top_nav .open-menu {margin-top: -34px!important;}
     .carousel-group-slides { height:65vh; overflow: hidden}
	.carousel-group-slides .carousel-inner{ height:65vh}
	.carousel-group-slides .carousel-inner .carousel-item{ height:65vh}
	.top_nav .navbar-brand {width: 135px!important; margin-top: 15px!important}
	.top_nav.navbar-fixed-top {height: 55px!important;}
	.container, .intro .container-fluid, .top_nav .container-fluid, footer .container-fluid { max-width: 100%!important;padding-left: 25px!important;padding-right: 25px!important}
	.cita-home h3 { font-size: 22px;line-height: 32px; max-width: 90%}
	.intro .inner.container{background-color: #22212c; position: absolute; bottom:0; min-height: 315px!important}
	.intro .inner p {font-size: 16px; line-height: 26px;padding-left: 0px;  padding-top: 20px; padding-bottom: 25px; max-width: 100%; color: #fff;text-align: center;}
	.intro .title-wrap .btn_style {margin: 0px auto!important;}
	.intro .dates-section {right: 50%;bottom: AUTO;top: 70px; margin-right: -105px;}
	.dates-section .date{ font-size: 14px; line-height: 26px;}
	.intro .line-date {width: 100px;}
	.intro .carousel-indicators {margin-right: 45px;}
	.zoom-box {-ms-flex: 0 0 50%!important;flex: 0 0 50%!important;max-width: 50%!important;}
	.zoom-box .zoom-txt {text-align: center;font-size: 14px;line-height: 19px; padding: 15px 0; height: auto}
	.secondary-title {font-size: 26px; margin-top: 0!important}
	.muestras .secondary-title {margin-top: 25px!important}
	.obra-text-container .secondary-title { padding-bottom: 20px;}
	.obra-text-container {padding: 35px 0;}
	.btn_style {width: 155px;font-size: 12px;}
	.intro .title-wrap .btn_style { background-color: #fff!important; color:#161616!important;}
	.punoyletra-home {padding: 60px 0;}
	.punoyletra-home p {max-width: 100%;}
	footer p {line-height: 18px; padding: 15px 0!important}
	footer .copetin a {margin-top: 24px;}
	.intro .title-wrap {display: block;padding: 0; height: 315px!important}
	.big_container {height:100vh!important;}
	.intro .carousel-indicators {top: auto;width: 72px;height: 11px; right: auto !important;left: 50% !important; bottom: 45px!important; margin: 0; margin-left: -36px; display: none; }
	.carousel-indicators li {width: 11px; height: 11px;margin-top: 0px; margin-right: 15px!important;display: inline-block;}
	.carousel-indicators li:last-child{ margin-right: 0!important}
	.carousel-indicators li span {display: none;}
	.muestras-home .muestras-left{ display: none;}
	.cita-home span { font-size: 14px;}
	.cita-home .line {height: 1px;width: 50px;}
	.cita-home p { margin-top: 10px!important}
	.punoyletra-home .pyl-object{top: -12px;}
	.punoyletra-text {-ms-flex: 0 0 100%;flex: 0 0 100%; max-width: 100%;}
	.punoyletra-home .pyl-object img{ width:40px;}
	.punoyletra-home {background-color: #9dd9d4; background-image: none; padding-top: 40px; padding-bottom: 120px;}
	.line-date.second{ display:inline-block!important; margin-right: 0; margin-left: 15px;}
	.line-date{width: 50px!important;}
	.carousel-item.adjust{background-position: right center}
	.carousel.slide{ height: inherit!important; overflow: visible}
	#fading{ opacity: 1!important}
	.dates-section{ display: none!important}
	.dates-section.mobile{ display: block!important; position: static; margin: 0 auto; text-align: center}
	.dates-section.mobile span{ display: inline-block!important}
	.firma_mobile{position: absolute; bottom:25px; right:45px; }
     .firma_mobile img{width: 110px}
	
	/*INTERNAL*/	
	.first-section-paddding { padding-top: 65px;}
	
	/*BIOGRAFIA*/
	.biografia .home-main-title {font-size: 40px!important;line-height:38px!important;padding-bottom: 20px;padding-top: 30px; color:#161616; text-align: left}
	.biografia h5 {font-size: 16px;line-height: 26px;}
	.padding-shadow {padding: 30px 0px 30px 0px;}
	.biografia .home-main-title {font-size: 55px;line-height: 55px;padding-bottom: 30px;padding-top: 30px;}
	.pasion, .compromiso {padding: 40px 0px 20px;}
	.compromiso-txt.right { padding-top: 0px; padding-left: 15px;}
	.pasion .pasion-img {padding-right: 15px;}
	.pasion .pasion-txt {padding-left: 15px; padding-bottom: 30px;}
	.pasion .piedefoto {padding-top: 15px;text-align: left;}
	.full-thumbs .container-fluid .row .zoom-box {padding: 0;-ms-flex: 0 0 50%;flex: 0 0 50%; max-width: 50%;}
	.recuerdos-bio.muestras-home .muestras-left {display:block; height: 450px}
	.recuerdos-bio .muestras-right {padding: 30px;}
	.malosvientos{padding:35px 0px 10px}
	.malos-txt {padding-top: 30px;}
	.familia .pasion-txt {padding-top: 10px;}
	.pasion .pasion-txt {padding-bottom:0px;}
	.bio-first-part {padding-left: 0px;}
	.biografia-one {padding-bottom: 10px;}
	.biografia .zoom-box .zoom-txt {padding: 10px; height: 80px; line-height: 18px; font-size: 13px}
	.secondary-title.hablan {padding-top: 10px;}
	.compromiso h3.cita {font-size: 20px; line-height: 30px;}
	.muestras-right .muestras-home-content {padding: 0 5%;}
	
	/*OBRAS*/
	.obra-item {width: 50%;}
	.obras-content.col-md-10{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.filters.column.col-md-2{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.obras-content .obras-txt {padding: 15px;}
	.obras-content .obras-txt .col-md-6.first-col {padding-right: 15px;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%; padding-bottom: 20px;}
	.obras-content .obras-txt .col-md-6.second-col { padding-left: 15px;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.obras-content .obras-txt{ line-height: 26px; font-size: 16px;}
	.filter-button-group {padding-top: 20px; padding-bottom: 20px; margin-bottom: 0px;}
	.filter-button-group button {padding-left: 26px; padding-top: 5px; padding-bottom: 20px; line-height: 30px;}
	.obra-item .zoom-txt {font-size: 15px;line-height:22px;}
	.filter-button-group button {font-size: 14px; padding-top: 8px; padding-bottom: 8px;}
	.obras-content {padding: 0;}
	.mobile-selector .drop-icon{ float:right}
	.mobile-selector{height: 50px;line-height: 50px;position: fixed;bottom: 0;width: 100%;border-radius: 0;transform: translateY(40px);animation-name: filter_shrink;animation-delay: 0s;animation-duration: 0.5s;animation-fill-mode: forwards; background-color: #bca68e;z-index: 1;}
	.obras-list {padding-top: 10px;}
	.mobile-selector h4#nav {display: block;}
	.obra footer{ padding-bottom:50px}
	.mobile-selector h4#nav {padding: 0 25px;}
	.mobile_menu_container .close {top: -30px;}
	body.obra-modal-open .top_nav {height: 60px !important;}
	.modalobra .container-fluid { padding-top: 60px!important;}
	.modalobra .obra-pic-modal {padding: 0 30px!important;}
	.modalobra .obra-txt-modal .categoria { font-size: 14px}
	
	/*MUESTRAS*/
	.muestras .zoom-box.three,.muestras .zoom-box.four{ display:none!important;}
	.muestras .zoom-box.one,.muestras .zoom-box.two{ -ms-flex: 0 0 100%!important;flex: 0 0 100%!important;max-width: 100%!important;}
	.muestras-one p { padding-bottom: 20px;}
}


@media (min-width: 576px) and (max-width: 767px) {
	body{font-size: 16px; line-height: 26px}
	.home-main-title { font-size: 50px;line-height:50px}
	.scroll-section{ display: none;}
	.container, .intro .container-fluid, .top_nav .container-fluid, footer .container-fluid { max-width: 100%!important;padding-left: 35px!important;padding-right: 35px!important}
	.cita-home h3 { font-size: 26px;line-height: 36px; max-width: 80%}
	.intro .inner .container{ margin-top: -26px;}
	.intro .inner p {font-size: 16px;line-height: 26px;padding-left: 8px;padding-right: 10px; padding-top: 5px;padding-bottom: 15px;width: 267px;}
	.intro .title-wrap .btn_style {margin-left: 0px;}
	.intro .dates-section {bottom: 40px;}
	.dates-section .date{ font-size: 16px; line-height: 26px;}
	.intro .line-date {width: 100px;}
	.intro .carousel-indicators {margin-right: 45px;}
	.zoom-box .zoom-txt {text-align: center;font-size: 14px;line-height: 19px; padding: 15px 0; height: auto}
	.secondary-title {font-size: 26px; margin-top: 0!important}
	.obra-text-container .secondary-title { padding-bottom: 20px;}
	.obra-text-container {padding: 35px 0;}
	.btn_style {width: 170px;font-size: 13px;}
	.punoyletra-home {padding: 60px 0;}
	.punoyletra-home p {max-width: 300px;}
	footer .copetin a {margin-top: 20px;}
	.intro .title-wrap {display: block;}
	.intro .carousel-indicators {top: auto;margin-right: 0px;width: 160px;height: 11px; right: auto !important;left: 40px !important; bottom: 45px!important;margin-top: 0px;}
	.carousel-indicators li {width: 11px; height: 11px;margin-top: 0px; margin-right: 30px!important;display: inline-block;}
	.intro .dates-section {right: 35px; bottom:35px}
	.carousel-indicators li span {left: -3px;font-weight: bold;top: -33px; font-size: 14px;}
	.muestras-home .muestras-left{ display: none;}
	.cita-home span { font-size: 14px;}
	.cita-home .line {height: 1px;width: 80px;}
	.cita-home p { margin-top: 10px!important}
	.punoyletra-home .pyl-object{top: -12px;}
	.punoyletra-home .pyl-object img{ width:40px;}
	.punoyletra-home {background: url( "../imgs/puno-letra-bkg.jpg") no-repeat 90px center #9dd9d4; background-size: auto 100%;}
	.carousel-item.adjust{background-position: right center}
	.intro .inner{ position: relative}
	.intro .inner:after{content:""; position: absolute; width: 100%; height: 100%; background-color: antiquewhite; z-index: 1000; top:0; left:0;background: rgb(255,255,255);
background: linear-gradient(141deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 60%); z-index: 1}
	.intro .title-wrap {position: relative;z-index: 2;}
	.firma_mobile{position: absolute; bottom:25px; right:45px; }
     .firma_mobile img{width: 110px}
	
	/*INTERNAL*/	
	.first-section-paddding { padding-top: 75px;}
	
	/*BIOGRAFIA*/
	.biografia h5 {font-size: 16px;line-height: 26px;}
	.padding-shadow {padding: 30px 0px 30px 0px;}
	.biografia .home-main-title {font-size: 55px;line-height: 55px;padding-bottom: 30px;padding-top: 30px;}
	.bio-first-part {padding-left: 0px;}
	.pasion, .compromiso {padding: 40px 0px;}
	.compromiso-txt.right { padding-top: 0px; padding-left: 15px;}
	.pasion .pasion-img {padding-right: 15px; padding-top: 15px;}
	.pasion .pasion-txt {padding-left: 15px; padding-bottom: 30px;}
	.pasion .piedefoto {padding-top: 15px;text-align: left;}
	.full-thumbs .container-fluid .row .zoom-box {padding: 0;-ms-flex: 0 0 50%;flex: 0 0 50%; max-width: 50%;}
	.recuerdos-bio.muestras-home .muestras-left {display:block; height: 450px}
	.recuerdos-bio .muestras-right {padding: 30px;}
	.malosvientos{padding:0 0px 40px}
	.malos-txt {padding-top: 30px;}
	.familia .pasion-txt {padding-top: 10px;}
	.pasion .pasion-txt {padding-bottom:0px;}
	.biografia .zoom-box .zoom-txt {padding: 15px; height: 70px;}
	
	/*OBRAS*/
	.obra-item {width: 50%;}
	.obras-content.col-md-10{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.filters.column.col-md-2{-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.obras-content .obras-txt {padding: 24px;}
	.obras-content .obras-txt .col-md-6.first-col {padding-right: 15px;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%; padding-bottom: 20px;}
	.obras-content .obras-txt .col-md-6.second-col { padding-left: 15px;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.obras-content .obras-txt{ line-height: 26px; font-size: 16px;}
	.filter-button-group {padding-top: 20px; padding-bottom: 20px; margin-bottom: 0px;}
	.filter-button-group button {padding-left: 36px; padding-top: 5px; padding-bottom: 20px; line-height: 30px;}
	.obra-item .zoom-txt {font-size: 15px;line-height:22px;}
	.filter-button-group button {font-size: 14px; padding-top: 8px; padding-bottom: 8px;}
	.obras-content {padding: 0;}
	.mobile-selector .drop-icon{ float:right}
	.mobile-selector{height: 50px;line-height: 50px;position: fixed;bottom: 0;width: 100%;border-radius: 0;transform: translateY(40px);animation-name: filter_shrink;animation-delay: 0s;animation-duration: 0.5s;animation-fill-mode: forwards; background-color: #bca68e;z-index: 1;}
	.obras-list {padding-top: 10px;}
	.mobile-selector h4#nav {display: block;}
	.obra footer{ padding-bottom:50px}
		
	/*MUESTRAS*/
	.muestras .zoom-box.three,.muestras .zoom-box.four{ display:none!important;}
	.muestras .zoom-box.one,.muestras .zoom-box.two{ -ms-flex: 0 0 100%!important;flex: 0 0 100%!important;max-width: 100%!important;}
	.muestras-one p { padding-bottom: 20px;}
	.muestras .secondary-title {margin-top: 25px !important;}
}
@keyframes filter_shrink {
		0%   {transform: translateY(40px)}
		100%   { transform: translateY(0)}
	}
@media (min-width: 576px) and (max-width: 767px) and (max-height: 500px){
	.dates-section{display:none; }
	.intro .carousel-indicators{ display:none!important}
}


@media (min-width: 576px) and (max-width: 767px) and (max-height: 375px){
	.intro .inner p { display: none}
}
@media (min-width: 768px) and (max-width: 1023px) {
	body{font-size: 16px; line-height: 26px}
	.home-main-title { font-size: 70px;line-height:55px}
	.scroll-section{ display: none;}
	.container, .intro .container-fluid, .top_nav .container-fluid, footer .container-fluid { max-width: 100%!important;padding-left: 45px!important;padding-right: 45px!important}
	.cita-home h3 { font-size: 30px;line-height: 40px; max-width: 75%}
	.intro .inner .container{ margin-top: -26px;}
	.intro .inner p {font-size: 16px; line-height: 26px;padding-left: 8px; padding-right: 100px;}
	.intro .title-wrap .btn_style {margin-left: 8px;}
	.intro .dates-section {bottom: 40px;}
	.dates-section .date{ font-size: 16px; line-height: 26px;}
	.intro .line-date {width: 100px;}
	.intro .carousel-indicators {margin-right: 45px;}
	.zoom-box .zoom-txt {text-align: center;font-size: 16px;line-height: 26px; padding: 15px 0}
	.secondary-title {font-size: 26px; margin-top: 0!important}
	.obra-text-container {padding: 45px 0;}
	.btn_style {width: 170px;font-size: 13px;}
	.punoyletra-home {padding: 80px 0;}
	.punoyletra-home p {max-width: 300px;}
	footer .copetin a {margin-top: 20px;}
	.carousel-item.adjust{background-position: right center}
	.intro .inner{ position: relative}
	.intro .inner:after{content:""; position: absolute; width: 100%; height: 100%; background-color: antiquewhite; z-index: 1000; top:0; left:0;background: rgb(255,255,255);
background: linear-gradient(141deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); z-index: 1}
	.intro .title-wrap {position: relative;z-index: 2;}
	.secondary-title {font-size: 28px;margin-top: 5px!important;padding-bottom: 20px!important; margin-bottom: 0!important}
	.biografia .secondary-title {margin-bottom: 0px !important;}
    
	/*INTERNAL*/	
	.first-section-paddding { padding-top: 100px;}
	
	/*BIOGRAFIA*/
	.biografia h5 {font-size: 16px;line-height: 26px;}
	.biografia .container {width: 100%;max-width: 1235px;}
	body.biografia{font-size: 16px; line-height: 26px}
	.padding-shadow::before {left: 2px;}
	.padding-shadow {padding: 30px 0px 30px 30px;}
	.biografia .home-main-title {font-size: 55px;line-height: 55px;padding-bottom: 30px;padding-top: 30px;}
	.bio-first-part {padding-left: 0px;}
	.biografia p {padding-bottom: 15px;}
	.biografia-one-left{ padding-right:20px;}
	.pasion, .compromiso, .malosvientos {padding: 50px 0 40px;}
	.malosvientos{ padding-bottom: 70px;}
	.pasion .pasion-txt {padding-left: 15px;}
	.pasion .piedefoto {padding-top: 20px;}
	.biografia .zoom-box .zoom-txt {padding: 10px 15px;height: 82px;line-height: 16px;font-size: 12px;}
	.compromiso h3.cita {font-size: 20px; line-height: 30px;}
	.malos-txt {padding-top: 20px;}
	
	/*OBRAS*/
	.obra-item {width: 33.33333%;}
	.obras-content.col-md-10{-ms-flex: 0 0 74%;flex: 0 0 74%;max-width: 74%;}
	.filters.column.col-md-2{-ms-flex: 0 0 26%;flex: 0 0 26%;max-width: 26%;}
	.obras-content .obras-txt {padding-left: 60px;}
	.obras-content .obras-txt .col-md-6.first-col {padding-right: 15px;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%; padding-bottom: 20px;}
	.obras-content .obras-txt .col-md-6.second-col { padding-left: 15px;-ms-flex: 0 0 100%;flex: 0 0 100%;max-width: 100%;}
	.obras-content .obras-txt{ line-height: 26px; font-size: 16px;}
	.filter-button-group {padding-top: 20px; padding-bottom: 220px}
	.filter-button-group button {padding-left: 50px;}
	.obra-item .zoom-txt {font-size: 15px;line-height:22px;}
	.filter-button-group button {font-size: 14px; padding-top: 8px; padding-bottom: 8px;}
	.modalobra .container-fluid {padding:65px 45px!important}
	.modalobra .obra_title {font-size: 38px;line-height: 38px;}
	.modalobra .obra-txt-modal {padding: 35px!important; padding-top: 40px!important}
	.modalobra .obra-pic-modal {padding: 40px 0 40px 15px;}
	.modal-content button.close {right: 18px;top: 18px;}
	.modalobra .obra-txt-modal ul {padding-bottom: 20px;}
	.modalobra .obra-txt-modal .categoria {padding: 6px 20px;}
	.modalobra .obra-txt-modal ul li { padding: 15px 0 15px 20px;}
	.modalobra .obra-txt-modal ul li::before {top: 24px;}
}
@media (min-width: 1024px) and (max-width: 1268px) {
	.home-main-title { font-size: 80px;line-height: 65px}
	.scroll-section{ display: none;}
	.container, .intro .container-fluid, .top_nav .container-fluid, footer .container-fluid { max-width: 100%!important;padding-left: 60px!important;padding-right: 60px!important}
	.cita-home h3 { font-size: 34px;line-height: 44px; max-width: 70%}
	.modalobra .container-fluid {padding:65px 45px!important}
	.modalobra .obra_title {font-size: 48px;line-height: 48px;}
}
@media (min-width: 1024px) and (max-width: 1439px) {
	.home-main-title { font-size: 80px;line-height: 65px}
	.secondary-title {font-size: 28px;margin-top: 5px!important;}
	
	/*BIOGRAFIA*/
	.biografia .container {width: 100%;max-width: 1235px;}
	body.biografia{font-size: 16px; line-height: 26px}
	.biografia .container {max-width: 100%!important;padding-left: 60px!important;padding-right: 60px!important}
	.padding-shadow::before {left: 2px;}
	.padding-shadow {padding: 30px 0px 30px 30px;}
	.biografia .home-main-title {font-size: 55px;line-height: 55px;padding-bottom: 30px;padding-top: 30px;}
	.bio-first-part {padding-left: 0px;}
	.biografia p {padding-bottom: 15px;}
	.biografia-one-left{ padding-right:40px;}
	.pasion, .compromiso, .malosvientos {padding: 70px 0 40px;}
	.malosvientos{ padding-bottom: 70px;}
	.pasion .pasion-txt {padding-left: 20px;}
	.pasion .piedefoto {padding-top: 20px;}
	.biografia .zoom-box .zoom-txt {padding: 10px 25px;height: 100px;line-height: 20px;}
	
	/*OBRAS*/
	.obra-item {width: 33.33333%;}
	.obras-content.col-md-10{-ms-flex: 0 0 75%;flex: 0 0 75%;max-width: 75%;}
	.filters.column.col-md-2{-ms-flex: 0 0 25%;flex: 0 0 25%;max-width: 25%;}
	.obras-content .obras-txt {padding-left: 60px;}
	.obras-content .obras-txt .col-md-6.first-col {padding-right: 20px;}
	.obras-content .obras-txt .col-md-6.second-col { padding-left: 20px;}
	.obras-content .obras-txt{ line-height: 26px; font-size: 16px;}
	.modalobra .container-fluid {padding:65px!important}
	.modalobra .obra_title {font-size: 58px;line-height: 58px;}
}
@media (max-width: 767px) {

.big_container {height: 100vh;position: relative;}
/***Mobile menu*****/
.row-offcanvas.active:before {height:100%; width: 100%;  position: absolute; top:0; left:0; z-index: 10; background-color: #0f0f0f; opacity: 0.5; content:"";-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out }	
.row-offcanvas.active:before:hover{background-color: #f00;}
.row-offcanvas{position:relative;-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out }
aside {width:290px; transform: translateX(290px); position: fixed; height: 120vh;background-color: #fff;top:0; right:0;z-index: 10;-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out ;z-index: 100; margin-top: -10px;padding-bottom: 30px}
aside.active {transform: translateX(0px)}
	
.open-menu{display:block;}
	.top_nav{ background-color: #fff}
.menu_open .top_nav{ background-color: transparent}
	.top_nav .navbar-brand {margin-top: 19px; width: 170px}
.header-nav { width:290px; top:0; right:0;transform: translateX(290px); padding: 0; margin-top:8px; -webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out ; position: fixed;}
.top_nav .header-nav {  padding-top: 0;-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out ; }
.top_nav.navbar-fixed-top .header-nav { margin-top:0px; padding-top: 0!important;}
.header-nav.active {transform: translateX(0px); z-index: 101;-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out ; margin: 0}
.header-nav ul li.first_level {width:290px; padding:0 30px; border-bottom:1px solid #efefef}
.header-nav ul li.first_level a{ line-height: 50px; padding: 0!important; font-size: 14px; display: block;height: 50px}
.header-nav.navbar ul.nav { padding: 25px 0; height: 100vh; overflow-y: scroll}
body.menu_open{ height:inherit!important; overflow: hidden!important}
	
/*  Cross Animation*/
.open-menu.active { transform:translateX(5px);-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;width: 30px;}
.open-menu.active .icon-bar{ opacity:0;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;width: 30px;}
.open-menu.active::before{
-moz-transform: rotate(-45deg) translateY(10px) ;-webkit-transform: rotate(-45deg) translateY(10px);transform: rotate(-45deg) translateY(10px) ;-webkit-transform: rotate(-45deg) translateY(10px);-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}
.open-menu.active::after{
-moz-transform: rotate(45deg) translateY(-11px);-webkit-transform: rotate(45deg) translateY(-11px);transform: rotate(45deg) translateY(-11px);-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;top: 1px;top: 1px;}
.open-menu.active:hover::after {bottom: 0px;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}
.open-menu.active:hover::before {bottom: 0px;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}

.top_nav{ position:fixed;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;height:58px;  background-image: none}
.top_nav.navbar-fixed-top {animation:none;transform: translateY(0); padding-top: 0; height: 70px;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}
.menu_open .top_nav{ padding: 0}
.menu_open .top_nav.navbar-fixed-top{ background-color: transparent; box-shadow: none;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}
.top_nav.navbar-fixed-top .navbar-brand .horizontal{display:block}
.top_nav.navbar-fixed-top .navbar-brand .vertical{display:none}
.top_nav .navbar-brand .vertical{display:none}
.top_nav .navbar-brand .horizontal{display:block}
.top_nav .navbar-brand {opacity: 1;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}
	
.menu_open .top_nav .navbar-brand { opacity:0.4;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;transition:all .4s;}
.small_container.breakpoint{ background-attachment:scroll!important; background-position: center center;}
.intro .scroll-section { display:none}
ul.social_links { float: left;margin-left: -22px;height: 37px;display: block;}
.navbar ul li.first_level.first_level.social{ padding-bottom: 30px;}
ul.social_links li a{padding: 0 20px!important;}
	.mobile-selector .button-group.filter-button-group {margin-left: 0px !important;position: fixed;bottom: 0%;width: 100%;left: 0;border-radius: 0; transform: translateY(100%);-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out }
	.mobile-selector .button-group.filter-button-group.goup{transform: translateY(0);-webkit-transition: all .4s  ease-out;-moz-transition: all .4s  ease-out;transition: all .4s ease-out }
	
	/*OBRA MODAL*/
	.modalobra .obra-pic-modal {padding:0 35px;}
	.modalobra .obra-pic-modal img{ display: block}
    .obra-modal-open .top_nav {height: 70px!important; background-color: #fff!important}
	.modal-content button.close {right: 18px;top: 18px;}
	.modalobra .obra-txt-modal ul {padding-bottom: 20px;}
	.modalobra .obra-txt-modal .categoria {padding: 6px 20px;}
	.modalobra .obra-txt-modal ul li { padding: 15px 0 15px 20px;}
	.modalobra .obra-txt-modal ul li::before {top: 24px;}
	.modalobra .obra-txt-modal {padding: 35px;}
	.modalobra .container-fluid {padding-bottom: 0px; padding-top: 70px;}
	.modalobra .obra_title {font-size: 38px;line-height: 38px;}
	.obra-modal-open .top_nav.navbar-fixed-top .navbar-brand {width: 170px;margin-top: 19px;}
	.obra-modal-open .mobile_menu_container .close{ display: block; }
	.modalobra .close{ display: block; visibility: hidden }
	.modalobra .obra-text-shadow {width: 100%;left: 0px;top: -70px;}
	
	/*PUÑO Y LETRA*/
	.punoyletra  .puno-two .biografia-one-left{ order:1!important}
	.punoyletra  .puno-two .biografia-one-right{ order:12!important}
	.punoyletra  .puno-two, .punoyletra  .puno-one{ padding-bottom: 0!important}
}

@media (min-width: 768px) and (min-height: 600px){
.filters.column{ position: fixed!important;}
}
