@media only screen and (max-width: 299px) {
	#grailsLogo .widthEscudo{width: 100%; padding-right: 0.10em;} 
	#webcontent h2 {font-size: 10vw !important;}
	#textAyunt h1{font-size: 12px !important;}
	#webcontent{width: 100%;font-size: 10px !important;}
}

@media only screen and (min-width: 300px) and (max-width: 320px) {
	#grailsLogo .widthEscudo{width: 100%; padding-right: 0.10em;} 
	#webcontent h2 {line-height: 2.5em;}
	#textAyunt h1{font-size: 12px !important;}
	#webcontent{width: 100%;font-size: 10px !important;}

}

@media only screen and (min-width: 300px) and (max-width: 499px){
	#webcontent{width: 100%;} 
	.ava-escudo .row h1 {line-height: 1.5em;}
}

@media only screen and (min-width: 321px) and (max-width: 360px){
	#grailsLogo .widthEscudo{width: 35%; padding-right: 0.10em;} 
	#webcontent{width: 100%;font-size: 10px !important;}
	#webcontent h2 {line-height: 2.5em;}
	#textAyunt h1{font-size: 12px !important;}
}

@media only screen and (min-width: 310px) and (max-width: 767px) {
	/****** Portada Publica ******/
	#grailsLogo {padding: 0.5em 0em 0.5em 0em;}
	/* Buscador */
	#search .container #buscadorPublic .text-right, 
	#search .container #buscadorPublic .top-text {text-align: center}
	#search .container #buscadorPublic div table {margin: auto;}
	#search .container #buscadorPublic #menuBuscador.compacto {display:none}
	#search .container #buscadorPublic #btnDesplegable {display:block; text-align: center; margin-top: 0.25em;padding-top:15px;padding-bottom:15px;cursor:pointer;}
	/* Ultima sesion */
	#last-session #multimediaContainer div {float: none; text-align: center;}
	#last-session #multimediaContainer {display: flex; flex-direction: column-reverse;}
	#last-session #multimediaContainer #session-info {margin: 0;}
	#last-session #multimediaContainer #session-info #last-session-label {text-align: center;}
	#last-session #multimediaContainer #session-info .btn-movil {display: none;}
	
	#last-session #session-info #last-session-title {font-size: 1.25em;}
	#last-session #session-info .btn-detail {margin-bottom: 0.5em;}
	
	#sessionsList .row .clearfix {display: none !important;}
	#sessionsList h2.last-sessions-label {margin:1em 0 0 0; border-bottom: 1px solid #444; color:#444; text-align: center;}
	/*Detalles de la sesion*/
	#session-detail #videoSignatureBtn, 
	#session-detail #sesion-document-list .doc-div .doc-sign-link {text-align: center;}
	
	#video-index-controls-social #social-networks {text-align: center; margin-top: 1em;}
	#video-index-controls-social #video-index-controls .btn-default {width: 100%; margin-top: 0.25em;}
	
	#video-index #indiceVideo .topic-row .topic-detaills {margin: 0.5em 0 0 0; font-size: 0.90em; float: left;}
	#video-index #indiceVideo .topic-row .text-right-sm {margin-top: 0.5em;}
	#video-index #indiceVideo .topic-row .text-right-sm a,
	#video-index #indiceVideo .topic-row .topic-detaills .timeSpan-box,
	#video-index #indiceVideo .topic-row .topic-detaills .topic-interventions-box {margin: 0;}
	
	#video-index #indiceVideo .topic-interventions span.intervention-block-badge {display: none;}
	#video-index #indiceVideo .topic-interventions .timeSpan-box,
	#video-index #indiceVideo .topic-interventions .topic-social-links,
	#video-index #indiceVideo .topic-interventions span.intervention-block {float: left;}
	#video-index #indiceVideo .topic-interventions span.intervention-block img.avatar {max-height: 6em;}
	
	/********* Footer ********/
	#footer .container .row div {text-align: -webkit-center; margin-bottom: 0.75em;}
}

@media only screen and (min-width: 374px) and (max-width: 533px) {
	#grailsLogo .widthEscudo{padding-right: 0.25em;} 
	#webcontent{width: 100%;text-align: center !important;}
	#textAyunt h1 {font-size: 16px !important;}
	.ava-escudo .row h1 {line-height: 1.5em;}
}

@media only screen and (min-width: 534px) and (max-width: 589px) {
	#grailsLogo .widthEscudo{padding-right: 0; width: 23%;} 
	#webcontent{width: 100%;text-align: center !important;}
	#textAyunt h1 {font-size: 18px !important;}
}

@media only screen and (min-width: 590px) and (max-width: 609px) {
	#webcontent h2{font-size: 27px !important;} 
}

@media only screen and (min-width: 610px) and (max-width: 770px) {
	#grailsLogo .widthEscudo{padding-right: 0; width: 16%;} 
	#webcontent h2{font-size: 26px !important;} 
	#textAyunt h1 {font-size: 18px !important;}
}

@media only screen and (min-width: 771px) {
	#grailsLogo .widthEscudo{padding-right: 0; width: 20%;}
}

@media only screen and (min-width: 989px) {
	#grailsLogo .widthEscudo{padding-right: 0; width: 16%;}
}

@media only screen and (min-width: 1204px){
	#grailsLogo .widthEscudo{padding-right: 0; width: 13%;}
}