home *** CD-ROM | disk | FTP | other *** search
/ waginteractive.ch / 2015.02.www.waginteractive.ch.tar / www.waginteractive.ch / bergerie / gen.css < prev    next >
Cascading Style Sheet File  |  2011-05-30  |  13KB  |  698 lines
  1. @charset "UTF-8";
  2. /* CSS Document */
  3.  
  4. /* colors
  5. red : E1001A
  6. titles and orange : DD7403
  7. titles other : 4D4D4D
  8. text : 666666
  9.  
  10. */
  11. * {
  12.     margin:0;
  13.     padding:0;
  14.     border:0;
  15. }
  16. body {
  17.     background:#000000 url("../images/fond-deg.jpg") 0 0 repeat-x;
  18. }
  19. body, html {
  20.     font-family:Arial, Helvetica, sans-serif;
  21.     font-size:12px;
  22.     line-height:140%;
  23.     color:#666;
  24. }
  25. .clearboth {
  26.     clear:both;
  27. }
  28. a {
  29.     color:#DD7403;
  30.     text-decoration:none;
  31. }
  32. p {
  33.     padding-bottom:8px;
  34. }
  35. h1, h2, h3, h4, h5, h6 {
  36.     padding-bottom:10px;
  37. }
  38. img.imgleft {
  39.     float:left;
  40.     margin:0 10px 10px 0;
  41. }
  42. img.imgright {
  43.     float:right;
  44.     margin:0 0 10px 10px;
  45. }
  46. .lirelasuite {
  47.     display:inline;
  48.     float:right;
  49.     margin-bottom:10px;
  50.     text-align:right;
  51.     background-color:#999;
  52.     line-height:18px;
  53.     padding:0 3px;
  54.     color:#fff;
  55. }
  56.     .lirelasuite a {
  57.         color:#fff;
  58.     }
  59. .savoirplus {
  60.     text-align:right;
  61.     font-style:italic;
  62.     margin-top:-10px;
  63. }
  64. .button {
  65.     display:block;
  66.     margin-bottom:10px;
  67.     padding-right:28px;
  68.     font-family:Georgia, "Times New Roman", Times, serif;
  69.     font-size:17px;
  70.     font-weight:normal;
  71.     font-style:italic;
  72.     text-align:right;
  73.     line-height:38px;
  74.     color:#fff;
  75.     background:#726A68 url("../images/button-arrow.png") right no-repeat;
  76. }
  77. .button2 {
  78.     display:block;
  79.     margin:10px 0;
  80.     padding:10px;
  81.     font-family:Georgia, "Times New Roman", Times, serif;
  82.     font-size:22px;
  83.     font-weight:normal;
  84.     font-style:italic;
  85.     text-align:center;
  86.     line-height:26px;
  87.     color:#fff;
  88.     background:#E1001A url("../images/button2-arrow.png") right bottom no-repeat;
  89. }
  90. select {
  91.     border:#ccc 1px solid;
  92. }
  93. input,
  94. textarea {
  95.     border: 1px solid #CCCCCC;
  96. }
  97. /* ############################# MENUS ############################# */
  98. #menu {
  99.     height:30px;
  100. }
  101.     #menu ul {
  102.         padding-top:5px;
  103.         list-style:none;
  104.         font-size:13px;
  105.         color:#000;
  106.         line-height:13px;
  107.     }
  108.     #menu ul li {
  109.         float:left;
  110.         position: relative;
  111.         margin-top:8px;
  112.         padding:0 12px;
  113.         border-right:1px #777 solid;
  114.     }
  115.         #menu ul li.end {
  116.             border-right:none;
  117.         }
  118.         #menu ul li a {
  119.             color:#000;
  120.         }
  121.             #menu ul li a.act {
  122.                 color:#DD7403;
  123.             }
  124.             #menu ul li ul {
  125.                 float:none;
  126.                 clear:left;
  127.                 display: none;
  128.                 position: absolute;
  129.                 width: 130px;
  130.                 margin-left:-10px;
  131.                 margin-top:15px;
  132.                 padding: 4px;
  133.                 background-color:#fff;
  134.             }
  135.                 #menu ul li:hover ul {
  136.                     display: block;
  137.                     z-index:500;
  138.                     background:url("../images/fond-main-right.png") repeat-x scroll 0 -30px transparent;
  139.                 }
  140.                     #menu ul li ul li {
  141.                         float: none;
  142.                         padding: 4px 0;
  143.                         margin-top:0;
  144.                         border:none;
  145.                         background-image:none;
  146.                         font-size:0.9em;
  147.                         line-height: 1.1em;
  148.                         font-style:italic;
  149.                     }
  150.                         #menu ul li ul li.end {
  151.                             border:none;
  152.                         }
  153.                         #menu ul li ul li a {
  154.                             /*color:#333335;*/
  155.                             color:#777;
  156.                             width: 130px;
  157.                         }
  158.                             #menu ul li ul li a:hover {
  159.                                 color:#000;
  160.                             }
  161. #submenu {
  162.     list-style:none;
  163.     font-size:13px;
  164.     margin-bottom:20px;
  165. }
  166.     #submenu li {
  167.         border-bottom:#ccc 1px solid;
  168.     }
  169.         #submenu li a {
  170.             display:block;
  171.             padding:8px 10px;
  172.             background-color:#ddd;
  173.             color:#666;
  174.             font-weight:bold;
  175.         }
  176.             #submenu li a:hover {
  177.                 color:#000;
  178.             }
  179.             #submenu li a.act {
  180.                 background-color:#ddd;
  181.                 color:#DD7403;
  182.             }
  183.                 #submenu li ul {
  184.                     list-style:none;
  185.                     margin-bottom:5px;
  186.                 }
  187.                     #submenu li ul li {
  188.                         border-top:#E6E6E6 1px solid;
  189.                         border-bottom:none;
  190.                         font-size:11px;
  191.                         line-height:10px;
  192.                     }
  193.                     #submenu li ul li a {
  194.                         background-color: transparent;
  195.                         border-top: 1px solid #EFEFEF;
  196.                         color: #666666;
  197.                         padding: 4px 10px 4px 15px;
  198.                         font-weight:normal;
  199.                     }
  200.                         #submenu li ul li a.act {
  201.                             font-weight:bold;
  202.                         }
  203. #bodywrapper {
  204.     margin-bottom:-32px;
  205.     min-height:100%;
  206.     /*position:relative;*/
  207. }
  208. .wrapperpadding {
  209.     padding:0 10px;
  210. }
  211. #headerwrapper {
  212.     /*position:relative;*/
  213.     height:28px;
  214.     width:990px;
  215.     margin:0 auto;
  216.     background-color:#333;
  217.     z-index:50;
  218.     font-family:Verdana, Arial, Helvetica, sans-serif;
  219.     font-size:9px;
  220.     color:#fff;
  221. }
  222.     #headerwrapper a {
  223.         color:#fff;
  224.     }
  225.     #headerwrapper a.lang {
  226.         color:#bbb;
  227.     }
  228.     #headerwrapper #logosite {
  229.         position:absolute;
  230.         width:650px;
  231.         margin:12px 0;
  232.         /*z-index:60;*/
  233.     }
  234.     #headerwrapper #langue {
  235.         float:left;
  236.         width:320px;
  237.         margin-top:2px;
  238.     }
  239.         #headerwrapper #langue img {
  240.             position:absolute;
  241.         }
  242.     #headerwrapper #musique {
  243.         margin-left: 230px;
  244.         margin-top: 5px;
  245.         position: absolute;
  246.         width: 440px;
  247.         z-index:100;
  248.     }
  249.     #headerwrapper #musique div {
  250.         float:right;
  251.     }
  252.     #headerwrapper #nl {
  253.         float:right;
  254.         width:270px;
  255.         margin-top:4px;
  256.         text-align:right;
  257.         line-height:10px;
  258.     }
  259.         #headerwrapper #nl ul {
  260.             list-style:none;
  261.         }
  262.             #headerwrapper #nl ul li {
  263.                 display:bloc;
  264.                 float:right;
  265.                 margin-left:5px;
  266.                 height:16px;
  267.                 line-height:16px;
  268.             }
  269.  
  270.                 #headerwrapper #nl ul li.inputborder {
  271.                     border:1px #ccc solid;
  272.                     line-height:14px;
  273.                 }
  274.         #headerwrapper #nl input {
  275.             padding:0 3px;
  276.             background-color:#333;
  277.             border:none;
  278.             color:#fff;
  279.             font-size:9px;
  280.         }
  281.             #headerwrapper #nl input.champ {
  282.                 width:74px;
  283.                 line-height:12px;
  284.             }
  285.             #headerwrapper #nl input.ok {
  286.                 width:24px;
  287.             }
  288. .background {
  289.     width:100%;
  290.     height:100%;
  291.     left:0;
  292.     background:url("../images/fond-topbar.png") no-repeat scroll center top transparent;
  293. }
  294.     .background.f1 {
  295.         background:url("../images/bandeau-01.jpg") no-repeat scroll center top transparent;
  296.     }
  297.     .background.f2 {
  298.         background:url("../images/bandeau-02.jpg") no-repeat scroll center top transparent;
  299.     }
  300.     .background.f3 {
  301.         background:url("../images/bandeau-03.jpg") no-repeat scroll center top transparent;
  302.     }
  303.     .background.f4 {
  304.         background:url("../images/bandeau-04.jpg") no-repeat scroll center top transparent;
  305.     }
  306.     .background.f5 {
  307.         background:url("../images/bandeau-05.jpg") no-repeat scroll center top transparent;
  308.     }
  309.     .background.f6 {
  310.         background:url("../images/bandeau-06.jpg") no-repeat scroll center top transparent;
  311.     }
  312.     .background.f7 {
  313.         background:url("../images/bandeau-07.jpg") no-repeat scroll center top transparent;
  314.     }
  315. #bandeau {
  316.     display:block;
  317.     z-index:0;
  318.     left:0;
  319. }
  320.     #main {
  321.         z-index:200;
  322.         position:relative;
  323.         margin-left:auto;
  324.         margin-right:auto;
  325.         width:990px;
  326.         background:url("../images/fond-main.png") 0 30px repeat-x;
  327.     }
  328.     #main.bigger {
  329.         margin-top:-160px;
  330.     }
  331.     #main.smaller {
  332.         margin-top:-422px;
  333.     }
  334. div.blocs {
  335.     margin-left:36px;
  336.     overflow:hidden;
  337.     /*position:relative;*/
  338.     width:908px;
  339. }
  340.     #main .blocs {
  341.         z-index:100;
  342.     }
  343.     #main .leftheader {
  344.         float:left;
  345.         width:216px;
  346.         height:30px;
  347.         margin-right:26px;
  348.     }
  349.     #main .rightheader {
  350.         float:left;
  351.         width:748px;
  352.         height:30px;
  353.     }
  354.     #main #left {
  355.         float:left;
  356.         width:216px;
  357.         margin-right:26px;
  358.         background-color:#E6E6E6;
  359.         font-size:11px;
  360.         line-height:16px;
  361.     }
  362.         #main #left h1 {
  363.             padding-top:6px;
  364.             padding-bottom:4px;
  365.             font-family:Georgia, "Times New Roman", Times, serif;
  366.             font-size:17px;
  367.             line-height:120%;
  368.             font-weight:normal;
  369.             font-style:italic;
  370.             color:#4D4D4D;
  371.         }
  372.         #main #left h2 {
  373.             padding-top:6px;
  374.             padding-bottom:4px;
  375.             font-size:15px;
  376.             line-height:120%;
  377.         }
  378.         #main #left img,
  379.         #main #left img.video {
  380.             margin-bottom:10px;
  381.         }
  382.         #main #left a:hover img {
  383.             opacity:0.4;
  384.             filter:alpha(opacity=40);
  385.         }
  386.     #main #right {
  387.         float:left;
  388.         width:748px;
  389.         margin-bottom:30px;
  390.     }
  391.         #main #right #lessimage,
  392.         #main #right #moreimage {
  393.             position:absolute;
  394.             width:748px;
  395.             text-align:right;
  396.             margin-top:-16px;
  397.             font-family:Verdana, Arial, Helvetica, sans-serif;
  398.             font-size:9px;
  399.             color:#fff;
  400.         }
  401.         #main #right #lessimage img,
  402.         #main #right #moreimage img {
  403.             margin-top:4px;
  404.             margin-left:4px;
  405.             display:block;
  406.             float:right;
  407.         }
  408.         #main #right #lessimage a,
  409.         #main #right #moreimage a {
  410.             margin-top:-1px;
  411.             color:#fff;
  412.             display:block;
  413.             float:right;
  414.         }
  415.         #main #right .hid {
  416.             display:none;
  417.         }
  418.         #main #right .vis {
  419.             display:block;
  420.         }
  421.         #main #right .right_background-top {
  422.             background:url("../images/fond-main-right.png") 0 -20px repeat-x;
  423.         }
  424.         #main #right h1 {
  425.             padding-top:6px;
  426.             font-family:Georgia, "Times New Roman", Times, serif;
  427.             font-size:20px;
  428.             line-height:120%;
  429.             font-weight:normal;
  430.             font-style:italic;
  431.             color:#DD7403;
  432.         }
  433.         #main #right .contentwrapper {
  434.             padding:20px 10px 10px;
  435.             margin-bottom:10px;
  436.         }
  437.             #main #right .contentwrapper.white {
  438.                 background-color:#fff;
  439.             }
  440. #footer {
  441.     /*position:relative;*/
  442.     height:28px;
  443.     width:990px;
  444.     margin:5px auto;
  445.     z-index:60;
  446.     font-family:Verdana, Arial, Helvetica, sans-serif;
  447.     font-size:9px;
  448.     color:#fff;
  449. }
  450. #footer .central {
  451.     position:absolute;
  452.     width:690px;
  453.     margin:0 150px;
  454.     text-align:center;
  455. }
  456. /* ####### RUBRIQUES ####### */
  457.         #main #right .rub h1 {
  458.             padding-top:12px;
  459.             font-size:26px;
  460.         }
  461.         #main #right .rub h2 {
  462.             padding-top:12px;
  463.             font-family:Georgia, "Times New Roman", Times, serif;
  464.             font-weight:normal;
  465.             font-style:italic;
  466.             color:#DD7403;
  467.             font-size:22px;
  468.         }
  469.         #main #right .rub h3 {
  470.             padding-top:12px;
  471.             font-family:Georgia, "Times New Roman", Times, serif;
  472.             font-weight:normal;
  473.             font-style:italic;
  474.             color:#DD7403;
  475.             font-size:18px;
  476.         }
  477.         #main #right .rub h4 {
  478.             padding-top:6px;
  479.             font-size:15px;
  480.             color:#666;
  481.         }
  482.         #main #right .rub h5 {
  483.             padding-bottom:4px;
  484.             font-size:13px;
  485.             color:#666;
  486.         }
  487.         #main #right .resa table {
  488.             width:100%;
  489.         }
  490.             #main #right .resa table table {
  491.                 width:170px;
  492.             }
  493.                 #main #right .resa table table td {
  494.                     padding:0;
  495.                 }
  496.                     #main #right .resa table table table td {
  497.                         padding:2px auto;
  498.                         text-align:center;
  499.                     }
  500.                         #main #right .resa table table table td.act {
  501.                             background-color:#DD7403;
  502.                             font-weight:bold;
  503.                         }
  504.                             #main #right .resa table table table td.act a {
  505.                                 color:#fff;
  506.                             }
  507.         #main #right .resa table.fond {
  508.             background-color:#eee;
  509.         }
  510.             #main #right .resa table td {
  511.                 padding:2px 4px;
  512.                 vertical-align: top;
  513.             }
  514.             #main #right .resa table td .field {
  515.                 border:#ccc 1px solid;
  516.                 width:386px;
  517.                 height:20px;
  518.                 padding-left:5px;
  519.             }
  520.             #main #right .resa table td .tarea {
  521.                 width:386px;
  522.             }
  523.                 #main #right .resa table td .smaller {
  524.                     width:160px;
  525.                 }
  526.                 #main #right .resa table td .small {
  527.                     width:60px;
  528.                 }
  529.             #main #right .resa table td .valid {
  530.                 padding:10px 30px;
  531.                 border:none;
  532.                 background-color:#DD7403;
  533.                 color:#fff;
  534.             }
  535. .tabvins {
  536.     width:100%;
  537. }
  538.     .tabvins td {
  539.         padding:2px;
  540.     }
  541.         .tabvins tr.fill td {
  542.             background-color:#eee;    
  543.         }
  544. /* ############################# JQUERY SLIDER ########################## */
  545. .carousel li
  546. {
  547.     display:inline;
  548. }
  549. .carousel ul li 
  550. {
  551.     margin:0;
  552.     padding:0;
  553.     position:relative;
  554. }
  555. .carousel ul li
  556. {
  557.     display:inline;
  558.     float:left;
  559.     height:402px;
  560.     /*overflow:hidden;*/
  561.     /*text-align:center;*/
  562. }
  563. .carousel ul li
  564. {
  565.     height:402px;
  566. }
  567. .carousel-next
  568. {
  569.     background:url(../images/images_site/next.png) 0 0 no-repeat;
  570. }
  571. .carousel-control
  572. {
  573.     float:left;
  574.     cursor:pointer;
  575.     display:inline-block;
  576.     height:40px;
  577.     line-height:999px;
  578.     overflow:hidden;
  579.     vertical-align:middle;
  580.     width:40px;
  581.     margin-top:180px;
  582.     color:transparent;
  583.     border:none;
  584. }
  585. .carousel-previous
  586. {
  587.     background:url(../images/images_site/prev.png) 0 0 no-repeat;
  588. }
  589. .js .carousel-wrap {
  590.     /*
  591.     display:inline-block;
  592.     vertical-align:middle;
  593.     margin:0 5px 15px;
  594.     border:1px solid #4f4f4f;
  595.     background:#1a1a1a;
  596.     */
  597.     display:inline-block;
  598.     float:left;
  599.     background-color:#fff;
  600.     width:640px;
  601.     border:2px #fff solid;
  602. }
  603.  
  604. /* ############ DIAPO ########### */
  605. /* The Nivo Slider styles */
  606. .nivoSliderInvisib {
  607.     display:none;
  608. }
  609. .nivoSlider {
  610.     position:relative;
  611.     height:436px;
  612. }
  613. .nivoSlider img {
  614.     position:absolute;
  615.     top:0px;
  616.     left:0px;
  617. }
  618. /* If an image is wrapped in a link */
  619. .nivoSlider a.nivo-imageLink {
  620.     position:absolute;
  621.     top:0px;
  622.     left:0px;
  623.     width:100%;
  624.     height:100%;
  625.     border:0;
  626.     padding:0;
  627.     margin:0;
  628.     z-index:6;
  629.     display:none;
  630. }
  631. /* The slices and boxes in the Slider */
  632. .nivo-slice {
  633.     display:block;
  634.     position:absolute;
  635.     z-index:5;
  636.     height:100%;
  637. }
  638. .nivo-box {
  639.     display:block;
  640.     position:absolute;
  641.     z-index:5;
  642. }
  643. /* Caption styles */
  644. .nivo-caption {
  645.     position:absolute;
  646.     left:0px;
  647.     bottom:0px;
  648.     background:#000;
  649.     color:#fff;
  650.     opacity:0.8; /* Overridden by captionOpacity setting */
  651.     width:100%;
  652.     z-index:8;
  653. }
  654. .nivo-caption p {
  655.     padding:5px;
  656.     margin:0;
  657. }
  658. .nivo-caption a {
  659.     display:inline !important;
  660. }
  661. .nivo-html-caption {
  662.     display:none;
  663. }
  664. /* Direction nav styles (e.g. Next & Prev) */
  665. .nivo-directionNav a {
  666.     position:absolute;
  667.     margin:8px;
  668.     top:45%;
  669.     z-index:9;
  670.     cursor:pointer;
  671. }
  672. .nivo-prevNav {
  673.     left:0px;
  674. }
  675. .nivo-nextNav {
  676.     right:0px;
  677. }
  678. /* Control nav styles (e.g. 1,2,3...) */
  679. .nivo-controlNav {
  680.     margin-bottom:5px;
  681.     position: absolute;
  682.     bottom:0;
  683.     text-align: right;
  684.     width: 722px;
  685.     z-index:10;
  686. }
  687. .nivo-controlNav a {
  688.     position:relative;
  689.     padding: 1px 3px;
  690.     z-index:9;
  691.     cursor:pointer;
  692. }
  693. .nivo-controlNav a.active {
  694.     font-weight:bold;
  695.     border:#ddd 1px solid;
  696.     color:#fff;
  697. }
  698.