* { margin:0; padding:0; }

  BODY { margin:0; padding:0; font-family : Arial, Helvetica, sans-serif; font-size:10pt; }
  IMG, TABLE { border: 0; } 
  INPUT[type="text"] { -webkit-appearance: none; }

  BODY {
    background-color: #FFFFFF; 
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: none;
    -webkit-text-size-adjust:none;
    -webkit-tap-highlight-color:rgba(0,0,0,0); 
  }

  A       { color:black; text-decoration:none; }
  A:hover { color:black; text-decoration:underline; }
  A.NoU:hover { color:black; text-decoration:none; }

  .absolute { position:absolute; }
  .relative { position:relative; }
  .nouserselect { -webkit-user-select: none; }

  #Main {
    position:relative;
    margin:auto;
    width:960px;
    z-index:100;
    background-position: 0 0;
    background-repeat: repeat-x;
    background-image: url(/http/maree.info/img/fond-entete.png);
  }

  #Main.Left  { margin-left:0;  }  
  #Main.Right { margin-right:0; }  

  BODY.Rounded #Main {
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
  }
  
  .mareeinfo SPAN { color:#c00000; }
  
  #Entete {
    position:relative;
    padding:0px 12px 0px 12px;
    z-index:300;
    width:936px;
    height:60px;
  }

  #Entete #Nav { position:relative; float:left; overflow:hidden; }
  #Entete #Nav TABLE { border:0; }
  #Entete #Nav TABLE TH#Logo { text-align:left; vertical-align:bottom; width:200px; }
  #Entete #Nav TABLE TH#Logo IMG { margin-bottom:2px; }
  #Entete #Nav TABLE TD#Welcome  { height:28px; font-size:13px; vertical-align:bottom; color:#336699; }
  #Entete #Nav TABLE TD#MainMenu { height:32px; font-size:13px; vertical-align:bottom; white-space:nowrap; }
  #Entete #Nav TABLE TD#Welcome H1 { display:inline; font-weight:normal; font-size:13px; }
 
  .Menu {
    display:inline-block;
    vertical-align:bottom;
    text-align:center;
    position:relative;
    top:0px;
    padding:5px 8px 3px 8px;
    margin:0 4px 0 0;
    background-color:#FFFFFF;
    color:#336699;
    -webkit-box-shadow:  1px 1px 2px  rgba(0,0,0,0.25);
    -moz-box-shadow: 1px 1px 2px  rgba(0,0,0,0.25);
    box-shadow: 1px 1px 2px  rgba(0,0,0,0.25);
    white-space:nowrap;
    cursor:pointer;
  }

  BODY.Rounded #MainMenu .Menu {
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
  }
  
  .Menu:hover { }
  
  .MenuTxt A       { text-decoration:none; color:#336699; }
  .MenuTxt A:hover { text-decoration:none; color:white; background-color:#336699; }
  .MenuTxt:hover, .MenuTxt:hover A { color:white; background-color:#336699; }
  
  .PMenuMainMenuSel1, .PMenuMainMenuSel1 A { color:white; background-color:#336699; }
 
  #MenuFTG       { margin-left:30px; padding:4px 3px 0px 3px; height:17px; font-size:0px; background-color:#F2F2F2; }
  #MenuFTG:hover { background-color:#F2F2F2; }
  #MenuFTG A     { display:inline-block; margin: 0 3px 0 3px; width:14px; height:14px; background-image: url(/http/maree.info/img/FTG.png); background-repeat: no-repeat; background-position: 0 14px; overflow:hidden; }
  #MenuFTG A.FB  { background-color: rgba(57,90,156,0.2);   background-position: 0 0; }
  #MenuFTG A.TW  { background-color: rgba(165,206,231,0.2); background-position: -14px 0; }
  #MenuFTG A.GG  { background-color: rgba(0,0,0,0.2);       background-position: -28px 0; }

  #MenuFTG.PMenuSel A { opacity:0.20; }
  #MenuFTG.PMenuSel A.Selected { opacity:1; }

  BODY.Rounded #MainMenu #MenuFTG {
    -webkit-border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
  }
  
  #Page { 
    width:936px;
    z-index:200;
    clear:both;
    position:relative;
    margin-bottom:2px;
    padding:12px;
    background-color:#FFFFFF;
    -webkit-box-shadow:  1px 1px 2px  rgba(0,0,0,0.25);
    -moz-box-shadow: 1px 1px 2px  rgba(0,0,0,0.25);
    box-shadow: 1px 1px 2px  rgba(0,0,0,0.25);
    border-top:1px solid #E8E8E8;
  }

  BODY.Rounded #Page {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
  }

  #SNSM { position:absolute; top:2px; right:12px; z-index:301; height:52px; padding: 18px 0 0 0; background-repeat: no-repeat; background-position: top right; background-image:url(/http/maree.info/img/SNSM.png); }
  #SNSM A { display:block; padding: 0px 74px 0 0; color:#336699; font-size:12px; text-decoration:none; }
  #SNSM A:hover b { text-decoration:underline; }

  #Rub {
    float:left;
    width:160px;
    min-height:690px; height:auto !important; height:690px;
    background-color:white;
    overflow:hidden;
  }

  #Rub1 { width:160px;height:90px;background-color:#F0F0F0; }
  #Rub2 { width:160px;height:600px;background-color:#F0F0F0; }
  
  #Contenu {
    margin-left: 172px;
    height:100%;
    min-height:690px; 
    background-color:#FFFFFF;
  }

  #Page.NoRub #Rub { display:none; }
  #Page.NoRub #Contenu { margin: 12px; }

  #FinContenu { clear:both; padding: 0 0 12px 0; border-bottom:1px solid #99B2CC; margin:0 0 6px 0; }

  .DlgMareeInfoCGU { overflow: auto; font-size:11pt; }
  .DlgMareeInfoCGU .DlgCGU { padding:10px 16px 0px 16px; }
  .DlgMareeInfoCGU .DlgCGU H4 { font-size:18pt; font-weight: bold; }
  .DlgMareeInfoCGU .DlgCGU H5 { font-size:10pt; font-weight: bold; }
  .DlgMareeInfoCGU .DlgCGUTxt { margin:18px 0; padding: 0 0 0 0; }
  .DlgMareeInfoCGU .DlgCGUBtn { margin:18px 0; padding: 0; text-align: center; }
  .DlgMareeInfoCGU .DlgCGUBtn BUTTON { border:0; padding:8px 12px; font-size:14pt; color:white; background-color: #336699; margin: 0 16px; }
  .DlgMareeInfoCGU .DlgCGUBtn BUTTON.Green { background-color: #00c000; }
  .DlgMareeInfoCGU .DlgCGUBtn BUTTON.Red { background-color: #c00000; }
  .DlgMareeInfoCGU .DlgCGUList { position:relative; margin:4px 0 0 0; padding:0 0 0 1em; }
  .DlgMareeInfoCGU .DlgCGUList:before { content:"•";  display: inline-block; width: 1em; margin-left: -1em; }
  .DlgMareeInfoCGU .DlgCGU A { text-decoration: underline; }

  BODY.Rounded .DlgMareeInfoCGU .DlgCGUBtn BUTTON {
 -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
         border-radius: 3px 3px 3px 3px;
 }

  
  #BasPage {
    position:relative; z-index:200;
    color:#336699; 
    font-size:8pt;
  }

  #BasPage A { color:#336699; text-decoration:none; }
  #BasPage A:hover { color:#336699; text-decoration:underline;  }
  
  #BasPage #MDI { float:left; width:26px; height:26px; background:url(/http/maree.info/img/maree.info-26x26.png) no-repeat 0 0; overflow:hidden; border-radius:6px; box-shadow:0px 0px 1px 0px #a0a0a0;}
  #BasPage #MDI > SPAN { display:none; }
  #BasPage #SHOM { float:left; margin:0 6px; width:45px; height:26px; background:url(/http/maree.info/img/SHOM.png) no-repeat 0 0; }
  #BasPage #CGU { font-weight:bold; }
  #BasPage #LT { padding-bottom: 1px; }
  #BasPage #LB { }

	#CGUCookie { position:fixed; z-index:10000; bottom:0px; left:0px; right:0px; background-color:#336699; background-color:rgba(51,102,153,0.9); padding:8px; color:white; }
	#CGUCookie TABLE { margin-left:auto; margin-right:auto; }
	#CGUCookie TABLE TD { padding: 8px; } 
	#CGUCookie A { color:white; text-decoration:underline; }	
	#CGUCookie DIV { display:inline-block; height:80%; float:right; color:white; background-color:#19334D; padding:10px 14px; cursor:pointer; }
	BODY.Rounded #CGUCookie DIV {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
  }
  
  #FlotteurBasPage {
    position:absolute;
    top:-25px;
    right:0;
    width:17px;
    height:21px;
   	background-repeat: no-repeat;
   	background-position: 0 0;
  	background-image:url(/http/maree.info/img/maree.info-flotteur.png);
  }

/* -------------------------------------------------------------------------- */

.MareeInfoFlotteur { display:inline-block; width:17px; height:21px; background:url(/http/maree.info/img/maree.info-flotteur.png) no-repeat 0 0; margin:0 0 0 1px; }
.MareeInfoGrandFlotteur { display:inline-block; width:29px; height:35px; background:url(/http/maree.info/img/maree.info-grand-flotteur.png) no-repeat 0 0; margin:0; }

/* -------------------------------------------------------------------------- */

.OnlyPrint {  display:none; }

@media screen and (max-width: 960px) {
  BODY.Rounded #Main { 
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
  }
  BODY.Rounded #Page {
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
  }
}

@media print {
   .OnlyPrint {  display:block; }
   .OnlyScreen { display:none; }

   #Main    { background:inherit; }
   #MenuFTG { display:none; }
   #Rub     { height:auto; min-height:inherit; }
   #Contenu { height:auto; min-height:inherit; }

   #Main { width:800px; }
   #Entete { width:776px; }
   #Page { width:776px; }
   #Rub  { display:none; }
   #Contenu { margin-left:0; }
   #SNSM { padding-top:28px; }
}

@media
only screen and (-webkit-min-device-pixel-ratio: 1.25),
only screen and ( min--moz-device-pixel-ratio: 1.25),
only screen and ( -o-min-device-pixel-ratio: 1.25/1),
only screen and ( min-device-pixel-ratio: 1.25)
{
  #BasPage #MDI { background-image:url(/http/maree.info/img/maree.info-26x26@2x.png); background-size: 26px 26px; }
  #BasPage #SHOM { background-image:url(/http/maree.info/img/SHOM@2x.png); background-size: 45px 26px; }
  #FlotteurBasPage, .MareeInfoFlotteur { background-image:url(/http/maree.info/img/maree.info-flotteur@2x.png); background-size: 17px 21px;}
  #SNSM { background-image:url(/http/maree.info/img/SNSM@2x.png); background-size: 69px 70px;}
}