/*
 * This file is part of the eduroam project.
 * 2013 - 2018 / RENATER
 */

/*---------------------------------CSS RESET-------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}

a img{
    border-width: 0;
    vertical-align: middle;
}

dialog{
    display: none;
}
dialog[open]{
    display: block;
}

/* ------------------------------------------------------------------------*/
* {		/* Proportional fonts */
    font-family: 'LatoWeb', sans-serif;
    font-size: 1rem;
}

/* Prevent content moving when vertical scroll appears */
html {
    overflow-x: hidden;
    margin-right: calc(-1 * (100vw - 100%));
    height: 100%;
    background-image: none;
    background-color: transparent;
}

body {
    display: table;
    width: 100%;
    height: 100%;
    position: absolute;
    color: #41494c;
    font-family: 'LatoWeb', sans-serif;
    font-size: 0.85em;
    line-height: 1;
    background-color: transparent;
    padding-bottom: 80px;
    z-index:1;
}

.background{
    display:block;
    position:fixed;
    width:100vw;
    height:100vh;
    padding:0;
    margin:0;
    background-image: url('../images/background.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size:cover;
    background-position: center center;
    z-index:-1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=90);
    -webkit-filter: opacity(0.9);
    -moz-filter: opacity(0.9);
    -o-filter: opacity(0.9);
    -ms-filter: opacity(0.9);
    filter: opacity(0.9);

}

main {
    min-height: 100%;
    padding-bottom: 0.5rem;
    text-align:left;
    line-height:1.7;
    animation-name: theFade; /* nom de l'animation */
    animation-duration: 1s; /* temps de l'animation (4s) */
    animation-iteration-count: 1; /* nombre de boucles (infinie) */
    animation-timing-function: linear; /* accelération de l'animation (constant) */
}
/* deuxième étape */
@keyframes theFade {
    0% {opacity:0;}
    50% {opacity:0.5;}
    100% {opacity:1}
}

main:after {
    content: "";
    display: block;
}

a, a:link, a:visited,.dokuwiki a.wikilink1 {
    color: #055284;
    text-decoration: underline;
    transition: background-color 300ms ease-out;
}
a:link:hover, a:visited:hover, a:link:focus, a:visited:focus, a:link:active, a:visited:active {
    text-decoration: none;
}

/* Titles */
h1,h2,h3,h4,h5,h6{
    margin: 0.67em 0;
    font-weight: bold;
    font-family: LatoWeb, Helvetica, sans-serif;
}
h3,h4,h5,h6{
    color:hsl(0,0%,30%);
}
h1 {
    font-size: 2rem;
}
h2 {
    font-size: 1.7rem;
}
h3 {
    font-size: 1.5rem;
}
h4 {
    font-size: 1.3rem;
}
h5 {
    font-size: 1.1rem;
}
h6 {
    font-size: 1rem;
}

img, object {
    max-width: 100%;
}

ul{
    margin-left: 1.25rem;
}
/**
 * Buttons
 */

/*button, .button{*/
/*padding: 0.5em;*/
/*background-color: #4382aa;*/
/*background-image: none;*/
/*font-style: italic;;*/
/*text-decoration: none;*/
/*color: #fefefe;*/
/*}*/

/*button.highlight, .button.highlight{*/
/*background-color: #7c7c7c;*/
/*}*/
/*button:hover, .button:hover {*/
/*background-image: none!important;*/
/*background-color: #7aadcd;*/
/*opacity: 0.8;*/
/*}*/

/* Buttons */
button {
    cursor: pointer;
}
.button {
    position: relative;
    overflow: hidden;
    padding: 0.85em 2em!important;
    border: none;
    background-color: #055284;
    background-image: none;
    font-family: 'LatoWeb', Helvetica, sans-serif;
    font-weight: bold!important;
    font-style: normal;
    text-decoration: none!important;
    color: #fff;
    cursor: pointer;
    border-radius: 50px;
    transition: clip-path 1s ease-in-out;
    z-index: 0;
}
.button:hover, .button:focus {
    background-image: none;
    background-color: #055284;
    border: none;
}
.button:before {
    content: '';
    background: rgba(255, 255, 255, .2);
    height: 100%;
    width: 100%;
    z-index: -1;
    filter: blur(1px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    clip-path: circle(0% at 50% 50%);
    transition: 1s;
}
.button:hover:before,
.button:focus:before {
    clip-path: circle(100% at 50% 50%);
}
.button:after {
    content: '';
    background: inherit;
    height: 50%;
    width: 100%;
    z-index: -1;
    position: absolute;
    bottom: 0;
    left: 0;
    clip-path: inset(100% 0% 0% 0% );
    transition: 1s .4s

}
.button.disabled,
.button.disabled:focus,
.button.disabled:hover,
.button[disabled],
.button[disabled]:focus,
.button[disabled]:hover {
    background-color: #ddd;
    color: #333;
}
[type="button"],
[type="submit"] {
    border-radius: 50px;
}

td .button{
    padding: 0.5em 1em !important;
    font-size:85%;
}

.close-button, .close-button:hover {
    padding:0;
    background: transparent;
}

/* design of tooltips*/
.tooltip {
    background-color: #fff0c6;
    color: #41494c;
    font-size: 100%;
    max-width: 20rem !important;
    border-radius: 3px;
    text-align:justify;
    box-shadow: 0px 5px 20px 0px rgba(1, 1, 1, 0.6);
}
.tooltip::before {
    border-color: transparent transparent #fff0c6;
}
.tooltip.bottom::before {
    border-color: transparent transparent #fff0c6;
}
.tooltip.top::before {
    border-color: #fff0c6 transparent transparent;
}
.tooltip.left::before {
    border-color: transparent transparent transparent #fff0c6;
}
.tooltip.right::before {
    border-color: transparent #fff0c6 transparent transparent;
}

/* Top button */
.scroll-top-wrapper {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    text-align: center;
    z-index: 99999999;
    background-color:#4382AA;
    color: #eeeeee;
    width: 50px;
    height: 50px;
    line-height: 50px;
    right: 30px;
    bottom: 30px;
    padding-top: 0px;
    border-radius: 50%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover {
    background-color:#055284;
}
.scroll-top-wrapper.show {
    visibility:visible;
    cursor:pointer;
    opacity: 1.0;
}
.scroll-top-wrapper i.fa {
    line-height: inherit;
}

/*
Accordion
 */
.accordion li {
    padding: 0;
    margin-bottom: 0.5rem;
}
.accordion li > a {
    text-decoration: none;
}
.accordion-title {
    font-size: 1rem;
    color: #41494c;
    background-color: #ddd;
}

/*Specific for dokuwiki*/
#dokuwiki__header .tools, #dokuwiki__header .tools li bdi{
    font-size: .875em;
}
#dokuwiki__header .headings, #dokuwiki__header .tools{
    width:100%;
    margin-bottom: 0;
}
#dokuwiki__usertools {
    top: 105px;
}
#dokuwiki__usertools ul {
    max-width: 100%;
}
#dokuwiki__usertools, #dokuwiki__usertools a, #dokuwiki__sitetools a {
    color: #fff;
}
#dokuwiki__pagetools ul {
    background: rgba(255,255,255,1);
}
#dokuwiki__footer{
    display:none;
}
.pageId{
    display:none;
}

[type="text"]{
    display: inherit;
    height:inherit;
    margin:inherit;
    padding:inherit;
    border: 1px solid #cacaca;
    border-radius: 3px;
    background-color: #fefefe;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
    font-family: inherit;
    font-size:inherit;
    font-weight:inherit;
    line-height:inherit;
    color: #0a0a0a;
    transition: box-shadow 0.5s, border-color 0.25s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
form.search {

    position: relative;
    top: -2rem;
}
select {
    background-position: right 0.5rem center;
}
#dokuwiki__header h1 {
    /*color: #055284;*/
    color: #fff;
    font-family: "foobar_proregular", Arial, sans-serif;
    font-size: 2em;
    text-align: center;
}
#dokuwiki__header h1 a{
    color: #fff;
}
#dokuwiki__header h1 a img{
    display:none;
}

.dokuwiki div.page{
    /*background-color: rgba(255,255,255,0.9);*/
    background-color: #fff;
    box-shadow: 0px 10px 20px 0px;
    border-radius: 3px;
}
.dokuwiki div.ui-admin ul.admin_tasks {
    font-size: 1rem;
}
.dokuwiki fieldset {
    text-align: left;
}

td.label {
    margin:0;
    display: inherit;
    padding: .8em 0 .6em 1em;
    border-radius: 0;
    cursor: default;
    background: transparent;
    color: inherit;
}
#config__manager td.label span.outkey {
    font-size: 70%;
    margin-top: -1.7em;
    margin-left: -1em;
    display: block;
    background-color: #fff;
    color: #666;
    float: left;
    padding: 0 .1em 0 0.7rem;
    position: relative;
    z-index: 1;
}
#config__manager table tbody{
    background-color: transparent;
}
#config__manager table tbody tr{
    border: 1px solid #ccc;
}
#config__manager .label{
    white-space: normal;
}

.profiled-content-selector p {
    margin-bottom: 1rem;
}
.profiled-content-selector [type="checkbox"] {
    margin-bottom: 0rem;
}

/* Table */
th, td{
    padding: 0.5rem;
}

tbody > tr:last-child td {
    border-bottom: 1px solid #ddd;
}
thead > tr > th, tbody > tr > th, tfoot > tr > th, thead > tr > td, tbody > tr > td, tfoot > tr > td {
    vertical-align: top;
    border-top: 1px solid #dddddd;
}
thead > tr > th, tbody > tr > th, tfoot > tr > th, thead > tr > td, tbody > tr > td, tfoot > tr > td {
    border-right: 1px solid #ddd;
    border-left: 1px solid #ddd;
}
thead > tr > th {
    vertical-align: middle;
    border-bottom: 2px solid #dddddd;
    color: #055284;
    font-weight: bold !important;
    font-variant: small-caps;
    background: #cee6f4;
    text-align: center !important;
}
.dokuwiki table.inline tr:hover th {
    background-color: #cee6f4;
}

table.dataTable td, table.dataTable th {
    vertical-align: middle;
}
table.dataTable td{
    padding: 0.2rem 0.5rem;
}
table.dataTable tr td:first-child {
    font-weight: bold;
    background-color: #eee;
    font-variant: all-small-caps;
    border-color: #fff;
}

/* Monitoring*/
.monitoring-success {
    color: #fff;
    background-color: #28a745;
    border: 1px solid #28a745;
}
.monitoring-alert {
    color: #fff;
    background-color: #dc3545;
    border: 1px solid #dc3545;
}
.monitoring-warning {
    color: #0a0a0a;
    background: #ffae00;
    border: 1px solid #ffae00;
}
.monitoring-primary {
    color: #fff;
    background-color: #007bff;
    border: 1px solid #007bff;
}
.monitoring-unknown {
    color: #fff;
    background-color: #6c757d;
    border: 1px solid #6c757d;
}
.btn_details {
    margin-left: 0.25rem;
    color: inherit;
    background-color:   transparent;
    border: 1px solid #055284;
    cursor: pointer;
}
.btn_details:hover, .btn_details.focus{
    border: 1px solid #055284;
    background-color: #055284;
    color: #fefefe;
}
.monitoring-badge {
    /*display: inline-block;*/
    min-width: 5rem;
    padding: 0.25em 0.4em;
    font-size: 75%;
    font-weight: bold;
    font-variant: small-caps;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 50px;
    transition: all 0.15s ease-in-out;
    text-decoration: none;
}
.method .monitoring-badge {
    display: inline-block;
    letter-spacing:0.5px;
}
.server{
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    padding:0;
    border:1px solid #ddd;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    background-color: #fff;
    box-shadow:0 4px 6px -6px #777;
}
.server > h1{
    padding: 0.25em 0;
    margin: 0 0 0.2rem 0;
    color: #055284;
    font-size: inherit;
    font-weight: bold;
    text-align: center;
    font-variant: all-small-caps;
    line-height: 1;
}

.method {
    margin-bottom: 0.5rem;
}
.method h1{
    border-radius: 0;
    /*font-variant: all-small-caps;*/
    padding: 0.15em 0.4em;
    font-size: 80%;
    font-weight: bold;
    color: #fff;
    background-color: #6c757d;
}
.method .fa {
    color: #055284;
    vertical-align: middle;
}
.realm {
    width:90%;
    margin: 0.5rem auto;
    border: 1px solid #6c757d;
}
.realm > h1{
    margin: 0 0 1rem 0 ;
    padding: 0.15em 0;
    color: #fff;
    font-size: 100%;
    font-weight: bold;
    background-color: #055284;
}
.realm .fa {
    color: #055284;
    vertical-align: middle;
 }

.text-center{
    text-align: center!important;
}

.server_details{
    display:none;
}

/* Small screens */

/* Define mobile styles */

/* max-width 450px, mobile-only styles, use when QAing mobile issues */
@media only screen and (max-width: 28em){
    #dokuwiki__header h1{
        font-size: 1.3em;
    }
}
@media only screen and (max-width: 480px){
    #dokuwiki__sitetools form.search input, #dokuwiki__header .mobileTools select {
        height: inherit;
        line-height: inherit;
    }
}

@media only screen and (min-width: 28em) and (max-width: 40em){
    #dokuwiki__header h1{
        font-size: 1.5em;
    }
}
/* max-width 640px, mobile-only styles, use when QAing mobile issues */
@media only screen and (max-width: 40em) {
    #dokuwiki__usertools {
        top: 50px;
    }
}

/* Medium screens */

/* min-width 641px, medium screens */
@media only screen and (min-width: 40.063em) {
}

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 40.063em) and (max-width: 50em) {

}

/* max-width 800px */
@media only screen and (max-width: 800px) {
    #dokuwiki__usertools a.action, #dokuwiki__usertools a.iw_user {
        padding-left: 5px;
        background: none;
    }
}


/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    #dokuwiki__header h1{
        font-size: 1.7em;
    }
    .menu.icon-top > li > a img {
        margin:0!important;
    }
    #dokuwiki__usertools {
        top: 90px;
    }
}

/* Large screens */

/* min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) {

}

/* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */
@media only screen and (min-width: 64.063em) and (max-width: 90em) {}

/* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */
@media only screen and (min-width: 74em) and (max-width: 90em) {
    .row{
        max-width:70rem;
    }
}

/* XLarge screens */

/* min-width 1441px, xlarge screens */
@media only screen and (min-width: 90.063em) {
    .row{
        max-width:80rem;
    }
}

/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
@media only screen and (min-width: 90.063em) and (max-width: 120em) {

}


/* XXLarge screens*/

/* min-width 1921px, xxlarge screens */
@media only screen and (min-width: 120.063em) {
    #dokuwiki__site {
    max-width: 95em;
    }
}