init commit
This commit is contained in:
hugo LAMY
126
www/actualisation/css/lightbox.css
Normal file
126
www/actualisation/css/lightbox.css
Normal file
@@ -0,0 +1,126 @@
|
||||
/* CSS Lightbox */
|
||||
|
||||
#lightbox {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 100;
|
||||
text-align: center;
|
||||
line-height: 0;
|
||||
}
|
||||
#lightbox img {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
#lightbox a img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
#outerImageContainer {
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
#imageContainer {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
#loading {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 0%;
|
||||
height: 25%;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
line-height: 0;
|
||||
}
|
||||
#hoverNav {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
}
|
||||
#imageContainer > #hoverNav {
|
||||
left: 0;
|
||||
}
|
||||
#hoverNav a {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#prevLink,
|
||||
#nextLink {
|
||||
width: 49%;
|
||||
height: 100%;
|
||||
background-image: url(data:images/gif;base64,AAAA); /* Trick IE into showing hover */
|
||||
display: block;
|
||||
}
|
||||
#prevLink {
|
||||
left: 0;
|
||||
float: left;
|
||||
}
|
||||
#nextLink {
|
||||
right: 0;
|
||||
float: right;
|
||||
}
|
||||
#prevLink:hover,
|
||||
#prevLink:visited:hover {
|
||||
background: url(../images/prevlabel.gif) left 15% no-repeat;
|
||||
}
|
||||
#nextLink:hover,
|
||||
#nextLink:visited:hover {
|
||||
background: url(../images/nextlabel.gif) right 15% no-repeat;
|
||||
}
|
||||
|
||||
#imageDataContainer {
|
||||
font: 11px Arial, Helvetica, sans-serif;
|
||||
background-color: #fff;
|
||||
border-top: 1px #666666 solid;
|
||||
margin: 0 auto;
|
||||
line-height: 1.4em;
|
||||
overflow: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#imageData {
|
||||
padding: 0 10px;
|
||||
color: #666;
|
||||
font-family: Courrier New, Courrier, DejaVu Sans Mono, monospace;
|
||||
}
|
||||
#imageData #imageDetails {
|
||||
width: 70%;
|
||||
float: left;
|
||||
margin-top: 7px;
|
||||
text-align: left;
|
||||
}
|
||||
#imageData #caption {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-weight: bold;
|
||||
}
|
||||
#imageData #numberDisplay {
|
||||
font: 10px Arial, Helvetica, sans-serif;
|
||||
display: block;
|
||||
clear: left;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
#imageData #bottomNavClose {
|
||||
width: 66px;
|
||||
float: right;
|
||||
margin-top: 7px;
|
||||
padding-bottom: 0.7em;
|
||||
outline: none;
|
||||
background: url(../images/closelabel.gif) right 15% no-repeat;
|
||||
}
|
||||
|
||||
#overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 90;
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
background-color: silver;
|
||||
}
|
||||
824
www/actualisation/css/styles.css
Normal file
824
www/actualisation/css/styles.css
Normal file
@@ -0,0 +1,824 @@
|
||||
@charset "UTF-8";
|
||||
/* CSS Document */
|
||||
|
||||
@font-face {
|
||||
font-family: "arial-bold";
|
||||
src: local("Arial Bold");
|
||||
}
|
||||
|
||||
* {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
body {
|
||||
background: url(../images/fond1.png);
|
||||
background-repeat: repeat-x;
|
||||
}
|
||||
|
||||
#global {
|
||||
height: 700px;
|
||||
width: 1024px;
|
||||
background-color: #ffffff;
|
||||
color: #000000;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 11px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
#left {
|
||||
float: left;
|
||||
width: 290px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
#logo {
|
||||
float: left;
|
||||
width: 230px;
|
||||
height: 60px;
|
||||
margin-top: 30px;
|
||||
margin-left: 38px;
|
||||
}
|
||||
|
||||
.trait {
|
||||
float: left;
|
||||
width: 218px;
|
||||
height: 1px;
|
||||
border-top: 1px solid #000000;
|
||||
margin-left: 43px;
|
||||
}
|
||||
|
||||
.trait1 {
|
||||
float: left;
|
||||
width: 180px;
|
||||
height: 1px;
|
||||
border-top: 1px solid #000000;
|
||||
margin-left: 43px;
|
||||
}
|
||||
|
||||
.menu {
|
||||
float: left;
|
||||
height: 41px;
|
||||
width: 180px;
|
||||
font-family: arial-bold, Arial Bold, sans-serif;
|
||||
font-weight: 900;
|
||||
color: #cc3300;
|
||||
font-size: 18px;
|
||||
line-height: 41px;
|
||||
margin-left: 43px;
|
||||
}
|
||||
.menu a {
|
||||
font-family: arial-bold, Arial Bold, sans-serif;
|
||||
font-weight: 900;
|
||||
text-decoration: none;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.menu a:hover {
|
||||
font-family: arial-bold, Arial Bold, sans-serif;
|
||||
font-weight: 900;
|
||||
text-decoration: none;
|
||||
color: #cc3300;
|
||||
}
|
||||
|
||||
.left_bottom {
|
||||
float: left;
|
||||
width: 213px;
|
||||
height: auto;
|
||||
font-size: 11px;
|
||||
margin-left: 40px;
|
||||
/*margin-top:7px;*/
|
||||
}
|
||||
|
||||
.left_bottom1 {
|
||||
float: left;
|
||||
width: 222px;
|
||||
height: auto;
|
||||
font-size: 11px;
|
||||
margin-left: 35px;
|
||||
/*margin-top:7px;*/
|
||||
}
|
||||
|
||||
.icone {
|
||||
float: left;
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.sousmenu {
|
||||
float: left;
|
||||
width: 150px;
|
||||
height: auto;
|
||||
color: #cc3300;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.sousmenu a {
|
||||
text-decoration: none;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.sousmenu a:hover {
|
||||
text-decoration: none;
|
||||
color: #cc3300;
|
||||
}
|
||||
|
||||
#right {
|
||||
float: left;
|
||||
width: 700px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
#trait_vertical {
|
||||
float: left;
|
||||
height: 610px;
|
||||
width: 1px;
|
||||
margin-top: 48px;
|
||||
margin-left: 110px;
|
||||
border-left: 1px solid #000000;
|
||||
}
|
||||
|
||||
#bottom {
|
||||
float: left;
|
||||
width: 909px;
|
||||
height: auto;
|
||||
margin-left: 45px;
|
||||
margin-top: 80px;
|
||||
padding-top: 10px;
|
||||
font-size: 10px;
|
||||
color: #000000;
|
||||
border-top: 1px solid #666666;
|
||||
}
|
||||
|
||||
.icone1 {
|
||||
float: left;
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
margin-left: 240px;
|
||||
}
|
||||
|
||||
/* page accueil */
|
||||
|
||||
#content {
|
||||
float: left;
|
||||
width: 480px;
|
||||
height: 600px;
|
||||
margin-left: 100px;
|
||||
margin-top: 92px;
|
||||
}
|
||||
|
||||
.diaporama {
|
||||
position: relative;
|
||||
width: 480px; /* Largeur d'une photo */
|
||||
height: 360px; /* Hauteur d'une photo */
|
||||
/*margin-top:30px;
|
||||
margin-left:262px;*/
|
||||
}
|
||||
|
||||
.diaporama li {
|
||||
list-style-type: none;
|
||||
overflow: hidden;
|
||||
position: absolute; /* Les images seront positionnées toutes au même endroit */
|
||||
}
|
||||
|
||||
.diaporama li a img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.diaporama_controls {
|
||||
width: 512px;
|
||||
margin: 3px 0;
|
||||
/* padding:5px;*/
|
||||
clear: both;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.diaporama_controls .btns {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.diaporama_controls a {
|
||||
font-weight: normal;
|
||||
width: 10px;
|
||||
/*height:13px;*/
|
||||
text-indent: -9999px;
|
||||
display: inline-block;
|
||||
margin: 0 3px;
|
||||
}
|
||||
|
||||
.diaporama_controls .prev {
|
||||
background: url(img/fleches_diapo.png) no-repeat top right;
|
||||
}
|
||||
|
||||
.diaporama_controls .next {
|
||||
background: url(img/fleches_diapo.png) no-repeat top left;
|
||||
}
|
||||
|
||||
.diaporama_controls .pause {
|
||||
background: url(img/fleches_diapo.png) no-repeat bottom right;
|
||||
}
|
||||
|
||||
.diaporama_controls .play {
|
||||
background: url(img/fleches_diapo.png) no-repeat bottom left;
|
||||
}
|
||||
|
||||
#texte {
|
||||
float: left;
|
||||
width: 480px;
|
||||
height: auto;
|
||||
font-size: 11px;
|
||||
/*margin-top:15px;*/
|
||||
padding-right: 10px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
/* page artistes */
|
||||
|
||||
#content_artistes {
|
||||
float: left;
|
||||
width: 552px;
|
||||
height: 552px;
|
||||
margin-left: 70px;
|
||||
margin-top: 92px;
|
||||
}
|
||||
|
||||
.portrait a {
|
||||
float: left;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-top: 5px;
|
||||
margin-left: 5px;
|
||||
border: 1px solid #000000;
|
||||
}
|
||||
|
||||
.portrait a img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.portrait a:hover {
|
||||
border: 1px solid #cc3300;
|
||||
}
|
||||
|
||||
.vide {
|
||||
float: left;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-top: 5px;
|
||||
margin-left: 5px;
|
||||
border: 1px solid #000000;
|
||||
}
|
||||
|
||||
.boite {
|
||||
float: left;
|
||||
width: 174px;
|
||||
height: 174px;
|
||||
}
|
||||
|
||||
#affichage {
|
||||
float: left;
|
||||
width: 167px;
|
||||
height: 105px;
|
||||
border: 1px solid #000000;
|
||||
margin-left: 5px;
|
||||
margin-top: 5px;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
padding-top: 62px;
|
||||
}
|
||||
|
||||
/* page manifestations */
|
||||
|
||||
#middle {
|
||||
float: left;
|
||||
width: 600px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#top {
|
||||
float: left;
|
||||
height: 15px;
|
||||
width: 480px;
|
||||
margin-left: 98px;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.center {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.carre {
|
||||
float: left;
|
||||
width: 10px;
|
||||
height: 12px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.nom {
|
||||
float: left;
|
||||
height: 12px;
|
||||
width: auto;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
#manifestations {
|
||||
position: relative;
|
||||
left: 100px;
|
||||
top: 0px;
|
||||
float: left;
|
||||
width: 580px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
#Container {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 510px;
|
||||
height: 530px;
|
||||
background-color: #ffffff;
|
||||
overflow-y: scroll;
|
||||
overflow-x: hidden;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
#News {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
/* overflow: hidden; */
|
||||
width: 480px;
|
||||
height: 530px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#News {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.Scroller-Container {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
.title {
|
||||
width: 480px;
|
||||
height: 20px;
|
||||
font-family: Arial, sans-serif;
|
||||
font-size: 19px;
|
||||
color: #cc3300;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.video {
|
||||
width: 480px;
|
||||
height: 400px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.images_grand {
|
||||
width: 480px;
|
||||
height: 380px;
|
||||
}
|
||||
|
||||
.images_grand1 {
|
||||
width: 480px;
|
||||
height: 357px;
|
||||
}
|
||||
|
||||
.images_grand2 {
|
||||
width: 480px;
|
||||
height: 384px;
|
||||
}
|
||||
|
||||
.images_grand3 {
|
||||
width: 480px;
|
||||
height: 351px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.images_grand4 {
|
||||
width: 480px;
|
||||
height: 402px;
|
||||
}
|
||||
|
||||
.images_grand5 {
|
||||
width: 480px;
|
||||
height: 372px;
|
||||
}
|
||||
|
||||
.images {
|
||||
width: 480px;
|
||||
height: 80px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.images1 {
|
||||
width: 480px;
|
||||
height: 80px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.vignette a {
|
||||
float: left;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
border: 1px solid #ffffff;
|
||||
}
|
||||
|
||||
.vignette a:hover {
|
||||
float: left;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
border: 1px solid #cc3300;
|
||||
}
|
||||
|
||||
.texte_manif {
|
||||
width: 480px;
|
||||
height: auto;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
.texte_manif p {
|
||||
text-align: justify;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.img_grand a {
|
||||
float: left;
|
||||
width: 478px;
|
||||
height: auto;
|
||||
border: 1px solid #ffffff;
|
||||
}
|
||||
.img_grand a:hover {
|
||||
float: left;
|
||||
width: 478px;
|
||||
height: auto;
|
||||
border: 1px solid #cc3300;
|
||||
}
|
||||
|
||||
#trait_vertical1 {
|
||||
float: left;
|
||||
height: 610px;
|
||||
width: 1px;
|
||||
margin-top: 48px;
|
||||
margin-left: 90px;
|
||||
border-left: 1px solid #000000;
|
||||
}
|
||||
|
||||
/* page interstices */
|
||||
|
||||
#content_inter {
|
||||
float: left;
|
||||
height: 600px;
|
||||
width: 570px;
|
||||
margin-left: 70px;
|
||||
margin-top: 92px;
|
||||
}
|
||||
|
||||
#interstice {
|
||||
float: left;
|
||||
height: 520px;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
#survol {
|
||||
float: left;
|
||||
height: 520px;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
#chiffres {
|
||||
float: left;
|
||||
width: 30px;
|
||||
height: 520px;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
#chiffres p {
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
#chiffres p a {
|
||||
color: #000000;
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
margin-bottom: 60px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#chiffres p a:hover {
|
||||
color: #cc3300;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* page ateliers */
|
||||
|
||||
#ateliers {
|
||||
position: relative;
|
||||
left: 100px;
|
||||
top: 90px;
|
||||
float: left;
|
||||
width: 580px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
#img_atelier {
|
||||
background-color: #000000;
|
||||
width: 480px;
|
||||
/*height:336px;*/
|
||||
height: 380px;
|
||||
margin-top: 3px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#img_atelier img {
|
||||
/*margin-top: 25px;*/
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.legende {
|
||||
width: 480px;
|
||||
height: auto;
|
||||
text-align: justify;
|
||||
font-style: italic;
|
||||
font-size: 11px;
|
||||
color: #000000;
|
||||
margin-top: 10px;
|
||||
margin-left: 340px;
|
||||
}
|
||||
|
||||
.artistes {
|
||||
width: 480px;
|
||||
height: auto;
|
||||
text-align: justify;
|
||||
font-size: 12px;
|
||||
color: #000000;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
#carton {
|
||||
width: 480px;
|
||||
height: 370px;
|
||||
margin-top: 50px;
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
.legende1 {
|
||||
float: left;
|
||||
width: 240px;
|
||||
height: auto;
|
||||
text-align: justify;
|
||||
font-style: italic;
|
||||
font-size: 11px;
|
||||
color: #000000;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
/* page de contact */
|
||||
|
||||
#contact {
|
||||
position: relative;
|
||||
left: 100px;
|
||||
top: 90px;
|
||||
float: left;
|
||||
width: 580px;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
#News1 {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
overflow: hidden;
|
||||
width: 480px;
|
||||
height: 530px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#News1 {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#noir {
|
||||
width: 480px;
|
||||
height: 480px;
|
||||
background-color: #000000;
|
||||
}
|
||||
|
||||
#fauteuil {
|
||||
background-image: url(../images/contact5.jpg);
|
||||
background-repeat: no-repeat;
|
||||
height: auto;
|
||||
width: 480px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
#fauteuil p {
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
/*#contact_center{
|
||||
height:442px;
|
||||
width:280px;
|
||||
margin-left:190px;
|
||||
top:0px;
|
||||
}*/
|
||||
|
||||
#adresse1 {
|
||||
position: relative;
|
||||
width: 250px;
|
||||
height: 444px;
|
||||
left: 205px;
|
||||
top: 0px;
|
||||
font-size: 11px;
|
||||
line-height: 16px;
|
||||
/*background-color:#d1d7d6;*/
|
||||
/*border-top:1px solid #cccccc;
|
||||
border-bottom:1px solid #cccccc;*/
|
||||
}
|
||||
|
||||
#logo_p {
|
||||
position: relative;
|
||||
width: 200px;
|
||||
left: 13px;
|
||||
top: 30px;
|
||||
}
|
||||
|
||||
#adresse1 p a {
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#adresse1 p a:hover {
|
||||
color: #cc3300;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
adresse1 td {
|
||||
height: 11px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.link a {
|
||||
color: #000000;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.link a:hover {
|
||||
color: #cc3300;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#marlei {
|
||||
margin-left: 17px;
|
||||
padding-top: 15px;
|
||||
width: 480px;
|
||||
height: 55px;
|
||||
text-decoration: none;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
#marlei a {
|
||||
text-decoration: none;
|
||||
color: #000000;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#marlei a:hover {
|
||||
text-decoration: none;
|
||||
color: #cc3300;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#mentions_legales {
|
||||
width: 450px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* page partenaires */
|
||||
|
||||
#lP {
|
||||
float: left;
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
#haut {
|
||||
float: left;
|
||||
width: 480px;
|
||||
height: 220px;
|
||||
}
|
||||
|
||||
#bas {
|
||||
float: left;
|
||||
width: 480px;
|
||||
height: 220px;
|
||||
}
|
||||
|
||||
.partner {
|
||||
float: left;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
margin: 10px;
|
||||
border: 1px solid #000000;
|
||||
}
|
||||
|
||||
.partner1 {
|
||||
float: left;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
margin: 10px;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/**
|
||||
* visible invisible 3
|
||||
*/
|
||||
.video.visible-invisible-3 {
|
||||
position: relative;
|
||||
width: 480px; /* Match poster width */
|
||||
height: 342.85px;
|
||||
background: black;
|
||||
}
|
||||
.video.visible-invisible-3 video {
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
object-fit: contain; /* Ensures black bars around the video */
|
||||
}
|
||||
.images.visible-invisible-3 {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/**
|
||||
* SCROLL BAR
|
||||
*/
|
||||
|
||||
/* Chrome, Safari, Edge Scrollbar */
|
||||
#Container::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
}
|
||||
#Container::-webkit-scrollbar-track {
|
||||
background: #eee;
|
||||
}
|
||||
#Container::-webkit-scrollbar-thumb {
|
||||
background: #cc3300;
|
||||
}
|
||||
/* Firefox-specific Scrollbar */
|
||||
@-moz-document url-prefix() {
|
||||
#Container {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #cc3300 #eee;
|
||||
scrollbar-gutter: stable;
|
||||
}
|
||||
}
|
||||
|
||||
/* Style scrollbar buttons (arrows) */
|
||||
/* ::-webkit-scrollbar-button {
|
||||
background: #555;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
} */
|
||||
/* Optional: Style the top (up) and bottom (down) buttons differently */
|
||||
/* ::-webkit-scrollbar-button:vertical:start {
|
||||
background: url("up-arrow.png") center no-repeat;
|
||||
}
|
||||
::-webkit-scrollbar-button:vertical:end {
|
||||
background: url("down-arrow.png") center no-repeat;
|
||||
}
|
||||
::-webkit-scrollbar-button:horizontal:start {
|
||||
background: url("left-arrow.png") center no-repeat;
|
||||
}
|
||||
::-webkit-scrollbar-button:horizontal:end {
|
||||
background: url("right-arrow.png") center no-repeat;
|
||||
} */
|
||||
|
||||
.Scrollbar-Up {
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
background-image: url(../images/up.png);
|
||||
font-size: 0px;
|
||||
}
|
||||
.Scrollbar-Down {
|
||||
position: absolute;
|
||||
top: 560px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
font-size: 0px;
|
||||
background-image: url(../images/down.png);
|
||||
}
|
||||
Reference in New Issue
Block a user