/* GENERAL SETTINGS */
    /* */
@font-face {
    font-family: "Sawasdee"; 
    src: url("http://daniel-mory-avocat.com/assets/fonts/Sawasdee.ttf")
}
@font-face {
    font-family: "Calendas Plus"; 
    src: url("http://daniel-mory-avocat.com/assets/fonts/calendas_plus-webfont.ttf")
}
@font-face {
    font-family: "Knile Italic";
    src: url( "http://daniel-mory-avocat.com/assets/fonts/knile-regularitalic-webfont.otf" );
}
html, body {
    height: 100vh;
    margin: 0;
}
body {
    font-family: 'Sawasdee';
    font-size  : 30px;
    padding-top: 70px;
    color      : #2a687a;
} 
p {
    text-align  : justify;
    text-justify: auto;
}


/* fixed navbar */
    /* */
#navbarSupportedContent, .navbar-nav {
    width: 100%;
}
.navbar-nav {
    justify-content: space-between;
}
.nav-item {
    display       : flex;
    flex-direction: column;
    align-items   : center;
}
.dropdown-menu {
    width: 100%;
}
.dropdown-menu a {
    text-decoration: none;
    color          : black;
    cursor         : pointer;
    font-size: 175%;
}
.dropdown-menu a:hover {
    background-color: #909090;
    color           : white !important;
    padding         : 3.5px 6px;
    text-align      : center;
}
#lawyers_logo {
    max-width: 120px;
}

/* SO slider */
#slide {
    height: 100vh;
    width: 100%;
}
#slide ul li {
    list-style-type: none;
}
#slideshow li span { 
    width              : 100%;
    height             : 100%;
    position           : absolute;
    top                : 0px;
    left               : 0px;
    color              : transparent;
    background-size    : cover;
    background-position: 50% 50%;
    background-repeat  : none;
    opacity            : 0;
    z-index            : -1;
    animation          : imageAnimation 20s linear infinite 0s; 
}
#slideshow li:nth-child(1) span { 
    background-image: url(http://daniel-mory-avocat.com/assets/images/cabinet.png);
    background-size: cover;
}
#slideshow li:nth-child(2) span { 
    background-image: url(http://daniel-mory-avocat.com/assets/images/court.png);
    background-size: cover;
    animation-delay: 10s;
}
@keyframes imageAnimation { 
    0%  { opacity: 0; animation-timing-function: ease-in; }
    25% { opacity: 1 }
    50% { opacity: 1; animation-timing-function: ease-out; }
    75% { opacity: 0 }
    100%{ opacity: 0 }
}
#slideshow h1 {
    background : rgba( 255, 255, 255, 0.8 );
    color      : #2a687a;
    font-size  : larges;
    font-weight: bold;
    text-align : center;
    padding    : 0.5em;
    width      : 25%;
    margin     : 0 auto;
}
#slideshow li div { 
    z-index    : 0;
    position   : absolute;
    bottom     : 30%;
    left       : 0px;
    width      : 100%;
    opacity    : 0;
    animation  : textAnimation 30s linear infinite 0s; 
}
#slideshow li:nth-child(2) div { 
    animation-delay: 10s;
}
@keyframes textAnimation { 
    0% { opacity: 0; animation-timing-function: ease-in; }
    5% { opacity: 1 }
    33% { opacity: 1; animation-timing-function: ease-out; }
    38% { opacity: 0 }
    100% { opacity: 0 }
}
/* EO slider */

/* CONTENT */
    /* */
hr {
    width: 50%;
}
h2, h3, h4 {
    text-align: center;
}
h2 {
    margin-top: 5%;
    margin-bottom: 10%;
}
h3 {
    margin-top: 5%;
    margin-bottom: 5%;
}
#cabinet_anchor, #skills_anchor, #fees_anchor, #contact_anchor {
    background-color: white;
    height: 60px;
}
.mb-4 {
    margin-top: 15%;
}
#skills_h2 h2 {
    margin : 1em;
}
#portrait {
    border       : groove 2px #2a687a;
    border-radius: 20%;
    display      : flex;
    margin       : 1.5em auto;
    max-width    : 100%;
    max-height   : 100%;
}
ul {
    font-weight: bolder;
}
::marker {
    color      : #2a687a;
    font-family: cursive;
    font-size  : small;
}
li {
    color      : black;
    font-weight: normal;
}
@supports selector(::marker) {
    li {
        padding-left: 0.2em;
    }
}
#map_wrapper {
    border: groove 3px;
    width : 100%;
    height: 78%; 
}
#mapid {
    width : 100%;
    height: 500px; 
}
#contact_div {
    display        : flex;
    flex-direction : column;
    align-items    : flex-start;
    justify-content: top;
}
#horaires {
    display        : flex;
    flex-direction : column;
    align-items    : flex-start;
    justify-content: top; 
}
#email_link,
#email_link:hover {
    text-decoration: none;
}
/* EO content */

/* FOOTER */
    /* */
footer {    
    font-size: 0.5em;
}
footer a,
footer a:hover
{
    text-decoration: none;
}