/*

useful classes for containers

.box-container-full
.box-container-half
.box-container-third
.box-container-quarter

per default the boxes in the container have the random width given by its content
*/


/* -------------------------------------- Chapter box container ------------ */

div.box-container-outer
{
position:relative;
overflow:hidden;
}


div.box-container
{
margin:0;
padding:0;
width:100%;
display:flex;
flex-direction: row;
overflow-y:hidden;
overflow-x:hidden;

flex-wrap:wrap;
justify-content: flex-start;
align-content: space-between;
align-items: space-between;
}

div.box-container
{
}


div.box-sub
{
overflow:hidden;
position:relative;
z-index:1;
margin:0;
}

div.box-sub img
{
width:100%;
height:auto;
}


div.box-container-full div.box-sub
{
width:100%;
margin:0 0 1.4em 0;
}

div.box-container-third div.box-sub
{
width:30%;
margin:0 0 1em 3.3%;
}

div.box-container-third:not(.box-container-slide) div.box-sub:nth-child(3n+1)
{
margin:0 0 1em 0;
}

div.box-container-half div.box-sub
{
width:49%;
margin:0 0 1em 1%;
}

div.box-container-half:not(.box-container-slide) div.box-sub:nth-child(2n+1)
{
margin:0 0 1em 0;
}

div.box-container-quarter div.box-sub
{
width:23%;
margin:0 0 1em 1.5%;
}

div.box-container-quarter:not(.box-container-slide) div.box-sub:nth-child(4n+1)
{
margin:0 0 1em 0;
}


div.box-container img.img-block-top
{
  width:100%;
  border:0.2em solid rgba(102,194,208,1);
  border-radius:0.05em;
}


div.box-container-third div.box-sub:first-child
{
margin-left:0%;
}