/*Customisation CSS du template Joomla5 Cassiopeia */
/* ********* Daniel PASQUIET et Claude PENAUD  ********* */

/* Couleur de fond du bandeau suppression des marges */
.header.container-header.full-width {
  background:#8ed1ea;}
.navbar-brand, div.grid-child {padding:0px!important;}

/* Couleur de fond et placement menu bas et Titre des modules */
#navbar1.collapse.navbar-collapse,.grid-child.container-nav,.card-header,.container-topbar{
  background:linear-gradient(to bottom, #82b9e3 19%,#164f77 100%);
  border-radius:0px;
   border: 2px solid #006699;
  box-shadow: 0 4px 6px #333;
 }
.grid-child.container-nav{ 
  padding:0px;
  margin-bottom:5px; 
}

/* largeur des 2 menus du bandeau */
.container-topbar,nav.navbar.navbar-expand-md{
display:flex;
margin-left:auto;
margin-right:auto;
max-width:1320px;
width:100%;}
 
/* texte des modules */
.card-header{
  font-size:1.4em;
  color:#fff;
  font-weight:normal;
  text-align:center;
}

/*mise en forme des modules et 2e niveau menus déroulants */
.sidebar-right.card,.mm-collapse.mm-show{
  background: linear-gradient(to bottom, #ffffff 66%,#f8d5d5 100%);
  border-color: #fbb9b9!important; 
  border: 1px solid;
  border-radius:1px;}

/* mise en forme container article et sidebar droite */
.grid-child.container-component, .grid-child.container-sidebar-right { 
  border-radius: 0px;
  background-image:url(/media/templates/site/cassiopeia/images/fond-ecran.jpg);   /*ATTENTION : URL absolue à modifier et adapter */
  border: 1px solid #006699;
  box-shadow: 0 4px 6px #333;
  padding:6px;
  margin-top:6px;}

/* Espace sur le pourtour de l'affichage des articles et textes de catégories */
.com-content-article {padding:10px}
div.item-content {padding:5px;}
.com-content-category {padding:5px}
/**************************************************************************************/
/* Responsive-design : amélioration de l'affichage des menus du bandeau sur tablette et smartphone */

@media(min-width:478px){
/*Pour que les menus du bandeau restent horizontaux sur tablette et smartphone*/
.container-header .mod-menu{
  display:flex;
 -webkit-box-orient: horizontal;
 -webkit-box-direction:normal;
  flex: 1 1 0%;
  flex-direction:row;
  flex-wrap:wrap;
 }
/* Pour éviter l'effacement du menu sur tablette et son remplacement par l'icône Hamburger (sur smartphone, l'icône hamburger reste) */
.collapse:not(.show){display:block;}
/* Pour éviter l'affichage de l'icône Hamburger de menu*/
.navbar-toggler.navbar-toggler-right{display:none;}
}

/* Taille et fond des titres de haut de page*/
.page-header h1 {
  font-size: 1.8rem;
  background-color: #fff;
  color: #000;
  padding-left:30px;
}
.page-header h2{font-size:1.8 em;}

/* afficher les détails haut de page en ligne */
.article-info dd {
  display: inline-block;}

/* sur smartphone, suppression des détails - menus du bandeau en ligne, lettres plus petites */
@media(max-width:478px){
  .article-info dd {display:none;}
  .metismenu.mod-menu .metismenu-item{
    font-size:16px;
    display:inline-block;
    padding-top:0px;
    padding-right:30px;}
  }
/*******************************************************/

/* couleur texte sidebar */
.card-body {color:#2a69b8;}

/* Cadrage à droite du texte du bandeau de bas de page  */
.grid-child {
  justify-content: right!important;  
}

/*lecteur javascript Claude
---lecteur position large--*/
 #lecteurclaude{width:487px;}
 #encadre{width:487px;}
    #image1,#image2{height:340px;}
    #image,#image3{width:450px;height:338px;}
#videncadre{width:536px;} 
#image4{height:284px}

/*--lecteur position smartphone--*/
@media (max-width:530px){
/*lecteur accueil*/
   #lecteurclaude{width:300px;}
   #image2{height:200px;}
   #image3{width:265px;height:199px;}
  .btitre{font-size:12px;}
/*lecteur audio concerts*/
  #ListeLecture{width:300px;font-size:12px!important;}
  #encadre{width:300px;}
  #image1{height:200px;}
  #image{width:265px;height:199px;}
  #afftitre:{font-size:10px;}
  /*lecteur video*/
  #videncadre{width:320px}
  #image4{height:160px}
  #lecteurvid{width:280px;height:107px;}
}
/* hauteur des lignes du lecteur javascript */
#ListeLecture{line-height:1.1em;font-size:14px;}

/*affichage myrweb*/
.ordi{display:block;}
.smartable{display:none;}
@media (max-width:900px) or (pointer:coarse){
.ordi{display:none;}
.smartable{display:block;}}