@font-face {
    font-family: "Champagne";
    src: url('../fonts/Champagne & Limousines.ttf') format('truetype');
}
html, body
{
    font-family: "Champagne";
    margin:0;
    padding:0;
    background-attachment: fixed;
    background-repeat:no-repeat;
    background-position:top center;
    background-size:100%;
    margin-bottom:0px;
    height:100%;
}
body {
    background-image: url('../img/bg.jpg');
    display : table;
    width: 100%;
    overflow:auto;
    -moz-user-select: none; 
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none; 
}
a
{
    color:rgba(14,62,99,0.8);
    font-weight:bold;
}
a:hover
{
    color:rgba(14,62,99,1);
    text-decoration:none;
}
h1
{
    font-size:30px;
    color:#0e3e63;
    font-weight:bolder;
    text-transform: uppercase;
    text-shadow:2px 2px 1px #500739; 
}
h2
{
    font-size:25px;
    color:#500739;
    margin-left:20px;
}
h3
{
    font-size:22px;
    margin-left:30px;
    font-weight:bolder;
    /*text-decoration:underline;*/
}
.coordinates
{
    font-weight: bolder;
}
p.warning 
{
    /*font-family:"simply_roundeditalic";*/
    color:#42A51D;
    font-style:italic;
    font-weight:lighter;
    font-size:15px;
    margin-right:30%;
}
.presentation
{
    font-style:italic;
    font-size:18px;
    padding:15px;
    text-align: justify;
}
.products
{

}
.products p
{
    font-size:18px;
    font-style:italic;
    margin-left:40px;
}
.products img
{
    /*float:left;*/
    display:inline-block;
    margin:50px;
    border-radius:10px; 
    border:3px solid white;
    box-shadow: 3px 3px 6px black;
}
.floatLeft
{
    float:left;
}
.floatRight
{
    float:right;
}
img.footerDiv
{
    /*float:right;*/
    border:none;
    box-shadow:none;
    right:0;
    bottom:0;
    position:static;
}
footer
{
    position:fixed;
    bottom:0;
    width:100%;
    height:30px;
    text-align: center;
    vertical-align:bottom;
}
#logo
{
    width:100%;
    text-align: center;
    margin:auto;
    min-height: 230px;
}
#logo img:hover
{
    cursor: pointer;
}
.logo img
{
    width:90%;
}
img.logos
{
    border:none;
    box-shadow:none;
}
#contact
{
    margin:0 -10px 0 0;
}
#contact,
#contact a
{
    width:100%;
    text-align:center;  
    font-size:18px;
    /*background:transparent;*/
    background-color:transparent;
    transition-property: all;
    transition-duration: 1.2s;
    cursor:pointer;
}
#contact a
{
    color:#0e3e63;
}
#contact h2
{
    background-color:#0e3e63;
    color:white;
}
#contact:hover,
#contact:hover a
{
    /*background:linear-gradient(to top, white, rgba(255,255,255,0)90%);*/
    background-color:#0e3e63;
    color:white;
}
#contact img
{
    width:50%;
    box-shadow: 4px 4px 8px black;
    border-radius:5px;
    margin:10px auto 25px 5px;
    transform:rotate(-8deg);
    -webkit-transition: all 0.3s ease; /* Safari et Chrome */
    -moz-transition: all 0.3s ease; /* Firefox */
    -ms-transition: all 0.3s ease; /* Internet Explorer 9 */
    -o-transition: all 0.3s ease; /* Opera */
    transition: all 0.3s ease;
    z-index:3;
    /*float:left;*/
}
#contact img:hover
{
    transform:rotate(0deg);
    transform: scale(1.5);
    box-shadow: 4px 4px 8px white;
}
table tr td, th
{
    padding:5px 10px;
    /*border:1px solid green;*/
}
table tr td input, textarea, select
{
    font-family: "Champagne";
    width:400px;
    color:black;
    box-shadow:3px 3px 6px black;
}
table tr td textarea
{
    height:150px;
}
#main
{
    margin-top:10px;
    height:100%;
}
#others
{
    min-height:160px;
    width:100%;
    /*background:linear-gradient(to top,rgba(255,200,0,0.9),rgba(0,0,0,0)90%);*/
    text-align:center;
    padding:100px 50px;
    margin-top:-20px;
    background-position:bottom center;
    background-size:auto 80%;
    background-repeat: no-repeat;
    background-image:url('../img/plume.png');
}
.others
{
    border:1px solid white;
    border-radius: 10px;
    color:white;
    /*background-color:rgba(255,0,0,0.8);*/ 
    background-color:rgba(80,7,57,0.8);
    font-weight:bold;
    font-size: 20px;
    line-height:25px;
    display:inline-block;
    margin:10px;
    padding:5px 10px;
    box-shadow:3px 3px 6px black;
    vertical-align: middle;
    transition-property: all;
    transition-duration:0.8s;
    cursor:pointer;
}
.others:hover
{
    background-color:rgba(80,7,57,1);
    box-shadow: 3px 3px 6px white;
}
.others img
{
    margin:5px;
    height:20px;
}
.menu
{
    width:100%;
    border:1px solid black;
    padding:0px;
    text-align:center;
    vertical-align:top;
    background-color:white;
    box-shadow:3px 3px 5px black;
}
hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0))
}
.leftLink
{
    cursor:pointer;
    width:100%;
    color:#0e3e63;
    font-size:20px;
    line-height:35px;
    margin:0px;
    padding-left:15px;
    background-color:transparent;
    /*text-align:left;*/
    transition-property:all;
    transition-duration:0.8s;
}
.leftLink:hover
{
    color:white;
    background-color:#0e3e63;
    border-radius: 10px;
    box-shadow: 2px 2px 5px white;
    padding-left:25px;
    /*text-align: center;*/
}
.leftLinkDropdown
{
    margin:0;
}
.leftLinkDropdown::after
{
    float:right;
    content:"\25BC";
}
.dropdown-menu
{
    width:80%;
}
.dropdown-item
{

}
.leftColumn
{
    width:24%;
    /*border:1px blue solid;*/
    display:inline-block;
    /*position:fixed;*/
    vertical-align:top;
    margin-right:10px;
    margin-left:6px;
}
.navBarLeft
{
    padding:5px 10px;
    box-shadow: -1px 2px 5px 3px rgba(0, 0, 0, 0.7); 
    background: rgba(255,255,255,0.5);
}
.centerColumn
{
    width:72%;    
    display:inline-block;   
}
.center
{
    border:5px solid white;
    border-radius:10px; 
    line-height: 1.5em;
    color: #444444;
    box-shadow: -1px 2px 5px 3px rgba(0, 0, 0, 0.7); 
    background: rgba(255,255,255,0.5);
    vertical-align:top;
    margin:auto 10px;
    padding:60px 40px;
    text-align: justify;
    /*height:98%;*/
    /*min-height:800px;*/
}
.toSlide,
.toOpen
{
    display:none;
}
.subMenu
{
    margin-left:7px;
    font-size:17px;
}
.subMenu:hover
{
    background-color:rbga(14,62,99,0.8);
}
.subMenu::before
{
    /*content:"\01F59D";*/
    content:url('../img/plume_fleche30.png');
    margin-right:5px;
}
.personalBG
{
    background-position:bottom right;
    background-size:250px;
    background-repeat: no-repeat;
}
.conseils
{
    background-image:url('../img/conseils.png');
}
.reflexology
{
    background-image:url('<?= $dirImg ?>reflexology.png');
}
.massages
{
    background-image:url('<?= $dirImg ?>massages.png');
}
.seances
{
    background-image:url('<?= $dirImg ?>seances.png');
}
.soins
{
    background-image:url('<?= $dirImg ?>soins.png');
}
.sophrology
{
    background-image:url('<?= $dirImg ?>sophrology.png');
}
.advices
{
    width:100%;
}
.advices p
{
    display: block;
}
.form input,
.form select,
.form textarea
{
    display:block;
    margin:2px;
    padding:10px;    
    height:50px;
    line-height:20px;
    font-size:18px;
    box-shadow:3px 3px 6px black;
    width:400px;
    border-radius:5px;    
    color:rgba(14,62,99,1);    
}
.form textarea
{
    height:150px;
}
.form input[type=submit]:hover
{
    background-color:rgba(14,62,99,0.5);
    box-shadow: 1px 1px 3px black;
    color:white;
}
.advice
{
    width:45%;
    display:inline-block;
    margin:25px 10px;
    border:3px white solid;
    border-radius:5px;
    background-color:rgba(0,0,0,0.3);
    color:white;
    padding:10px;
    box-shadow:3px 3px 6px black;
    vertical-align:top;
}
.adviceHeader,
.slideAdviceHeader
{
    /*float:left;*/
    width:100%;
}
.adviceHeader span
.slideAdviceHeader span
{
    margin-right:0px;
    float:right;
    /*content:"*";*/
}
.starRankingFull
{
    content:url('../img/starFull.png');
}
.starRankingEmpty
{
    content:url('../img/starEmpty.png');
}
.starRankingFull,
.starRankingEmpty
{
    display:inline-block;
}
.ranking
{
    width:10%;
    height:150px;
    max-height:150px;
}
.adviceComment
{
    width:85%;
    font-style:italic;
    text-align:center;
    /*border:green 1px solid;*/
}

.ranking,
.adviceComment
{    
    display:inline-block;
    vertical-align: middle;
    padding:auto;

}
.slides
{
    width:100%;
    height:250px;
    /*margin-bottom: 40px;*/
    text-align: center;
    background:linear-gradient(0.5turn, rgba(255,255,255,0), #ebf8e1, rgba(255,255,255,0));
    margin-top:-60px;
}
.slide
{
    width:300px;
    height:200px;
    border:3px white solid;
    border-radius: 10px;
    box-shadow: 3px 3px 8px black;
    display:inline-block;
    vertical-align: middle;
    color:white;
    padding:3px;
    background:linear-gradient(to top, rgba(80,7,57,1), rgba(255,255,255,0.1) 95%);
    margin-right:20px;
}
.slideAdviceHeader
{
    height:20px;
    font-weight:bold;
    color:black;
}
.slideAdviceHeader span
{
    font-weight:normal;
}
.slideAdviceComment
{
    height:125px;
}
.slideAdviceRanking
{
    width:100%;
    vertical-align: bottom;
    height:40px;
}


* {
    box-sizing: border-box;
}

/*	body {
                background: #121314;
        }*/

body > ul {
    position: absolute;
    top: 50%;
    width: 800px;
    height: 200px; 
    left: 50%;
    margin-left: -400px;
    margin-top: -130px;
}

ul > li {
    width: 25%;
    list-style-type: none;
    position: absolute;
    /*top: 0;*/
    /*padding: 20px;*/
    /*height: 200px;*/ 
    opacity: 0;
    /*padding-top: 40px;*/
    text-align: center;
    transition: 1s opacity; 
}
.products li
{
    opacity:1;
    position: relative;
    width:100%;
    overflow-wrap: break-word;
    text-align:left;
    line-height:28px;
    /*height:25px;*/
    /*margin:auto;*/
    list-style-position: inside;
}
.products li:before
{
    content:url('../img/plume_fleche30.png'); 
}

.active {
    opacity: 1;
}

/*p {
    font-family: sans-serif;
    font-size: 13px;
    color: #646566;
    line-height: 1.5em;
}*/

.connect
{
    text-align:center;
    margin:auto;
}
.connect input
{
    width:250px;
    text-align:center;
    margin:5px auto;
}
/*.connect label
{
    display:block;
}*/
.menuAdmin
{
    text-align: center;
}
.menuAdmin button
{
    border-radius:50%;
    margin:auto;
    color:white;
    font-weight:bold;
    background-color:rgba(14,62,99,0.8);
    font-size:15px;
    width:80px;
    height:80px;
    vertical-align: top;
}
.connectMenu button
{
    vertical-align: top;
}
.menuAdmin button:hover
{
    background-color:rgba(14,62,99,1);
    box-shadow:3px 3px 6px black;
}
.bigSize button
{
    font-size:25px;
    width:150px;
    height:150px;
}
.counters
{
    text-align: left;
}
.counters table
{
    width:400px;
    margin-left:50px;
}

.counters th
{
    font-size:25px;
    width:50%;
    /*float:left;*/
    width:300px;
    display:block;
    background-color:rgba(14,62,99,0.8);
    color:white;
    border:rgba(14,62,99,0.8) solid 1px;
}

.counters thead td
{
    font-size:25px;
    color:white;
    background-color:rgba(14,62,99,0.8);
}
.counters td
{
    width:50%;
    border:rgba(14,62,99,0.8) solid 1px;
    color:black;
}
.validAdvice,
.deleteAdvice
{
    border-radius:50%;
    height:50px;
    width:50px;
    display:inline-block;
    border:3px white solid;
    text-align: center;
    line-height:44px;
    margin:auto 20px;
    box-shadow:3px 3px 6px black;
}
.validAdvice:hover,
.deleteAdvice:hover
{
    box-shadow: 1px 1px 2px black;
}
.validAdvice
{
    /*border:green 1px solid;*/
    background:linear-gradient(to right bottom, green, rgba(0,0,0,0.6)90%);
}
.validAdvice:after
{
    content:'OK';
}
.deleteAdvice
{
    background-color:red;
}
.deleteAdvice:after
{
    content:'X';
}
.adviceSelect
{
    width:100%;
    margin-bottom:-40px;
    text-align:center;
}
.agendaPart
{
	text-align:center;
	width:49%;
	margin:0;
	vertical-align:top;
	display:inline-block;
	/*border:1px red solid;*/
}
.rdv
{
    display:inline-block;
    border:4px white solid;
    width:300px;
    margin:5px;
    /*border-radius:10px;*/
    box-shadow: 3px 3px 6px black;
    padding:15px;
    background:linear-gradient(to top,rgba(14,62,99,0.8), rgba(80,7,57,0.3)50%);
    color:white;    
}
.rdvAttach
{
    /*content:url('../img/plume_fleche.png');*/
    margin:-30px auto 0px auto;
    
}
.creation
{
    border:3px solid white;
    background:rgba(255,255,255,0.5);
    display:inline-block;
    width:30%;
    text-align: center;
}
.link
{
    border:2px white solid;
    width:30%;
    background-color:#CCC;
    color:black;
    box-shadow: 3px 3px 6px black;
    padding:8px;
    margin:5px;
    display:inline-block;
}
.formPatient
{
    display:none;
}
.formPatient input[type=text]
{
    width:400px;
    display: block;
}
tr.trWhite:hover
{
    background-color:#FFF;
    border-color:red;
    color:red;
}
.fichePatient input,
.fichePatient textarea
{
    border:none;
    background-color:transparent;
    box-shadow: none;
    margin:0;
    width:100%;
}
.fichePatient input:focus,
.fichePatient textarea:focus
{
    background:#355d7b;
    color:#FFF;
    border-color:transparent;
}