@font-face {
    font-family: 'Montserrat';
    src: url('assets/anima/Montserrat-Regular.woff2') format('woff2'),
    url('assets/anima/Montserrat-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('assets/anima/Montserrat-Light.woff2') format('woff2'),
    url('assets/anima/Montserrat-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}



html,body,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}img,embed,object,audio,video{height:auto;max-width:100%; width: 100%;}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0;text-align:left}

body {

    background: #eecd42 url('assets/anima/back.jpg') top center;
    background-repeat: repeat;
    color: #222c47;
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    text-align: center;
    font-weight: 300;
}

.centered {
    margin-left: auto;
    margin-right: auto;
}

.container {
	clear: both;
    max-width: 900px;
    padding-left: 1rem;
    padding-right: 1rem;
    width: 100%;
    position: relative;
    z-index: 1;
    padding-bottom: 2rem;
}

.logoheader {
    font-size: 35px;
    line-height: 32px;
    font-weight: 300;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.title_img {
    width: auto !important;
    max-height: 60px;
    display: block;
    margin: 10px auto;
}

.txt-center {
    text-align: center !important;
}
.txt-bold {
    font-weight: 400 !important;
}
.txt-through {
    text-decoration: line-through;
}
.u-block {
    display: block;
}

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

.top-logos {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 10px 15px;
}

.logo {
    margin-top: 30px;
    display: block;
    clear: both;
    font-size: 40px;
}
.section {
    padding: 30px 1.rem;
}
.section.dark {
    background: url('assets/anima/sep.png') bottom center no-repeat, url('assets/anima/back-dark.jpg') top center;
    background-size: contain, auto;
    color: #eecd42;
    padding-bottom: 100px;
}

.section.gira25 {
    background: #000815 url('assets/anima/header.jpg') top center no-repeat;
    background-size: cover;
    max-height: 110vh;
    min-height: 950px;
}

.separador {
    width: 95%;
    max-width: 900px;
    height: 6vw;
    display: block;
    margin: 20px auto;
    background:  url('_home4/separator.jpg') top center;
    background-size: 100%;
    background-repeat: no-repeat;
    clear: both;
}

.title {
    /*text-transform: uppercase;*/
    font-size: 30px;
}

.text {
    font-size: 18px
}

.social-header {
    margin-bottom: 1em;
}

.link-social {
    display: inline-block;
    margin: 5px;
    padding: 5px;
    background: #222c47;
    border-radius: 100px;
    /* line-height: 0; */
    color: #000;
    text-decoration: none;
    min-width: 25px;
    height: 25px;
    font-size: initial;
}

.link-social:hover {
    background: rgba(34, 44, 71, 0.6);
    
}

img.img-social {
        height: 15px;
        width: auto;
}

.img-social {
    text-transform: uppercase;
}



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

.video-responsive {
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    padding-top: 30px;
    position: relative;
    }
.video-responsive iframe, .video-responsive object, .video-responsive embed {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    }

    

.videoclip-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}
.videoclip-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%}
.txt--center {
	text-align: center;
	justify-content: center;
} 
.txt--block {
	display: block;
}


.concert {
	display: flex;
	flex-direction: row;
	padding: 20px .5em;
}

.concert + .concert {
	border-top: 2px dotted;
}

.concert--dia,
.concert--lloc,
.concert--entrada {
	flex: .75;
	display: flex;
	flex-direction: column;
	align-self: center;
	padding-right: 15px;
}
.concert--dia {
    flex: 1;
}
.concert--lloc {
	flex: 2.25;
}
.concert--entrada {
	height: 100%;
	width: 100%;
	align-self: center;
	padding-right: 0;
}

.concert--entrada_link {
	padding: 10px 20px;
	height: 100%;
	background:  url('assets/anima/boto.png') top center no-repeat;
    background-size: 100% 100%;
    text-transform: uppercase;
	/*border: 1px solid #000;*/
	color: #222d48;
	text-decoration: none;
	font-weight: 400;
    width: min-content;
    margin: 0 auto;
    min-width: 150px;
}
.concert--entrada_link.btn-dark {

    background:  url('assets/anima/boto2.png') top center no-repeat;
    background-size: 100% 100%;
    color: #efcf46;
}
a.concert--entrada_link:hover {
	opacity: .8;
}

.concert--entrada_link.exhaurides {

    opacity: .4
}
.concert--entrada_link.concert--entrada_lliure {
	border-color: #53738a;
	color: #53738a;
	background-color: transparent;
}


@media (max-width: 680px) {

    .section.gira25 {
        background: #000815 url('assets/anima/headermbl.jpg') bottom center no-repeat;
        background-size: 120%;
        height: auto;
        min-height: 600px;
    }

    .flex {
        flex-direction: column;
    }
    .platform {
        height: 30px !important
    }

	.concert {
		flex-direction: column;
	}

	.concert--entrada,
    .concert--lloc{
		margin-top: 10px;
	}

    .merxan {
        width: 100% !important;
        text-align: center !important;
    }

    .merxan img{
        margin: auto !important;
        padding: auto !important;
    }
    .merxan p {
        padding-left: initial !important;
    }
}

@media (min-width: 48em) {

    .logoheader {
        font-size: 45px;
    }

    .title_img {
        width: auto !important;
        max-height: 80px;
    }

	.video {
		margin-top: 10%
	}

    .left {
        float: left
    }

    .right {
        float: right;
    }

    .logo {
    	font-size: 10vh;
    }
    .block-info {
        text-align: left;
        max-width: 400px;
    }

    .disc-info {
        margin-top: 40px;
    }
    .title {
        font-size: 40px;
    }
    .text {
        font-size: 24px;
    }
    
}









/* =====================================
12 COLUMN GRID
===================================== */

/* ================================
Desktop
================================ */

/* the wraping container */
.container {
    position: relative;
    width: 100%;
    min-width: 768px;
    max-width: 990px
}
/* align the site */
.leftaligned {
    margin: 0 auto 0  0
}
.rightaligned {
    margin: 0 0 0 auto
}
.centered {
    margin: 0 auto
}
/* Global Grid layout */
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
    display:inline;
    float: left;
    position: relative;
    margin-left: .96%;
    margin-right: .96%   
}

/* alpha and omega classes remove margins, aplha = no margin left, omega = no margin right */
.alpha { margin-left: 0 }
.omega { margin-right: 0 }

/* Grid sizes up to 12 columns */
.container .grid_1 { width:6.333% }
.container .grid_2 { width:14.667% }
.container .grid_3 { width:23.0% }
.container .grid_4 { width:31.333% }
.container .grid_5 { width:39.667% }
.container .grid_6 { width:48.0% }
.container .grid_7 { width:56.333% }
.container .grid_8 { width:64.667% }
.container .grid_9 { width:73.0% }
.container .grid_10 { width:81.333% }
.container .grid_11 { width:89.667% }
.container .grid_12 { width:98.0% }

/* Prefix to add extra space left */
.container .prefix_1 { padding-left:8.333% }
.container .prefix_2 { padding-left:16.667% }
.container .prefix_3 { padding-left:25.0% }
.container .prefix_4 { padding-left:33.333% }
.container .prefix_5 { padding-left:41.667% }
.container .prefix_6 { padding-left:50.0% }
.container .prefix_7 { padding-left:58.333% }
.container .prefix_8 { padding-left:66.667% }
.container .prefix_9 { padding-left:75.0% }
.container .prefix_10 { padding-left:83.333% }
.container .prefix_11 { padding-left:91.667% }

/* Suffix to add extra space right */
.container .suffix_1 { padding-right:8.333% }
.container .suffix_2 { padding-right:16.667% }
.container .suffix_3 { padding-right:25.0% }
.container .suffix_4 { padding-right:33.333% }
.container .suffix_5 { padding-right:41.667% }
.container .suffix_6 { padding-right:50.0% }
.container .suffix_7 { padding-right:58.333% }
.container .suffix_8 { padding-right:66.667% }
.container .suffix_9 { padding-right:75.0% }
.container .suffix_10 { padding-right:83.333% }
.container .suffix_11 { padding-right:91.667% }

/* Push columns to right */
.container .push_1 { left:8.333% }
.container .push_2 { left:16.667% }
.container .push_3 { left:25.0% }
.container .push_4 { left:33.333% }
.container .push_5 { left:41.667% }
.container .push_6 { left:50.0% }
.container .push_7 { left:58.333% }
.container .push_8 { left:66.667% }
.container .push_9 { left:75.0% }
.container .push_10 { left:83.333% }
.container .push_11 { left:91.667% }

/* Pull columns to left */
.container .pull_1 { left:-8.333% }
.container .pull_2 { left:-16.667% }
.container .pull_3 { left:-25.0% }
.container .pull_4 { left:-33.333% }
.container .pull_5 { left:-41.667% }
.container .pull_6 { left:-50.0% }
.container .pull_7 { left:-58.333% }
.container .pull_8 { left:-66.667% }
.container .pull_9 { left:-75.0% }
.container .pull_10 { left:-83.333% }
.container .pull_11 { left:-91.667% }

/* =====================================
Tablet (Portrait) 
===================================== */

/* =====================================
Smartphones (Portait) 
===================================== */
@media only screen and (max-width: 320px) {
    .container {
        width: 100%;
        min-width: 300px;
        max-width: 320px
    } 
    .container .grid_1, 
    .container .grid_2,
    .container .grid_3,
    .container .grid_4,
    .container .grid_5,
    .container .grid_6,
    .container .grid_7,
    .container .grid_8,
    .container .grid_9,
    .container .grid_10,
    .container .grid_11,
    .container .grid_12 { 
        width: 100%;  
        margin: 0;
        float: none
    }
}

/* =====================================
Smartphones (Landscape) 
===================================== */
@media only screen and (min-width: 321px) and (max-width: 767px) {
    .container {
        width: 100%;
        min-width: 321px;
        max-width: 767px
    } 
    .container .grid_1, 
    .container .grid_2,
    .container .grid_3,
    .container .grid_4,
    .container .grid_5,
    .container .grid_6,
    .container .grid_7,
    .container .grid_8,
    .container .grid_9,
    .container .grid_10,
    .container .grid_11,
    .container .grid_12 { 
        width: 100%;
        margin: 0;
        display: block;
        float: none
    }    
}

/* =====================================
Smartphones (Portrait & Landscape) 
===================================== */
@media only screen and (min-width: 300px) and (max-width: 767px) {
    .hidden-sm {
        display: none !important;
        visibility: hidden !important;
    }

    .container .prefix_1,
    .container .prefix_2,
    .container .prefix_3,
    .container .prefix_4,
    .container .prefix_5,
    .container .prefix_6,
    .container .prefix_7,
    .container .prefix_8,
    .container .prefix_9,
    .container .prefix_10,
    .container .prefix_11,
    .container .suffix_1,
    .container .suffix_2,
    .container .suffix_3,
    .container .suffix_4,
    .container .suffix_5,
    .container .suffix_6,
    .container .suffix_7,
    .container .suffix_8,
    .container .suffix_9,
    .container .suffix_10,
    .container .suffix_11 { 
        padding-right: 0;
        padding-left: 0
    } 
    .container .push_1,
    .container .push_2,
    .container .push_3,
    .container .push_4,
    .container .push_5,
    .container .push_6,
    .container .push_7,
    .container .push_8,
    .container .push_9,
    .container .push_10,
    .container .push_11,
    .container .pull_1,
    .container .pull_2,
    .container .pull_3,
    .container .pull_4,
    .container .pull_5,
    .container .pull_6,
    .container .pull_7,
    .container .pull_8,
    .container .pull_9,
    .container .pull_10,
    .container .pull_11 {
        left: auto;
        right: auto
    }
}

/* =====================================
iPhone 4, iPad2, Retina stuff ?
===================================== */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {

/* if you buy me one i might test and add something here */

}



.leftaligned {
    margin: 0 auto 0 0;
}
.rightaligned {
    margin: 0 0 0 auto;
}
.centered {
    margin: 0 auto;
}
.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {
    display: inline;
    float: left;
    position: relative;
    margin-left: .96%;
    margin-right: .96%}
.alpha {
    margin-left: 0;
}
.omega {
    margin-right: 0;
}
.container .grid_1 {
    width: 6.333%}
.container .grid_2 {
    width: 14.667%}
.container .grid_3 {
    width: 23.0%}
.container .grid_4 {
    width: 31.333%}
.container .grid_5 {
    width: 39.667%}
.container .grid_6 {
    width: 48.0%}
.container .grid_7 {
    width: 56.333%}
.container .grid_8 {
    width: 64.667%}
.container .grid_9 {
    width: 73.0%}
.container .grid_10 {
    width: 81.333%}
.container .grid_11 {
    width: 89.667%}
.container .grid_12 {
    width: 98.0%}
.container .prefix_1 {
    padding-left: 8.333%}
.container .prefix_2 {
    padding-left: 16.667%}
.container .prefix_3 {
    padding-left: 25.0%}
.container .prefix_4 {
    padding-left: 33.333%}
.container .prefix_5 {
    padding-left: 41.667%}
.container .prefix_6 {
    padding-left: 50.0%}
.container .prefix_7 {
    padding-left: 58.333%}
.container .prefix_8 {
    padding-left: 66.667%}
.container .prefix_9 {
    padding-left: 75.0%}
.container .prefix_10 {
    padding-left: 83.333%}
.container .prefix_11 {
    padding-left: 91.667%}
.container .suffix_1 {
    padding-right: 8.333%}
.container .suffix_2 {
    padding-right: 16.667%}
.container .suffix_3 {
    padding-right: 25.0%}
.container .suffix_4 {
    padding-right: 33.333%}
.container .suffix_5 {
    padding-right: 41.667%}
.container .suffix_6 {
    padding-right: 50.0%}
.container .suffix_7 {
    padding-right: 58.333%}
.container .suffix_8 {
    padding-right: 66.667%}
.container .suffix_9 {
    padding-right: 75.0%}
.container .suffix_10 {
    padding-right: 83.333%}
.container .suffix_11 {
    padding-right: 91.667%}
.container .push_1 {
    left: 8.333%}
.container .push_2 {
    left: 16.667%}
.container .push_3 {
    left: 25.0%}
.container .push_4 {
    left: 33.333%}
.container .push_5 {
    left: 41.667%}
.container .push_6 {
    left: 50.0%}
.container .push_7 {
    left: 58.333%}
.container .push_8 {
    left: 66.667%}
.container .push_9 {
    left: 75.0%}
.container .push_10 {
    left: 83.333%}
.container .push_11 {
    left: 91.667%}
.container .pull_1 {
    left: -8.333%}
.container .pull_2 {
    left: -16.667%}
.container .pull_3 {
    left: -25.0%}
.container .pull_4 {
    left: -33.333%}
.container .pull_5 {
    left: -41.667%}
.container .pull_6 {
    left: -50.0%}
.container .pull_7 {
    left: -58.333%}
.container .pull_8 {
    left: -66.667%}
.container .pull_9 {
    left: -75.0%}
.container .pull_10 {
    left: -83.333%}
.container .pull_11 {
    left: -91.667%}
@media only screen and (max-width: 320px) {
    .container {
    width: 100%;
    min-width: 300px;
    max-width: 320px;
    }   
    .container .grid_1, .container .grid_2, .container .grid_3, .container .grid_4, .container .grid_5, .container .grid_6, .container .grid_7, .container .grid_8, .container .grid_9, .container .grid_10, .container .grid_11, .container .grid_12 {
        width: 100%;
        margin: 0;
        float: none;
    }
    .header {
   
    }
}
@media only screen and (min-width: 321px) and (max-width: 767px) {
    .container {
    width: 100%;
    min-width: 321px;
    max-width: 767px;
    }

    .container .grid_1, .container .grid_2, .container .grid_3, .container .grid_4, .container .grid_5, .container .grid_6, .container .grid_7, .container .grid_8, .container .grid_9, .container .grid_10, .container .grid_11, .container .grid_12 {
    width: 100%;
    margin: 0;
    display: block;
    float: none;
    }

    .container .grid_sm_3 {
    width: 23.0% !important ;
    display: inline !important ;
    float: left !important ;
    position: relative !important ;
    margin-left: .96% !important ;
    margin-right: .96% !important ;
    }

    .container .grid_sm_6 {
    width: 48.0% !important ;
    display: inline !important ;
    float: left !important ;
    position: relative !important ;
    margin-left: .96% !important ;
    margin-right: .96% !important ;
    }

}
@media only screen and (min-width: 300px) and (max-width: 767px) {
    .hidden-sm {
    display: none !important;
    visibility: hidden !important;
    }
    .container .prefix_1, .container .prefix_2, .container .prefix_3, .container .prefix_4, .container .prefix_5, .container .prefix_6, .container .prefix_7, .container .prefix_8, .container .prefix_9, .container .prefix_10, .container .prefix_11, .container .suffix_1, .container .suffix_2, .container .suffix_3, .container .suffix_4, .container .suffix_5, .container .suffix_6, .container .suffix_7, .container .suffix_8, .container .suffix_9, .container .suffix_10, .container .suffix_11 {
        padding-right: 0;
        padding-left: 0;
    }
    .container .push_1, .container .push_2, .container .push_3, .container .push_4, .container .push_5, .container .push_6, .container .push_7, .container .push_8, .container .push_9, .container .push_10, .container .push_11, .container .pull_1, .container .pull_2, .container .pull_3, .container .pull_4, .container .pull_5, .container .pull_6, .container .pull_7, .container .pull_8, .container .pull_9, .container .pull_10, .container .pull_11 {
        left: auto;
        right: auto;
    }

}


/* =====================================
CLEARING FLOATS
===================================== */
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0
}

.cf:before, 
.cf:after,
.row:before,
.row:after{ 
    content: ""; 
    display: table
}
.cf:after,
.row:after{ 
    clear: both
}
.cf,
.row { 
    *zoom: 1
}