/* ///////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////// */

.image_box
{
box-sizing:border-box;

margin-top: var(--margin_top_value);
background: #549eeb;

width: 100%;

display: flex;
flex-direction: column;
align-items: center;

border: var(--border_style);
border-radius: var(--outer_radius);

font-family: sans-serif;
font-weight: bold;
text-align: center;
font-size: 16px;
color: white;

transition: all 2s;

position: relative;
}

.image_box::before
{
display: flex;

content: '';

width: 100%;
height: 100%;

top: 0;

box-shadow: var(--image_box_shadow_style);

background: transparent;

position: absolute;

border-radius: var(--inner_radius);

}


.image_title
{
padding: 10px;
box-sizing:border-box;
width: 100%;
display: flex;
flex-direction: column;

text-align: center;
font-size: 16px;
color: white;

}

.image_file
{
box-sizing:border-box;

margin: 0;
padding: 0;

width: 100%;
max-width: 100%;
height: auto;

background-color: black; /* Used if the image is unavailable */
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Do not repeat the image */
background-size:cover;

border-radius: var(--inner_radius);

transition: all 2s;

}

/* ///////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////// */
/* ///////////////////////////////////////////////////////////////////////////////// */