@charset "utf-8";
/* CSS Document */

/* ======================================================= 
 GRID CSS
 *    
 * ======================================================= */

* {
  box-sizing: border-box;
}
.full-width{
  width: 100%;
  padding:0px;
}
.media-box-title{
	
	display: none;
}
.media-box-date{
	
	display: none;
}
.media-boxes-filter>li a, .media-boxes-filter>li a:hover{
	border:none;
}
#navbar{
	z-index:100;
}
.navbar-default{
	min-height: 60px;
}
.auto-grid-filters-container{
  width: 100%;
	top:58px;
	position: sticky;
	z-index: 99;
	background-color: #222222;
	text-align: center;
  left:0px;
  right:0px;
}

blockquote {
  font: 1.1em/2 'Playfair Display', serif;
  font-style: italic;
  margin: 0 0 2em 0;
}

.cta p{
	padding-top: 20px;
	margin-bottom: 5px;
}



.img3 {  
  /* https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP */
    grid-column: 1/ 2;
    grid-row: 3 / 4;
	   height: auto;
	  width: 100%;
	padding: 2%;
}

.img5 {  
  /* https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP */
 grid-column: 1 / 2;
    grid-row: 5 / 6;
	   height: auto;
	  width: 100%;
	padding: 2%;
}


.cta h1 {    
  font: bold 4em/1 'Playfair Display', serif;
  margin: 0 0 20px 0;
  position: relative;
}


/* grid */

.grid1 {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  padding: 20px;
}
.grid1 hr{
	border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-top-color: rgb(128, 128, 128);
    border-right-color: rgb(128, 128, 128);
    border-bottom-color: rgb(128, 128, 128);
    border-left-color: rgb(128, 128, 128);
    background-color: rgb(128, 128, 128);
}
.wid25{
		width:25%;
	}
.wid15{
		width:15%;
	}
	.wid40{
		width:40%;
	}

  @media only screen and (min-width: 400px) {
    .full-width{
      padding:13px;
    }
    }

@media only screen and (min-width: 830px) {
	.img-d-non{
		display:none;
	}
	
  .grid1 {
    grid-template-columns: 1fr 2em 1fr;
    grid-template-rows: auto;
    padding: 0;
  }

 

	.img3 {  
    grid-column: 3 / 4;
    grid-row: 2 / 3;
		padding: 2%;
		height: auto;
	  width: 100%;
		align-self: center;
			
  }
	
  .img5 {  
    grid-column: 1/ 2;
    grid-row: 3 / 4;
	 height: auto;
	  width: 100%;

  }
	
	.cta-wrapper {
    grid-column: 1 / 4;
    grid-row: 1 / 2;
		text-align: center;
		padding: 20px 20% 20px 20%;
  }
.cta-wrapper1 {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
	
	  padding: 5% 10%;
  }
  
.cta-wrapper2 {
    grid-column: 3 / 4;
    grid-row: 3 / 5;
	
	padding: 5% 10%;
  }
	.cta-wrapper3 {
    grid-column: 1 / 2;
    grid-row: 4 / 6;
		
		padding: 5% 10%;
  }
	.cta-wrapper4 {
    grid-column: 3 / 4;
    grid-row: 5 / 6;
		
		padding: 5% 10%;
  }
	.cta-wrapper5 {
    grid-column: 1 / 4;
    grid-row: 6 / 7;
		text-align: center;
		padding: 70px 0 50px 0;
  }
    .cta {
    
		 
    }
  
  .cta h1 {    
    font-size: 6em;
  }
  
  .button {
    width: auto;
  }

}
@media only screen and (min-width: 1200px) {
	.img-d-non{
		display:none;
	}
	
  .grid1 {
    grid-template-columns: 2fr 3fr 2em 3fr 2fr;
    grid-auto-rows: auto;
    padding-top: 100px;
	
  }
 

	.img3 {  
    grid-column: 4 / 5;
    grid-row: 3 / 4;
		height: auto;
	  }
	
  .img5 {  
    grid-column: 2 / 3;
    grid-row: 4 / 5;
	height: auto;
	  width: 100%;
  }
	
	.cta-wrapper {
    grid-column: 2 / 5;
    grid-row: 1 / 3;
		text-align: center;
		padding: 0 0 50px 0;
  }
.cta-wrapper1 {
    grid-column: 2 / 3;
    grid-row: 3 / 4;
	
	  padding: 50px 10% 20px 10%;
  }
  
.cta-wrapper2 {
    grid-column: 4 / 5;
    grid-row: 4 / 6;
	
	padding: 50px 10% 20px 10%;
	height: min-content;
  }
	.cta-wrapper3 {
    grid-column: 2 / 3;
    grid-row: 5 / 7;
		
		padding: 50px 10% 20px 10%;
		height: min-content;
  }
	.cta-wrapper4 {
    grid-column: 4 / 5;
    grid-row: 6 / 7;
		
		padding: 10px 10% 10px 10%;
  }
	.cta-wrapper5 {
    grid-column: 5 / 7;
    grid-row: 9 / 10;
		
		padding: 0px 10% 50px 10%;
  }
}


