/* DEFAULTS
----------------------------------------------------------*/
form {
    height: 100%;
}

html,
body {
    font-size: 14px;
    font-family: "Exo 2.0", "Segoe UI", Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
    height: 100%;
}

#Container {
    min-height: 100%;
    position: relative;
}

#Header {
}

#Body {
    padding: 10px;
    padding-bottom: 50px; /* Height of the footer */
    height: auto !important;
    height: 100%;
}

#Footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 50px; /* Height of the footer */
    background-color:white;
}

a:link {
    color: #00632e;
    text-decoration: none;
}

a:hover {
    color: #90be00;
    font-weight:bold;
}

a:active, a:visited {
    color: #00632e;
}

.anchor {
    color:black!important;
}
.anchor:hover {
    color:#00632e!important;
}

p {
    margin-bottom: 5px;
    line-height: 1em;
}

.LeftText {
    text-align: left;
}

.LeftAlign {
    position: absolute;
    left: 0px;
}

.RightText {
    text-align: right;
}

.RightAlign {
    position: absolute;
    right: 0px;
}

.CenterText {
    text-align: center;
}

.CenterAlign {
    margin-left: auto;
    margin-right: auto;
}

.bold {
    font-weight:bold;
}

.italic {
    font-style:italic;
}

hr {
    border-color:#90be00;
    border-style:solid;
    border-width:1px;
}

fieldset {
    border-color: #90be00;
    border-style: solid;
    border-width: 1px;
}

.smallText {
    font-size:10px;
}

.red {
    font-weight: bold;
    color: red;
}

.remark {
    font-size:12px;
    font-weight:bold;
    font-style:italic;
    color:#00632e;
}


/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
    font-size: 1.5em;
    color: #666666;
    font-variant: small-caps;
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

/* titre de la page */
h1
{
    color:#90be00;
    font-weight: bold;
    font-size: 2.2em;
    line-height: 20px;
    padding: 0px 60px;
}


h2 {
    color:white;
    background-color:#90be00;
    font-size: 1.5em;
    font-weight: 600;
    line-height: 30px;
    padding: 0px 20px;
    width: 96%;
    position:relative;
    right:-30px;
}
    h2::after {
        position: absolute;
        right: 100%;
        top: 0;
        content: "";
        border: 30px solid #90be00;
        border-width: 30px 20px 0px 0px;
        border-color: transparent #90be00 transparent transparent;
    }

h3 {
    color:white;
    background-color:#E7D032;
    font-size: 1.5em;
    font-weight: 600;
    line-height: 30px;
    padding: 0px 20px;
    width: 96%;
    position:relative;
    right:-30px;
}
    h3::after {
        position: absolute;
        right: 100%;
        top: 0;
        content: "";
        border: 30px solid #E7D032;
        border-width: 30px 20px 0px 0px;
        border-color: transparent #E7D032 transparent transparent;
    }

h4 {
    color:white;
    background-color:#00632e;
    font-size: 1.5em;
    font-weight: 600;
    line-height: 30px;
    padding: 0px 20px;
    width: 96%;
    position:relative;
    right:-30px;
}
    h4::after {
        position: absolute;
        right: 100%;
        top: 0;
        content: "";
        border: 30px solid #00632e;
        border-width: 30px 20px 0px 0px;
        border-color: transparent #00632e transparent transparent;
    }

h5 {
    color: #a3c123;
    font-weight: bolder;
    font-size: 1.2em;
}

/* sous titre de la page */
h6 {
    color: #666666;
    font-weight: bold;
    font-size: 1.4em;
    line-height: 5px;
    padding: 0px 60px;
}

/* flèche de titre */
.TitleImage {
    width:64px;
    height:64px;
    position:absolute;
    left:-10px;
}

.GrayText {
    color: #7f7f7f  ;
    padding: 0px 60px;
}

.HighLight {
    background-color:#E7D032;
    font-weight:bold;
}

/* MENU
----------------------------------------------------------*/
.MenuContainer {
    border-bottom-color:#90be00;
    border-bottom-style:solid;
    border-bottom-width:2px;
}

@media screen and (max-width: 750px) {
	.MenuContainer {
        height:150px;
	}
}

.MenuItems {
    padding:20px;
    background-color:#f7f7f7;
    border: 2px;
    border-color:#90be00;
    border-style:solid;
}

.MenuItemHeaderLeft{
    color:#90be00;
    font-size:18px;
    width:350px;
    font-weight:bolder;
    font-variant:small-caps;
}

.MenuItemHeaderRigth{
    color:#2d373d;
    font-size:18px;
    font-weight:bold;
}

.MenuItemHeaderToolTip{
    font-family: "Exo 2.0", "Segoe UI", Arial, Helvetica, sans-serif;
    font-size:12px;
    font-style:italic;
    line-height:1.5;
    min-height:30px;
}

.BorderLeftGray {
    border-left-style:solid;
    border-left-width:1px;
    border-left-color:#e6e6e6;
}


/* BUTTONS
----------------------------------------------------------*/
.ImageButton
{
    width:20px;
    padding-left:7px;
}

.SmallButton {
    font-size: 0.7em;
    font-weight: bold;
    color: black;
    background: #E7D032;
    border: 1px solid #90be00;
    -webkit-border-radius: 3;
    -moz-border-radius: 3;
    border-radius: 3px;
    padding: 5px 5px 5px 5px;
}
.SmallButton:hover {
  background: #90be00;
  text-decoration: none;
}
.SmallButton:active {
	position:relative;
	top:1px;
}

.buttonGreen {
  background: #90be00;
  border:1px solid #90be00;
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  font-weight:bold;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}
.buttonGreen:hover {
  background: #00632e;
  text-decoration: none;
}
.buttonGreen:active {
	position:relative;
	top:1px;
}


.buttonRed {
  background: #eb2305;
  border:1px solid #eb2305;
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  font-weight:bold;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}
.buttonRed:hover {
  background: #7a2305;
  text-decoration: none;
}
.buttonRed:active {
	position:relative;
	top:1px;
}

.buttonBlue {
  background: #0096bb;
  border:1px solid #0096bb;
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  font-weight:bold;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
}
.buttonBlue:hover {
  background: #04b8e4;
  text-decoration: none;
}
.buttonBlue:active {
	position:relative;
	top:1px;
}


/* RAMPES
----------------------------------------------------------*/
.DownRamp70Grey {
    background-color:transparent;
	border-color: transparent #e5e5e5;
	border-style: solid;
	border-width: 0px 50px 70px 0px;
	height: 0px;
	width: 0px;
    position:absolute;
    right:600px
}


.FourTriangles {
    width:0;
    height:0;
    text-indent:-9999px;
    border-top:0px solid #ffffff;
    border-right:160px solid #00632e;
    border-bottom:160px solid #90be00;
    border-left:160px solid #E7D032;
}

.DownRamp500Green {
    background-color:transparent;
	border-color: transparent #90be00;
	border-style: solid;
	border-width: 0px 500px 700px 0px;
	height: 0px;
	width: 0px;
    position:absolute;
    right:0px;
}

.UpRamp300Yellow {
    background-color:transparent;
	border-color: transparent #E7D032;
	border-style: solid;
	border-width: 300px 300px 0px 0px;
	height: 0px;
	width: 0px;
    position:absolute;
    right:0px;
}

/* Grid
----------------------------------------------------------*/
.GridCommandButton {
    width:25px;
    padding:5px;
}

.GridEditTemplate {
    width:100%;
    border-color:#E7D032;
    border-width:1px;
    border-style:solid;
    padding:10px;
    background-color:white;
}

.RadGrid .rgFilterRow img, .RadGrid .rgFilterRow input
{
    vertical-align: middle;
    background-color:white;
}


/*----------------------------------------------------------*/
/*  Frames                                                  */
/*----------------------------------------------------------*/
.GreenFrameH1Title {
    background-color: #90be00;
    border-color: #90be00;
    border-width:1px;
    border-style:solid;
    color:white;
    font-weight:bold;
    font-size:35px;
    padding:20px;
}

.GreenFrameH1 {
    border-color: #90be00;
    border-width:1px;
    border-style:solid;
    padding:20px;
    line-height: 3em;
    min-height:300px;
}

.GreenFrameH1Hovered div:hover {
    background-position-x: center;
    background-image: url(images/IndexDown.png);
    background-repeat: no-repeat;
}

.GreenFrameH2Title {
    background-color: #90be00;
    border-color: #90be00;
    border-width:1px;
    border-style:solid;
    color:white;
    font-weight:bold;
    font-size:25px;
    padding:10px;
    -webkit-border-top-left-radius: 7px;
    -webkit-border-top-right-radius: 7px;
    -moz-border-radius-topleft: 7px;
    -moz-border-radius-topright: 7px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.GreenFrameH2 {
    border-color: #90be00;
    border-width:1px;
    border-style:solid;
    padding:10px;
    line-height: 3em;
    -webkit-border-bottom-right-radius: 7px;
    -webkit-border-bottom-left-radius: 7px;
    -moz-border-radius-bottomright: 7px;
    -moz-border-radius-bottomleft: 7px;
    border-bottom-right-radius: 7px;
    border-bottom-left-radius: 7px;
}


/*----------------------------------------------------------*/
/*  List in MAIN (responsive)                               */
/*----------------------------------------------------------*/
.ListMain {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.ListMain ul, .ListMain li {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.ListMain li {
    float: left;
    width: 49%;
}

/* responsive
/* default */
.ListMain {
	float:left;
	overflow:auto;
	width:100%;
	clear:both;
    padding-top:0px;
    padding-bottom:20px;
    padding-right:20px;
    padding-left:20px;
}

/* min-width for standard resolutions */
@media screen and (min-width: 751px) {
    .ListMain {
        clear: none;
    }
}

/* max-width for low résolutions */
@media screen and (max-width: 750px) {
    .ListMain a {
        display: block;
    }

    .ListMain li {
        float: none;
        width: 99%;
    }

    .ListMain {
        clear: both;
        width: 100%;
    }
}


/* téléchargements */
.DropZone1 {
    width: 200px;
    height: 300px;
    background-color: #E7D032;
    border-color: #90be00;
    border-radius:5px;
    color: #767676;
    float: left;
    text-align: center;
    font-size: 16px;
    color: white;
    padding:10px;
}



/* -------------------------------------------------------*/
/* -------------------------------------------------------*/
/*                      PAGES                             */
/* -------------------------------------------------------*/
/* -------------------------------------------------------*/


/* Default
----------------------------------------------------------*/
.HomeMessage {
    background-color:#f7f7f7;
    font-size:16px;
    font-weight:bold;
    padding:20px;
}

.NewsPanel {
    padding: 20px;
    min-height: 250px;
    width: 90%;
    background-color: #90be00;
    width: 70%;
}
.NewsPanelAnchor {
    color:black;
    font-weight:bold;
}
.NewsPanelDate {
    color:white;
    font-weight:bold;
}
.NewsPanelDescription {
    color:black;
    font-size:12px;
}

.MessagesPanel {
    min-height: 200px;
    padding-left: 30px;
    padding-right: 30px;
    width: 96%;
}
@media screen and (max-width: 750px) {
    .NewsPanel {
        width: 100%;
    }
}

    .PagerWrapper {
        float: right;
        font-size: 10px;
        font-weight: bold;
        color: #00632e;
    }

.ToDoMessages {
    border: 1px solid #90be00;
    -webkit-border-radius: 3;
    -moz-border-radius: 3;
    border-radius: 7px;
    border-color:darkorange;
    padding: 5px 5px 5px 5px;
}

    /* login  
----------------------------------------------------------*/
@media screen and (min-width: 751px) {
	.Account {
        width:750px;
	}
}

/* max-width for low résolutions */
@media screen and (max-width: 750px) {
	.Account {
        width:320px;
	}
}

.AccountHeader {
    font-weight:bold;
    font-size:16px;
}

.failureNotification {
    color: Red;
    font-weight: bold;
}


    /* Deployment  
----------------------------------------------------------*/
    .FooterDeployment {
        text-align: right;
        bottom: 0px;
        right: 0px;
        position: absolute;
    }

    .DeploymentTextHeader {
        font-weight: bold;
        font-size: 21px;
        color: #9bc64e;
        margin: 0 auto;
        padding: 20px;
    }

    .DeploymentText {
        font-weight: bold;
        font-size: 17px;
        color: Black;
        margin: 0 auto;
        padding: 20px;
    }

    .DeploymentTextGreen {
        font-size: 16px;
        color: #9ac00c;
        margin: 0 auto;
        padding: 20px;
    }

    .DeploymentTextGreenUnderlined {
        font-size: 16px;
        color: #9ac00c;
        text-decoration: underline;
    }

    .DeploymentTextSub {
        font-size: 16px;
        color: Black;
        margin: 0 auto;
    }


    .DeploymentTextLegal {
        font-size: 12px;
        color: Black;
        margin: 0 auto;
    }


    .DeploymentTextRemark {
        font-size: 14px;
        font-style: italic;
        color: #9ac00c;
        margin: 0 auto;
    }


    .DeploymentTextBackGround {
        font-size: 16px;
        color: Black;
        padding: 20px;
        margin: 0 auto;
        background-color: #7fabd2;
        border-color: #888888;
    }

    .DeploymentInput {
        border-color: #9ac00c;
        border-style: solid;
        border-width: 1px;
    }

    .DeploymentModuleText {
        font-size: 14px;
        font-weight: bold;
        color: Black;
        padding: 0px;
    }

    .DeploymentCheckText {
        font-size: 14px;
    }

    .DeploymentSymbol {
        font-family: Wingdings;
    }


    .DeploymentFieldSet {
        margin: 12px 8px 8px 8px;
        margin-bottom: 10px;
        margin-top: 10px;
        border-color: #5a892f;
        border-width: 3px;
        padding: 30px;
    }

    .DeploymentFieldSetLegend {
        padding: 0px;
        background-color: #5a892f;
    }

    /* Image
----------------------------------------------------------*/
    .ImageHover {
        background-repeat: repeat-x;
        background-position: left top;
        background-color: #c4ced8;
    }

    .Thumbnail {
        border-color: #9ac00c;
        background-color: White;
    }

        /* Supervision
----------------------------------------------------------*/
.Gauges {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;/* IE */
}