.ol-control button {
    color:#000;
    background-color:#fff;
}
.ol-control button:hover {
    background-color:rgba(255, 255, 255, 0.5);
}
.ol-rotate {
    top:45px;
}
.toogle-3d {
    top: 65px;
    left: .5em;
}
.ol-touch .toogle-3d {
    top: 80px;
}
/*
.ol-zoomslider-thumb {
    background-color:#fff;
}
.ol-zoomslider, .ol-zoomslider:hover {
    background-color:transparent;
}
.ol-zoom .ol-zoom-out {
    margin-top: 204px;
}
.ol-zoomslider {
    background-color: transparent;
    top: 2.3em;
}
.ol-touch .ol-zoom .ol-zoom-out { 
    margin-top: 212px;
}
.ol-touch .ol-zoomslider {
    top: 2.75em;
}
.ol-zoom-in.ol-has-tooltip:hover [role=tooltip],
.ol-zoom-in.ol-has-tooltip:focus [role=tooltip] {
    top: 3px;
}
.ol-zoom-out.ol-has-tooltip:hover [role=tooltip],
.ol-zoom-out.ol-has-tooltip:focus [role=tooltip] {
    top: 232px;
}
*/
body {
    font-family: 'Open Sans', 'Helvetica Neue', 'Arial', sans-serif;
    font-size: 14px;
    color: #fff;
}

h1, h2, h3, h4 {
    font-family: 'Montserrat', 'Helvetica Neue', 'Arial', sans-serif;
}
h1.small {
    font-size:1.7em;
}
h2.small {
    font-size:1.5em;
}
h3.small {
    font-size:1.3em;
}
h4.small {
    font-size:1.1em;
}

a {
    color:#fff;
}
a.fa, a.colored {
    color:orange;
}
a:hover {
    color:orange;
}
a.fa:hover {
    opacity:0.8;
}

a.dark {
    color:#EB7420;
}
a.dark:hover {
    color:orange;
}

.color__theia {
    color:#EB7420;
}
    
/************************************
 *
 * Shared classes
 *
 ************************************/
.coverbg {
    background: url('../img/bg_4.jpg') no-repeat center center;
    min-width: 100%;min-height: 300px;
    width: auto;height: 300px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    z-index:-100;
}
.coverbg.almostcovered {
    min-height: 80vh;
}
.bgdark {
    //background-color: #000;
    background-color: #343434;
    color:#fff;
}
.bglight {
    background-color: #f7f8fa;
    color:#000; 
}
.bglight a {
    color:#000; 
}
.bglight a:hover {
    color:orange; 
}
.bgmiddle {
    background-color: darkgray;
    color:#fff; 
}
.center {
    text-align: center;
}
.justified {
    text-align: justify;
}
.content__page {
    text-align:center;
    color:#fff;
}
.content__page.almostcovered {
    height:310px;
}
.button {
    background-color: orange;
    padding:10px 20px;
}
.button.disabled, .button[disabled] {
    background-color: orange;
    border-color: orange;
    box-shadow: none;
    color: #fff;
    cursor: default;
    opacity: 0.7;
}
.smaller{
    font-size:0.6em;
}
.smallest {
    font-size:0.4em;
}
.bigger{
    font-size:1.2em;
}
.pin-top, .pin-bottom {
    position: absolute;
}
.pin-top {
    top:0px;
}
.pin-bottom {
    bottom:0px;
}
.pin-right {
    right:0px;
}
.padded {
    padding:20px;
}
.padded-top {
    padding-top:20px;
}
.padded-bottom {
    padding-bottom:20px;
}
.padded-left {
    padding-left:20px;
}
.padded-right {
    padding-right:20px;
}
.padded-small {
    padding:10px;
}
.padded-small-left {
    padding-left: 10px;
}
.padded-small-right {
    padding-right: 10px;
}
.padded-small-top {
    padding-top: 10px;
}
.padded-small-bottom {
    padding-bottom: 10px;
}
.padded-medium-bottom {
    padding-bottom: 20px;
}
.shadowed {
    box-shadow: 1px 1px 5px #000;
}
.fullWidth {
    width:100%;
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
}
.light {
    color:gray;
    //color:#CECECE;
}
.unbreakable {
    white-space: nowrap;
}
table.niceTable {
    padding:0px 20px;
    width:100%;
}
table.niceTable tr {
    border-bottom:1px lightgray solid 
}
table.niceTable th {
    background-color:lightgray;
}
table.niceTable td {
    padding:10px;
    text-align:left;
    vertical-align:top;
}

div.tableContainer {
    padding-left: 25px;
    padding-right: 25px;
}

div.tableContainer table {
    width: 100%;
}

.tableContainer__margin-top {
    margin-top: 40px;
}

div.tableContainer tr {
    border-bottom:1px lightgray solid 
}

/************************************
 *
 * Navigation menu
 *
 *      shared/header/header.html
 * 
 ************************************/
header {
    position: fixed;
    top: 0px;
    left: 0px;
    padding: 10px 100px 0;;
    width: 100%;
    height:50px;
    display: inline;
    z-index:100;
}
nav .nav__content {
    display: block;
    float: right;
}
nav .link {
    display: inline;
    list-style: none;
    margin: 10px;
    cursor: pointer;
}
nav .link.active {
    color:orange;
    border-bottom: 2px solid orange;
    padding-bottom: 15px;
}
nav .link--signup {
    border: 1px solid #e5e5e5;
    padding:5px 10px;
}
nav .link--signin {
    color: white;
    background-color: orange;
    padding:5px 10px;
}
.resto-logo {
    cursor: pointer;
    position:absolute;
    top:0px;
    left:100px;
    z-index:20;
    font-size: 30px;
}

nav.left-menu .link {
    display:block;
}
.gravatar,.gravatar-big {
    border-radius:50%;
    background-size:100% 100%;
}
.gravatar {
    width:30px;
    height:30px;
    vertical-align: middle;
}
.gravatar-big {
    width:125px;
    height:125px;
}

/***** Gestion des sous-menus ******/
.nav__content ul {
    display: none; // On masque les sous-menus par défaut
}

.nav__content, .nav__content ul {
    list-style-type: none;
    margin: 0px;
    padding: 3px;
}

.nav__content li:hover ul {
    display: block;
    position: absolute;
    left: 0px;
    z-index: 100;
    padding: 15px 0px;
    top: 12px;
}

.nav__content ul li {
    background-color: #343434;
}

.nav__content li {
    position: relative;
    white-space: nowrap;
    padding: 2px;
}
.nav__content ul a {
    display: block;
}

/************************************
 *
 * Home page
 *
 *      components/home/home.html
 * 
 ************************************/
.content__description {
    position:absolute;
    top:0px;
    width:100%;
    padding:100px 25px 0px 25px;
}
.content__start {
    padding-bottom: 35px;
}
.content__start h1 {
    color:#fff;
}
.content__start p {
    font-size:20px;
    max-width:80%;
    margin:auto;
}
.content__search {
    padding-top:30px;
}
.resto-search {
    line-height: 50px;
    padding-left:20px;
}
.content__search input, .content__search input:focus {
    background: url('../img/search_darker.png') no-repeat scroll 97% 50% / 20px 20px rgba(255, 255, 255, 0.8);
    color:#2f2f2f;
    border: medium none;
    border-radius: 3px;
    display: inline-block;
    width:350px;
    margin:0px;
}
.content__search--last .latest {
    color:#000;
    padding:10px 0px;
}
.content__register {
    text-align:center;
    padding:50px 0px;
}
.content__register .button {
    font-size:2em;
    margin:0px 20px;
}
.bconfirm, a.bconfirm {
    //background-color: #34bf49;
    background-color: orange;
    color:#fff;
}

a.bconfirm:hover {
    background-color: #34bf49;
    color:#fff;
}

.bcancel {
    //background-color: #c7ced2;
    background-color: orange;
    color:#fff;
}
.bwarning {
    background-color: #f00;
    color:#fff;
}
.content__statistics, .content__statistics a  {
    color:#000;
    text-align: left;
}

/************************************
 *
 * SignIn
 *
 *      components/signin/signIn.html
 * 
 ************************************/
.content_signin {
    padding-top: 100px;
}
.content_signin h2, content_signin h4 {
    color:#000;
}

/************************************
 *
 * Help / about
 *
 *      components/help/help.html
 * 
 ************************************/
.content_help {
    padding-top: 100px;
    color:#000;
}
.content_help h2, content_help h4, .content_help p {
    color:#000;
}

/************************************
 *
 * Documents
 *
 *      components/documents/documents.html
 * 
 ************************************/
.content_documents {
    padding-top: 100px;
    color:#000;
}
.content_documents h2, content_documents h4, .content_documents p {
    color:#000;
}

/************************************
 *
 * Sites
 *
 *      components/sites/sites.html
 * 
 ************************************/
.content_sites {
    padding-top: 100px;
    color:#000;
}
.content_sites h2, content_sites h4, .content_sites p {
    color:#000;
}

/************************************
 *
 * Contact
 *
 *      components/contact/contact.html
 * 
 ************************************/
.content_contact {
    padding-top: 100px;
    color:#000;
}
.content_contact h2, content_contact h4, .content_contact p {
    color:#000;
}

/************************************
 *
 * Register
 *
 *      components/register/register.html
 * 
 ************************************/
.content_register {
    padding-top: 100px;
}
.content_register h2, content_register h4 {
    color:#000;
}
/************************************
 *
 * Search page
 *
 *      components/features/search.html
 * 
 ************************************/
h1.collection {
    font-size: 35px;
}

p.description {
    font-size: 12px;
    margin-bottom: 10px;
}

.features-search {
    position:fixed;
    top:50px;
    left:25%;
    right:25%;
    height:60px;
    z-index:100;
    text-align: center;
    padding:5px;
}
.features-search input, .features-search input:focus {
    background: url('../img/search_darker.png') no-repeat scroll 97% 50% / 20px 20px rgba(255, 255, 255, 1);
    color:#2f2f2f;
    border: medium none;
    border-radius: 3px;
    display: inline-block;
    width:100%;
    margin:0px;
}
.features-search select {
    width: auto;
}
.content__menu {
    position: fixed;
    bottom:0px;
    left:0px;
    height: 35px;
    width: 100%;
    z-index:1000;
}
.content__menu ul {
    margin: 0;
    padding: 0;
    text-align: center;
    display: table;
    table-layout: fixed;
    width:100%;
    height:100%;
} 
.content__menu li {
    display: table-cell;
    list-style-type: none;
    vertical-align: middle;
    margin: 4px;
    cursor: pointer;
}
.content__menu li.active {
    background-color:orange;
}
.content__features  {
    margin-left:0px;
    padding-top:110px;
}
#map {
    position:absolute;
    top:50px;
    left:0px;
    bottom:35px;
    right:0px;
}
#mapmenu {
    position:absolute;
    cursor:pointer;
    width:auto;
    display:none;
    z-index:1000;
}
#mapmenu .item {
    position:absolute;
    height:60px;
    width:60px;
    line-height: 60px;
    padding:7px;
    background-color:#fff;
    color:#000;
    border-radius: 50%;
    text-align:center;
}
.loadmore {
    width:100%;
    padding:60px 0px;
    text-align:center;
    cursor: pointer;
}
.search-menu__content {
    color:#000;
}
#staticmap {
    width:100%;
    height:450px;
}

.panel-list {
    color:#000;
    padding-top:60px;
}
.panel-list img.thumbs {
    cursor:pointer;
    height:75px;
    width:75px;
}
a.loadmore-list {
    color:#fff;
    background-color:#f00;
    padding:5px 10px;
    float:right;
    text-align:right;
}

a.load-list {
    color:#fff;
    background-color:#f00;
    padding:5px 10px;
}

a.page:hover {
    color:orange;
}


/************************************
 *
 * Feature page
 *
 *      components/features/feature.html
 * 
 ************************************/
.content__feature  {
    margin-left:0px;
    padding-top:50px;
}
.content__feature h5 {
    color:#000;
    font-style: italic;
}
.feature-actions {
    margin-top:40px;
}
.content__feature-metadata {
    background-color: #000;
    color:#fff;
    text-align: left;
}
.content__feature-metadata h5 {
    color:orange;
}
.feature-keywords h5 {
    color:#000;
    font-style: normal;
}
.feature-keywords a.keyword {
    color:#000;
    font-style: italic;
}
.feature-keywords a.keyword:hover {
    color:orange;
}
.collection-description a {
    color:#000;
}
.collection-description p {
    color:darkgray;
    font-style: italic;
    font-size: 0.8em;
}
/************************************
 *
 * Cart page
 *
 *      components/cart/cart.html
 * 
 ************************************/
.content__cart {
    color:#000;
    padding:20px 20px 20px 20px;
}
.content__cart .checkout {
    color:#fff;
    background-color:#f00;
    padding:5px 10px;
    float:right;
    text-align:right;
}
.content__cart .checkout__download {
    color:#fff;
    background-color:#f00;
    padding:5px 10px;
    text-align:right;
}
.content__cart-header {
    padding-top:50px;
}
.content__cart-header h2 {
    text-align:center;
    padding:20px;
}
.content__cart img.thumbs {
    cursor:pointer;
    height:125px;
}

/************************************
 *
 * Profile page
 *
 *      components/profile/profile.html
 * 
 ************************************/
.content__profile {
    color:#000;
    padding:20px 20px 20px 20px;
}
.content__profile-header {
    padding-top:50px;
}
.content__profile-header h5 {
    color:darkgray;
}
.radio-tab-profile-wrapper {
  clear: both;
  display: inline-block;
  width: 100%;
  border-bottom: 1px solid #428bca;
  padding: 0 10px;
  position: relative;
}

input.radio-tab-profile {
  position: absolute;
  left: -99999em;
  top: -99999em;

	& + label {
		cursor: pointer;
		float: left;
		border: 1px solid #aaa;
		border-bottom: 0;
		background-color: #fff;
		margin-right: -1px;
		padding: .5em 1em;
		position: relative;
        
     &:hover {
       background-color: #eee;
     }
	}

	&:checked + label {
		box-shadow: 0 3px 0 -1px #fff,
       inset 0 5px 0 -1px #13CD4A;
		background-color: #fff;
     border-color: #428bca;
		z-index: 1;
	}
}

/************************************
 *
 * Growl
 *
 ************************************/
.alert-error {
    background-color:red
}
.alert-warning {
    background-color:orange;
}
.alert-success {
    background-color: green;
}
.growl-container.growl-fixed.top-center {
    top:100px;
}

/************************************
 *
 * Left menu for mobile
 *
 ************************************/
#menuleft {
    left:-50%;
    position:fixed;
    top:50px;
    width:50%;
    height:100%;
    z-index:1000;
    background-color:#000;
    display:block
}
#menuleft.slide {
    left:0
}
.slide, .hide{
    transition: all 0.2s ease;
}
.overlay {
    left:0;
    top:50px;
    transition: all 0.2s ease;
}
.overlay.show {
    position:fixed;
    left:50%;
    right:0;
    bottom:0;
    background-color:rgba(0, 0, 0, 0.8);
    z-index:9999
}

#menuleft h1 {background-color:#424242;color:#eee;font-size:1.2em;line-height:50px;text-align:center;float:none !important}
#menuleft a{display:block;width:98%;padding:10px 0 10px 2%;color:#424242;border-bottom:1px solid #424242}

/************************************
 *
 * Left menu for mobile
 *
 ************************************/
.loading-mask {
    position: fixed;
    z-index: 100000;
    top: 50px;
    left: 0px;
    right:0px;
    bottom:0px;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    text-align: center;
    line-height: 100vh;
}

.footer {
    width:100%;
    height:40px;
    background-color:#2f2f2f;
    text-align: center;
}

/************************************
 *
 * Masonry
 * 
 ************************************/
.masonry {
    margin: 0 auto;
}
.grid-sizer {
    width:20%;
}
.masonry-brick {
    display:none;
    padding:10px;
}
.search-menu {
    width:40%;
    height:200px;
    padding:10px;
}
.search-menu .onmap {
    position:absolute;
    top:10px;
    left:10px;
}
.search-menu__content {
    background-color:#f7f8fa;
    padding:10px;
    width:100%;
    height:100%;
}
.search-menu h5 {
    width:100%;
}
.redalert {
    color:#f00;
}
.search-menu-what {
    color:#000;
    background-color:orange;
    padding:5px 0px;
}
.masonry-brick.loaded {
    display: block;
}
.feature-info {
    position: absolute;top:0;left:0;right:0;bottom:0;
    text-decoration: none;
    color: #000;
    cursor: pointer;
}
.feature-info a {
    color:orange;
}
.feature-info .title {
    background-color: rgba(0,0,0,0.80);
    color: #fff;
    text-align: left;
    font-size: 12px;
    padding:10px;
    margin:10px;
}
.feature-info .description {
    position:absolute;bottom:0;left:0;right:0px;
    margin: 10px;
    opacity:0;
}
.feature-info .description p {
    margin: 20px;
}
ul.feature-square {
    display: block;
    margin:0;
    padding:0;
    width: 100%;
}
.feature-square li {
    display: inline-block;
    list-style-type: none;
    vertical-align: middle;
    margin: 4px;
    width:calc(100vw / 5 * 0.9);
    height:calc(100vw / 5 * 0.9);
    background-color:orange;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.feature-square-info {
    background-color: orange;
    padding:4px;
    text-decoration: none;
    color: #fff;
    width:calc(100vw / 5 * 0.9);
    height:calc(100vw / 5 * 0.9);
    text-align: center;
    opacity:0;
}
.feature-square-info .title {
    padding-top:10px;
    font-size: 15px;
}

ul.feature-square__collection {
    display: block;
    margin:0;
    padding:0;
    width: 100%;
}

ul.feature-square__collection li:hover {
    opacity: 1;
}

.feature-square__collection li {
    display: inline-block;
    list-style-type: none;
    vertical-align: middle;
    //margin: 4px;
    padding: 10px;
}

div.feature-square__collection--content {
    cursor: pointer;
    height: 100%;
    width: 100%;
    padding: 10px;
    background-color:grey;
    opacity: 0.8;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
} 

div.feature-square__collection--content:hover {
    opacity: 1;
} 

/************************************
 *
 * Responsive assertions
 *
 ************************************/
@media only screen and (max-width: 64.063em) {
    header {
        padding-right: 10px;
    }
    .resto-logo {
        left:10px;
    }
    .feature-actions {
        margin-top:0px;
    }
}

/*
 * Hover implementation only for non touch devices
 */
@media only screen and (min-width: 64.063em) {
    .button:hover, .button.disabled:hover, .button[disabled]:hover {
        background-color: rgba(252, 76, 2, 0.8);
    }
    nav .link:hover {
        color: orange;
    }
    nav .link--signin:hover {
        color: black;
        opacity: 0.8;
    }
    .content__statistics a:hover  {
        color:orange;
    }
    .content__menu li:hover {
        opacity:0.4;
    }
    #mapmenu .item:hover {
        background-color:rgb(227, 65, 26);
        color:#fff;
    }
    .landuse img:hover {
        background-color:rgb(227, 65, 26);
    }
    .feature-info a:hover {
        color:#000;
    }
    .feature:hover .feature-info {
        background-color: rgba(255,255,255,0.5);
        color:#000;
        display: block;
    }
    .feature:hover .description {
        opacity:1;
    }
    .feature-square-info:hover {
        opacity:1;
    }
}

@media (max-width: 1200px) {
    .grid-sizer {
        width:25%;
    }
    .search-menu {
        width:50%;
    }
}
@media (max-width: 1000px) {
    .grid-sizer {
        width:33%;
    }
    .search-menu {
        width:100%;
    }
}
@media (max-width: 800px) {
    .grid-sizer {
        width:50%;
    }
    .search-menu {
        width:100%;
    }
}
@media (max-width: 400px) {
    .grid-sizer {
        width:100%;
    }
    .search-menu {
        width:100%;
    }
}


/****************************************
*
* GLOBAL
*
*****************************************/

.margin-bottom-10 {
    margin-bottom: 10px;
}
.margin-bottom-20 {
    margin-bottom: 20px;
}

.margin-top-10 {
    margin-top: 10px;
}
.margin-top-20 {
    margin-top: 20px;
}
.margin-top-30 {
    margin-top: 30px;
}
.margin-top-40 {
    margin-top: 40px;
}