/***************************/
/* Les classes prédéfinies */

/* reset */
.reset          { clear:both; margin:0; padding:0; background:transparent; border:0; font-size:100%; }

/* display */
.block          { display: block; }
.inlineBlock    { display: inline-block; }
.inline         { display: inline; }

/* Les flottants */
.clearFloat     {clear:both;}
.floatLeft      {float:left;}
.floatRight     {float:right;}

/* Largeur et hauteur des blocks en pourcent ou en pixel */
.width5pc       { width: 5%; }
.width10pc      { width: 10%; }
.width20pc      { width: 20%; }
.width25pc      { width: 25%; }
.width30pc      { width: 30%; }
.width33pc      { width: 33.333%; }
.width40pc      { width: 40%; }
.width50pc      { width: 50%; }
.width60pc      { width: 60%; }
.width66pc      { width: 66.666%; }
.width70pc      { width: 70%; }
.width75pc      { width: 75%; }
.width80pc      { width: 80%; }
.width90pc      { width: 90%; }
.width100pc     { width: 100%; }

.width20px      { width: 20px; }
.width40px      { width: 40px; }
.width50px      { width: 50px; }
.width50px      { width: 60px; }
.width88px      { width: 88px; }
.width100px     { width: 100px; }
.width120px     { width: 120px; }
.width125px     { width: 125px; }
.width150px     { width: 150px; }
.width200px     { width: 200px; }
.width234px     { width: 234px; }
.width300px     { width: 300px; }
.width400px     { width: 400px; }
.width468px     { width: 468px; }
.width500px     { width: 500px; }
.width600px     { width: 600px; }
.width700px     { width: 700px; }
.width728px     { width: 728px; }
.width800px     { width: 800px; }
.width960px     { width: 960px; }
.width980px     { width: 980px; }

.height20px      { height: 31px; }
.height31px      { height: 31px; }
.height40px      { height: 40px; }
.height50px      { height: 50px; }
.height60px      { height: 60px; }
.height90px      { height: 90px; }
.height100px     { height: 100px; }
.height125px     { height: 125px; }
.height150px     { height: 150px; }
.height200px     { height: 200px; }
.height240px     { height: 240px; }
.height250px     { height: 250px; }
.height300px     { height: 300px; }
.height400px     { height: 400px; }
.height500px     { height: 500px; }

/* Les marges externes */
.margin0        { margin: 0; }
.margin0-5      { margin: 0.5em; }
.margin1        { margin: 1em; }
.margin1-5      { margin: 1.5em; }
.margin2        { margin: 2em; }
.margin2-5      { margin: 2.5em; }
.margin3        { margin: 3em; }

.marginTop0     { margin-top: 0; }
.marginTop0-5   { margin-top: 0.5em; }
.marginTop1     { margin-top: 1em; }
.marginTop1-5   { margin-top: 1.5em; }
.marginTop2     { margin-top: 2em; }
.marginTop2-5   { margin-top: 2.5em; }
.marginTop3     { margin-top: 3em; }

.marginRight0   { margin-right: 0; }
.marginRight0-5 { margin-right: 0.5em; }
.marginRight1   { margin-right: 1em; }
.marginRight1-5 { margin-right: 1.5em; }
.marginRight2   { margin-right: 2em; }
.marginRight2-5 { margin-right: 2.5em; }
.marginRight3   { margin-right: 3em; }

.marginBottom0   { margin-bottom: 0; }
.marginBottom0-5 { margin-bottom: 0.5em; }
.marginBottom1   { margin-bottom: 1em; }
.marginBottom1-5 { margin-bottom: 1.5em; }
.marginBottom2   { margin-bottom: 2em; }
.marginBottom2-5 { margin-bottom: 2.5em; }
.marginBottom3   { margin-bottom: 3em; }

.marginLeft0     { margin-left: 0; }
.marginLeft0-5   { margin-left: 0.5em; }
.marginLeft1     { margin-left: 1em; }
.marginLeft1-5   { margin-left: 1.5em; }
.marginLeft2     { margin-left: 2em; }
.marginLeft2-5   { margin-left: 2.5em; }
.marginLeft3     { margin-left: 3em; }

/* Les marges internes */
.padding0        { padding: 0; }
.padding0-5      { padding: 0.5em; }
.padding1        { padding: 1em; }
.padding1-5      { padding: 1.5em; }
.padding2        { padding: 2em; }
.padding2-5      { padding: 2.5em; }
.padding3        { padding: 3em; }

.paddingTop0     { padding-top: 0; }
.paddingTop0-5   { padding-top: 0.5em; }
.paddingTop1     { padding-top: 1em; }
.paddingTop1-5   { padding-top: 1.5em; }
.paddingTop2     { padding-top: 2em; }
.paddingTop2-5   { padding-top: 2.5em; }
.paddingTop3     { padding-top: 3em; }

.paddingRight0   { padding-right: 0; }
.paddingRight0-5 { padding-right: 0.5em; }
.paddingRight1   { padding-right: 1em; }
.paddingRight1-5 { padding-right: 1.5em; }
.paddingRight2   { padding-right: 2em; }
.paddingRight2-5 { padding-right: 2.5em; }
.paddingRight3   { padding-right: 3em; }

.paddingBottom0   { padding-bottom: 0; }
.paddingBottom0-5 { padding-bottom: 0.5em; }
.paddingBottom1   { padding-bottom: 1em; }
.paddingBottom1-5 { padding-bottom: 1.5em; }
.paddingBottom2   { padding-bottom: 2em; }
.paddingBottom2-5 { padding-bottom: 2.5em; }
.paddingBottom3   { padding-bottom: 3em; }

.paddingLeft0     { padding-left: 0; }
.paddingLeft0-5   { padding-left: 0.5em; }
.paddingLeft1     { padding-left: 1em; }
.paddingLeft1-5   { padding-left: 1.5em; }
.paddingLeft2     { padding-left: 2em; }
.paddingLeft2-5   { padding-left: 2.5em; }
.paddingLeft3     { padding-left: 3em; }

/* Alignement du texte et block */

.center      { margin: auto; }
.textLeft    { text-align: left; }
.textRight   { text-align: right; }
.textCenter  { text-align: center; }
.textJustify { text-align: justify; }

/* Retrait du texte */

.textIndent0-5   { text-indent: 0.5em; }
.textIndent1     { text-indent: 1em; }
.textIndent1-5   { text-indent: 1.5em; }
.textIndent2     { text-indent: 2em; }
.textIndent2-5   { text-indent: 2.5em; }
.textIndent3     { text-indent: 3em; }

/* Grandeur du texte */

.size0-5    { font-size: 0.5em; }
.size0-6    { font-size: 0.6em; }
.size0-7    { font-size: 0.7em; }
.size0-8    { font-size: 0.8em; }
.size0-9    { font-size: 0.9em; }
.size1-1    { font-size: 1.1em; }
.size1-2    { font-size: 1.2em; }
.size1-3    { font-size: 1.3em; }
.size1-4    { font-size: 1.4em; }
.size1-5    { font-size: 1.5em; }

/* Les puces */

.puceNone   { list-style: none; }
.puceSquare { list-style: square; }

/* Les bordures */
      
.borderTop1      { border-top: 1px solid; }
.borderTop2      { border-top: 2px solid; }
.borderTop3      { border-top: 3px solid; }
.borderTop5      { border-top: 5px solid; }

.borderRight1    { border-right: 1px solid; }
.borderRight2    { border-right: 2px solid; }
.borderRight3    { border-right: 3px solid; }
.borderRight5    { border-right: 5px solid; }

.borderBottom1   { border-bottom: 1px solid; }
.borderBottom2   { border-bottom: 2px solid; }
.borderBottom3   { border-bottom: 3px solid; }
.borderBottom5   { border-bottom: 5px solid; }

.borderLeft1     { border-left: 1px solid; }
.borderLeft2     { border-left: 2px solid; }
.borderLeft3     { border-left: 3px solid; }
.borderLeft5     { border-left: 5px solid; }

.border1        { border: 1px solid; }
.border2        { border: 2px solid; }
.border3        { border: 3px solid; }
.border5        { border: 5px solid; }

.borderRadius3    { border-radius: 3px; }
.borderRadius5    { border-radius: 5px; }
.borderRadius6    { border-radius: 6px; }
.borderRadius7    { border-radius: 7px; }
.borderRadius8    { border-radius: 8px; }
.borderRadius9    { border-radius: 9px; }
.borderRadius10   { border-radius: 10px; }
.borderRadius15   { border-radius: 15px; }
.borderRadius20   { border-radius: 20px; }
.borderRadius25   { border-radius: 25px; }
.borderRadius30   { border-radius: 30px; }
.borderRadius35   { border-radius: 35px; }
.borderRadius40   { border-radius: 40px; }
.borderRadius45   { border-radius: 45px; }
.borderRadius50   { border-radius: 50px; }

.borderRadiusTopLeft3    { border-top-left-radius: 3px; }
.borderRadiusTopLeft5    { border-top-left-radius: 5px; }
.borderRadiusTopLeft6    { border-top-left-radius: 6px; }
.borderRadiusTopLeft7    { border-top-left-radius: 7px; }
.borderRadiusTopLeft8    { border-top-left-radius: 8px; }
.borderRadiusTopLeft9    { border-top-left-radius: 9px; }
.borderRadiusTopLeft10   { border-top-left-radius: 10px; }
.borderRadiusTopLeft15   { border-top-left-radius: 15px; }
.borderRadiusTopLeft20   { border-top-left-radius: 20px; }
.borderRadiusTopLeft25   { border-top-left-radius: 25px; }

.borderRadiusTopRight3    { border-top-right-radius: 3px; }
.borderRadiusTopRight5    { border-top-right-radius: 5px; }
.borderRadiusTopRight6    { border-top-right-radius: 6px; }
.borderRadiusTopRight7    { border-top-right-radius: 7px; }
.borderRadiusTopRight8    { border-top-right-radius: 8px; }
.borderRadiusTopRight9    { border-top-right-radius: 9px; }
.borderRadiusTopRight10   { border-top-right-radius: 10px; }
.borderRadiusTopRight15   { border-top-right-radius: 15px; }
.borderRadiusTopRight20   { border-top-right-radius: 20px; }
.borderRadiusTopRight25   { border-top-right-radius: 25px; }

.borderRadiusBottomLeft3    { border-bottom-left-radius: 3px; }
.borderRadiusBottomLeft5    { border-bottom-left-radius: 5px; }
.borderRadiusBottomLeft6    { border-bottom-left-radius: 6px; }
.borderRadiusBottomLeft7    { border-bottom-left-radius: 7px; }
.borderRadiusBottomLeft8    { border-bottom-left-radius: 8px; }
.borderRadiusBottomLeft9    { border-bottom-left-radius: 9px; }
.borderRadiusBottomLeft10   { border-bottom-left-radius: 10px; }
.borderRadiusBottomLeft15   { border-bottom-left-radius: 15px; }
.borderRadiusBottomLeft20   { border-bottom-left-radius: 20px; }
.borderRadiusBottomLeft25   { border-bottom-left-radius: 25px; }

.borderRadiusBottomRight3    { border-bottom-right-radius: 3px; }
.borderRadiusBottomRight5    { border-bottom-right-radius: 5px; }
.borderRadiusBottomRight6    { border-bottom-right-radius: 6px; }
.borderRadiusBottomRight7    { border-bottom-right-radius: 7px; }
.borderRadiusBottomRight8    { border-bottom-right-radius: 8px; }
.borderRadiusBottomRight9    { border-bottom-right-radius: 9px; }
.borderRadiusBottomRight10   { border-bottom-right-radius: 10px; }
.borderRadiusBottomRight15   { border-bottom-right-radius: 15px; }
.borderRadiusBottomRight20   { border-bottom-right-radius: 20px; }
.borderRadiusBottomRight25   { border-bottom-right-radius: 25px; }

/* Couleur de la bordure */

.borderRed1      { border-color: #a0191e; }
.borderRed2      { border-color: #c10000; }
.borderRed3      { border-color: #c6002b; }
.borderRed4      { border-color: #FF0000; }

.borderGreen1    { border-color: #005e20; }
.borderGreen2    { border-color: #007e00; }
.borderGreen3    { border-color: #5f7900; }
.borderGreen4    { border-color: #57b05a; }
.borderGreen5    { border-color: #c2eb74; }

.borderBlue1     { border-color: #2f3958; }
.borderBlue2     { border-color: #265390; }
.borderBlue3     { border-color: #0067a0; }
.borderBlue4     { border-color: #2e7dec; }
.borderBlue5     { border-color: #b5cdff; }

.borderWhite     { border-color: #fff; }
.borderBlack     { border-color: #000; }

.borderGrey1     { border-color: #282b2e; }
.borderGrey2     { border-color: #343434; }
.borderGrey3     { border-color: #434343; }
.borderGrey4     { border-color: #4c4c4f; }
.borderGrey5     { border-color: #666; }
.borderGrey6     { border-color: #888; }
.borderGrey7     { border-color: #aaa; }
.borderGrey8     { border-color: #ccc; }
.borderGrey9     { border-color: #eee; }

.borderSilver    { border-color: #e9e9e9; }
.borderMagnolia  { border-color: #f7f5e8; }

.borderYellow    { border-color: #ffff6f; }
.borderOrange    { border-color: #c74100; }
.borderFlux      { border-color: #ff5e00; }
.borderGold      { border-color: #bb8800; }
.borderPink      { border-color: #ff0070; }
.borderSlime     { border-color: #adc61a; }
.borderInfo      { border-color: #00529B; }
.borderSuccess   { border-color: #4F8A10; }
.borderWarning   { border-color: #9F6000; }
.borderError     { border-color: #D8000C; }

/* Effets des boites */

.boxShadow      { box-shadow:0 0 5px #666; }
.opaqueWhite    { background:rgba(255,255,255,.7); }
.opaqueBlack    { background:rgba(0,0,0,.7); }

/* Palette de couleur */

.textRed1      { color: #a0191e; }
.textRed2      { color: #c10000; }
.textRed3      { color: #c6002b; }
.textRed4      { color: #FF0000; }

.textGreen1    { color: #005e20; }
.textGreen2    { color: #007e00; }
.textGreen3    { color: #5f7900; }
.textGreen4    { color: #57b05a; }
.textGreen5    { color: #c2eb74; }

.textBlue1     { color: #2f3958; }
.textBlue2     { color: #265390; }
.textBlue3     { color: #0067a0; }
.textBlue4     { color: #2e7dec; }
.textBlue5     { color: #b5cdff; }

.textWhite     { color: #fff; }
.textBlack     { color: #000; }

.textGrey1     { color: #282b2e; }
.textGrey2     { color: #343434; }
.textGrey3     { color: #434343; }
.textGrey4     { color: #4c4c4f; }
.textGrey5     { color: #666; }
.textGrey6     { color: #888; }
.textGrey7     { color: #aaa; }
.textGrey8     { color: #ccc; }
.textGrey9     { color: #eee; }

.textSilver    { color: #e9e9e9; }
.textMagnolia  { color: #f7f5e8; }

.textYellow    { color: #ffff6f; }
.textOrange    { color: #c74100; }
.textFlux      { color: #ff5e00; }
.textGold      { color: #bb8800; }
.textPink      { color: #ff0070; }
.textSlime     { color: #adc61a; }
.textInfo      { color: #00529B; }
.textSuccess   { color: #4F8A10; }
.textWarning   { color: #9F6000; }
.textError     { color: #D8000C; }

/* Pack de boites de info utilisateur */

.backgroundRed1      { background-color: #a0191e; }
.backgroundRed2      { background-color: #c10000; }
.backgroundRed3      { background-color: #c6002b; }
.backgroundRed4      { background-color: #FF0000; }

.backgroundGreen1    { background-color: #005e20; }
.backgroundGreen2    { background-color: #007e00; }
.backgroundGreen3    { background-color: #5f7900; }
.backgroundGreen4    { background-color: #57b05a; }
.backgroundGreen5    { background-color: #c2eb74; }

.backgroundBlue1     { background-color: #2f3958; }
.backgroundBlue2     { background-color: #265390; }
.backgroundBlue3     { background-color: #0067a0; }
.backgroundBlue4     { background-color: #2e7dec; }
.backgroundBlue5     { background-color: #b5cdff; }

.backgroundWhite     { background-color: #fff; }
.backgroundBlack     { background-color: #000; }

.backgroundGrey1     { background-color: #282b2e; }
.backgroundGrey2     { background-color: #343434; }
.backgroundGrey3     { background-color: #434343; }
.backgroundGrey4     { background-color: #4c4c4f; }
.backgroundGrey5     { background-color: #666; }
.backgroundGrey6     { background-color: #888; }
.backgroundGrey7     { background-color: #aaa; }
.backgroundGrey8     { background-color: #ccc; }
.backgroundGrey9     { background-color: #eee; }

.backgroundSilver    { background-color: #e9e9e9; }
.backgroundMagnolia  { background-color: #f7f5e8; }

.backgroundYellow    { background-color: #ffff6f; }
.backgroundOrange    { background-color: #c74100; }
.backgroundFlux      { background-color: #ff5e00; }
.backgroundGold      { background-color: #bb8800; }
.backgroundPink      { background-color: #ff0070; }
.backgroundSlime     { background-color: #adc61a; }
.backgroundInfo      { background-color: #BDE5F8; }
.backgroundSuccess   { background-color: #DFF2BF; }
.backgroundWarning   { background-color: #FEEFB3; }
.backgroundError     { background-color: #FFBABA; }

/* Extra */
.lien {cursor:pointer;}

/* Messages Box */

.info, .success, .warning, .error, .validation
{
    border-top: 1px solid;
    border-bottom: 1px solid;
    margin: 10px 5px;
    padding:15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
    font-family:Arial, Helvetica, sans-serif; 
    font-size:13px;
}
.info
{
    color: #00529B;
    background-color: #BDE5F8;
}
.success
{
    color: #4F8A10;
    background-color: #DFF2BF;
}
.warning
{
    color: #9F6000;
    background-color: #FEEFB3;
}
.error
{
    color: #D8000C;
    background-color: #FFBABA;
}
.boxInfo
{
    color: #00529B;
    background-color: #BDE5F8;
    border: 1px solid;
}
.boxSuccess
{
    color: #4F8A10;
    background-color: #DFF2BF;
    border: 1px solid;
}
.boxWarning
{
    color: #9F6000;
    background-color: #FEEFB3;
    border: 1px solid;
}
.boxError
{
    color: #D8000C;
    background-color: #FFBABA;
    border: 1px solid;
}

/* Fléches Box */

.arrowTopInfo { position: relative; background: #aedef7; border: 1px solid #003c8a; }
.arrowTopInfo:after, .arrowTopInfo:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowTopInfo:after { border-color: rgba(174, 222, 247, 0); border-bottom-color: #aedef7; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowTopInfo:before { border-color: rgba(0, 60, 138, 0); border-bottom-color: #003c8a; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowRightInfo { position: relative; background: #aedef7; border: 1px solid #003c8a; }
.arrowRightInfo:after, .arrowRightInfo:before{ left: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowRightInfo:after{ border-color: rgba(174, 222, 247, 0); border-left-color: #aedef7; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowRightInfo:before{ border-color: rgba(0, 60, 138, 0); border-left-color: #003c8a; border-width: 21px; top: 50%; margin-top: -21px; }

.arrowBottomInfo { position: relative; background: #aedef7; border: 1px solid #003c8a; }
.arrowBottomInfo:after, .arrowBottomInfo:before { top: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowBottomInfo:after { border-color: rgba(174, 222, 247, 0); border-top-color: #aedef7; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowBottomInfo:before { border-color: rgba(0, 60, 138, 0); border-top-color: #003c8a; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowLeftInfo { position: relative; background: #aedef7; border: 1px solid #003c8a; }
.arrowLeftInfo:after, .arrowLeftInfo:before { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowLeftInfo:after { border-color: rgba(174, 222, 247, 0); border-right-color: #aedef7; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowLeftInfo:before { border-color: rgba(0, 60, 138, 0); border-right-color: #003c8a; border-width: 21px; top: 50%; margin-top: -21px; }



.arrowTopSuccess { position: relative; background: #dff2bf; border: 1px solid #4f8A10; }
.arrowTopSuccess:after, .arrowTopSuccess:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowTopSuccess:after { border-color: rgba(223, 242, 191, 0); border-bottom-color: #dff2bf; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowTopSuccess:before { border-color: rgba(79, 138, 16, 0); border-bottom-color: #4f8A10; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowRightSuccess { position: relative; background: #dff2bf; border: 1px solid #4f8A10; }
.arrowRightSuccess:after, .arrowRightSuccess:before { left: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowRightSuccess:after { border-color: rgba(223, 242, 191, 0); border-left-color: #dff2bf; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowRightSuccess:before { border-color: rgba(79, 138, 16, 0); border-left-color: #4f8A10; border-width: 21px; top: 50%; margin-top: -21px; }

.arrowBottomSuccess { position: relative; background: #dff2bf; border: 1px solid #4f8A10; }
.arrowBottomSuccess:after, .arrowBottomSuccess:before { top: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowBottomSuccess:after { border-color: rgba(223, 242, 191, 0); border-top-color: #dff2bf; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowBottomSuccess:before { border-color: rgba(79, 138, 16, 0); border-top-color: #4f8A10; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowLeftSuccess { position: relative; background: #dff2bf; border: 1px solid #4f8A10; }
.arrowLeftSuccess:after, .arrowLeftSuccess:before { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowLeftSuccess:after { border-color: rgba(223, 242, 191, 0); border-right-color: #dff2bf; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowLeftSuccess:before { border-color: rgba(79, 138, 16, 0); border-right-color: #4f8A10; border-width: 21px; top: 50%; margin-top: -21px; }



.arrowTopWarning { position: relative; background: #feefb3; border: 1px solid #9F6000; }
.arrowTopWarning:after, .arrowTopWarning:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowTopWarning:after { border-color: rgba(254, 239, 179, 0); border-bottom-color: #feefb3; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowTopWarning:before { border-color: rgba(159, 96, 0, 0); border-bottom-color: #9F6000; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowRightWarning { position: relative; background: #feefb3; border: 1px solid #9F6000; }
.arrowRightWarning:after, .arrowRightWarning:before { left: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowRightWarning:after { border-color: rgba(254, 239, 179, 0); border-left-color: #feefb3; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowRightWarning:before { border-color: rgba(159, 96, 0, 0); border-left-color: #9F6000; border-width: 21px; top: 50%; margin-top: -21px; }

.arrowBottomWarning { position: relative; background: #feefb3; border: 1px solid #9F6000; }
.arrowBottomWarning:after, .arrowBottomWarning:before { top: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowBottomWarning:after { border-color: rgba(254, 239, 179, 0); border-top-color: #feefb3; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowBottomWarning:before { border-color: rgba(159, 96, 0, 0); border-top-color: #9F6000; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowLeftWarning { position: relative; background: #feefb3; border: 1px solid #9F6000; }
.arrowLeftWarning:after, .arrowLeftWarning:before { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowLeftWarning:after { border-color: rgba(254, 239, 179, 0); border-right-color: #feefb3; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowLeftWarning:before { border-color: rgba(159, 96, 0, 0); border-right-color: #9F6000; border-width: 21px; top: 50%; margin-top: -21px; }



.arrowTopError { position: relative; background: #FFBABA; border: 1px solid #D8000C; }
.arrowTopError:after, .arrowTopError:before { bottom: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowTopError:after { border-color: rgba(255, 186, 186, 0); border-bottom-color: #FFBABA; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowTopError:before { border-color: rgba(216, 0, 12, 0); border-bottom-color: #D8000C; border-width: 21px; left: 50%; margin-left: -21px; }

.arrowRightError { position: relative; background: #FFBABA; border: 1px solid #D8000C; }
.arrowRightError:after, .arrowRightError:before { left: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowRightError:after { border-color: rgba(255, 186, 186, 0); border-left-color: #FFBABA; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowRightError:before { border-color: rgba(216, 0, 12, 0); border-left-color: #D8000C; border-width: 21px; top: 50%; margin-top: -21px; }

.arrowBottomError { position: relative; background: #FFBABA; border: 1px solid #D8000C; }
.arrowBottomError:after, .arrowBottomError:before { top: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowBottomError:after { border-color: rgba(255, 186, 186, 0); border-top-color: #FFBABA; border-width: 20px; left: 50%; margin-left: -20px; }
.arrowBottomError:before { border-color: rgba(216, 0, 12, 0); border-top-color: #D8000C; border-width: 21px; left: 50%; margin-left: -21px; }


.arrowLeftError { position: relative; background: #FFBABA; border: 1px solid #D8000C; }
.arrowLeftError:after, .arrowLeftError:before { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.arrowLeftError:after { border-color: rgba(255, 186, 186, 0); border-right-color: #FFBABA; border-width: 20px; top: 50%; margin-top: -20px; }
.arrowLeftError:before { border-color: rgba(216, 0, 12, 0); border-right-color: #D8000C; border-width: 21px; top: 50%; margin-top: -21px; }