/*
'=================================================================================================
'             Copyright © 2011-2016 Commission scolaire de la Rivière-du-Nord (CSRDN)               
'                                      Tous droits réservés.
'     L'usage de ce code source est autorisé seulement avec la permission écrite de la CSRDN.   
'                                 Tout autre usage est proscrit.
'                     Réalisation : Service des Technologies de l'Information
'-------------------------------------------------------------------------------------------------
'                             Version originale : Sébastien Desmarais
'                                  Contribution : Luc Kingsley
'=================================================================================================
*/

html, body {
    margin: 0;
    padding: 0;
}

/*
================================================================================
    Formattage des éléments de la page maitre    
================================================================================
*/
div.PM-Entete { position: relative; height: 62px; width: 100%; background: #5F93E6 url(../images/PageMaitre/CSSRDN_pm_header.png) no-repeat; }
div.PM-Icone { position: absolute; top: 6px; right: 10px; /*width: 300px;*/ height: 32px; text-align: right; }
div.PM-Login { position: absolute; top: 38px; right: 10px; width: 300px; height: 20px; font-size: 14px; font-weight: normal; text-align: right; color: White; }

/* Selon la taille du titre principal on peut avoir à déplacer les sous-titres en modifiant la valeur du LEFT: */
/*div.PM-TitreDroit { position: absolute; top: 15px; left: 230px; width: 520px; height: 38px; font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; }*/
/*div.PM-TitreHaut { position: absolute; top: 4px; left: 230px; width: 520px; height: 32px; font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; }
div.PM-TitreBas { position: absolute; top: 34px; left: 230px; width: 520px; height: 23px; font-size: 17px; font-weight: normal; text-align: left; color: white; }*/
/*div.PM-TitreHaut { position: absolute; top: 4px; left: 230px; height: 32px; font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; }*/
/*div.PM-TitreBas { position: absolute; top: 34px; left: 230px; height: 23px; font-size: 17px; font-weight: normal; text-align: left; color: white; }*/

Table.TitreEnTete {  position: absolute; top: 4px; left: 210px; height: 20px;  }
Table.Mobile { left:60px; top:0px; }
div.PM-TitreGauche {top:15px;  font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; letter-spacing: -0.5px; }
div.PM-TitreDroit {position: relative;  font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; }

/*
Avant optimisation pour Tdb    
div.PM-TitreHaut { top:4px;  font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; }
div.PM-TitreBas { top: 34px; left: 230px; font-size: 17px; font-weight: normal; text-align: left; color: white; }
*/

div.PM-TitreHaut { font-size: 26px; font-weight: normal; text-align: left; color: #F8C416; }

div.PM-TitreBas { font-size: 17px; font-weight: normal; text-align: left; color: white; }
/*.lblTitreBas { top: 34px; left: 230px; font-size: 17px; font-weight: normal; text-align: left; color: white; }*/

.lblTitreDroit{  font-size: 26px; }
.lblTitreHaut{  font-size: 26px; }
.lblTitreBas{  font-size: 17px;}
.lblTitreGauche{  font-size: 26px; }
td.tdGauche { }


#Corps {
	padding-bottom:100px;   /* Height of the footer element */
}
#Pied {
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
}


div.Mobile {left: 60px; }
div.PM-TitreHaut.Mobile {  font-size: 22px; }
div.PM-TitreBas.Mobile {  font-size: 14px; top: 29px; }
div.PM-TitreDroit.Mobile {  font-size: 20px; top: 12px; }

div.PM-PiedPage { position: relative; margin-bottom: 0px; width: 100%; height: 20px; background: #5F93E6 url(../images/PageMaitre/CSRDN_pm_footer.png) no-repeat; }
div.PM-Copyright { position: absolute; top: 3px; left: 10px; width: 400px; height: 16px; font-size: 11px; font-weight: normal; text-align: left; color: #F8C416; }
div.PM-Lieu { position: absolute; top: 3px; right: 10px; width: 400px; height: 16px; font-size: 11px; font-weight: normal; text-align: right; color: White; }

h1, h2, h3, h4, h5, h6 { margin-top: 0px; margin-bottom: 0px; font-weight: normal; }
h1 { font-size: 26px; color: #4169E1; font-weight: bold; margin-top: 5px; margin-bottom: 5px; text-align: center; }
h2 { font-size: 22px; color: #4169E1; }
h3 { font-size: 18px; color: #4169E1; }
h4 { font-size: 22px; color: #535353; }
h5 { font-size: 18px; color: #535353; }
h6 { font-size: 10px; color: #535353; }

.pm_hyperlink, a.pm_hyperlink:visited {
    color: black;
    cursor: pointer;
}

.PM-Outils {
    position:relative;
    top:-6px;
    right:-6px;
    padding:5px;
    /*background-color:transparent;
    border-radius: 7px;
    box-shadow: 0px 3px 10px 1px rgba(0, 0, 0, 0.9);*/
    /*transform: scale(0.8);*/
}

.mainContentPane {
}

/* Assigner à la propriété CssClass pour centrer les contrôles de DevExpress */
/* Les 2 sont pareils, le A-Centrer a été ajouté simplement pour qu'il soit toujours en haut de la liste */
.A-Centrer {
    margin: 0 auto;
    float: none !important;
    display: table;
}

.Centrer {
    margin: 0 auto;
}

/* Header */
.dxpnl-edge.t.headerPane {
    /* Ligne jaune sous le header */
    background-color: #EDEDED; background-position: left top; background-repeat: no-repeat; border-bottom-width: 2px; border-bottom-color: #F8C416;
}

.dxpnl-edge.t.panHeader {
    /* ###jack### Ligne jaune sous le header */
    background-color: #EDEDED;
    background-position: left top;
    background-repeat: no-repeat;
    border-bottom-width: 2px;
    border-bottom-color: #F8C416;
}

.dxpnl-edge.t.headerPane.panel {
    /* Enlève le padding autour du header */
    padding: 0;
}

.headerMenu {
    /* Style pour le menu du haut en mode mobile */
    background: #5F93E6;
    padding: 5px;
    text-align: left !important;
}

/* Footer */
.dxpnl-edge.b.footerPane {
    /* Ligne jaune au dessus du footer */
    background-color: #EDEDED; border-top-width: 2px; border-top-color: #F8C416;
}

.dxpnl-edge.b.footerPane.panel {
     /* Enlève le padding autour du footer */
    padding: 0;
}

.contentPane {
    /* Padding pour le contenu de la page maitre Main.master */
    /*width: auto;*/
    /*padding: 5px;*/
}

/* Left Panel */
.leftPane.panel {
    padding: 0px;
    width: 204px;
}
@media only screen and (max-width: 740px) {
    .leftPane.panel {
        padding: 0px;
       width: 50px;
        /*text-align:center;*/
    }
    #ctl00_MainPane_LeftPane.dxpnl-expanded {
        width:204px;
    }
}
/*@media only screen and (max-width: 740px) {
   .bar {
     height:50px;
    }
}*/
/*!!!!!*/
.bar {
     height:51px;
}
/* Pour ajuster le hamberger menu du header*/
.dxpnl-fp {
    margin-right: 12px;
}
/* Right Panel */
.rightPane.panel {
    padding: 0;
    width: 250px;
}

/* Office2010Blue */
.dxpnlControl_Office2010Blue.dxpnl-edge.t.headerPane {
    /*Background du header mobile*/
    background: #5F93E6 url(../images/PageMaitre/CSSRDN_pm_header_small.png) no-repeat;
}


.hideDefaultImage img {
    /* Nécessaire pour le bon fonctionnement du hamburger menu du left panel */
    background-image: none !important;
}

/*!!!!!*/
.hideDefaultImage {
    display:block;
    margin-left:12px;
    margin-top:12px;
}
.dxRoundpanel {
    margin: 0 auto;
    /*float: none !important;*/
    /*display: table;*/ /* à désactiver après le passage à Dx22.2 ex pour dans Tdb-Jeunes */
    border-radius: 4px;
    padding: 8px 8px 5px 8px;
    border: 1px solid #8BA0BC;
    background-color: #EAF1FA;
}


/* Pour la ROTATION du texte */
/* http://kizu.ru/en/fun/rotated-text/ */
.rotated-text {
    display: inline-block;
    overflow: hidden;
    width: 1.5em;
    line-height: 1.5em;
    text-align: left !important;
}
.rotated-text__inner {
    display: inline-block;
    /*white-space: nowrap;*/
    /*white-space: pre-line;*/
    -webkit-transform: translate(0,100%) rotate(-90deg);
    -moz-transform: translate(0,100%) rotate(-90deg);
    -ms-transform: translate(0,100%) rotate(-90deg);
    -o-transform: translate(0,100%) rotate(-90deg);
    transform: translate(0,100%) rotate(-90deg);
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
}
/* This element stretches the parent to be square
by using the mechanics of vertical margins  */
.rotated-text__inner:before {
    content: "";
    float: left;
    margin-top: 100%;
}
/* FIN - Pour la ROTATION du texte */

/* Pour les impressions */
.onlyprint {
    display: none;
}

@media print {
    .onlyprint {
        display: block;
    }
    .MainContenuPM{
        margin-left : 0px !important;
    }
    .contentPane {
        position: absolute;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
    }
    .noprint {
        display: none ;
    }
}
/* FIN - Pour les impressions */

/* DEBUT - FLOU */
.cssImgFlou img {
    filter: blur(4px);
    -moz-filter: blur(4px);
    -o-filter: blur(4px);
    -ms-filter: blur(4px);
}

.cssTxtFlou {
    /*filter: blur(2px);
    -moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);*/
    color: transparent !important;
    text-shadow: 0 0 5px #000 !important;
}

.cssLienFlou {
    filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
}

.cssTxtLargeFlou {
    /*filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);*/
    color: transparent !important;
    /*text-shadow: 0 0 5px #000 !important;*/
    text-shadow: 0 0 7px #000 !important;
}

.cssTextAFlou * {
    text-shadow: 0 0 5px black !important;
    color: transparent !important;
}
/* Pour flouté une partie, simplement utiliser dans le CssClass ou encore class ceci :  <%#If(ps.ModeFlou = 1, "cssToutAFlou", "") */
.cssToutAFlou {
    text-shadow: 0 0 7px #000 !important;
    color: transparent !important;
    filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
}

    .cssToutAFlou * {
        text-shadow: 0 0 5px black !important;
        color: transparent !important;
    }

    .cssToutAFlou img {
        filter: blur(4px);
        -moz-filter: blur(4px);
        -o-filter: blur(4px);
        -ms-filter: blur(4px);
    }
/* FIN - Flou */