/* nav */

nav {
    z-index:23;
    margin-top: 0;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    height:100px;
}
nav ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
//  background: #e9e9e9;
position: relative;
text-align: center;
z-index:10;
}

nav ul li {
    display: none;
    position: static;
    background: black;
}

nav ul li a {
    color: #beac74;
    font-size: 2em;
    font-family: raleway,sans-serif;
    text-decoration: none;
    padding: 17px;
    display: block;
}

nav ul li a:hover {
   color: white;
}

nav ul ul {
    position: static;
    z-index:10;
//    background: #e3e3e3;
}

nav ul ul li {
  display: block;
//  background: #e3e3e3;
}

nav ul li i {
  color: #292929;
  float: right;
  padding-left: 20px;
}

nav a.burger {
    display: inline-block;
    width:100%;
    background: black;
    color: white;
    font-size: 2em;
    padding: 0.2em 0.6em 0.2em 0.6em;
    cursor: pointer;
    position: absolute;
    text-decoration: none;
    z-index:10;
}
.main {
    padding-top:3em;
    background-color: black;
}
/*
Source - https://stackoverflow.com/a/69599229
Posted by A Haworth
Retrieved 2026-10-19, License - CC BY-SA 4.0
*/

.photo-galery-with-zoom {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: equally-spaced;
}

.photo-galery-with-zoom label {
  position: relative;
}

.photo-galery-with-zoom img {
  height:25vh;
  width: 25vh;
  object-fit: contain;
}

.photo-galery-with-zoom input:checked+img {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100vw;
  height: 100vh;
  background: black;
  object-fit: contain;
  padding:3em;
}

.photo-galery-with-zoom input {
  width: 19vh;
  height: 19vh;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 2;
}

.photo-galery-with-zoom input:checked {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
}

nav .logo {
    display: none;
}
@media screen and ( min-width: 1100px ){
    nav {
        margin-top: 20px;
        width: 1170px;
        margin-right:auto;
    }
    nav a.burger {
        display: none;
    }
    nav .logo {
        height: 113px;
        padding-bottom: 13px;
        display:inline-block;
    }

    nav ul li {
        display: inline-block;
//        background: #e9e9e9;
    }

    nav ul ul {
        position: absolute;
        min-width: 200px;
        background: lightgrey;
        display: none;
    }
    nav ul li a {
        font-size: 47px;
    }
    .main {
    padding-top:20px;
    }


h1 {
    color: #beac74;
    font-size: 3em;
    font-family: raleway,sans-serif;

    padding-bottom: 20px;
    padding-top: 30px;
}
h2 {
    color: #beac74;
    display: table; /* keep the background color wrapped tight */
    font-size: 1,5em;
    text-align: center;
    width: 100%;
}

h2 i {
    color: white;
    font-size: 1,5em;
    
    
}

body{
    color: #beac74;
    font-family: rubik-light;
    font-size: 20px;
}

}
nav a.active  {
    #background-color: #ffff01;
    color: white;
}

nav .icon {
    height: 1.3em;
    float: left;
}
nav .text {
    vertical-align: middle;
text-align: center;
display: inline;

}



h1 {
    color: #beac74;
    font-size: 3em;
    font-family: raleway,sans-serif;

    padding-bottom: 20px;
    padding-top: 30px;
}

body{
    color: #beac74;
    font-size: 2em;
}

h4 {
    padding:10px;
    color:white;
    background-color: #beac74;
    text-align:center;
}

td {
    border-top:0px;!important
}

.guitare {
    display: inline-grid;
    margin: 1em;
    width:12em;
}
.guitare img {
    height: 22em:
}

.guitare-list {
    width : 100%;
    padding: 1em;
    text-align: center;
}
