/* welcome to the blob CSS theme override, a simple "custom_css" file. PLEASE BE CAREFUL! Anything not included in the comments will immediately affect your blob appearance! */ 
/* TIPS */
/* if a rule you add to the code does not show up, even after a deep browser cache refresh, consider adding the selector "!important;" at the end of the line to override */
/* clear the cache of your web browser: in Windows press CTRL+SHIFT+R on Firefox; CTRL+F5 on Chrome */
/* logout from admin and login again to check if your override is effective */
/* before changing here, we strongly advice to tinker with the inspector in the browser https://firefox-source-docs.mozilla.org/devtools-user/page_inspector/how_to/examine_and_edit_css/index.html */


/* basic theme color: primary/secondary color. */

## default theme colors
  .v-theme--light {
    --v-theme-primary: 63,81,181;
    --v-theme-secondary: 255,183,77;
  }

/*change the number of cards per line. 300px is default > 3 cards for maxwidth */

.theme-Grid .postContainer { grid-template-columns: repeat(auto-fit,minmax(270px,1fr)) !important; }

/* make the logo bigger by changing the height of the toolbar */
 /* .v-toolbar-title img {
height: 100px;
}*/

/* listing the custom classes
    #blob_appbar
    #blob_logo
    #blob_main
    #blob_tagline
    #blob_blobs
*/

/* examples customisation of the #blob_appbar class */

/* remove blobs and share from menu */
/*#blob_appbar .Blobs,
#blob_appbar .Share {
  display: none !important;
}*/

/* hide the language button */

/*#blob_appbar button.Translate {
	display: none;
} */

/* hide the About button - example on one line */

/*#blob_appbar .About .label { display: none; }*/

/* style blob tagline */
/*#blob_tagline
{
  margin-bottom:25px; !important;
  font-weight: bold;
  width:70%;
}*/

/* examples customisation of the #blob_buttons class */
/*#blob_blobs
{
  margin-bottom:40px; !important;
}*/

/*#blobs_blob .description
{
  margin-top:40px; !important;
}*/

/*#v-field__field
{
width: 70%;
margin-bottom:40px; !important;
}*/

/* style single blob buttons */
/* LtR > nth-child(1) nth-child(2) etc.*/

/* a.v-btn--variant-outlined:nth-child(1) {
color: aqua;
}*/

/*a.v-btn--variant-outlined:not(:first-child) {
  content: "/";
  display: inline;
}*/

/* style buttons font black, no border, yellow background - STRANGELY WORKING only with two different rules!!!*/

/*a.v-btn--variant-outlined {
	color: black;
	background: yellow;
	font-size: large;
	font-weight: bold;
	border: none;
	border-radius: 0px;
}*/

/*a.v-btn--variant-outlined {
  color: black; !important;
  border: none; !important;
  background-color: yellow; !important;
  font-size: large;
  font-weight: bold;
  border-radius: 0px;
}*/

/* background button light blue OK */

/*a.v-btn--variant-outlined:hover {
background: #00ffff;
}*/

/*.blobs a.v-btn--active {
    background-color: #00ffff;
}*/

/* add a "/" between buttons in menu NOT WORKING*/

/*a.v-btn--variant-outlined:nth-child(odd):not(:empty) + a.v-btn--variant-outlined:nth-child(even):not(:empty)::before {
  content: '/';
margin: -50px;
  display: inline;
}*/

/*add a border radius to images, add transition*/
/*.media img, .media picture {
##	aspect-ratio: 1.7778;
##	border: 1px solid #eee;
##	height: 100%;
##	-o-object-fit: cover;
##	object-fit: cover;
##	width: 100%;
	border-radius: 3%;
    transition: transform 1s ease-in-out;
}*/

/*add a transform scale image:hover*/

/*.media img, .media picture:hover {
transform: scale(1.2);
}*/

/*a.v-btn--variant-outlined:nth-child(odd):not(:empty) + a.v-btn--variant-outlined:nth-child(even):not(:empty)::before {
  content: '/';
  margin: -25px;
  display: inline;
}*/

/* workaround for border thickness and style */
/* reference: https://developer.mozilla.org/en-US/docs/Web/CSS/border-style */

.post.card {
  border-width: 4px !important;
  border-style: dotted !important;
}

/* adding a box-shadow to .post.card */
/* https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow */
/* :hover pseudo-class with "unset" do revert to normal */
/* opacity is for every .post.card */

.post.card {
    box-shadow: 5px 5px 5px aquamarine;
    background-color: bisque;
}

.post.card:hover {
    box-shadow: unset;
    background-color: unset;
    opacity: 0.6;
}