/**
 * Skeleton v1.2-BibPatNumMines
 * Copyright 2011, Dave Gamache
 * www.getskeleton.com
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 6/20/2012
 *
 * Adapted by Daniel Berthereau for Mines ParisTech (12 columns for Omeka)
 * 25/01/2014
 */

/* Table of Contents
==================================================
    #Base 960 Grid (12 columns)
    #Full screen (> 1320 pixels)
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing
    #Specific layout for some pages
    */

/* #Base 960 Grid / Default format
================================================== */

.container {
    position: relative;
    width: 960px;
    margin: 0 auto;
    padding: 0;
}
.container .column,
.container .columns {
    float: left;
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
}
.row {    margin-bottom: 20px }

/* Nested Column Classes */
.column.alpha,
.columns.alpha {    margin-left: 0 }
.column.omega,
.columns.omega {    margin-right: 0 }

/*****************************
 *        12 Columns
 *            ((960/12) - 20) * 1 = 60
 *****************************/

/* Base Grid */
.container .one.column {    width: 60px }
.container .two.columns {    width: 140px }
.container .three.columns {    width: 220px }
.container .four.columns {    width: 300px }
.container .five.columns {    width: 380px }
.container .six.columns {    width: 460px }
.container .seven.columns {    width: 540px }
.container .eight.columns {    width: 620px }
.container .nine.columns {    width: 700px }
.container .ten.columns {    width: 780px }
.container .eleven.columns {    width: 860px }
.container .twelve.columns {    width: 940px }
.container .twelve.columns.row {    width: 908px }
.container .one-third.column {    width: 300px }
.container .two-thirds.column {    width: 620px }
.container .one-fourth-ten.column {    width: 180px }
.container .three-fourths-ten.column {    width: 600px }
.container .one.column.panel {    width: 40px }
.container .two.columns.panel {    width: 120px }
.container .three.columns.panel {    width: 200px }
.container .four.columns.panel {    width: 280px }
.container .five.columns.panel {    width: 360px }
.container .six.columns.panel {    width: 440px }
.container .seven.columns.panel {    width: 520px }
.container .eight.columns.panel {    width: 600px }
.container .nine.columns.panel {    width: 680px }
.container .ten.columns.panel {    width: 760px }
.container .eleven.columns.panel {    width: 840px }
.container .twelve.columns.panel {    width: 920px }
/* Offsets */
.container .offset-by-one {    margin-left: 80px }
.container .offset-by-two {    margin-left: 160px }
.container .offset-by-three {    margin-left: 240px }
.container .offset-by-four {    margin-left: 320px }
.container .offset-by-five {    margin-left: 400px }
.container .offset-by-six {    margin-left: 480px }
.container .offset-by-seven {    margin-left: 560px }
.container .offset-by-eight {    margin-left: 640px }
.container .offset-by-nine {    margin-left: 720px }
.container .offset-by-ten {    margin-left: 800px }
.container .offset-by-eleven {    margin-left: 880px }

.container .four.columns.minus { width: 275px }

/* #Full screen: Design for a width greater than 1320px.
 *================================================== */
@media only screen and (min-width: 1320px) {
    .container {    width: 1320px }
    .container .column,
    .container .columns {
        margin-left: 10px;
        margin-right: 10px;
    }
    .column.alpha,
    .columns.alpha {    margin-left: 0 }
    .column.omega,
    .columns.omega {    margin-right: 0 }
    /*****************************
     *            12 Columns
     *            ((1320/12) - 20) * 1 = 90
     *****************************/
    .container .one.column {    width: 90px }
    .container .two.columns {    width: 200px }
    .container .three.columns {    width: 310px }
    .container .four.columns {    width: 420px }
    .container .five.columns {    width: 530px }
    .container .six.columns {    width: 640px }
    .container .seven.columns {    width: 750px }
    .container .eight.columns {    width: 860px }
    .container .nine.columns {    width: 970px }
    .container .ten.columns {    width: 1080px }
    .container .eleven.columns {    width: 1190px }
    .container .twelve.columns {    width: 1300px }
    .container .one-third.column {    width: 420px }
    .container .two-thirds.column {    width: 860px }
    .container .one-fourth-ten.column {    width: 255px }
    .container .three-fourths-ten.column {    width: 825px }
    .container .one.column.panel {    width: 70px }
    .container .two.columns.panel {    width: 180px }
    .container .three.columns.panel {    width: 290px }
    .container .four.columns.panel {    width: 400px }
    .container .five.columns.panel {    width: 510px }
    .container .six.columns.panel {    width: 620px }
    .container .seven.columns.panel {    width: 730px }
    .container .eight.columns.panel {    width: 840px }
    .container .nine.columns.panel {    width: 950px }
    .container .ten.columns.panel {    width: 1060px }
    .container .eleven.columns.panel {    width: 1170px }
    .container .twelve.columns.panel {    width: 1280px }
    /* Offsets */
    .container .offset-by-one {    margin-left: 110px }
    .container .offset-by-two {    margin-left: 220px }
    .container .offset-by-three {    margin-left: 330px }
    .container .offset-by-four {    margin-left: 440px }
    .container .offset-by-five {    margin-left: 550px }
    .container .offset-by-six {    margin-left: 660px }
    .container .offset-by-seven {    margin-left: 770px }
    .container .offset-by-eight {    margin-left: 880px }
    .container .offset-by-nine {    margin-left: 990px }
    .container .offset-by-ten {    margin-left: 1100px }
    .container .offset-by-eleven {    margin-left: 1210px }

    .container .four.columns.minus { width: 395px }
}

/* #Tablet (Portrait): Design for a width of 768px.
 *================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container {    width: 768px }
    .container .column,
    .container .columns {
        margin-left: 10px;
        margin-right: 10px;
    }
    .column.alpha,
    .columns.alpha {    margin-left: 0 }
    .column.omega,
    .columns.omega {    margin-right: 0 }
    /*****************************
     *            12 Columns
     *            ((768/12) - 20) * 1 = 44
     *****************************/
    .container .one.column {    width: 44px }
    .container .two.columns {    width: 108px }
    .container .three.columns {    width: 172px }
    .container .four.columns {    width: 236px }
    .container .five.columns {    width: 300px }
    .container .six.columns {    width: 364px }
    .container .seven.columns {    width: 428px }
    .container .eight.columns {    width: 492px }
    .container .nine.columns {    width: 556px }
    .container .ten.columns {    width: 620px }
    .container .eleven.columns {    width: 684px }
    .container .twelve.columns {    width: 748px }
    .container .one-third.column {    width: 236px }
    .container .two-thirds.column {    width: 492px }
    .container .one-fourth-ten.column {    width: 140px }
    .container .three-fourths-ten.column {    width: 480px }
    .container .one.column.panel {    width: 24px }
    .container .two.columns.panel {    width: 88px }
    .container .three.columns.panel {    width: 152px }
    .container .four.columns.panel {    width: 216px }
    .container .five.columns.panel {    width: 280px }
    .container .six.columns.panel {    width: 344px }
    .container .seven.columns.panel {    width: 408px }
    .container .eight.columns.panel {    width: 472px }
    .container .nine.columns.panel {    width: 536px }
    .container .ten.columns.panel {    width: 600px }
    .container .eleven.columns.panel {    width: 664px }
    .container .twelve.columns.panel {    width: 728px }
    /* Offsets */
    .container .offset-by-one {    margin-left: 64px }
    .container .offset-by-two {    margin-left: 128px }
    .container .offset-by-three {    margin-left: 192px }
    .container .offset-by-four {    margin-left: 256px }
    .container .offset-by-five {    margin-left: 320px }
    .container .offset-by-six {    margin-left: 384px }
    .container .offset-by-seven {    margin-left: 448px }
    .container .offset-by-eight {    margin-left: 512px }
    .container .offset-by-nine {    margin-left: 576px }
    .container .offset-by-ten {    margin-left: 640px }
    .container .offset-by-eleven {    margin-left: 704px }

    .container .four.columns.minus { width: 211px }
}

/* #Mobile (Landscape): Design for a width of 480px.
 *================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container {    width: 420px }
    .container .columns,
    .container .column {    margin: 0 }
    .container .one.column,
    .container .one.columns,
    .container .two.columns,
    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .thirteen.columns,
    .container .fourteen.columns,
    .container .fifteen.columns,
    .container .sixteen.columns,
    .container .one-third.column,
    .container .two-thirds.column,
    .container .one-fourth-ten.column,
    .container .three-fourths-ten.column {    width: 420px }
    .container .one.column.panel,
    .container .two.columns.panel,
    .container .three.columns.panel,
    .container .four.columns.panel,
    .container .five.columns.panel,
    .container .six.columns.panel,
    .container .seven.columns.panel,
    .container .eight.columns.panel,
    .container .nine.columns.panel,
    .container .ten.columns.panel,
    .container .eleven.columns.panel,
    .container .twelve.columns.panel,
    .container .thirteen.columns.panel,
    .container .fourteen.columns.panel,
    .container .fifteen.columns.panel,
    .container .sixteen.columns.panel,
    .container .one-third.column.panel,
    .container .two-thirds.column.panel,
    .container .one-fourth-ten.column.panel,
    .container .three-fourths-ten.column.panel {    width: 400px }
    /* Offsets */
    .container .offset-by-one,
    .container .offset-by-two,
    .container .offset-by-three,
    .container .offset-by-four,
    .container .offset-by-five,
    .container .offset-by-six,
    .container .offset-by-seven,
    .container .offset-by-eight,
    .container .offset-by-nine,
    .container .offset-by-ten,
    .container .offset-by-eleven,
    .container .offset-by-twelve,
    .container .offset-by-thirteen,
    .container .offset-by-fourteen,
    .container .offset-by-fifteen {    margin-left: 0 }

    .container .four.columns.minus { width: 395px }
}

/*  #Mobile (Portrait): Design for a width of 320px.
 *================================================== */
@media only screen and (max-width: 479px) {
    .container {    width: 300px }
    .container .columns,
    .container .column {    margin: 0 }
    .container .one.column,
    .container .one.columns,
    .container .two.columns,
    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
    .container .thirteen.columns,
    .container .fourteen.columns,
    .container .fifteen.columns,
    .container .sixteen.columns,
    .container .one-third.column,
    .container .two-thirds.column,
    .container .one-fourth-ten.column,
    .container .three-fourths-ten.column {    width: 300px }
    .container .one.column.panel,
    .container .two.columns.panel,
    .container .three.columns.panel,
    .container .four.columns.panel,
    .container .five.columns.panel,
    .container .six.columns.panel,
    .container .seven.columns.panel,
    .container .eight.columns.panel,
    .container .nine.columns.panel,
    .container .ten.columns.panel,
    .container .eleven.columns.panel,
    .container .twelve.columns.panel,
    .container .thirteen.columns.panel,
    .container .fourteen.columns.panel,
    .container .fifteen.columns.panel,
    .container .sixteen.columns.panel,
    .container .one-third.column.panel,
    .container .two-thirds.column.panel,
    .container .one-fourth-ten.column.panel,
    .container .three-fourths-ten.column.panel {    width: 280px }
    /* Offsets */
    .container .offset-by-one,
    .container .offset-by-two,
    .container .offset-by-three,
    .container .offset-by-four,
    .container .offset-by-five,
    .container .offset-by-six,
    .container .offset-by-seven,
    .container .offset-by-eight,
    .container .offset-by-nine,
    .container .offset-by-ten,
    .container .offset-by-eleven,
    .container .offset-by-twelve,
    .container .offset-by-thirteen,
    .container .offset-by-fourteen,
    .container .offset-by-fifteen {    margin-left: 0 }

    .container .four.columns.minus { width: 275px }
}

/* #Clearing
================================================== */
/* Self Clearing Goodness */
.container:after {
    content: "\0020";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}
.row:after,
.clearfix:after {    clear: both }
.row,
.clearfix {    zoom: 1 }
/* You can also use a <br class="clear" /> to clear columns */
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

/* #Specific
================================================== */

#tabs section .row.unique {
    min-height: 280px;
}

/**
 * Full screen
 * Note: Design for a width greater than 1320px
 */
@media only screen and (min-width: 1320px) {
    .container .twelve.columns.row {
        width: 1268px;
    }

    nav.two.columns ul li a {
        width: 176px;
    }

    #tabs section .row.unique {
        min-height: 620px;
    }

    #tabs .row.unique-double img {
        width: 508px;
    }
    #tabs .row.unique img,
    #tabs .row.demi img,
    #tabs .row.un-tiers img,
    #tabs .row.deux-tiers img {
        width: 238px;
    }

    #collection-items #item-texts > li {
        margin-right: 1%;
        width: 15%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 1%;
        width: 9%;
    }
    /* Browse collection */
    /* Browse items */
    .collection_data.row,
    .item-meta.row {
        min-height: 192px;
    }
/*
    #collection-items .item-meta {
        height: 84px;
    }
*/
    .collection_image img,
    .item-img img {
        width: 184px;
    }
    /*11/07/2017 Avant 78px. Permet d’agrandir l’image tout en s’adaptant en % à la taille de la page. Pas une très bonne pratique mais seule solution trouvée pour le moment. */
    #collection-items .item-img a img {
        width: 50%;
    }
    .three.columns .collection_image img,
    .three.columns .item-img img {
        width: 298px;
    }
    .three.columns.gauche {
        width: 300px;
    }
    .rg-image img {
        max-height: 800px;
    }
}

/**
 * Full screen
 * Note: Design for a width greater than 960px
 */
@media only screen and (min-width: 960px) and (max-width: 1319px) {
    .container .twelve.columns.row {
        width: 908px;
    }

    nav.two.columns ul li a {
        width: 116px;
    }

    .container .nine.columns {
        width: 710px;
    }
    #search-container.five.columns,
    #advanced-form.five.columns {
        width: 390px;
    }

    #tabs section .row.unique {
        min-height: 456px;
    }

    #tabs .row.unique-double img {
        width: 360px;
    }
    #tabs .row.unique img,
    #tabs .row.demi img,
    #tabs .row.un-tiers img,
    #tabs .row.deux-tiers img {
        width: 160px;
    }

    #collection-items #item-texts > li {
        margin-right: 1%;
        width: 23%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 1%;
        width: 15%;
    }

    /* Browse collection */
    /* Browse items */
    .collection_data.row,
    .item-meta.row {
        min-height: 140px;
    }
/*
    #collection-items .item-meta {
        height: 84px;
    }
*/
    .collection_image img,
    .item-img img {
        width: 120px;
    }
    #collection-items .item-img a img {
        width: 78px;
    }
    .three.columns .collection_image img,
    .three.columns .item-img img {
        width: 208px;
    }
    .three.columns.gauche {
        width: 210px;
    }
    .rg-image img {
        max-height: 640px;
    }
}

/**
 * #Tablet (Portrait)
 * Note: Design for a width of 768px
 */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container .twelve.columns.row {
        width: 714px;
    }

    header #site-title,
    header #primary-nav {
        width: 576px;
    }
    header nav#primary-nav.top ul.navigation li {
        margin-right: 22px;
    }
    header nav#primary-nav.top ul.navigation li:last-of-type {
        margin-right: 0;
    }

    #tabs nav.two.columns ul li a {
        letter-spacing: -0.02em;
        padding-left: 5px;
        padding-right: 5px;
        /* width: 84px; */
        width: 98px;
    }

    #content #tabs section h2 {
        letter-spacing: -0.05em;
    }
    #content #tabs section .row.unique h2 {
        letter-spacing: normal;
    }

    #tabs section .row.unique {
        min-height: 360px;
    }

    #tabs .row.unique-double img {
        width: 278px;
    }
    #tabs .row.unique img,
    #tabs .row.demi img,
    #tabs .row.un-tiers img,
    #tabs .row.deux-tiers img {
        width: 122px;
    }

    #collection-items #item-texts > li {
        margin-right: 1%;
        width: 30%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 9px;
        width: 22%;
    }
/*
    .element-set .element .field {
        text-align: inherit;
    }
*/
    form #advanced-search:after {
      margin-top: -1.2em;
    }

    /* Browse collection */
    /* Browse items */
    .collection_data.row,
    .item-meta.row {
        min-height: 104px;
    }
/*
    #collection-items .item-meta {
        height: 108px;
    }
*/
    .collection_image img,
    .item-img img {
        width: 88px;
    }
    .three.columns .collection_image img,
    .three.columns .item-img img {
        width: 160px;
    }
    .three.columns.gauche {
        width: 162px;
    }
    .three.columns.gauche h2 {
        width: 162px;
        font-size: 1.8em;
    }

    /* ================== */
   /* Theme layout */

    #wrap {
/*        max-width: 95%; */
/*        margin: 36px auto; */
        margin: 0;
        padding: 0;
    }
    #admin-bar {
        position: relative;
        top: auto;
    }
    header {
/*        width: 100%; */
    }
    #home #primary {
        clear: right;
        width: 45%;
    }
    #items.show #primary {
        width: 95%;
    }
    #home #secondary {
        width: 45%;
        clear: left;
    }
    #primary-nav ul.navigation {
        list-style-type: none;
        font-size: medium;
    }
    footer {
        width: 100%;
/*        display: inline-block; */
    }
    footer .navigation {
        float: none;
        text-align: center;
    }
    #featured-item .item-description {
        font-size: 1.5em;
        word-wrap: break-word;
    }
    #search-container a {
/*        margin-left: -3%; */
        margin-left: 0;
    }
    #advanced-search {
        width: 4%;
    }
    #search-container a {
        font-size: 1.5em;
    }
    #search-container #advanced-form a {
        font-size: inherit;
    }
    #advanced-form {
        width: 70.5%;
        margin-left: 17.5em;
    }

    .horiz #primary .navigation.top li a,
    .horiz #primary .navigation.top li span {
        font-size: 1em;
        padding: 10px 2px 6px;
        text-transform: none;
    }

    footer #communication li {
        font-size: .9em;
    }
    #plandesite #adresse p {
        font-size: 0.65em;
    }
    .rg-image img {
        max-height: 480px;
    }
}

/**
 * #Mobile (Portrait)
 */
@media only screen and (max-width: 767px) {

   /* ================== */
   /* Theme layout */

    nav.two.columns ul li a {
        width: 396px;
    }

    #wrap {
        max-width: 95%;
/*        margin: 36px auto; */
        margin: 0;
        padding: 0;
    }
    #wrap p {
        font-size: 1.2em;
    }
    .item-description {
        font-size: 1.2em;
    }
    #admin-bar {
        position: relative;
        top: auto;
    }
/*
    header {
        width: 100%;
    }
*/
    #primary-nav .navigation {
        width: 10%;
    }
    #site-title {
        width: 100%;
        clear: left;
        text-align: center;
        margin-bottom: .75em;
    }
    #search-container {
        width: 100%;
        clear: both;
        /*text-align:center;*/
        margin-bottom: 10px;
    }
    #search-form input[type="text"] {
        width: 55%;
    }
    #home #primary {
        clear: both;
        width: 100%;
    }

    #content h1 {
        font-size: 1.2em;
    }
    #content #tabs section h2 {
        letter-spacing: -0.05em;
    }
    #content #tabs section .row.unique h2 {
        letter-spacing: normal;
    }

   #tabs section .row.unique {
        min-height: 300px;
        padding: 0;
    }

    #tabs .row.unique-double img {
        width: 278px;
    }
    #tabs .row.unique img,
    #tabs .row.demi img,
    #tabs .row.un-tiers img,
    #tabs .row.deux-tiers img {
        width: 122px;
    }

    #collection-items #item-texts > li {
        margin-right: 1%;
        width: 30%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 9px;
        width: 22%;
    }

    #items.show #primary {
        font-size: 1.5em;
        width: 95%;
    }
    #home #secondary {
        width: 100%;
        clear: both;
    }
    footer {
        width: 100%;
/*        display: inline-block; */
    }
    footer .navigation {
        float: none;
        text-align: center;
        font-size: 1.2em;
    }
    footer #bas {
        height: auto;
    }
    footer #communication li {
        float: inherit;
        border-right: 0;
    }
    #partenaire {
        height: auto;
    }
    #partenaire a {
        left: auto;
        right: auto;
        text-align: center;
    }

    .exhibit-text {
        clear: both;
        width: 95%;
    }
    #search-container a {
        margin-left: 0px;
    }
    #primary-nav {
        display: none;
    }
    #mobile-nav {
        display: block;
        clear: both;
        overflow: hidden;
        zoom: 1;
        border: 1px solid #ccc;
        border-width: 0 0 0 1px;
    }
    #mobile-nav ul {
        background: #fafafa;
        border-bottom: 1px solid #ccc;
        position: absolute;
        width: 419px;
        z-index: 199;
    }
    #mobile-nav li {
/*        width: 144px; */
        text-align: left;
        display: block;
        overflow: hidden;
    }
    #mobile-nav a {
        text-decoration: none;
        display: block;
        padding: 10px;
        border: 1px solid #ccc;
        border-width: 1px 1px 0 0;
    }
    #mobile-nav a.menu {
/*        width: 116px; */
        font-size: 1.5em;
        display: block;
    }
    #mobile-nav > a:first-child {
        background: #fafafa;
        cursor: pointer;
    }
    #mobile-nav a:hover {
        background: #fff;
    }
    #mobile-nav li.current a {
        background: #fff;
        color: #ff8000;
    }
    #mobile-nav li ul a:before {
        content: "-- ";
    }
    #mobile-nav li ul ul a:before {
        content: "---- ";
    }

    #document-nav a {
        text-decoration: none;
        display: block;
        padding: 10px;
        border: 0;
	color: #fff;
    }
    #document-nav a.menu {
/*        width: 116px; */
        font-size: 1.5em;
        display: block;
    }
    #document-nav > a:first-child {
        cursor: pointer;
    }
    #document-nav a:hover {
        background: #fff;
    }

    #advanced-form {
        width: 100%;
    }
    .element-text {
        font-size: 1.5em;
    }

    .horiz #primary .navigation.top li a,
    .horiz #primary .navigation.top li span {
        font-size: 1.2em;
        padding: 10px 6px 6px;
    }

    .scripto #primary #item-viewer,
    .scripto #primary #item-transcribe {
        min-height: 360px;
    }
    .page .gauche {
        min-height: 0;
    }

    #wrap #tabs p.explanation,
    #wrap #tabs .scripto-stats p,
    #wrap #tabs #item-tags p,
    #wrap #tabs #item-citation .element-text,
    #wrap #tabs #see-also p,
    #wrap #tabs .items-list li > a,
    #tabs h3 a,
    .items.show #itemfiles #item-images > div p {
        font-size: .8em;
    }
    .items.show #itemfiles #item-images > div p {
        padding-bottom: 6px;
    }
    .scripto .row h2 {
        font-size: .8em
    }

    .hentry {
        display: inline-block;
    }
}

/**
 * #Mobile (Landscape)
 * Note: Design for a width of 480px
 */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    nav.two.columns ul li a {
        width: 394px;
    }

    .container .twelve.columns.row {
        width: 420px;
    }

    #mobile-nav {
      display:block;
    }
    aside .gauche {
        display: none;
    }

    #content #page h1,
    #content #page h2,
    #content #page h3,
    #content #page h4,
    #content #page p {
        padding: 0 6px;
    }

    #tabs .row.unique-double img,
    #tabs .row.unique img,
    #tabs .row.demi img,
    #tabs .row.un-tiers img,
    #tabs .row.deux-tiers img {
        width: 300px;
    }

    #item-metadata .field,
    #collection-metadata .field {
        text-align: left;
    }
    .items.show #itemfiles #item-images span.label {
        display: inline-block;
        white-space: normal;
    }
    #collection-items #item-texts > li {
        margin-right: 1%;
        width: 47%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 9px;
        width: 22%;
    }

    /* Browse collection */
    #content #primary .collection .collection_data.row,
    #content #primary .collection .item-meta.row {
/*        height: 104px; */
/*        margin-bottom:0;*/
        margin-right:10px;
    }
    #content #primary .collection .collection_image.row,
    #content #primary .collection .item-img.row {
        display:none;
/*        height: 104px; */
        margin-left:10px;
        margin-right:10px;
        margin-top:0;
        margin-bottom:0;
    }
    .collection_image img,
    .item-img img {
/*        width: 96px; */
    }
    .browse #content #primary .item.hentry .item-meta.row {
      margin-left: 0;
    }
    .search-results .search-result .record-type,
    .search-results .search-result .item-img {
        display:none;
    }

   /* ================== */
   /* Theme layout */

    #wrap {
/*        max-width: 95%; */
/*        margin: 36px auto; */
        margin: 0;
        padding: 0;
    }
    #admin-bar {
        position: relative;
        top: auto;
    }
    header {
        width: 100%;
    }
    #site-title {
        width: 100%;
        clear: left;
        text-align: center;
        margin-bottom: .75em;
    }
    #search-container {
        width: 100%;
        clear: right;
        /*text-align:center;*/
        margin-bottom: 10px;
    }
    #home #primary {
        clear: right;
        width: 100%;
    }
    #items.show #primary {
        font-size: 1.5em;
        width: 95%;
    }
    #home #secondary {
        width: 100%;
        clear: left;
    }
    #primary-nav ul.navigation,
    .secondary-nav ul.navigation {
        list-style-type: none;
    }
    footer {
        width: 100%;
/*        display: inline-block; */
    }
    footer .navigation {
        float: none;
        text-align: center;
    }
    #search-container a {
        margin-left: 0px;
    }

    .horiz #primary .navigation.top li a,
    .horiz #primary .navigation.top li span {
        font-size: 1.2em;
        padding: 12px;
    }
}

/**
 * #Mobile (Portrait)
 * Note: Design for a width of 320px
 */
@media only screen and (max-width: 479px) {
    #wrap {
        max-width: 100%;
    }
    #partenaire {
        float: none;
    }

    header #logo a {
        left: auto;
        right: auto;
        text-align: center;
    }

    .container .twelve.columns.row {
        width: 300px;
        padding-left: 0;
        padding-right: 0;
    }

    nav.two.columns ul li a {
        width: 276px;
    }

    #mobile-nav {
      display:block;
    }
    aside .gauche {
        display: none;
    }
    #content #page h1,
    #content #page h2,
    #content #page h3,
    #content #page h4,
    #content #page p {
        padding: 0 6px;
    }

    #tabs .row.unique-double img,
    #tabs .row.unique img,
    #tabs .row.demi img,
    #tabs .row.un-tiers img,
    #tabs .row.deux-tiers img {
        width: 280px;
    }

    #item-metadata .field,
    #collection-metadata .field {
        text-align: left;
    }
    .items.show #itemfiles #item-images span.label {
        display: inline-block;
        white-space: normal;
    }
    #collection-items #item-texts > li {
        margin-right: 1%;
        width: 97%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 6px;
        width: 45%;
    }

    /* Browse collection */
    #content #primary .collection .collection_data.row,
    #content #primary .collection .item-meta.row {
/*        height: 104px; */
/*        margin-bottom:0;*/
        margin-right:10px;
    }
    #content #primary .collection .collection_image.row,
    #content #primary .collection .item-img.row {
        display:none;
/*        height: 104px; */
        margin-left:10px;
        margin-right:10px;
        margin-top:0;
        margin-bottom:0;
    }
    .collection_image img,
    .item-img img {
        width: 280px;
    }
    .browse #content #primary .item.hentry .item-meta.row {
      margin-left: 0;
    }
    .search-results .search-result .record-type,
    .search-results .search-result .item-img {
        display:none;
    }

    #mobile-nav  ul {
        width: 299px;
    }
    #tabs  form > div,
    #tabs  form > div > div {
        width: 282px;
    }
    #partenaire a {
        float: none;
        margin: auto;
        padding-bottom: 2px;
    }
}

@media only screen and (max-width: 320px) {
   /* ================== */
   /* Theme layout */

    #search-container input[type=submit].with-advanced {
        width: 25%;
    }
    a#advanced-search.button {
        width: 10%;
        left: 87%;
    }
    .items.show #itemfiles #item-images > div {
        margin-right: 6px;
        width: 45%;
    }
   #tabs section .row.unique {
        min-height: 300px;
        padding: 0;
    }
    #mobile-nav  ul {
        width: 299px;
    }
    #item-metadata .field,
    #collection-metadata .field {
        text-align: left;
    }

    #tabs form .inputs {
        width: 292px;
    }
    #partenaire a {
        float: none;
        margin: auto;
        padding-bottom: 2px;
    }
}
