/*
 __            __  __                        __  __                        __
|  |          |  ||  |                      |  ||  |                      |  |
 |  |        |  |  |  |        ____        |  |  |  |        ____        |  |
  |  |      |  |    |  |      |    |      |  |    |  |      |    |      |  |
   |  |    |  |      |  |    |  ||  |    |  |      |  |    |  ||  |    |  |
    |  |  |  |        |  |  |  |  |  |  |  |        |  |  |  |  |  |  |  |
     |  ||  |          |  ||  |    |  ||  |          |  ||  |    |  ||  |
      |____|            |____|      |____|            |____|      |____|
	  
Copyright (C) 2019 Vanparijs Wim Websites www.vanparijswimwebsites.com
*/

/****************
 *              *
 * Page Content *
 *              *
 ****************/

section {
    display: grid;
    grid-gap: 3.33%;
    grid-template-columns: 
        [col1-start] 30%
        [col2-start] 30%
        [col3-start] 30%
        [col3-end];
    grid-template-rows: 
        [row1-start] auto
        [row2-start] auto
        [row3-start] auto
        [row3-end];
}

section .reaction {
    background-color: #fff;
    color: #000;
    padding: 0.5em;
}

section .reaction .container {
    display: grid;
    height: 100%;
}

section .reaction .container p {
    margin: auto;
}



/**********
 *        *
 * Images *
 *        *
 **********/

.fancybox {
    display: block;
    text-align: center;
    height: 12em;
    padding: 5px;
}

.fancybox img {
    opacity: 0.9;
    transition: opacity 500ms;
    max-height: 100%;
    width: auto;
}

.fancybox img:hover {
    opacity: 1;
}