.background-cc1 { background-color:#016940;}
.background-white {background-color:#fff;}
.absolute { position:absolute;}
.relative { position:relative;}
.bottom-0 { bottom:0;}
.background-black-half { background:rgba(0,0,0,.5);}
.flex {display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;flex-wrap: wrap;}
.m-auto { margin-left:auto;margin-right:auto;}
.mx-auto { margin-left:auto!important;margin-right:auto!important;}
.mt-8 { margin-top:2rem;}
.my-8 { margin-bottom:2rem;margin-top:2rem;}
.max-w-400 { max-width:100rem;}
.p-2 { padding:.5rem;}
.p-4 { padding:1rem;}
.text-center { text-align:center;}
.text-white { color:#fff;}
.tile.size3 h2, .tile.size4 h2 { font-size:29px;text-transform:uppercase;}
.w-full { width:100%;}
.h-auto { height:auto;}
.block { display:block;}
.flex { display:flex;}
.tile-title { font-size:20px;color:#fff;text-align:center;text-transform:uppercase;}
.items-end { align-items:flex-end;}
.page-width { width:100%;max-width:1500px;} 
.gap-x-1 {-moz-column-gap: .25rem; column-gap: .25rem;}
.gap-x-2 {-moz-column-gap: .5rem; column-gap: .5rem;}
.gap-x-4 {-moz-column-gap: 1rem; column-gap: 1rem;}
.gap-x-5 {-moz-column-gap: 1.25rem;column-gap: 1.25rem;}
.gap-x-8 {-moz-column-gap: 2rem;column-gap: 2rem;}
.gap-x-10 { -moz-column-gap: 2.5rem; column-gap: 2.5rem;}
.gap-x-16 {-moz-column-gap: 4rem;column-gap: 4rem;}
.gap-x-20 { -moz-column-gap: 5rem; column-gap: 5rem;}
.gap-x-24 { -moz-column-gap: 6rem; column-gap: 6rem;}
.gap-y-1 {row-gap: .25rem;}
.gap-y-2 {row-gap: .5rem;}
.gap-y-4 {row-gap: 1rem;}
.gap-y-6 {row-gap: 1.5rem;}
.gap-y-8 { row-gap: 2rem; }
.gap-y-10 { row-gap: 2.5rem;}
.gap-y-16 { row-gap: 4rem;}
.gap-y-20 { row-gap: 5rem;}
.gap-y-28 {row-gap: 7rem;}

.grid {display:grid;}
.grid-cols-1 { grid-template-columns: repeat(1,minmax(0,1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr));}
.grid-cols-3 { grid-template-columns: repeat(3,minmax(0,1fr));}
.grid-cols-4 { grid-template-columns: repeat(4,minmax(0,1fr));}
.grid-cols-5 {grid-template-columns: repeat(5,minmax(0,1fr));}
.grid-cols-6 {grid-template-columns: repeat(6,minmax(0,1fr));}
.grid-cols-7 {grid-template-columns: repeat(7,minmax(0,1fr));}

.inline-grid {display:inline-grid;}

@media only screen and (min-width: 768px) {
.md\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr));}

    .md\:col-span-1 { grid-column: span 1/span 1; }
    .md\:col-span-2 { grid-column: span 2/span 2; }
    .md\:col-span-3 { grid-column: span 3/span 3; }
    .md\:col-span-4 { grid-column: span 4/span 4; }
    .md\:col-span-5 { grid-column: span 5/span 5; }
    .md\:col-span-7 { grid-column: span 7/span 7; }
    .md\:gap-x-4 {-moz-column-gap: 1rem;column-gap: 1rem;}
    .md\:gap-x-5 {-moz-column-gap: 1.25rem;column-gap: 1.25rem;}
    .md\:gap-x-8 { -moz-column-gap: 2rem; column-gap: 2rem; }
    .md\:gap-x-10 { -moz-column-gap: 2.5rem; column-gap: 2.5rem; }
    .md\:gap-x-16 {-moz-column-gap: 4rem;column-gap: 4rem;}

    .md\:gap-y-0 {row-gap: 0;}
    .md\:gap-y-6 {row-gap: 1.5rem;}
    .md\:gap-y-16 {row-gap: 4rem;}
    .md\:gap-y-28 {row-gap: 7rem;}
	
}
@media (min-width: 1280px) {

    .lg\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)); } 
    .lg\:grid-cols-3 {grid-template-columns: repeat(3,minmax(0,1fr));}
    .lg\:grid-cols-4 {grid-template-columns: repeat(4,minmax(0,1fr));}
    .lg\:grid-cols-5 { grid-template-columns: repeat(5,minmax(0,1fr)); }
}


@media (min-width: 1024px) {

    .xl\:grid-cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)); } 
    .xl\:grid-cols-3 {grid-template-columns: repeat(3,minmax(0,1fr));}
    .xl\:grid-cols-4 {grid-template-columns: repeat(4,minmax(0,1fr));}
    .xl\:grid-cols-5 { grid-template-columns: repeat(5,minmax(0,1fr)); }
}