
/* Vignettes
================================================== */

/* Mobile first queries */

/* Larger than mobile 
@media (min-width: 400px) {}

/* Larger than phablet 
@media (min-width: 550px) {}

/* Larger than tablet 
@media (min-width: 750px) {}

/* Larger than desktop 
@media (min-width: 1000px) {}

/* Larger than Desktop HD 
@media (min-width: 1200px) {}
*/

div.fill-screen {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
}

img.make-it-fit {
    max-height: 90vh;
    height: auto;
	display: block;
    margin-left: auto;
    margin-right: auto }	
}


/****************************************************************/
/* Vignettb - Settings for displaying pictures of activities    */
/****************************************************************/

.vignettb{
position: relative;
z-index: 99900;
}


.vignettb:hover {
position: relative;
z-index: 999000000;
}

.vignettb span{ /*CSS for enlarged image*/
position: absolute;
background-color: #ffffff;
padding: 5px;
left: 1px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.vignettb span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

/****************************************************************/
/* Vignettc - Settings for displaying pictures of posters       */
/****************************************************************/

.vignettc{
position: relative;
z-index: 0;
}


.vignettc:hover {
z-index: 9000;
}

.vignettc span{ /*CSS for enlarged image*/
position: absolute;
background-color: #ffffff;
padding: 5px;
left: 1px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
/*display: block
margin-left: auto
margin-right: auto*/
}

.vignettc span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;

}

/********************************************************************/
/*CSS for enlarged image on hover - Occupies the whole screen
HAS BEEN MOVED TO MEDIAQUERIES
*/
/********************************************************************/


.vig260  {
	width:260px;
	border: thin #000 solid;
}

.vig460  {
	width:460px;
	border: thin #000 solid;
}


.vig60p  {
	width:100%;
	border: thin #000 solid;
}


.vig180  {
	width:180px;
	border: thin #000 solid;
}

.vig200  {
	width:200px;
	border: thin #000 solid;
}

.vig220  {
	width:220px;
	border: thin #000 solid;
}

.zig800  {
	height:800px;
/*	width:220px;*/
	border: thin #000 solid;
}

