/* STEM FONTS */
@font-face{
  font-family: "League Spartan";
  src: url("/wp-content/themes/inl/fonts/LeagueSpartan-Bold.ttf");
  src: url("/wp-content/themes/inl/fonts/LeagueSpartan-Bold.otf") format('opentype'),
       url("/wp-content/themes/inl/fonts/leaguespartan-bold.woff") format('woff');
}
@font-face{
  font-family: "Open Sans Light";
  src: url("/wp-content/themes/inl/fonts/open sans light.ttf");
}

.k-12-fonts h1, .k-12-fonts h2, .k-12-fonts h3, .k-12-fonts h4, .k-12-fonts h5, .k-12-fonts a{
  font-family: 'League Spartan';
}

.k-12-fonts p, .k-12-fonts span{
  font-family: 'Open Sans Light';
}

/* one-off style items by Dustin */
.volunteer-content .tabs-item-0 .tabs-title{
  /* hides the title on the first tab title on the volunteers section */
  display: none;
}

/* STEM CARDS */
.stem-card{
	width: 24%;
	background: white;
	padding: 20px;
	margin: .5%;
	min-height: 250px;
	text-align: center;
	position: relative;
	float: left;
}

.stem-card i{
	padding: 25px;
}

.stem-card .card-title{
	text-align: center;
	color: #005a96;
}

.stem-card .card-link-container{
	width:100%;
	position: absolute;
	bottom: 0;
	left: 0;
}

.stem-card .btn-blue{
	width: 150px;
	margin-bottom: 20px;
  background: #81cb23;
  border: 0;
  color: white;
}

.stem-card .btn-blue:hover{
  background: rgba(6, 31, 33, 0.9) !important;
}

/* STEM JUMP CARDS */
.stem-jump{
	width: 24%;
	background: white;
	padding: 20px;
	margin: .5%;
	text-align: center;
	position: relative;
	float: left;
	min-height: 250px;
}

.stem-jump .btn-blue{
	width: 150px;
	margin-bottom: 20px;
  background: #81cb23;
  border: 0;
  color: white;
}

.stem-jump .btn-blue:hover{
  background: rgba(6, 31, 33, 0.9) !important;
}

.stem-stat{
	width: 25%;
	background: white;
	padding: 20px;
	text-align: center;
	position: relative;
	float: left;
	min-height: 250px;
}

.stem-stat{
	padding: 20px 0px;
}

.stem-jump i, .stem-stat i{
	padding: 25px;
}

.stem-jump .jump-title{
	text-align: center;
	color: #005a96;
}

.stat-value, .stat-title{
	margin-bottom: 0;
	color: #ff6565;
	text-align: center;
	text-transform: uppercase;
}

.stat-title{
	font-weight: 600;
}

.stat-value{
	line-height: 45px !important;
}

.stem-jump .jump-link-container{
	width:100%;
	position: absolute;
	bottom: 0;
	left: 0;
}

.stem-jump .btn-blue{
	width: 150px;
	margin-bottom: 20px;
}

/* STEM CONTENT SECTIONS */
.support-content, .volunteer-content{
	background: #ffffff;
}

.stem-tabs p > img{
  width: 100%;
}

.support-content .stem-accordions,
.career-content .stem-accordions,
.volunteer-content .stem-accordions{
  display: none;
}

.stem-content{
	padding: 50px 0;
}

.stem-content .stem-title{
	text-align: center;
}

/* STEM TAB SECTIONS */
.stem-tabs{
	width:60%;
	margin: 50px auto;
  display: flex;
}

.tabs-switchers{
	width: 30%;
	display: table-cell;
	float: left;
}

.tabs-switch{
	padding: 1.5em;
	background: #777777;
  opacity: 0.7;
	margin: 20px 0px 20px 0px;
}

.tabs-switch .btn-blue{
  /* max-width: 160px; */
  padding: 5px 10px;
  margin-top: 10px;
}

.tabs-switch:hover{
	background: #005a96;
}

.tabs-switch.active{
	background: #005a96;
}

.tabs-switch .tabs-teaser{
  color: black;
}

.tabs-switch.active .tabs-title,
.tabs-switch:hover .tabs-title,
.tabs-switch:hover .tabs-teaser,
.tabs-switch.active .tabs-teaser{
	color: white;
}

.tabs-content{
	/* width: 950px; */
  width: 70%;
	/* display: table-cell; */
	/* border: gray 1px solid; */
	background: #d9d9d9;
}

.tabs-content .tabs-title{
	font-size: 30px;
}

.tabs-content .btn-blue{
  background: #81cb23;
  border: 0;
  color: white;
}

.tabs-content .btn-blue:hover{
  background: rgba(6, 31, 33, 0.9) !important;
}

.tabs-item{
	overflow: hidden;
	margin:0;
	display: none;
}

.tabs-item.active{
	display: block;
	margin:20px;
}

.contact-content .stem-title{
	color: white;
}

.stem-contacts{
	width: 100%;
  max-width: 1280px;
	margin: 50px auto;
}

.stem-contacts .contact{
	width: 32%;
	margin: 0px .5%;
	float: left;
}
.stem-contact-img{
	width: auto !important;
	border-radius: 0 !important;
}

.stem-post{
	margin: 50px;
}

.stem-post p{
  font-size: 18px;
}

/* STATS SECTION */
.stem-stats{
	margin: 50px auto;
	max-width: 80%;
}

.stem-stats .stem-stat:nth-child(1){
	border-left: 20px solid transparent;
	border-top: 20px solid transparent;
	border-right: 10px solid transparent;
  border-image: linear-gradient(to right, #005a97 0%, #2eb2ae 100%);
  border-image-slice: 1;
}
.stem-stats .stem-stat:nth-child(2){
	border-left: 10px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 10px solid transparent;
  border-image: linear-gradient(to right, #2eb2ae 0%, #38b6ff 100%);
  border-image-slice: 1;
}
.stem-stats .stem-stat:nth-child(3){
	border-left: 10px solid transparent;
	border-top: 20px solid transparent;
	border-right: 10px solid transparent;
  border-image: linear-gradient(to right, #38b6ff 0%, #39ede7 100%);
  border-image-slice: 1;
}
.stem-stats .stem-stat:nth-child(4){
	border-left: 10px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid transparent;
  border-image: linear-gradient(to right, #39ede7 0%, #81cb23 100%);
  border-image-slice: 1;
}

.stat-disclaimer{
	float: right;
	margin: 10px;
}

/* GOALS SECTION */
.goal-content{
	background: #2eb2ae;
}
.goal-content .stem-title{
  color: white;
}
.goals-container{
	width:80%;
	margin:auto;
}

.goal-image-box, .goal-container{
	width: 45%;
	float: left;
	margin: 50px 2.5%;
}

.stem-goal{
	margin: 15px auto;
	background: white;
}

.stem-goal-icon{
	width: 25%;
	float: left;
	padding: 20px;
	text-align: center;
}

.stem-goal-icon{
	color: #005a97;
}

.stem-goal-text{
	padding: 20px;
	width: 75%;
	float: left;
}

.stem-goal-text h3{
	color: #005a97 !important;
}

/* Statewide Map */
.statewide-map-description, .statewide-map-image{
	width: 50%;
	float: left;
}

.statewide-map-description .btn-blue{
  background: #2eb2ae;
  color: white;
  border: 0;
}
.statewide-map-description .btn-blue:hover{
  background: rgba(6, 31, 33, 0.9);
}

/* STEM Meet Our Team */
.social-icon .fa-instagram{
	color: #e1306c;
}

.stem-team{
  display:flex;
}

.stem-member{
	/* float: left; */
	background: white;
	/* width: 19%; */
	margin: .5%;
	text-align: center;
  position: relative;
}

.stem-member .member-name{
	color: #005a96;
	text-align: center;
	margin-bottom: 0;
}

.stem-member .member-description{
  margin: 10px 5px 50px 5px;
  font-size: 14px;
}

.stem-member .btn-blue{
  margin-bottom: 0;
  width:100%;
}
.stem-member .btn-container{
  position: absolute;
  bottom: 0;
  left: 0;
  width:100%;
}

.team-content{
  padding: 20px 0 20px 10px;
  background-color: white;
  margin: 50px 0 0 11px;
}

/* STEM NEWS AND EVENTS */
.news-content{
	background: #2eb2ae;
}
.news-content .stem-title{
  color: white;
}

.news-content .pagination{
	text-align: right;
}

.news-content .pagination .page-numbers{
  margin: 0 2px 10px 2px;
  text-align: center;
  text-decoration: none;
  padding: 10px 15px;
  border: 3px solid #8ed8f8;
  font-size: 12px;
  line-height: 23px;
  text-transform: uppercase;
  color: #8ed8f8;
  font-weight: 700;
  cursor: pointer;
  background: rgba(6, 31, 33, 0.4);
  font-family: "Raleway";
  display: inline-block;
  zoom: 1;
  -webkit-transition: all 0.50s;
  -moz-transition: all 0.50s;
  transition: all 0.50s;
}
.news-content .pagination .page-numbers.current,
.news-content .pagination .page-numbers:hover{
	background: rgba(6, 31, 33, 0.9);
  color: #fff !important;
}
.news-content .pagination .page-numbers.current{
	cursor: default;
}

.stem-buttons{
  display: flex;
}

.stem-news-item{
	width: 32%;
	margin: .5%;
	background: white;
	float: left;
	position: relative;
	min-height: 550px;
}

.stem-news-item .stem-news-text{
	margin: 0 15px 70px 15px;
}

.stem-news-item .stem-news-button{
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 0px;
	left: 0px;
}

.stem-news-item .stem-news-button .btn-blue{
  color: white;
  background: #005a97;
  border: 0;
}
.stem-news-item .stem-news-button .btn-blue:hover{
  background: rgba(6, 31, 33, 0.9);
}

.stem-news-text .date{
	margin-bottom: 0;
}

.stem-news-item .title-link{
	font-family: 'Raleway';
	font-size: 18px;
	font-weight: 800;
	text-transform: uppercase;
	color: #35629b;
	text-decoration: none;
}

.stem-news-item .news-type{
	text-transform: uppercase;
	text-decoration: none;
	line-height: 20px;
}

.stem-news-item .news-type:hover{
	color: #35629b;
	font-weight: 600;
}

.stem-events-title{
	text-align: center;
	margin: 65px 0 0 0;
}

/* JOKE OF THE WEEK */
.stem-joke{
	border: #005a96 2px dotted;
	text-align: center;
	padding: 20px;
}
.stem-joke h3{
	text-align: center !important;
}

/* RESOURCE SECTION */
.stem-flipbooks{
  display: flex;
  flex-wrap: wrap;
}
.flipbook-container{
  flex-basis: 49%;
  margin: .5%;
}
.stem-flipbook{
  background: white;
  padding: 10px;
}

.stem-flipbook:hover{
	cursor: pointer;
}

.stem-flipbook-image{
	width:100%;
}

.stem-flipbook-title{
	font-size: 16px !important;
	text-align: center !important;
}

.stem-flipbook-links-l,
.stem-flipbook-links-r{
  width: 49%;
  background: #81cb23;
  border: 0;
  color: white;
}
.stem-flipbook-links-l{
  float: left;
}
.stem-flipbook-links-r{
  float:right;
}
.btn-blue:hover{
  color:white;
}
/* RESOURCE ACCORDIONS */

.stem-accordions{
	margin: 50px auto;
}

.stem-accordion{
	background: white;
	margin: 10px auto;
}

.stem-accordion-header{
	background: white;
	padding: 20px;
}

.active .stem-accordion-header{
	background: #35629b;
}

.stem-accordion-header:hover{
	background: #35629b;
	cursor: pointer;
}

.stem-accordion .stem-accordion-help{
  color: black;
}

.stem-accordion-header:hover .stem-accordion-title,
.stem-accordion-header:hover .stem-accordion-help,
.active .stem-accordion-title,
.active .stem-accordion-help{
	color: white;
}

.stem-accordion-header .btn-blue{
  margin-top: 10px;
}

.stem-accordion-image{
  max-width: 22%;
  margin: 1.5%;
  float: left;
  text-align: center;
  height: 150px;
}

.stem-files .stem-accordion-image{
  float:none;
  flex-basis: 25%;
  margin-bottom: 60px;
}
.stem-files{
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 60px;
}

.stem-accordion-image img{
  max-height: 150px;
}

.stem-accordion-collapse{
	padding: 0px;
	overflow: hidden;
	height: 0;
	transition: height 500ms ease;
}

.stem-accordion-sizebox{
	padding: 20px;
}

.resource-icon{
	height: 100px;
	margin: 20px;
}

/* STEM BREADCRUMB */
.stem-bread a, .stem-bread i{
	color: #35629b;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 600;
}

.stem-bread{
	margin-bottom: 20px;
}

/* STEM BANNER */
.stem-wrapper{
	width: 35% !important;
	margin: 100px 0 !important;
	padding: 0 !important;
	position: absolute;
}

.stem-inner{
	padding: 40px !important;
	background: #005a97;
	height: 150px !important;
}

.stem-inner h1{
	text-align: left !important;
  margin-bottom: 0;
}

/* NEW STEM JOKES */
.jokes {
  padding: 0rem;
  display: flex;
  flex-wrap: wrap;
}

.jokes .joke{
  flex-basis: 33%;
  max-width: 31%;
  margin: 1%;
  background: rgb(18, 18, 18);
}

.jokes .joke .gifplayer-wrapper{
  display: block;
}

.jokes .joke figure {
  text-align: center;
}

.jokes .joke img {
  width: 100%;
  max-width: none;
}

.jokes .joke figure figcaption h3 {
  color: white;
  padding: .75rem;
  font-size: 1.25rem;
}

.jokes .joke p {
  font-size: 1rem;
  line-height: 1.5;
  padding: 1rem .75rem;
  color: #666666;
}

/* JOKES SHARING */
.joke-shares{
  margin-top: 16px;
  margin-bottom: 16px;
  text-align: center;
}

.joke-shares h3{
  text-align: center;
  /* margin-left: 5px; */
  font-family: interface, Helvetica Neue, helvetica, sans-serif;
  letter-spacing: .01em;
  text-transform: capitalize;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: 600;
  color: #b2b2b2;
  font-size: 14px;
}

.j-button{
  color: #fff;
  background: no-repeat url(/wp-content/themes/inl/img/social_sprite_2x.png) 0 0;
  background-size: 288px 216px;
  display: inline-block;
  margin-left: 5px;
  padding: 0;
  width: 36px;
  border: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  font-family: interface, Helvetica Neue, helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700;
  height: 36px;
  line-height: 36px;
  min-width: 36px;
  outline: none;
  padding: 0 15px;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-appearance: none;
  -webkit-font-smoothing: antialiased;
}

/* ANIMATIONS */
@-webkit-keyframes fb-anim{0%{background-position:0 -144px}20%{background-position:0 -144px}25%{background-position:-36px -144px}30%{background-position:-72px -144px}35%{background-position:-108px -144px}40%{background-position:-144px -144px}60%{background-position:-144px -144px}65%{background-position:-180px -144px}70%{background-position:-216px -144px}75%{background-position:-252px -144px}80%{background-position:0 -144px}to{background-position:0 -144px}} @keyframes fb-anim{0%{background-position:0 -144px}20%{background-position:0 -144px}25%{background-position:-36px -144px}30%{background-position:-72px -144px}35%{background-position:-108px -144px}40%{background-position:-144px -144px}60%{background-position:-144px -144px}65%{background-position:-180px -144px}70%{background-position:-216px -144px}75%{background-position:-252px -144px}80%{background-position:0 -144px}to{background-position:0 -144px}}

@-webkit-keyframes tw-anim{0%{background-position:-36px -72px}to{background-position:-180px -72px}}@keyframes tw-anim{0%{background-position:-36px -72px}to{background-position:-180px -72px}}

@-webkit-keyframes pin-anim{0%{background-position:-36px -36px}to{background-position:-216px -36px}}@keyframes pin-anim{0%{background-position:-36px -36px}to{background-position:-216px -36px}}

@-webkit-keyframes rd-anim{0%{background-position:-36px 0}to{background-position:-216px 0}}@keyframes rd-anim{0%{background-position:-36px 0}to{background-position:-216px 0}}

.j-facebook{
  background-color: #3894fc;
  background-position: 0 -144px;
}

.j-facebook:hover{
  -webkit-animation: fb-anim 1s steps(1) infinite alternate;
  animation: fb-anim 1s steps(1) infinite alternate;
}

.j-twitter{
  background-color: #00ccff;
  background-position: 0 -72px;
}

.j-twitter:hover{
  -webkit-animation: tw-anim .35s steps(4) infinite;
  animation: tw-anim .35s steps(4) infinite;
}

.j-tumblr{
  background-color: #529ecc;
  background-position: 0 -108px;
}

.j-pintrest{
  background-color: #e54cb5;
  background-position: 0 -36px;
}

.j-pintrest:hover{
  -webkit-animation: pin-anim .5s steps(5) infinite alternate;
  animation: pin-anim .5s steps(5) infinite alternate;
}

.j-reddit{
  background-color: #fc6669;
  background-position: 0 0;
}

.j-reddit:hover{
  -webkit-animation: rd-anim .5s steps(5) infinite alternate;
  animation: rd-anim .5s steps(5) infinite alternate;
}

/* RESPONSIVES */
@media screen and (max-width: 1440px){
  .stem-inner h1{
    font-size: 23px;
  }
  .member-name{
    font-size: 15px !important;
  }
  .member-title{
    font-size: 15px !important;
  }
  .stem-member{
    min-height: 270px;
  }
}
@media screen and (max-width: 1024px){
  .stem-inner h1{
    font-size: 20px;
  }
  .stem-tabs{
    width: 95%;
  }
  .tabs-teaser{
    font-size: 12px;
  }
  .tabs-title{
    margin-bottom: 0px !important;
  }
  .stem-goal-icon i{
    font-size: 3em !important;
  }
  .stem-goal-text h3{
    margin: 0;
  }
  .stem-goal-description{
    font-size: 14px;
  }
  .jokes .joke{
    margin: auto;
    flex-basis: 50%;
    max-width: 46%;
  }
  #joke_2, #joke_3{
    display: none;
  }
}
@media screen and (max-width: 768px){
  .stem-wrapper{
    width: 50% !important;
  }
  .stem-card{
    width: 48%;
    margin: 1%;
  }
  .stem-jump{
    width: 48%;
    margin: 1%;
  }
  .stem-contacts .contact{
    width: 100%;
    margin: 1% 0;
  }
  .goal-image-box, .goal-container{
    width: 100%;
    margin: 0;
    float: none;
  }
  .stem-team{
    display: block;
  }
  .stem-member{
    width: 400px;
    margin: 3% auto;
  }
}
@media screen and (max-width: 425px){
  .stem-post{
    margin: 25px;
  }
  .stem-wrapper{
    width: auto !important;
  }
  .stem-inner h1{
    text-align: center !important;
  }
  .stem-card .card-title{
    font-size: 14px;
    margin-bottom: 0px;
  }
  .stem-card .card-teaser{
    font-size: 12px;
  }
  .support-content .stem-accordions,
  .career-content .stem-accordions,
  .volunteer-content .stem-accordions{
    display: block;
    width: 95%;
  }
  .support-content .stem-tabs,
  .career-content .stem-tabs,
  .volunteer-content .stem-tabs{
    display: none;
  }
  .goal-image-box{
    display: none;
  }
  .goal-container{
    width: 100%;
    margin: 0;
  }
  .stem-goal-icon i{
    font-size: 3em !important;
  }
  .stem-stat{
    width: 100%;
  }
  .stem-stats .stem-stat:nth-child(1){
  	border-left: 20px solid transparent;
  	border-top: 20px solid transparent;
  	border-bottom: 10px solid transparent;
    border-right: 0;
    border-image: linear-gradient(to bottom, #005a97 0%, #2eb2ae 100%);
    border-image-slice: 1;
  }
  .stem-stats .stem-stat:nth-child(2){
    border-left: 0;
  	border-top: 10px solid transparent;
  	border-right: 20px solid transparent;
  	border-bottom: 10px solid transparent;
    border-image: linear-gradient(to bottom, #2eb2ae 0%, #38b6ff 100%);
    border-image-slice: 1;
  }
  .stem-stats .stem-stat:nth-child(3){
  	border-top: 10px solid transparent;
  	border-left: 20px solid transparent;
  	border-bottom: 10px solid transparent;
    border-right: 0;
    border-image: linear-gradient(to bottom, #38b6ff 0%, #39ede7 100%);
    border-image-slice: 1;
  }
  .stem-stats .stem-stat:nth-child(4){
  	border-top: 10px solid transparent;
  	border-right: 20px solid transparent;
  	border-bottom: 20px solid transparent;
    border-left: 0;
    border-image: linear-gradient(to bottom, #39ede7 0%, #81cb23 100%);
    border-image-slice: 1;
  }
  .stem-news-item{
    width: 100%;
    margin: 5% 0;
  }
  .stem-buttons{
    display: block;
  }
  .stem-member{
    width: 100%;
    margin: 3% auto;
  }
  .jokes .joke{
    margin: 0px;
    flex-basis: 100%;
    max-width: 100%;
  }
}

@media screen and (max-width: 375px){
  .stem-jump{
    min-height: 275px;
  }
  .stem-jump .btn-blue{
    width: auto;
    min-width: 0;
  }
  .stem-jump h3{
    font-size: 14px;
  }
  .stem-card{
    width: 98%;
  }
}


/*
  Nerd Humor card /upcoming-news-events
*/

.flip-outer {
  margin: 60px;
  display: grid;
  place-items: center;
}

.flip-wrapper {
  position: relative;
  perspective: 40em;
  display: grid;
  transform-style: preserve-3d;
}

.flip-card {
  grid-area: 1 / 1;
  height: 200px;
  width: 500px;
  transform: translateX(10px) rotateY(25deg) rotateX(10deg);
  background: rgba(249, 198, 26, 0.88);
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 30px;
  color: #000;
  text-transform: uppercase;
  font-size: 60px;
  font-weight: 900;
  backface-visibility: hidden;
  box-shadow: 0 10px 30px -3px rgba(0,0,0,.1);
}

.flip-card h2 {
  font-size: 25px;
  font-weight: 900;
  width: 100%;
}

.flip-card p{
  font-size: 20px;
  font-weight: 800;
  text-transform: none;
  color: black;
}

.flip-answer{
  color: rgba(249, 198, 26, 0);
  font-size: 15px;
  transition: 0.3s;
}


.flip-card .enclosed {
  background: #000;
  line-height: 1;
  color: rgba(249, 198, 26, 1);
  padding: 0 5px;
  display: inline-block;
  transform: translate(-1px, 1px) scale(0.75);
  transform-origin: right center;
}

.flip-wrapper:before {
  --bw: 9px;
  grid-area: 1 / 1;
  content: '';
  backface-visibility: hidden;
  height: 100%;
  width: 100%;
  margin-top: calc(-1 * var(--bw));
  margin-left: calc(-1 * var(--bw));
  background: transparent;
  transform: translateX(-60px) rotateY(-30deg) rotateX(15deg) scale(1.03);
  pointer-events: none;
  border: var(--bw) solid #000;
  box-sizing: content-box;
}


.flip-wrapper:hover > div,
.flip-wrapper:hover:before {
  transform: none;
}

.flip-wrapper:hover .flip-answer{
  color: black;
  background-color: white;
  padding: 10px;
}

.flip-wrapper > div,
.flip-wrapper:before {
  will-change: transform;
  transition: .3s transform cubic-bezier(.25,.46,.45,1);
}

.page-template-template-k12-grants-php .main-content{
  background-color: #FFFFFF;
}

.page-template-template-k12-grants-php .main-content .sidebar div{
  background-color: whitesmoke;
}

.page-template-template-k12-grants-php .main-content .top h3{
  color: #303030;
}