/*
    /////////////////////////////////////////////////////////
    \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\

    ----------------------------------
    MOBILE LAYOUT (max-width 767px)
    ----------------------------------

    1 SCROLL INDICATOR
    2 HEADER
    3 FOOTER
    4 MAIN MENU
    5 FIXED BAR

*/

@media (max-width: 767px) {


    /* 2 HEADER
    -----------*/

    body.path-webform header.header,
    body.page-node-type-static-page header.header,
    body.path-search header.header {
        top: 0;
    }

    header.header .site-logo {
        text-align: center;
        padding-top: 10px;
        left: auto;
        position: relative;
    }

    header.header .site-logo img {
        width: 145px !important;
    }

    header.header .block-language-blocklanguage-interface {
        right: 10px;
        width: 50%;
    }

    header.header .block-language-blocklanguage-interface a {
        color: #000!important;
        /* font-size: 5vw; */
    }

    header.header .block-language-blocklanguage-interface ul.dropdown-menu {
        background: #fff;
        padding: 20%;
        width: auto;
    }

    body.path-frontpage header.header,
	body.path-nagen header.header,
    body.path-investigacion header.header,
    body.path-servicios header.header,
    body.page-node-type-plataformas header.header,
    body.path-actualidad header.header,
    body.page-node-type-directorio header.header,
    body.page-node-type-proyectos header.header,
    body.page-node-type-noticias header.header,
    body.page-node-type-unidades header.header,
    body.page-node-type-eventos header.header,
    body.page-node-type-calls header.header,
    body.path-empleo header.header,
    body.page-node-type-empleo header.header,
    body.path-actividad header.header,
    body.path-navarrabiomed header.header,
	body.page-node-type-proyecto-innova header.header {
        background: #fff;
        height: 70px;
        top: 0;
    }

    body.path-frontpage #toggle-main-menu.button_container span,
    body.path-nagen #toggle-main-menu.button_container span,
    body.path-investigacion #toggle-main-menu.button_container span,
    body.path-servicios #toggle-main-menu.button_container span,
    body.page-node-type-plataformas #toggle-main-menu.button_container span,
    body.page-node-type-unidades #toggle-main-menu.button_container span,
    body.page-node-type-directorio #toggle-main-menu.button_container span,
    body.page-node-type-proyectos #toggle-main-menu.button_container span,
    body.page-node-type-noticias #toggle-main-menu.button_container span,
    body.path-actualidad #toggle-main-menu.button_container span,
    body.page-node-type-eventos #toggle-main-menu.button_container span,
    body.page-node-type-calls #toggle-main-menu.button_container span,
    body.path-empleo #toggle-main-menu.button_container span,
    body.page-node-type-empleo #toggle-main-menu.button_container span,
    body.path-actividad #toggle-main-menu.button_container span,
    body.path-navarrabiomed #toggle-main-menu.button_container span,
	body.page-node-type-proyecto-innova #toggle-main-menu.button_container span {
        background: #000;
    }

	header.header #toggle-main-menu.button_container.active {
		top: 30px;
		left: 15px;
	}

    header.header .search-button {
        right: 55px;

        top: 23px;
        background: url(../../images/lupa-black.png) no-repeat;
        width: 15px;
        height: 15px;
        background-size: cover;
    }

    section.search-section .block-search-form-block {
        padding: 2%;
        top: 70px;
        width: 100%;
    }

    section.search-section .block-search-form-block form .js-form-type-search .control-label {
        font-size: 4vw;
        padding-left: 0;
    }

    section.search-section .block-search-form-block form .js-form-type-search .input-group input.form-control {
        font-size: 6.5vw;
    }

    section.search-section .block-search-form-block form .js-form-type-search .input-group .js-form-submit::after {
        width: 20px;
        height: 20px;
        background-size: cover;
    }

    section.search-section .block-search-form-block .form-group {
        margin-bottom: 0;
    }

    body .main-container {
        margin-top: 70px;
    }



    /* 3. FOOTER
    ------------*/
    #block-logodelfooter .field--name-field-image-image-block {
        padding-left: 0;
		width: 200px;
    }

    footer.footer .field--name-field-logo-images-block .field--item {
        display: inline-block;
		margin: 0 20px 20px 0;
		width: 42%;
    }

    footer.footer #block-logotiposdelfooter {
        padding-bottom: 10px;
    }

    #block-piedepaginainferior {padding-right:0 !important;}
    #block-piedepaginainferior ul {padding-left: 0; }
    #block-piedepaginainferior ul  li {display: inline-block;}

    footer.footer .footer-bottom nav#block-piedepaginainferior {
        float: none;
        padding-top: 10px;
    }

    footer.footer .footer-bottom #block-direcciondelfooter {
        padding-top: 20px;
        padding-bottom: 10px;
    }

    footer.footer {
        margin-top: 5px;
        margin-left: 5px;
        margin-right: 5px;
		padding-top: 10%;
    }

	footer.footer .footer-top-2 nav h2,
	footer.footer .footer-top-3 #block-footer-social h2.block-title {
		margin-top: 30px;
	}

    footer.footer .field--name-field-links-logos-link-block .field--item {
        display: block;
        margin: 5% 0 !important;
    }

    footer.footer .field--name-field-links-logos-link-block .field--item img {
        margin: 0 auto;
        height: 40px;
    }


    /* 4 MAIN MENU
    --------------*/


    /* Toggle button */
    body.path-frontpage header.header.scrolled #toggle-main-menu.button_container.active {
        top: 40px;
        left: 30px;
    }

    #toggle-main-menu.button_container {
        left: 0px;
    }


    /* Overlay */
    #overlay-main-menu.overlay {
        width: 100%;
        border-right: 10px solid #FFF;
        top: -2px;
    }

    #overlay-main-menu.overlay ul li a {
        font-size: 28px;
    }

	#overlay-main-menu.overlay.open {
		border-left: 5px solid #fff;
		border-right: 5px solid #ffffff;
	}



    /* 6 FIXED BAR
     -------------*/

    .fixed-bar-overlay {
		background: #E2E9ED;
		width: 100%;
		position: fixed;
		bottom: 16px;
		left: 5px;
		z-index: 100;
		height: 0;
		transition: height 0.5s linear;
		border-right: 10px solid #FFF;
	}

	.fixed-bar-overlay #block-fixed-bar-localization-info .field--name-field-text-text-links-block {
		width: 85%;
		margin: 0 auto;
		font-size: 2.5vh;
		font-size: 16px;
	}

    .fixed-bar #block-direcciondelabarrafija ul {
        margin-left: 0;
    }

	.fixed-bar .col-lg-6 {
		width: 55%;
		float: left;
	}

	.fixed-bar .col-lg-6.text-right {
		width: 45%;
		float: left;
	}

    .field--name-field-body-basic-block .location a,
    .field--name-field-body-basic-block .email a,
    .field--name-field-body-basic-block .phone a  {
        color: transparent;
    }

    .field--name-field-body-basic-block .location a  {
        padding: 10px 3px 0 40px;
    }

    .field--name-field-body-basic-block .location a:hover {
        background-image: url(../../images/location.png);
        color: transparent;
    }

    .field--name-field-body-basic-block .email a  {
        padding: 5px 5px 0 50px;
    }

    .field--name-field-body-basic-block .email a:hover {
        background-image: url(../../images/mail.png);
        color: transparent;
    }

    .field--name-field-body-basic-block .phone a  {
        padding: 10px 10px 0px 12px;
        border-right: 1px solid #000;
    }
	
	.fixed-bar #block-direcciondelabarrafija ul {
		text-indent: -999999px;
	}
	
	.fixed-bar #block-direcciondelabarrafija a, 
	.fixed-bar #block-colaboraconnosotros a {
		cursor: pointer;
	}

    .fixed-bar #block-direcciondelabarrafija ul li {
        width: 50px;
    }

    .fixed-bar #block-fixed-bar-social a#fixed-social-dropdown {
        margin-right: 0;
    }

    .field--name-field-body-basic-block .phone a:hover {
        background-image: url(../../images/phone.png);
        color: transparent;
    }

    .field--name-field-body-basic-block .colabora a:hover {
        color: #000;
    }

    .field--name-field-body-basic-block .email a:hover {
        background-image: url(../../images/mail.png);
        color:transparent;
    }

    .location:before,
    .email:before,
    .phone:before,
    .colabora:before {
        display: none;
    }

	#block-direcciondelabarrafija {
		position: relative;
		left: -5px;
	}

	#block-colaboraconnosotros {
		left: -75px;
		display: inline-block;
		position: relative;
	}

	.fixed-bar #block-colaboraconnosotros .colabora {
		height: 36px;
		text-transform: uppercase;
		border-right: 1px solid #000;
		padding-top: 10px;
		position: absolute;
		left: -70px;
	}

	.fixed-bar #block-fixed-bar-social a#fixed-social-dropdown {
		border-right: 0;
	}

	.fixed-bar #block-fixed-bar-social .label-social, .fixed-bar #block-fixed-bar-social .dropup {
		right: 4px;
		display: inline;
		position: absolute;
	}

	.field--name-field-body-basic-block .email a {
    	background-position: 16px 12px;
	}

	.field--name-field-body-basic-block .phone a {
    	background-position: 18px 9px;
	}

    /* 7 SCROLLABLE MENU
    -------------------*/

    .scroll-menu {
        display: none;
    }

}