/* -----------------------------------------------------------------------------

    This file should be used to add your own CSS definitions or override
	the existing ones.

----------------------------------------------------------------------------- */

	/* FONT */
	/* body { font-family: 'insert-font-family-name-here', 'Arial', sans-serif; } */

	/* STANDARD LOGO DIMENSIONS */
    .header-branding img { width: 140px; }

	/* LARGE LOGO DIMENSIONS */
	.header-branding.m-large-logo img { width: 200px; }
	/* Scroll down to "MEDIUM DEVICES" to change width of large logo on mobile devices */

	/* your CSS here */
    .c-gallery .gallery-images.m-3-columns>li {
        width: 29.3333%;
        margin-left: 2%;
        margin-right: 2%
    }
    
    .list-files {
        margin-top: 20px;
        padding: 0;
        padding: 7px 0 0px 0;
        font-size: 0.875em;
        border-top: 1px solid transparent;
        border-color: #f0f0f0;
    }
  
    .list-files ul {
        list-style-type: none;
    }
    
    .list-files li {
        line-height: 0.8em
    }
    
    .list-files li:before {
        content: "\f15b"; /* FontAwesome Unicode */
        font-family: FontAwesome;
        display: inline-block;
        width: 1.3em; /* same as padding-left set on li */
    }
    
   
    .videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
    

/* -----------------------------------------------------------------------------

    RESPONSIVE DEFINITIONS

----------------------------------------------------------------------------- */

    /* -------------------------------------------------------------------------
        LARGE DEVICES
		devices with width between 992px and 1199px
    ------------------------------------------------------------------------- */

    @media ( max-width: 1199px ) {

		/* your CSS here */  

	}

    /* -------------------------------------------------------------------------
        MEDIUM DEVICES
		devices with width between 768px and 991px
    ------------------------------------------------------------------------- */

    @media ( max-width: 991px ) {

		/* LARGE LOGO DIMENSIONS */
		.header-branding.m-large-logo img { width: 140px; }

		/* your CSS here */ 

	}

	/* -------------------------------------------------------------------------
        SMALL DEVICES
		devices with width between 481px and 767px
    ------------------------------------------------------------------------- */

    @media ( max-width: 767px ) {

		/* your CSS here */   

	}

	/* -------------------------------------------------------------------------
        EXTRA SMALL DEVICES
		devices with width up to 480px
    ------------------------------------------------------------------------- */

	@media ( max-width: 480px ) {

		/* your CSS here */ 

	} 


li:focus {
	background: red;
}


.white-popup {
  position: relative;
  background: #FFF;
  padding: 40px;
  width: auto;
  max-width: 1000px;
  margin: 20px auto;
  transition: 1s all;
}

.mfp-bg {}

.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.15s ease-out;
  -moz-transition: all 0.15s ease-out;
  transition: all 0.15s ease-out;
}


/* overlay animate in */

.mfp-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}


/* overlay animate out */

.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  transition: all 0.4s ease-out;
}

.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}

.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}