.pglist4col .pglist { position: relative; padding: 0; text-align: center; }
.pglist4col .pglist:before,
.pglist4col .pglist:after {
	position: absolute; top: 0; left: 0; width: 100%; height: 100%; content:''; 
 z-index: 0; transition: 0.25s ease-in-out all; }
.pglist4col .pglist:after { z-index: -1; }

.pglist4col .pglist a { display: block; transition: 0.25s ease-in-out all; }

#pagewrap .pglist4col h2.ccm-page-list-title { font-size: 32px; }

.pglist4col .pglist { 
/* new styles */
position: relative;
overflow: hidden; }



@media screen and (min-width: 250px)
{
.pglist4col .pglist { width: 100%; padding: 45px 0; }
.pglist4col .pglist:before { background: rgba(64,64,65,0.7); }
.pglist4col .pglist:hover:before { background: rgba(64,64,65,0.2); }

.pglist4col .pglistbgd { 
background-size: cover; position: absolute; background-position: center; 
background-repeat: no-repeat; top: 0; left: 0;
width:100%; height:100%; z-index: -1 }
}
@media screen and (min-width: 650px)
{
.pglist4col .pglist { width: 50%; display: inline-block; vertical-align: top; }
}
@media screen and (min-width: 1000px)
{ 
.pglist4col .pglist:after { 
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#404041+0,404041+100&1+10,0+100 */
background: -moz-linear-gradient(top,  rgba(64,64,65,1) 0%, rgba(64,64,65,1) 10%, rgba(64,64,65,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(64,64,65,1) 0%,rgba(64,64,65,1) 10%,rgba(64,64,65,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(64,64,65,1) 0%,rgba(64,64,65,1) 10%,rgba(64,64,65,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#404041', endColorstr='#00404041',GradientType=0 ); /* IE6-9 */
}
.pglist4col .pglist:before { background: rgba(64,64,65,0.7); }
.pglist4col .pglist:hover:before { background: rgba(64,64,65,0.2); }

.pglist4col .pglist { width: 24%; padding: 75px 0 0 0;
transform: skewX(-25deg); 
-ms-transform: skewX(-25deg); /* IE 9 */
-webkit-transform: skewX(-25deg); /* Safari and Chrome */}
#slideshow, .nopaper, #featnav, .pglist4col, .pglist4col .pglist { height: 100%; }
.pglist4col table {
transform: skewX(25deg); 
-ms-transform: skewX(25deg); /* IE 9 */
-webkit-transform: skewX(25deg); /* Safari and Chrome */
}

.pglist4col .pglistbgd { 
transform: skewX(25deg); 
-ms-transform: skewX(25deg); /* IE 9 */
-webkit-transform: skewX(25deg); /* Safari and Chrome */


background-size: cover;
background-repeat: no-repeat; 
background-position: top center; 

/* new styles */
position: absolute; right: 0; left: inherit;
-webkit-transform-origin: top right;
-ms-transform-origin: top right;
transform-origin: top right;
width: 1000px; /* something ridiculously big */
height: 1000px;
}


.pglist4col:hover .pglist { width: 24%; }
.pglist4col .pglist:hover { width: 27%; }
}