@charset "utf-8";

/* CSS Document */

/* --------------------------- */
/* ------ STYLE GENERAL ------ */
/* --------------------------- */
*, *::before, *::after {
    -khtml-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
    -o-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}
* {
    padding: 0;
    margin: 0;
}


@font-face {
    font-family:'Romeral';
    src:url('fonts/Romeral.ttf');
    font-weight:400;
    font-style:normal;
}
@font-face {
    font-family:'Estrellass TBF';
    src:url('fonts/estrellass.ttf');
    font-weight:400;
    font-style:normal;
}

@font-face {
    font-family:'Starz 2';
    src:url('fonts/Starz 2.ttf');
    font-weight:400;
    font-style:normal;
}
@font-face {
    font-family:'PizzaDude Bullets';
    src:url('fonts/PIZZADUDEBULLETS.ttf');
    font-weight:400;
    font-style:normal;
}
html {
    font-size:62.5%;
    z-index: 2;
    font-family: helvetica, arial, sans-serif;
    background-color: #E9EBEE;
}

body {
    background-color: #E9EBEE;
}

p{
    font-size: 1.3em;
}

.red{
    background: red;
}

.form-errors {
    list-style-type: none;
}

.form-errors li {
    color: red;
}

.viewContent p {
    margin-bottom: 0px;
}

.infos-retour {
    font-size: 1.5em;
    text-align: center;
}

.infos-retour table td {
    border-bottom: solid 1px #000;
    border-right: solid 1px #000;
    padding-top: 10px;
    max-height: 5em;
    text-align: left;
    padding-left: 1em;
}

.infos-retour table tr {
    max-height: 5em;
}

.infos-retour table img {
    width: 80%;
}

.infos-retour table td:first-child {
    border-left: solid 1px #000;
    width: 10%;
    text-align: center;
    padding-left: 0;
}

.infos-retour table tr:first-child td {
    border-top: solid 1px #000;

}

.infos-retour table {
    margin: 20px auto 0;
    width: 70%;
}

.infos-retour h3 {
    margin-top: 2em;
    margin-bottom: 0.5em;
}

.infos-retour p {
    margin:auto;
    width: 70%;
    text-align: justify;
}

#afterSubmit{
    width:80%;
    margin:auto;
    margin-top:5em;
}

#afterSubmit h1 {
    text-align: center;
    padding: 2em;
}

#afterSubmit #commandList {
    width: 70%;
    margin: auto;
    margin-bottom: 5em;
    margin-top: 2em;
}

#bipContent{
    width: 70%;
    margin: auto;
    background: transparent;
}

#bipContent form{
    width: 80%;
    margin:auto;
}

#bipContent h1{
    text-align: center;
    margin:auto;
    color: #3B5998;
    margin-top: 2em;
}

#bipContent label{
    margin-top: 5em;
    font-size: 1.5em;
    font-weight: 600;
    display: block;
    text-align: center;
}

#bipContent input{
 display: block;
    text-align: center;
    margin: auto;
    margin-top: 2em;
    min-height: 3em;
    min-width: 50%;

}

#variableList {
    width: 20%;
    margin-top: 2em;
    padding:2em;
    min-height: 70em;
    float: right;
    margin-right: 5%;
}

#variableList ul{
    list-style: none;
}

#variableList li{
    font-size: 1.5em;
    margin-bottom: 0.5em;
}

#variableList h3{
    font-weight: 600;
    font-size: 1.7em;
    margin-bottom: 1em;
    color:#3B5998;
}

#updateEmail {
    width: 65%;
    margin:auto;
    margin-top: 2em;
    padding:2em;
    min-height: 70em;
    margin-bottom: 2em;
    float: left;
    margin-left: 5%;
}

#updateEmail label{
    font-size: 1.3em;
    font-weight: 600;
    color: #999;
    margin-left:1em;

}

#updateEmail select {
    height: 2em;
    width: 30%;
    font-size: 1.2em;
    margin-left: 1em;
    border: none;
    border-bottom: 1px solid rgba(0,0,0,0.2);

}

#updateEmail input {
    height: 2em;
    font-size: 1.2em;
    margin-left: 1em;
    border: none;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    width: 90%;
    padding-left:0.5em;
}

#updateEmail textarea {
    margin-bottom: 5em;
}

#updateEmail .form-group {
    margin-top:2.5em;
}

#updateEmail a {
    float: left;
    margin-top: 1em;
}

#updateEmail button {
    float: right;
    margin-top: 1em;
    background: #2196f3;
}

.userDeco{
    display:inline-block;
    font-size: 1.5em;
    padding-top: 1em;
    float: right;
}

.catForm {
    width: 80%;
    margin:auto;
}

.catForm input{
    border:none;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    height: 2em;
    width: 100%;
    display: block;
    margin-bottom: 1em;
}

.catForm label {
    font-weight: 600;
    font-size: 1.1em;
    color: #999;
}

.catForm table {
    width: 80%;
}

.catForm button{
    float: right;
    background: #2196F3;
}

.catForm:nth-child(1) button{
    margin-top:-3.5em;
}

.catForm h3{
    text-align: center;
    font-weight: 600;
    font-size: 1.3em;
    color: #3B5998;
}

.catForm select{
    display: block;
    margin-top: 1em;
    height: 2em;
    width: 15%;
}

.flash-success {
    background-color: #4bbb6e;
    color: #FFF;
    padding: 10px;
    font-size: 1.6em;
    text-align: center;
}

.alertError{
    background: red;
    color: #FFF;
        padding: 1em;
    width: 75%;
    font-weight: 600;
    margin: auto;
}


.loader {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
        margin: auto;
    margin-top: 15em;
}

.loader2 {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 120px;
    height: 120px;
    animation: spin 2s linear infinite;
    margin: auto;
    margin-top: 5em;
    margin-bottom: 5em;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#productsForm{
    width:80%;
    margin:auto;
    margin-top: 2em;
    padding:1.5em;
    display:none
}

#customerInfos p {
    width: 45%;
    display: inline-block;
}

.loader, #loader{
    border: 24px solid #f3f3f3;
    border-top: 24px solid #3b5997;
    border-radius: 96%;
    width: 240px;
    height: 240px;
    animation: spin 2s linear infinite;
    margin: auto;
    margin-top: 20%;

}

#window_loader{
    position: fixed;
    width: 102%;
    margin-left: -2.25%;
    height: 110%;
    min-height: 665px;
    background: rgba(0,0,0,0.5);
    margin-top: -6%;
    display:none;
    z-index: 5;
}

#close_confirmation div {
    width:60%;
    margin:auto;
    margin-top: 30em;
    padding:1.5em;
    text-align:center;
    background:#FFF;
    min-height: 20em;
}

#close_confirmation p {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 3em;
    margin-top: 2em;
}

#close_confirmation{
    position: fixed;
    width: 100%;
    height: 110%;
    min-height: 665px;
    background: rgba(0,0,0,0.5);
    margin-top: -6%;
    display: none;
}

#close_confirmation_button_yes{
    float: right;
    margin-right: 35%;
    padding: 0.5em;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;
    color: #000;
    font-weight: 600;
    font-size: 1.4em;
    border: 1px solid rgba(0,0,0,0.2);
    background: #dadada;
}

#close_confirmation_button_no{
    float: left;
    margin-left: 35%;
    padding: 0.5em;
    font-weight: bold;
    cursor: pointer;
}

.card-center {
    width: 75%;
    margin: auto;
    margin-top: 2em;
    padding: 2em;
}

#menuHeader .language_switcher li {
    margin: 0;
}

#menuHeader .language_switcher li a {
    display: inline-block;
    font-size: 0.8em;
    text-align: center;
    width: 50px;
}

#menuHeader .language_switcher li a.active {
    background-color: #000080;
    border-radius: 4px;
    color: #FFF;
    font-weight: bold;
    padding: 3px 1px;
}

nav li {
    display: inline-block;
    margin-left: -20px;
}

nav a {
    text-decoration: none;
    color: #ffff;
    background: #DCDCDC;
    position: relative;
    display: inline-block;
    margin: 0 22px;
    padding: 8px 11px;
    border-radius: 7px 7px 0 0;
    font-size: 14px;
}

nav a:before,
nav a:after {
    content: " ";
    position: absolute;
    top: 0;
    width: 23px;
    height: 100%;
    background-color: inherit;
}

nav a:before {
    border-radius: 12px 0 0 0;
    transform: skew(-24deg);
    left: -13px;
}

nav a:after {
    border-radius: 0 12px 0 0;
    transform: skew(24deg);
    right: -13px;
    border-right: 1px solid #628E2F;
    z-index: 1;
}

nav li.active {
    border-bottom: 0px solid #fff;
}

nav li.active a {
    color: #fff;
    background: #3B5998;
    font-size: 16px;
}

nav li.active a:before {
    z-index: 1;
}

nav li.active a:after {
    border-bottom: 0px solid #fff;
}

.addProduct:hover {
    color: #0000F0;
    text-decoration: underline #0000F0;
}
#menuHeader {
	padding: 0em 5%;
	width: 100%;
	max-height: 5em;
	color: #FFF;
}

#menuHeader ul {
	text-align: right;
	list-style: none;
	display: inline-block;
}

#menuHeader li {
	font-size: 1.5em;
	display: inline-block;
	margin-left: 2em;
	font-weight: 600;
	padding: 1em 0em;
	padding-top: 1em;
}

#menuHeader a{
	text-decoration: none;
	text-transform: uppercase;
	display: inline-block;
	color: #FFF
}

#menuHeader a:hover {
    text-decoration: none;
}

#menuHeader h1{
	color: #FFF;
	font-weight: 600;
	font-size: 1.5em;
	display: inline-block;
	width: 20%;
}




/* ---------- SOUS MENU ---------- */
/* ------------------------------- */

#menuHeader li > ul {
	display: none;
	position: absolute;
    background: #FFF;
    width: 11%;
    text-align: left;
    margin-top: 1em;
    border-radius: 1px;
    text-align: left;
    box-shadow: 1px 1px 5px 0px #656565;

}

#menuHeader li > ul > li {
	text-align: left;
	color: #000;
	margin-left: 0px;
	width: 100%;
	font-size: 0.8em;
    padding: 0.5em;
}
#menuHeader li > ul >li > a {
	color: #000;
	text-align: left;
}

#menuHeader li:hover > ul {
	display: block;
}

#menuHeader li > ul:hover  {
	display: block;
}

#menuHeader li > ul > li:hover  {
	background: rgba(0,0,0,0.075);
}

#menuHeader li:hover > ul {
	float: none;
}

#menuHeader img.logo {
    max-height: 40px;
    vertical-align: middle;
}
h1 {
    font-size: 2.5em;
    margin-bottom: 0.5em;
}

h2{
	margin-bottom: 0.5em;
	text-align: center;
	font-size: 1.5em;
	border-collapse: collapse;
	color:#3B5998;
	font-weight: 600;
	font-size: 1.7em;
}

.card{
	background-color: #FFF;
    border-radius: 1px;
    padding: 1em;
    text-align: left;
    box-shadow: 1px 1px 5px 0px #656565;
}

.tableIndex {
	width: 75%;
}

.tableIndex td {
	border-bottom: 1px solid rgba(0,0,0,0.1);
	padding: 0.5em;
	min-height: 3em;
	font-size: 1.1em;
	padding-left: 1em;
}


.selectTypeOrder{
	background: #999;
    padding: 1em;
    color: #FFF;
    text-decoration: none;
    font-size: 1.2em;
    font-weight: 600;
    box-shadow: 0 1px 2px 0 #000;
    margin-top: 3em;
}

#step1{
	margin-top: 5em;
	width: 75%;
	text-align: center;
	margin:auto;
	background: #ebedf4;
    padding: 1em;
    color: #FFF;
    text-decoration: none;
    font-size: 1.5em;
    font-weight: 600;
    box-shadow: 0 1px 2px 0 #000;
    margin-top: 2em;
    min-height: 6em;
    padding-top: 2em;
}

#step1 a {
	margin: 0 3em;
}

#cmdList{
    margin-top: 5em;
}

#cmdList table{
    border-collapse: collapse;
    background: #FFF;
}

#cmdList td {
    border-collapse: collapse;
    padding: 0.5em;
    font-size: 1.5em;
}

#cmdList tr {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

#cmdList th {
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 1em 0.5em;
    font-size: 1.5em;
    font-weight: 600;
    background: rgba(0,0,0,0.1);
}

#cmdRecap{
    margin-top: 5em;
}

#cmdRecap table{
    border-collapse: collapse;
    background: #FFF;
}

#cmdRecap td {
    border-collapse: collapse;
    padding: 0.5em;
    font-size: 1.5em;
}

#cmdRecap tr {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

#cmdRecap th {
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 1em 0.5em;
    font-size: 1.5em;
    font-weight: 600;
    background: rgba(0,0,0,0.1);
}

#form-groupcmd td{
    text-align: left;
    padding: 0.75em 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

#form-groupcmd td:last-child {

    border-bottom: none
}

#form-groupcmd label{
    text-align: left;
    padding-right: 0.5em;
    font-size: 1.3em;
    vertical-align: top;
}


#form-groupcmd label{
    width: 50%;
}


#form-groupcmd table{
    margin: auto;
    margin-top:2em;
    width: 75%;
    border-collapse: collapse;
}

#productsList{
margin-top: 5em;
}

#productsList table{
	border-collapse: collapse;
	background: #FFF;
}

#productsList td {
    border-collapse: collapse;
    padding: 0.5em;
    font-size: 1.5em;
}

#productsList tr {
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

#productsList th {
	border-collapse: collapse;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	padding: 1em 0.5em;
	font-size: 1.5em;
	font-weight: 600;
	background: rgba(0,0,0,0.1);
}

#form-group td{
	text-align: left;
    padding: 0.75em 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

#form-group td:last-child {

    border-bottom: none
}

#form-group label{
	text-align: left;
    padding-right: 0.5em;
    font-size: 1.3em;
        vertical-align: top;
}


#form-group label{
	width: 50%;
}


#form-group table{
	margin: auto;
	margin-top:2em;
	width: 75%;
	border-collapse: collapse;
}

#productsForm{
	margin-top: 5em;
}

.selectOrderLabel{
	display: inline-block;
    font-size: 1.5em;
    font-weight: 600;
}

.selectReferenceLabel{
    display: inline-block;
    font-size: 1.5em;
    font-weight: 600;
}

.selectPrescripteurLabel{
    display: inline-block;
    font-size: 1.5em;
    font-weight: 600;
}

.selectOrder{
	min-width: 25%;
    min-height: 2em;
    font-size: 1.5em;
    font-weight: 600;
    padding-left: 1em;
}

.selectBox{
	width: 15%;
}

#userIndex .leftColumn img {
	width: 50%;
}

.exchangeListAdmin{
    font-size: 1.1em;
    font-weight: 400;
    margin:auto;
    margin-top: 2em;
    width:80%;
}

.exchangeListAdmin table{
    background: #FFF;
   border-collapse: collapse;
    width: 95%;
    margin:2em;
}

.exchangeListAdmin th{
    font-weight: 600;
    text-align: left;
    padding: 0.5em;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    background: rgba(0,0,0,0.1);
}

.exchangeListAdmin td{
	border-bottom: 1px solid rgba(0,0,0,0.1);
	border-collapse: collapse;
	min-height: 3em;
	padding: 0.5em;
	text-align: left;
}

.pliage, .depliage{
    display: inline-block;
    float: right;
    width: 3%;
    height: 3%;
    margin-right: 2em;
    margin-top: -3em;
}

#exchangeList , #ordersList{
    width: 65%;
    font-size: 1.1em;
    font-weight: 400;
    float: right;
}

#exchangeList table, #ordersList table{
    background: #FFF;
   border-collapse: collapse;
    width: 95%;
    font-size: 1.1em;
    font-weight: 400;
    margin:auto;
}

#exchangeList th, #ordersList th{
    font-size: 1.1em;
    font-weight: 600;
    text-align: left;
    padding: 0.5em;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    background: rgba(0,0,0,0.1);
}

#exchangeList td,  #ordersList td{
	border-bottom: 1px solid rgba(0,0,0,0.1);
	border-collapse: collapse;
	min-height: 3em;
	padding: 0.5em;
	text-align: left;
}

.cursor:hover {
    cursor:pointer;
    background-color: rgba(0,0,0,0.025);
}

.pointeur:hover {
    cursor:pointer;
    background-color: rgba(0,0,0,0.025);
}

.picto{
    width: 1.2em;
    height: 1.2em;
}

.state {
	vertical-align: top;
    margin-top: 0.5em;
}

#commandList {
	width: 100%;
}
#commandsList {
    width: 100%;
}
#commandListRecap {
    width: 100%;
}

#condition, #customerUpdate, #addSpecialRefund{
    background: rgba(0,0,0,0.3);
    position: absolute;
    width: 100%;
    min-height: 850px;
    margin-top: -10em;
    padding-top: 10em;
    z-index: 2;
}

#condition {
    height: 100%;
}

#annulation{
    background: rgba(0,0,0,0.3);
    position: absolute;
    width: 100%;
    min-height: 850px;
    margin-top: -10em;
    padding-top: 10em;
    z-index: 2;
}

#condition li {
    font-size: 1.3em;
    text-align: justify;
    margin-left:2em;
    line-height: 1.4em;
}

#condition h3 {
    font-size:1.5em;
}

#conditionContent{
    padding: 5em;
}

.btn {
    border-radius: 2px;
    padding: 1em;
    box-shadow: 1px 1px 5px 0px #656565;
    color: #FFF;
    font-size: 1.3em;
    font-weight: 600;
    cursor:pointer;
    text-decoration: none;
    font-weight: 600;
}

.blue{
       background: #2196f3;
}

.accept{
    background: #2196f3;
}

.refuse{
    background: red;
}

.accept:hover{
    background: #0d87e9;
}

.refuse:hover{
    background: #CC332C;
}

#DouchetteMenu {
    width: 50%;
    margin: auto;
    margin-top:5em;
}

#DouchetteMenu > div {
    display: inline-block;
    width: 40%;
    margin:auto;
    text-align: center;
    padding: 2em;
}

#DouchetteMenu > div > img {
    margin-top: 2em;
    width: 50%;
}

#afterSubmit .btn {
    margin:auto;
    margin-bottom: 2em;
    display: block;
    width: 30%;
    text-align: center;
}

#btnDouchette img {
    margin-top:2em;
    margin-bottom: 1em;
}

#btnDouchette h1 {
    text-decoration: none;
    color: #3b5998;
}

#motivList{
    width: 75%;
    margin: auto;
    margin-top:2em;
    padding: 2em;
}

#motivList table{
    width: 80%;
    margin: auto;
    margin-bottom: 2em;
    border-collapse: collapse;
}

#motivList th{
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 1em 0.5em;
    font-size: 1.5em;
    font-weight: 600;
    background: rgba(0,0,0,0.1);
}

#motivList td{
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 0.5em;
    font-size: 1.5em;
}

#motivList td:nth-child(1n+3){
    text-align: center;
}

#motivList th:nth-child(1n+3){
    text-align: center;
}

#motivList td:nth-child(1){
    text-align: center;
}

#motivList th:nth-child(1){
    text-align: center;
}

.emailList{
    width: 75%;
    margin: auto;
    margin-top:2em;
    padding: 2em;
}

.emailList table{
    width: 70%;
    margin: auto;
    margin-bottom: 2em;
    border-collapse: collapse;
}

.emailList th{
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 1em 0.5em;
    font-size: 1.5em;
    font-weight: 600;
    background: rgba(0,0,0,0.1);
}

.emailList td{
    border-collapse: collapse;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding: 0.5em;
    font-size: 1.5em;
}


.emailList td:nth-child(1){
    text-align: center;
}

.emailList th:nth-child(1){
    text-align: center;
}

.emailList > div {
    text-align: center;
    margin:auto;
    margin-bottom: 1em;
}

.emailList > div img{
    margin-left: 2em;
    width: 5%;
}
.emailList > div h2{
    vertical-align: top;
    margin-top: 0.5em;
}

.searchForm{
    width: 22.5%;
    float: left;
    min-height: 25em;
    margin-top: 2em;
    padding: 2em;
    position: absolute;
    margin-top: 30em;
}

.searchForm form{
    font-size: 1em;
    font-weight: 400;
    background-color: #FFF;
    padding: 0em;
    border-radius: 0px;
    box-shadow: 0px 0px 0px 0px #656565;
}

.searchForm select {
    border: none;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    height: 2em;
    margin-bottom: 1em;
    margin-right: 0.5em;
    width: 100%;
    font-size: 1.5em;
}

.searchForm input{
    border: none;
    border-bottom: 1.5px solid rgba(0,0,0,0.2);
    height: 2em;
    margin-bottom: 1em;
    width: 100%;
    font-size: 1.5em;
}

.searchForm label{
    text-align: left;
    color: #999;
    font-weight: 600;
}


.addressForm{
    width: 100%;
    background: rgba(0,0,0,0.3);
    position: fixed;
    width: 100%;
    height: 850px;
    z-index: 2
}

.addressForm form{
    width: 70%;
    font-size: 1em;
    font-weight: 400;
    margin:auto;
    background-color: #FFF;
    border-radius: 1px;
    padding: 1em;
    text-align: left;
    box-shadow: 1px 1px 5px 0px #656565;
    width:50%;
    margin:auto;
    min-height:400px;
    margin-top:5em;
    padding: 5em;
}

.addressForm select {
    border: none;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    height: 2em;
    margin-bottom: 1em;
    margin-right: 0.5em;
    width: 100%;
    font-size: 1.5em;
}

.addressForm input{
    border: none;
    border-bottom: 1.5px solid rgba(0,0,0,0.2);
    height: 2em;
    margin-bottom: 1em;
    width: 100%;
    font-size: 1.5em;
}

.addressForm label{
    text-align: left;
    color: #999;
    font-weight: 600;
}




#reset {
    font-size: 1.2em;
    font-weight: 600;
    text-decoration: none;
    list-style: none;
    color: #FFF;
    padding: 0.5em;
    padding-bottom: 0.5em;
    text-align: center;
    vertical-align: middle;
    float: right;
    margin-bottom: 2em;
    background: #2196f3;
    padding:0.75em;
}

.alert{
    margin-top: 2em;
    width:75%;
    font-size: 1.5em;
    padding:1em;
    text-align:center;
    margin:auto;
    background:green;
    color:#FFF;
}

.alert2, .alert3, .alert4{
    margin-top: 2em;
    width:100%;
    font-size: 1.5em;
    padding:1em;
    text-align:center;
    background:red;
    color:#FFF;
    font-weight: 600;
}

#comptaMenu{
    padding-top: 0.5em;
    background: #FFF;
    height: 3em;
    border: 2px solid #3B5998;
    text-align: center;
}

#comptaMenu a{
    margin-top: 0.5em;
    text-decoration: none;
    font-size: 1.5em;
    padding: 0em 2em;
    font-weight: 600;
    color: #3B5998
}

.btns-actions {
    text-align: right;
}

.btns-actions a {
    display: inline-block;
    margin-bottom: 10px;


}

.notif{
    display: inline-block;
    color: #FFF;
    background: red;
    padding: 0.2em 0.5em;
    border-radius: 13px;
    text-align: center;
    font-weight: 600;
    position: absolute;
}

.notifEs{
    display: inline-block;
    color: #FFF;
    background: green;
    padding: 0.2em 0.5em;
    border-radius: 13px;
    text-align: center;
    font-weight: 600;
    position: absolute;
}

.checkBoxRaisonExchange {
    display: flex;
}

.checkBoxRaisonExchange > div {
    margin-right: 30px;
}

.checkBoxRaisonExchange > div > label {
    margin-left: 5px;
}

.popup-container {
    width: 100%;
    height: 900px;
}
#popup-box {
    position: absolute;
    width: 480px;
    height: auto;
    z-index: 1000;
    margin: auto;
    left: 825px; right: 0;
    background-color: #FFF;
    border-radius: 10px;
    padding: 1em;
    text-align: left;
    box-shadow: 1px 1px 5px 0px #656565;
    display: none;
}

.form-theme {
    font-size: 1.4em;
}

.form-theme label {
    display: block;
    font-weight: 700;
    margin-bottom: 5px;
    max-width: 100%;
}

.form-theme .form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}



/* ------ FORMULAIRE DE DZMANDE DE RETOUR ------------------- */

/* --- TABLEAU PRESENTATION CLIENT --- */

#tab_customer_presentation{
    width: 80%;
    text-align: left;
}

#customerAddress p, #customerInfos p {
    width: 100% !important;
    text-align: left !important;
}

#tab_customer_presentation > tr > td{
    width: 25%;
}
@media screen and (max-width:1450px) {
    body {
        font-size: 80%;
    }
}


@media screen and (max-width:1200px) {
    body {
        font-size: 70%;
    }
}



@media screen and (max-width:1100px) {
    body {
        font-size: 65%;
    }

    .pub{
        display:none;
    }
}


@media screen and (max-width:1000px) {
    body {
        font-size: 60%;
    }

    .pub{
        display:none;
    }
}



@media screen and (max-width:850px) {
    body {
        font-size: 50%;
    }

    #exchangeList{
        width: 100%;
    }

}

@media screen and (max-width:700px) {
    body {
        font-size: 40%;
    }

    #exchangeList{
        width: 100%;
    }

}
@import url('https://fonts.googleapis.com/css?family=Roboto');

html, body {
    background: none;
    font-family: 'Roboto', sans-serif;
}

#menuHeader {
    background: white;
    border-bottom: solid 2px #000080;
}

#menuHeader a,
#menuHeader p {
    color: #000080;
}

#exchangeList {
    width: 100%;
}

.blue,
.btn-primary,
.btn-primary:active,
.btn-primary:focus {
    background: #000080;
    border: solid 1px #000080;
}

.blue:hover,
.btn-primary:hover,
.btn-primary:active:hover {
    background: white;
    border: solid 1px #000080;
    color: #000080;
}

.card {
    box-shadow: none;
    padding: 0;
}

#exchangeList table {
    width: 100%;
}

.btn {
    box-shadow: none;
    padding: 0.5em 1em;
}

#exchangeList th, #ordersList th {
    background: none;
}


textarea:focus, textarea.form-control:focus, input.form-control:focus, input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=number]:focus, [type=text].form-control:focus, [type=password].form-control:focus, [type=email].form-control:focus, [type=tel].form-control:focus, [contenteditable].form-control:focus {
    -webkit-box-shadow: inset 0 -2px 0 #000080;
    box-shadow: inset 0 -2px 0 #000080;
}

h2 {
    color: #000080;
}

.well {
    background-color: transparent;
    border-color: #000080;
    border-radius: 5px;
}

.blue {
    background: #000080 !important;
}

.blue:hover, .btn-primary:hover, .btn-primary:active:hover {
    background: #FFF !important;
}

.flash-error {
    text-align: center;
    color: red;
    font-size: 1.3em;
    background: #ffdada;
    border: solid 1px red;
    margin: 10px;
    padding: 10px;
}