@import url('https://fonts.googleapis.com/css?family=Quattrocento:400,700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Fauna+One&display=swap');

/*
@import url('https://fonts.googleapis.com/css?family=Philosopher:400,400i,700,700i&display=swap');
@import url('https://fonts.googleapis.com/css?family=Neuton:200,300,400,400i,700,800&display=swap');
*/

html {
  background:#102f57 url('luxury_seamless_pattern_vector.svg.png') fixed;
  color:#333;
}

body {
  background:#efe8c2;
  background:#efe8c2DD;
  width:50%;
  margin:100px 25%;
  padding:50px 2em;
  font-family:sans;
/*  font-family: 'Neuton', serif; */
  font-family: 'Fauna One', serif;
  border-radius:2em;
  font-size:1em;
}

@media only screen and (max-width: 480px) {
  body {
    width:90%;
    margin:100px 0;
    padding:50px 5%;
  }
}

h1, h2, h3, h4 {
  color:#144a3e;
  font-family: 'Quattrocento', serif;
/*  font-family: 'Philosopher', serif; */
}

a {
  color:#630e0e;
  transition:color .6s;
}

a:hover {
  color:#e7b320;
  transition:color .3s;
}

br.clear {
  clear:both;
}

li.clear {
  height:0;
  flex-basis:100%;
  width:100%
}

div.intro {
  text-align: right;
  font-size: smaller;
}

img.home_img {
  float:left;
  max-height:220px;
  margin-right:2em;
  border-radius:2%;
}

ul.gallery {
  display: flex;
  flex-wrap:wrap;
  justify-content: center;
}

ul.gallery li {
  display: flex;
  flex-direction:row;
  align-items: center;
  justify-content: center;
  text-align:center;
  position:relative;
  padding-bottom:2em;
}

ul.gallery li a {
  font-size:smaller;
}

ul.gallery li img {
  display:block;
  min-width:220px;
  box-shadow:2px 2px 6px #333;
  filter:brightness(100%);
  transition: filter .6s;
}

ul.gallery li img:hover {
  filter:brightness(120%);
  transition:filter .3s;
}

ul.gallery li figcaption {
  display:block;
  font-size:smaller;
  position:absolute;
  bottom:1em;
}

ul.gallery li:hover figcaption {
  color:#630e0e;
  align-self: flex-start;
}


ul.gallery li a.preview {
    opacity:0;
    color: #fff;
    background: #102f5799;
    text-transform: capitalize;
    text-decoration:none;
    font-family:sans-serif;
    font-size: 1.2em;
    transform: rotate(-9deg);
    padding: .3em 2em;
    margin-left: -7px;
    position: absolute;
    margin-top: 135px;
    transition:opacity .8s;
    border-radius:5px;
}

ul.gallery li:hover a.preview {
    opacity:1;
    transition:opacity .2s, background-color .2s, color .2s;
}

ul.gallery a.preview:hover {
    background:#102f57;
    color:#e7b320;
}

/*
ul.collection {
  max-height:960px;
  overflow-y:scroll;
}
*/

img.thumb {
  width:150px;
  margin:20px;
}

ul.discs li img,
ul.publications li img {
  width:250px !important;
}

ul.publications2 li img {
  width:300px !important;
}

nav a {
  text-decoration:none;
  background:#583968;
  color:lightblue;
  border-radius:4px;
  transition: text-shadow .3s, padding .3s, margin .3s;
  box-shadow:.1em .2em .5em #333;
  padding:.1em 2em;
}

nav a:hover {
  background:#382e3e;
  color:#fff;
  text-shadow:0 0 .2em;
  transition: text-shadow .6s, padding .6s, margin .6s;
}

nav a.current {
  font-weight: bold;
  background:#144a3e;
  color:#CCC;
}

nav a.current:hover {
  background:inherit;
  color:inherit;
  cursor:default;
}

ul.lang {
  float:right;
  list-style-type:none;
}

ul.lang li {
  float:left;
  width:36px;
  padding:2px;
  margin:0 0 0 2px;
  border:1px solid #33333333;
  border-radius:6px;
  text-align:center;
}

ul.lang li img {
  width:32px;
  height:20px;
}

ul.lang li:hover {
 border:1px solid #333;
 }

ul.lang li.current {
  filter:grayscale(100%);
}

ul.lang li a {
  background:none;
  filter:saturate(80%) contrast(80%);
  transition:filter .3s;
}

ul.lang li a:hover {
  filter:saturate(120%) contrast(100%);
  transition:filter .6s;
}

a.order {
  display:block;
  margin:2em auto;
  text-align:center;
}

nav.menu {
  width:33%;
  min-width:12em;
  float:right;
  margin-left:20px;
}

nav.menu ul {
  margin-top:20px;
  list-style-type:none;
}

nav.menu ul li {
  list-style-type:none;
  float:right;
  width:100%;
  text-align:center;
}

nav.bottom_nav {
	margin: 1em 0 0;
	padding: 1em 0 0;
	border-top: 1px #999 solid;
	width:100%;
	text-align:center;
}

nav.bottom_nav ul {
  list-style-type:none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

nav.bottom_nav ul li {
  list-style-type: none;
  margin:1em 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

nav.menu a {
  display:block;
  margin:.2em 6px;
}

nav.menu a:hover {
  margin: 0 6px;
  padding:.3em 2em;
}

nav.bottom_nav a {
  margin:0 .5em;
  padding:.1em 1em;
}

nav.bottom_nav a:hover {
 margin:0 .3em;
 padding:.1em 1.2em;
}

h1 {
	text-shadow:1px 1px 2px #33333399;
}

p.signature {
  font-style:italic;
  font-size:smaller;
  text-align:right;
  margin-right:5em;
}