/* ---------------------------------------- */
/* --- Custom style for Trésors de Nice --- */
/* ---------------------------------------- */

/* -------------------------------- */
/* Layout & Tool box */
/* -------------------------------- */

@font-face {
    font-family: 'Montserrat';
    src: url('Montserrat-Regular.eot');
    src: url('Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
    url('Montserrat-Regular.woff') format('woff'),
    url('Montserrat-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('Montserrat-Bold.eot');
    src: url('Montserrat-Bold.eot?#iefix') format('embedded-opentype'),
    url('Montserrat-Bold.woff') format('woff'),
    url('Montserrat-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('Montserrat-Light.eot');
    src: url('Montserrat-Light.eot?#iefix') format('embedded-opentype'),
    url('Montserrat-Light.woff') format('woff'),
    url('Montserrat-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

body {
    font-family: "Montserrat";
    color: #2f2c2c;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Montserrat";
    font-weight: 300;
}
h1 {
    font-size: 2rem;
}
h2 {
    font-size: 1.5em;
}

.ptb2 {
    padding: 2em 0;
}

.bg-header {
    padding: 1em 0 2em;
    overflow: hidden;
    background-color: #2f2c2c;
}

.logo {
    display: block;
    margin: 0 auto;
    width: 250px;
}

.logo-ville {
    display: block;
    margin: 0 auto .5rem;
}

.bg-content {
    background-color: #e7e7e7;
}
.bg-white {
    background-color: #fff;
}
.bg-footer {
    background-color: #2F2C2C;
    color: #fff;
}
.copyright {
    font-size: .875em;
    text-transform: uppercase;
    text-align: center;
}

.menu-footer  {
    margin: 2em 0 1em 0;
    text-align: center;
}
.menu-footer li {
    display: inline-block;
    margin-right: 2em;
}
.menu-footer li.last {
    margin-right: 0;
}
.menu-footer li a {
    color: #F7921E;
    text-decoration: none;
    text-transform: uppercase;
}
.menu-footer li a:hover {
    text-decoration: underline;
    color: #fff;
}

.bg-bleu {
    background-color: #13A5B9;
    color: #fff;
}
.bg-orange {
    background-color: #f7921e;
    color: #fff;
}
.bg-gris {
    background-color: #2f2c2c;
    color: #fff;
}

.fs6 {
    font-size: 6em;
    line-height: .8;
}
.fs2 {
    font-size: 1.5em;
}
.fs3 {
    font-size: 3em;
    line-height: .8;
}
.fs5 {
    font-size: 5em;
    line-height: .8;
}

.mb0 {
    margin-bottom: 0;
}
.mtb05, .briques p.mtb05 {
    margin: .5rem 0;
}
.ptb05 {
    padding: .5rem
}
.ptb15 {
    padding: 1.5rem 0;
}
.ptb2 {
    padding: 2rem 0;
}
.ptb35 {
    padding: 3.5rem 0;
}
.ptb5 {
    padding: 5rem 0;
}
.pb5 {
    padding-bottom: 5rem;
}
.pr0, .columns.pr0 {
    padding-right: 0;
}
.pl0, .columns.pl0 {
    padding-left: 0;
}
.psp {
    padding: 1.5rem 0 8px;
}
.br1 {
    border-right: 1px solid #2f2c2c;
}
.bl1 {
    border-left: 1px solid #2f2c2c;
}
.pa0 {
    padding: 0;
}

/* -------------------------------- */
/* Homepage */
/* -------------------------------- */

.homepage h1 {
    margin: 0;
    padding: 2em 0;
    font-size: 2em;
    font-weight: 300;
    text-align: center;
    text-transform: none;
}

.form-search {
    padding-left: 64px;
    color: #6b6b6b;
    background: #fff url("../images/search.svg") no-repeat 16px 3px / auto 80% ;
}

form select, form p {
    margin-bottom: 2em;
}
form select {
    border: 3px solid #fff;
    font-size: .85em;
    font-weight: 300;
    color: #2f2c2c;
    text-transform: uppercase;
    background-color: #e7e7e7;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' width='32' height='24' viewBox='0 0 32 24'><polygon points='0,0 32,0 16,24' style='fill: rgb%2819, 165, 185%29'></polygon></svg>");
}

.form-submit {
    padding: .75em 32px .75em 1.25em;
    text-transform: uppercase;
    color: #fff;
    background: #302c2d url("../images/search.svg") no-repeat right 8px / auto 60% ;
    border-right: 6px solid #302c2d;
    transition: all .2s;
}

.form-submit:hover {
    background-color: #13A5B9;
    border-right: 6px solid #13A5B9;
}

.briques {
    background-color: #fff;
    overflow: hidden;
}

.briques h2, .homepage h2 {
    margin: 0;
    padding: .75em 0;
    font-weight: normal;
    text-transform: uppercase;
    font-size: 2em;
    text-align: center;
}

.briques p {
    line-height: 1;
    margin: 0;
}

.briques .columns {
    position: relative;
    overflow: hidden;
}

.briques p small {
    font-weight: 300;
    text-transform: uppercase;
}

/* -------------------------------- */
/* Pages lieux */
/* -------------------------------- */

.page-lieu h1 {
    margin-bottom: 0;
    padding: 1.5em;
    font-size: 1.875rem;
    font-weight: 400;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
}
h3 {
    font-size: 1.5em;
    color: #f7921e;
    text-transform: uppercase;
}
.teaser {
    text-align: center;
    margin-bottom: 3rem;
}

.lien {
    padding: .25em 0;
    text-align: center;
    border: 3px solid #2f2c2c;
}
.lien a {
    text-decoration: none;
    transition: color .1s;
}
.lien a:hover {
    color: #f7921e;
}

.image-container {
    height: 100%;
}
.image-container img {
    opacity:0;
}

.textholder {
    padding: 1.5rem;
    color: #a0a0a0;
    font-size: .875em;
}
.pratique {
    text-align: center;
    color: #2f2c2c;
}



/* -------------------------------- */
/* Pages trésors/oeuvres */
/* -------------------------------- */

.page-oeuvre h1 {
    margin-bottom: 0;
    padding: 1.5em;
    font-size: 1.875rem;
    font-weight: 400;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
}

.page-oeuvre h2, h3, h4 {
	text-transform:uppercase;
}
.page-oeuvre .image-container {
	margin-right:20px;
}
.page-oeuvre h2 {
	font-weight:bold;
}
.page-oeuvre h3 {
	color: #000;
	border:2px solid;
	display:inline-block;
	padding:10px 20px;
    font-size: 1.3em;
}
.page-oeuvre .image-container h4 {
	margin-top:20px;
}
.page-oeuvre .legende {

}

.case {
    text-align: center;
	padding:10px;
	margin:0 10px 20px;
    font-size:1.125em;
    color:#000;
}

figure {
    margin: 0 0 1em;
    text-align: center;
}
figcaption {
    padding: .25em .5em;
    text-align: center;
    font-size:0.8em;
}
figcaption span {
    color: grey;
}

.description {
    font-weight: lighter;
}

.cartel {
    padding: 1em;
    background-color: #fff;
}
.cartel dl {
    margin: 0;
}
.cartel dl dt {
    margin-bottom: 0;
    float: left;
    width: 110px;
    overflow: hidden;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #13A5B9;
    font-weight: 400;
}
.cartel dl dd {
    margin-left: 115px;
    color: grey;
}

.cartel a {
    color: #F7921E;
}

ul.partage {
    margin: 0;
    text-align: right;
    transition: all .2s;
    list-style-type: none;
    overflow: hidden;
}
ul.partage li {
    margin: 0;
    float: left;
    width: 50%;
    text-align: center;
    transition: all .2s;
}
ul.partage li span {
    display: inline-block;
    width: 100%;
}
ul.partage li a {
    display: inline-block;
    width: 100%;
    color: #fff;
    text-indent: -9999px;
}
ul.partage li .tw-share-button a {
    background-position: center center;
}
ul.partage li .fb-share-button a {
    background-position: center center;
}
.fb-share-button {
    background-color: #4267b2;
}
.tw-share-button {
    background-color: #1b95e0;
}
.fb-share-button a {
    padding: .25em .25em .25em 24px;
    color: #fff;
    font-weight: bold;
    background: #4267b2 url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAxNiIgY2xhc3M9Il8xcGJxIj48cGF0aCBmaWxsPSIjZmZmZmZmIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik04IDE0SDMuNjY3QzIuNzMzIDEzLjkgMiAxMy4xNjcgMiAxMi4yMzNWMy42NjdBMS42NSAxLjY1IDAgMCAxICAgICAgICAgICAgMy42NjcgMmg4LjY2NkExLjY1IDEuNjUgMCAwIDEgMTQgMy42Njd2OC41NjZjMCAuOTM0LS43MzMgICAgICAgICAgICAxLjY2Ny0xLjY2NyAgICAgICAgICAgIDEuNzY3SDEwdi0zLjk2N2gxLjNsLjctMi4wNjZoLTJWNi45MzNjMC0uNDY2LjE2Ny0uOS44NjctLjlIMTJ2LTEuOGMuMDMzICAgICAgICAgICAgMC0uOTMzLS4yNjYtMS41MzMtLjI2Ni0xLjI2NyAwLTIuNDM0LjctMi40NjcgICAgICAgICAgICAyLjEzM3YxLjg2N0g2djIuMDY2aDJWMTR6Ij48L3BhdGg+PC9zdmc+) no-repeat 3px 3px/20px 20px;
}
.fb-share-button a:hover {
    text-decoration: none;
    background-color: #365899;
}
.tw-share-button a {
    padding: .25em .25em .25em 24px;
    color: #fff;
    font-weight: bold;
    background: #1b95e0 url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2072%2072%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h72v72H0z%22%2F%3E%3Cpath%20class%3D%22icon%22%20fill%3D%22%23fff%22%20d%3D%22M68.812%2015.14c-2.348%201.04-4.87%201.744-7.52%202.06%202.704-1.62%204.78-4.186%205.757-7.243-2.53%201.5-5.33%202.592-8.314%203.176C56.35%2010.59%2052.948%209%2049.182%209c-7.23%200-13.092%205.86-13.092%2013.093%200%201.026.118%202.02.338%202.98C25.543%2024.527%2015.9%2019.318%209.44%2011.396c-1.125%201.936-1.77%204.184-1.77%206.58%200%204.543%202.312%208.552%205.824%2010.9-2.146-.07-4.165-.658-5.93-1.64-.002.056-.002.11-.002.163%200%206.345%204.513%2011.638%2010.504%2012.84-1.1.298-2.256.457-3.45.457-.845%200-1.666-.078-2.464-.23%201.667%205.2%206.5%208.985%2012.23%209.09-4.482%203.51-10.13%205.605-16.26%205.605-1.055%200-2.096-.06-3.122-.184%205.794%203.717%2012.676%205.882%2020.067%205.882%2024.083%200%2037.25-19.95%2037.25-37.25%200-.565-.013-1.133-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E") no-repeat 3px 3px/20px 20px;
}
.tw-share-button a:hover {
    text-decoration: none;
    background-color: #0c7abf;
}


/* -------------------------------- */
/* Blocs trésors */
/* -------------------------------- */

.bloc-tresor {
    margin-bottom: 1.5rem;
    border: 2px solid #13A5B9;
}
.bloc-tresor figure {
    margin-bottom: 0;
}
.bloc-tresor a {
    text-decoration: none;
}

.bloc-tresor .imageholder {
    padding: 1px 2px 0;
    width: 100%;
    height: 250px;
    line-height: 248px;
}

.bloc-tresor .imageholder img {
    padding: 6px;
    max-width: 100%;
    max-height: 100%;
    display:inline-block;
    vertical-align:middle;
}

.bloc-tresor figcaption {
    padding: 6px;
    font-size: .875em;
    background-color: #13A5B9;

}
.bloc-tresor figcaption span {
    color: #fff;
}
.bloc-tresor figcaption span:first-child {
    color: #e7e7e7;
}

/* -------------------------------- */
/* Page de base */
/* -------------------------------- */

.page h1 {
    margin-bottom: 0;
    padding: 1.5em;
    font-size: 1.875rem;
    font-weight: 400;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
}


.boltform-message {
    text-align: center;
    padding: .5em 1em;
    background-color: green;
    color: #fff;
}

/* -------------------------------- */
/* Medias queries pour responsive ! */
/* -------------------------------- */

.ligne-blocs > div {
    clear: none;
}

/* Small only */
@media screen and (max-width: 28.75em) {

    .ligne-blocs .small-6 {
        width: 100%;
    }

}

@media screen and (max-width: 40em) {

    .ligne-blocs > div:nth-child(2n+1) {
        clear: left;
    }

}

/* Medium and up */
@media screen and (min-width: 40em) {

    .ligne-blocs .column, .ligne-blocs .columns {
        padding-left: .75rem;
        padding-right: .75rem;
    }
    .ligne-blocs > div:nth-child(2n+1) {
        clear: none;
    }
    .ligne-blocs > div:nth-child(3n+1) {
        clear: left;
    }

}



/* Large and up */
@media screen and (min-width: 64em) {

	.page-oeuvre  .case {
		max-width:30%;
	}
    .ligne-blocs > div:nth-child(2n+1) {
        clear: none;
    }
    .ligne-blocs > div:nth-child(3n+1) {
        clear: none;
    }
    .ligne-blocs > div:nth-child(4n+1) {
        clear: left;
    }

}
