archinsa/css/index.css
2024-07-22 15:37:47 +02:00

198 lines
No EOL
3.4 KiB
CSS

@media (hover: none){
/* For mobile phones: */
.floating-action-btn{
width: auto;
text-align: left;
border-radius: 5px;
border-width: 2px;
font-weight:bolder;
text-decoration: none;
color: black;
background-color: rgba(224, 54, 54, 0.482);
border-bottom: 3px solid rgba(224, 54, 54, 0.482);
margin-top: 50vh;
}
.card{
width: 85vw;
}
}
@media only screen and (min-width: 1000px) {
/* For desktop: */
.floating-action-btn{
position: fixed;
bottom: 5%;
margin-left:1%;
padding: 10px;
padding-top: 0px;
width: fit-content;
text-align: left;
border-radius: 5px;
border-width: 2px;
font-weight:bolder;
text-decoration: none;
color: black;
border-bottom: 3px solid rgba(224, 54, 54, 0.482);
}
.card {
width: 70vw;
}
}
.gros-titre{
font-size: larger;
font-weight: bolder;
}
.centre-vertical{
margin-top: auto;
margin-bottom: auto;
}
.centre-horizontal{
margin: auto;
justify-content: center;
display: flex;
}
.centre-txt{
text-align: center;
}
.etaler{
width: 100%;
}
.bulle-rouge{
width: fit-content;
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;
background-color: rgba(255, 0, 0, 0.283);
border-radius: 5px;
border-width: 2px;
border-color: rgba(255, 0, 0, 0.283);
}
.button{
margin-top: 10px;
width: fit-content;
padding-top: 1%;
padding-left: 1%;
padding-right: 1%;
padding-bottom: 1%;
border-radius: 5px;
font-weight:bolder;
text-decoration: none;
color: black;
border-bottom: 3px solid rgba(224, 54, 54, 0.482);
border-top: 0px;
border-left: 0px;
border-right: 0px;
}
.color-red-tr{
background-color: rgba(224, 54, 54, 0.482);
border-color: rgba(224, 54, 54, 0.482);
}
.barre-recherche{
margin-top: 10px;
width: 80vw;
max-width: 800px;
border-radius: 15px;
border-width: 5px;
border-bottom: 3px solid rgba(224, 54, 54, 0.482);
background-color: rgba(224, 54, 54, 0.482);
padding: 20px;
}
#recherche_input{
width: 80vw;
max-width: 800px;
}
.champ{
border-radius: 3px;
border: 0px;
background-color: transparent;
font-size: larger;
width: fit-content;
}
.champ:focus{
outline: none;
}
.card {
background-color: #f6f3f3;
border-radius: 8px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
margin-bottom: 20px;
padding: 20px;
}
.card img {
width: 100%;
height: auto;
margin-bottom: 10px;
border-radius: 7px;
}
.card embed{
width: 100%;
height: 50vw;
margin-bottom: 10px;
}
.card iframe {
width: 100%;
height: 50vw; /* Ajuster la hauteur selon vos besoins */
}
.card video {
width: 100%;
height: auto;
}
.card div {
margin-bottom: 10px;
line-height: 1.5;
}
.card ul {
padding-left: 20px;
margin-bottom: 10px;
}
/* Styles pour les liens */
.lien {
color: #007bff;
text-decoration: none;
padding: 10px;
background-color: rgba(224, 54, 54, 0.482);
border-bottom: 2px solid rgba(224, 54, 54, 0.482);
border-radius: 5px;
margin-bottom: 30px;
margin-left: 2vw;
margin-top: 2vh;
}
.lien:hover {
text-decoration: underline;
}
/* Styles pour les informations secondaires */
.secondary-text {
font-size: 14px;
color: #777;
}