@charset "utf-8";
/*
Theme Name: ANNA SANTAMARIA V2
Theme URI:
Description: Design created for Panda Creatiu.
Version: 1.0
Author: Panda Creatiu
Author URI: http://www.pandacreatiu.com/
Tags:
*/
/* ------------------------------------------------------------------ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;/*vertical-align: baseline*/;background: transparent;list-style:none;
	webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
a {text-decoration:none;}
/* -------------------------------------------------------------------- */
html, body{ overflow-x: hidden; }
body { font-family: "Montserrat", sans-serif; font-size:14px; }


body .hidden { display: none !important; }

.wrapper{ width: 100%; margin: 0; }

.title_gen{ font-size: 37px; font-weight: 300px; line-height: 1.4; margin-bottom: 40px; }
.txtgen{ font-size: 15px; line-height: 1.3; font-weight: 300; }
.txtgen p, .txtgen h1, .txtgen h2, .txtgen h3{ margin-bottom: 30px; }
.txtgen h1{ font-size: 140%; }
.txtgen h2{ font-size: 120%;  }
.txtgen h3{ font-size: 100%; }
.txtgen img { max-width: 100% !important; height: auto !important; }
.txtgen a{ color: #666; }
.txtgen a:hover{ text-decoration: underline; }
.txtgen ul, .txtgen ol{ padding-left:20px; margin-bottom:25px; margin-top:15px; }
.txtgen ul li, .txtgen ol li{  list-style:outside; margin-bottom:15px; }
.txtgen ol li { list-style:decimal; }
.txtgen iframe { max-width: 100%; height: 300px; }

/* center div variable width */
.outer{ position: relative; left: 50%; float: left; }
.inner { position: relative; left: -50%; float: left; }

.transition{
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}

.shadow{ -webkit-box-shadow: 0px 5px 15px 0px rgba(96,67,17,0.4); -moz-box-shadow: 0px 5px 15px 0px rgba(96,67,17,0.4); box-shadow: 0px 5px 15px 0px rgba(96,67,17,0.4); }
.radius{ -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; }

::selection { background: #F1F1F1; }
::-moz-selection { background: #F1F1F1; }


::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-button { width: 0px; height: 0px; }
::-webkit-scrollbar-thumb { background: #7f7f7f; border: 0px none #ffffff; border-radius: 0px; }
::-webkit-scrollbar-thumb:hover { background: #7f7f7f; }
::-webkit-scrollbar-thumb:active { background: #000000; }
::-webkit-scrollbar-track { background: #f1f1f1; border: 0px none #ffffff; border-radius: 50px; }
::-webkit-scrollbar-track:hover { background: #f1f1f1; }
::-webkit-scrollbar-track:active { background: #333333; }
::-webkit-scrollbar-corner { background: transparent; }


.clear{ clear: both; }

.container{ width: 100%; max-width: 1200px; min-width: 320px; margin: auto; padding: 0 10px; position: relative; }

/* MENU / SUBMENU -------------------- */
.header{ width: 100%; height: 70px; position: fixed; z-index: 99; background-color: #fff; box-shadow: 0 0 7px rgba(0,0,0,.1)!important; }

	.logo{ position: absolute; margin: 20px 20px; font-size: 30px; font-weight: 200; }
	.logo a{ color: #000; }

	#main-nav{ position: absolute; right: 115px; top: 32px; font-size: 13px; font-weight: 600; }

		/*#main-nav:after{ content: ''; width: 1px; height: 15px; background-color: #999; position: absolute; right: 0; top: 0; }*/

		#main-nav ul { margin: 0; padding: 0; display: inline-flex; text-transform: uppercase; }
		#main-nav li { display: block; float: left; margin: 0; padding: 0 15px; position: relative; cursor: pointer; word-wrap: break-word; }
		#main-nav li a { display: block; padding: 0 0 5px 0; color: #666; 
			-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
		
		#main-nav .current-menu-item a, #main-nav .current_page_item a, #main-nav a:hover, li.current-menu-parent >a{ color: #8E819C !important; 
			border-bottom: 1px solid #8E819C; }

		#main-nav ul li ul { display: none; position: absolute; background-color: #fff; border-top: 2px solid #8E819C; padding: 10px 0 15px 0; font-weight: normal; 
			-webkit-box-shadow: 0 0 7px rgba(0,0,0,.1)!important; -moz-box-shadow: 0 0 7px rgba(0,0,0,.1)!important; box-shadow: 0 0 7px rgba(0,0,0,.1)!important; }

		#main-nav ul li ul li { float: none; word-wrap: break-word; font-size: 13px; padding: 7px 15px; }
		#main-nav ul li ul li a { display: block; white-space: nowrap; }
		
		#main-nav ul .menu-item-has-children{ padding-right: 14px; }
		#main-nav ul .menu-item-has-children > a:after{ font-family: 'Material Design Icons'; content: '\F140'; position: absolute; font-size: 18px; margin-top: -2px; }


	#xarxes{ position: absolute; right: 85px; top: 25px; }
		#xarxes a{ color: #000; font-size: 25px; }


	#menu_lang{ position: absolute; right: 10px; top: 22px; }

		.lang{ font-size: 11px; font-weight: 700; margin: 2px 0 0 0; width: 60px; }

		.wpml-ls ul li a{ padding: 7px 10px; 
			-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }

			.wpml-ls ul li a:after{ content: ' - '; }
			.wpml-ls ul li:last-child a:after{ content: ''; }

.header_separa{ height: 90px; }
	

/* menu mobile*/
.menu_movil_trigger{ display: none; position: absolute; right: 15px; top: 15px; font-size: 40px; }
.menu_movil_trigger a{ color: #000; }

	.menu_mobile{ margin-top: 20px; }

		.sidr { display: block; position: fixed; top: 0; height: 100%; z-index: 999999; width: 260px; overflow-x: hidden; overflow-y: auto;
		  font-size: 14px; background: #fff; color: #333; box-shadow: 0 0 5px 5px #F0F3F7 inset; padding: 15px; }

		.sidr .sidr-inner { padding: 0 0 15px; }

		.sidr.right { left: auto; right: -260px; }
		.sidr.left { left: -260px; right: auto; }

			.lang_mobile{ font-size: 13px; font-weight: 700; width: 60px; margin-left: -10px; }

				.lang_mobile li div ul{ display: flex; }
				.wpml-ls ul li a{ color: #000; }
				.wpml-ls ul li a:after{ display: none; }
				.wpml-ls-current-language a{ font-weight: 400 !important; }
				
			.menu_mobile a{ color: #000; }

			.menu_mobile{ font-size: 13px; text-transform: uppercase; }
			.menu_mobile ul li{ padding: 17px 0; }
			.menu_mobile ul li a{ display: block; width: 230px !important; border-bottom: 1px solid #ccc; padding-bottom: 5px; font-weight: bold; }
			.menu_mobile ul li a:after{ font-family: 'Material Design Icons'; content: "\F055"; float: right; padding-right: 10px; }

			.menu_mobile ul li ul{ padding-left: 15px; font-size: 12px; margin-top: 7px; display: none; }
			.menu_mobile ul li ul li a{ border-bottom: none; font-weight: normal; }
			.menu_mobile ul li ul li a:after{ content: ''; }

.menu_mobile_xxss{ margin-top: 15px; font-size: 30px; }
.menu_mobile_xxss a{ color: #000; }

@media only screen and (max-width: 1020px) {
	#main-nav, #xarxes, #menu_lang{ display: none; }
	.menu_movil_trigger{ display: inherit; }
}


@media only screen and (max-width: 500px) {
	.logo{ margin: 24px 15px; font-size: 24px; }
}


/* HOME =============================================================================================================================== */
.home_back{ width: 100%; height: calc(100vh - 70px); top: 70px; position: fixed; }

	.swiper-container{ overflow: hidden; position: relative; height: calc(100vh - 75px) !important; }

		.swiper-slide{
			text-align: center;
			font-size: 18px;
			background: #fff;
		}

		.swiper-slide img {
			display: block;
			width: 100%;
			height: 100%;
			object-fit: cover;
		}

		.swiper-slide:nth-child(1){ width: 10%; }
		.swiper-slide:nth-child(2n) { width: 70%; }
		.swiper-slide:nth-child(3n) { width: 70%; }

		.swiper-pagination-bullet {
		    width: 10px !important;
		    height: 10px !important;
		    background: #fff !important;
		    opacity: 1 !important;
		}

		.swiper-pagination-bullet-active{ background: #000 !important; }


@media only screen and (max-width: 763px) {
	.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{ bottom: 75px !important; }
}

.video-background {
    background: #000;
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: -99; /* Perquè estiga al fons de tot */
    overflow: hidden;
}

.video-foreground,
.video-background iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none; /* Aquest és el secret: bloqueja qualsevol interacció/clic */
}

/* Per a assegurar que el vídeo sempre cobreix la pantalla (estil background-size: cover) */
@media (min-aspect-ratio: 16/9) {
    .video-foreground { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
    .video-foreground { width: 300%; left: -100%; }
}




/* LLIBRES ============================================================================================================================================== */
.llibres_items{ margin:40px 0 70px 0; }

	.llibres_item{ display:flex; justify-content: space-between; margin-bottom:25px; padding-bottom:25px; border-bottom:1px solid #ccc; }

		.llibres_item_left{ width:47%; }
		.llibres_item_left h2{ margin-top:15px; font-size:25px; margin-bottom:25px }
		.llibres_item_bt{ width: fit-content; padding: 15px 25px; background-color:#000; color:#fff; text-transform:uppercase; font-weight:800; }

		.llibres_item_right{ width:47%; }
		.llibres_item_right img{ width:100%; height:auto; }


@media only screen and (max-width: 768px) {
	.llibres_item{ display:block; }
		.llibres_item_left{ width:100%; }
		.llibres_item_right{ width:100%; margin-top:30px; }

}




/* CONTACTE =========================================================================== */
.contacte{ width: 100%; max-width: 700px; margin: 70px auto; }

.contacte_title{ font-size: 40px; font-weight: 100; }
.contacte_mail{ margin-top: 5px; font-size: 14px; }
.contacte_mail a{ color: #000; border-bottom: 1px solid #999; padding-bottom: 4px; }

.contacte_form_mc{ margin-top: 25px; font-size: 0.9em; color: #666; padding: 40px; 
	-webkit-box-shadow: 0 0 7px rgba(0,0,0,.1)!important; -moz-box-shadow: 0 0 7px rgba(0,0,0,.1)!important; box-shadow: 0 0 7px rgba(0,0,0,.1)!important; }

	.form_contacte_100, .contacte_form_mc p{ margin-bottom: 25px; }
	.contacte_form_mc input[type='text'], .contacte_form_mc input[type='number'], .contacte_form_mc input[type='email'], .contacte_form_mc textarea, .contacte_form_mc select{
		width: 100%; border: none; border: 1px solid #ccc; margin-top: 4px;
		webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 8px; }

	.contacte_form_mc textarea{ resize: none; height: 200px; font-family: 'Raleway', sans-serif; }

	.contacte_form_mc a{ color: #e6462a; }
	.contacte_form_mc a:hover{ text-decoration: underline; }

	.form_submit{ background-color: #1a1a1a; padding: 10px 25px; color: #fff; width: fit-content; margin: 20px 0 10px 0; font-weight: 100;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 16px; cursor: pointer; }

.falta{ border: 1px solid red !important; }

.enviat{ position: absolute; font-size: 25px; font-weight: 400; color: #1abc9c; opacity: 0; z-index: -1; }

	.form_submit_other{ background-color: #1a1a1a; padding: 10px 25px; color: #fff; width: fit-content; margin: 20px 0 10px 0; font-weight: 100;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 16px; cursor: pointer; }

@media only screen and (max-width: 768px) {
	.contacte{ margin: 20px auto; }

	.contacte_form_mc{ padding: 20px; }

	.enviat{ font-size: 17px; }
}



/* BOOK =========================================================================================== */
.container_book{ margin: 20px auto 70px auto; width: 100%; max-width: 1200px; min-width: 320px; padding: 0 10px; position: relative;  }

.book_header_title{ padding: 10px 5px; }
.book_header_title_inner{ padding: 15px 20px; background-color: #262626; color: #fff; font-size: 27px; font-weight: 800; text-transform: uppercase; }

.book_link_autor{ padding-left: 5px; font-size: 12px; font-weight: 800; margin-bottom: 15px; text-decoration: underline; }
.book_link_autor a{ color: #000; }

.grid-item { width: 33.333%; padding: 5px; }
.grid-item img{ width: 100%; height: auto; }

@media only screen and (max-width: 768px) {
	.container_book{ padding: 3px; }

	.book_header_title{ padding: 10px 2px; }
	.book_header_title_inner{ font-size: 20px; }

	.grid-item { width: 50%; padding: 2px; }
}



/* VIDEOS =========================================================================================== */
.videos{ margin: 20px 0 70px 0; }

.videos_header_title{ padding: 20px; }
.videos_header_title_inner{ padding: 15px 20px; background-color: #262626; color: #fff; font-size: 27px; font-weight: 800; text-transform: uppercase; }

.videos_item{ width: 50%; float: left; padding: 20px; }

	.videos_title{ font-size: 16px; font-weight: 800; text-transform: uppercase; background-color: #f2f2f2; padding: 10px; }
	.videos_content{ font-size: 14px; margin: 7px 0 12px 0; line-height: 1.4; }

	.videos_img{ position: relative; }
		.videos_img img{ width: 100%; height: auto; 
			-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
			-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
			box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5); }

		.videos_img span{ position: absolute; font-size: 100px; color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%); }

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

	.videos_header_title{ padding: 0; }
	.videos_header_title_inner{ font-size: 20px; }

	.videos_item{ width: 100%; float: none; padding: 15px 0; }

		.videos_title{ font-size: 14px; }
		.videos_img span{ font-size: 60px; }
}



/* CURRICULUM =========================================================================== */
.container_contacto{  margin: 20px auto 70px auto; width: 100%; max-width: 700px; min-width: 320px; padding: 0 10px; position: relative; }

.cv_header_title{ padding: 0; margin-bottom: 15px; }
.cv_header_title_inner{ padding: 10px 15px; background-color: #262626; color: #fff; font-size: 22px; font-weight: 800; text-transform: uppercase; }

.cv_item{ margin: 30px 0; }

.cv_text{ padding: 0 15px; }

@media only screen and (max-width: 768px) {
	.cv_header_title_inner{ font-size: 18px; }
}


/* PER FER FUNCIONAR LA MAQUETACIO FLOAT DE CONTENT ------------------------------- */
.alignnone { margin: 5px 20px 20px 0; }
.aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; }
.alignright { float:right; margin: 0px 0 7px 7px; }
.alignleft { float: left; margin: 0px 7px 7px 0; }
a img.alignright { float: right; margin: 5px 0 7px 7px; }
a img.alignnone { margin: 5px 7px 7px 0; }
a img.alignleft { float: left; margin: 5px 7px 7px 0; }
a img.aligncenter { display: block; margin-left: auto; margin-right: auto }
.wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; padding: 5px 3px 10px; text-align: center; }
.wp-caption.alignnone { margin: 5px 20px 20px 0; }
.wp-caption.alignleft { margin: 5px 20px 20px 0; }
.wp-caption.alignright { margin: 5px 0 20px 20px; }
.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; }
/* Text meant only for screen readers. */
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; }
.screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto;
	left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ }