/*
 Theme Name:   Twenty Twenty Child Theme
 description: >-
   A child theme of the Twenty Twenty default WordPress theme
 Author:       Jon Babb
 Template:     twentytwenty
 Version:      1.0.0
*/


/* Title underline animation */


.title-underline, .title-underline-2{ 
  text-decoration: none;
  background-image: linear-gradient(#7fb951, #7fb951);
  background-position: 0% 100%;
  background-repeat: no-repeat;
}

.title-underline {
 background-size: 0% 8px;
}


.title-underline-2 {
 background-size: 0% 4px;
}


@-webkit-keyframes underline{
			0%{background-size:0% 8px;}
			100%{background-size:100% 8px;}
		}
		
		.title-underline  {
			-webkit-animation:underline 2s normal forwards ease-in-out;
			animation-play-state: paused;
		}


@-webkit-keyframes underline-2{
			0%{background-size:0% 4px;}
			100%{background-size:100% 4px;}
		}
		
		.title-underline-2  {
			-webkit-animation:underline-2 2s normal forwards ease-in-out;
			animation-play-state: paused;
		}
	

h3 {font-size:16px;}

/* csn Post Grid */
#csn-pg-row{width:100%; opacity: 1; transition: opacity 0.5s;}
.csn-pg-col{width: calc(50% - 12px); height: 350px; display: inline-grid; margin: 7px 5px;}
.csn-pg-id-all {background-position: center; width: 100%; height: 100%;}
.csn-pg-overlay {width: 100%; height: 100%; position:relative;
	background-color:rgba(62,73,73,.5);
	transition: background-color .25s ease-in-out;
	-moz-transition: background-color .25s ease-in-out;
	-webkit-transition: background-color .25s ease-in-out;}

.csn-pg-overlay:hover {
	background-color:rgba(62,73,73,.75);
	transition: background-color .25s ease-in-out;
	-moz-transition: background-color .25s ease-in-out;
	-webkit-transition: background-color .25s ease-in-out;}

.csn-pg-content{position: absolute; top: 50%; text-align: center; width: 100%; color:#ffffff;}



.csn-pg-nav{}

.csn-pg-but-number {}
.csn-pg-but-active {}

#csn-pg-button-previous{transition: opacity 0.5s; opacity:0;}
#csn-pg-button-next{transition: opacity 0.5s;opacity:1;}

.csn-pg-hidden {visibility:hidden;}
.csn-pg-visible {visibility:visible;}


/* Highlight Testing */
.text--animated-lead-active {
    background-position: top left 0!important;
    color: #fff;
}

.text--animated-lead {
    background: -webkit-gradient(linear,left top,right top,color-stop(50%,#ffd200),color-stop(50%,rgba(255,210,0,0)));
    background: -webkit-linear-gradient(left,#ffd200 50%,rgba(255,210,0,0) 0);
    background: -o-linear-gradient(left,#ffd200 50%,rgba(255,210,0,0) 50%);
    background: linear-gradient(90deg,#ffd200 50%,rgba(255,210,0,0) 0);
    background-size: 200%;
    background-position: top left 100%;
    display: inline;
    -webkit-transition: 1s ease-in-out;
    -o-transition: 1s ease-in-out;
    transition: 1s ease-in-out;
}



/* ----------------- CSN Network ----------------- */
.csn-news .csn-news-box:first-child {margin-bottom: 40px;}
.csn-vol-container {display: flex; align-items: flex-start;}
.csn-vol-photo {margin-right: 30px; width:380px;}
.csn-vol-details {margin-top:10px;}
.csn-vol-details a {text-decoration:none!important;}
#csn-vol-row .csn-vol-spec p:first-child {margin-top:20px!important;}
.csn-vol-spec p {background-color: #f7f7f7; padding: 10px 20px; width: fit-content; transition: all 200ms cubic-bezier(0.780, 0.140, 0.20, 0.86); margin-right:10px;}
.csn-vol-spec p:hover {background-color:#7fb951; color:#ffffff;}
.csn-vol-spec {display: flex; flex-wrap: wrap; flex-direction: row; align-items: flex-start;}


.csn-news-box {display: flex; align-items: center;}
.csn-l {width: 25%; margin-right: 5%;}
.csn-r {width: 70%;}

.csn-news-date {font-size:18px; line-height:20px;margin-bottom:5px; font-weight:700;}
.csn-news-text {}


@media (max-width:1199px) {
    .csn-vol-container {display:block; text-align:center;}
    .csn-vol-photo {margin-right:0px; width:unset;}
    .csn-vol-spec p {margin:auto;}

}

@media (max-width:767px) {
    .csn-l {width:50%;margin-bottom:20px;}
    .csn-r {width:100%;}
    .csn-news-box {align-items: flex-start; flex-direction: column;}
}