/* CSS Document */
@media (min-width: 1600px) {
	.banner {
		padding-top: 720px;
	}
	.banner#mainpg {
		padding-top: 35%;
	}
}

@media (max-width: 1520px) {
	.banner#mainpg {
		padding-top: 50%;
	}
	.top-line {
		font-size: 2.5vw !important;
		line-height: 1.2em;
	}
	.banner#mainpg .banner-copy .fifthyeartext h1 {
	    font-size: 3vw !important;
        line-height: 1.1em;
}
	.banner#mainpg .banner-copy .fifthyeartext p {
	        font-size: 1.8vw;
    line-height: 1.5em;
	}
/* 	.top-line::before {
		width: 1.9vw;
		padding-bottom: 1.9vw;
	} 
	.top-line::after {
		width: 1.9vw;
		padding-bottom: 1.9vw;
	}*/
	.banner .banner-copy .logo-text-wrap {
		width: 150px;
		height: 150px;
	}
	.second-line {
		display: block;
		font-size: 1.5vw !important;
		line-height: 1.5 !important;
	}
	.second-line strong {
		font-size: 3em;
		line-height: 1em !important;
		letter-spacing: .05em;
	}
	.banner-paragraph {
		font-size: 1.25vw;
		line-height: 1.35em;
		margin: 15px auto 5px;
	}
	.bottom-title {
		font-size: 1.95vw !important;
		line-height: 1.4em !important;
	}
	.bottom-title strong {
		font-size: 1.4em;
		letter-spacing: .05em;
	}
	main {
		font-size: 1.05vw;
		line-height: 1em;
	}
	main.upload-page {
		font-size: 1.05em;
		line-height: 1em;
	}
	.video {
		font-size: 1.15em;
		line-height: 1.4em;
	}
	.featured-row .video:nth-child(4) {
		display: none;
	}
	.library-page .featured-row .video:nth-child(4) {
		display: inline-block;
	}
	.full-library-links {
		font-size: 1.35em;
	}
	.library-page {
		text-align: center;
	}
	.library-page h2 {
		color: #ffffff;
		margin: 0px auto .25em;
		display: inline-block;
		width: auto;
	}
	.result-total {
		font-size: 1.5em;
		line-height: 1.1em;
		display: block;
		margin: 0px;
	}
	.inside .pagination {
		position: static;
		margin: 1em auto 0px;
		text-align: center;
	}
	.inside .pagination a {
		font-size: 1em;
		transform: translate(0%);	
	}
	.list-container {
	    -moz-column-count: 3;
	    -webkit-column-count: 3;
	    column-count: 3;
	    -moz-column-gap: 1%;
	    -webkit-column-gap: 1%;
	    column-gap: 1%;
		column-fill: balance;
	}
	.banner .foreground-tree {
		position: absolute;
		z-index: 200;
		right: -6%;
		bottom: 0;
		width: 34%;
		padding-bottom: 34%;
	}
}

@media (max-width: 1350px) {
	.banner .right-graphics .slider {
		top: 46%;
		width: 85%;
	}
	.banner .right-graphics .slider::before, .banner .right-graphics .slider::after {
		border: 9px solid #ffffff;
	}
	.banner .right-graphics .slider ul.slide-holder {
		border: 9px solid #ffffff;
		width: calc(100% - 18px);
		padding-bottom: 62%;
	}
	.banner .right-graphics .ghosts {
		right: -8%;
		bottom: -10%;
		width: 25%;
		padding-bottom: 30%;
	}
	.banner .right-graphics .back-bat {
		left: 80%;
		top: -3%;
		width: 23%;
		padding-bottom: 16%;
	}
	.banner .right-graphics .bats::before {
		left: -15%;
		bottom: -11%;
		width: 34%;
		padding-bottom: 30%;
	}
	.banner .right-graphics .bats::after {
		left: -9%;
		top: -2%;
		transform: translateY(0%);
		width: 24%;
		padding-bottom: 15%;
	}
	header .pumpkin {
		width: 24vw;
		height: 14vw;
		top: -25%;
		left: 30%;
	}
}

@media (max-width: 1200px) {
	header {
		padding: 10px 0px 19px;
		box-shadow: 2px 2px 3px rgba(0,0,0,.15);
	}
	.logo {
		width: 90px;
		height: 50px;
	}
	nav {
		top: 55%;
	}
	header ul li a {
		padding: 9px 2px 10px;
		margin: 0px 15px 0px 0px;
		font-size: 12px;
		line-height: 1em;
		letter-spacing: 0.1em;
	}
	.accordion-section-title {
		font-size: 11px;
		line-height: 1em;
		padding:  11px 6em 10px 2em;
	}
	.accordion-section-title:after {
		width: 9px;
		padding-bottom: 9px;
		top: 50%;
	}
	.homelink {
		background-position: left 47%;
		background-size: 10px 10px;
		padding: 11px 2px 12px 18px;
	}
	header.triggered .homelink {
		background-position: left 47%;
		background-size: 10px 10px;
		padding: 11px 2px 12px 18px;
	}
	header .pumpkin {
		width: 21vw;
		height: 13vw;
		top: -0%;
		left: 31%;
	}
	.list-container {
	    -moz-column-count: 2;
	    -webkit-column-count: 2;
	    column-count: 2;
	    -moz-column-gap: 4%;
	    -webkit-column-gap: 4%;
	    column-gap: 4%;
		column-fill: balance;
	}
	.result-total {
		font-size: 1.25rem;
		line-height: 1.1em;
	}
	.inside .pagination {
		font-size: 1rem;
		line-height: 1em;
	}
	.footer-pagination {
		padding: 1.75em 5% 2.15em;
	}
	.footer-pagination ul li {
		display: inline-block;
		vertical-align: middle;
		margin: 0px .15em;
	}
	.footer-pagination .pagination {
		font-size: .9rem;
		line-height: 1em;
	}
	.video {
		font-size: 1.5em;
		line-height: 1.4em;
	}
	.banner#mainpg .banner-copy .fifthyearlogo img {
      width: 380px;
    height: 380px;
}
}

@media (max-width: 1000px) {
	header {
		position: fixed;
		padding: 9px 0px 15px;
		background-color: rgba(0,120,190,.95);
	}
	header::before {
		height: 4px;
	}
	header.triggered {
		padding: 9px 0px 15px;
	}
	header .pumpkin {
		display: none;
	}
	.inside {
		position: static;
	}
	.library-banner .inside {
		position: relative;
	}
	.logo {
		width: 90px;
		height: 50px;
		background-size: contain;
	}
	nav {
		display: inline-block;
		position: static;
		transform: none;
	}
	header nav > ul {
		position: fixed;
		top: 72px;
		left: 0px;
		width: 100%;
		background-color: rgba(0,120,190,.75);
		text-align: center;
		padding: 2px 0px 0px;
		box-shadow: 0px 3px 4px rgba(0,60,90,.15);
		transition: .2s all ease-in-out;
	}
	header.triggered nav > ul {
		position: fixed;
		top: 69px;
		left: 0px;
		width: 100%;
		background-color: rgba(0,120,190,.9);
	}
	header nav > ul li a, header.triggered nav > ul li a {
		padding: 6px 7px;
		margin: 0px 10px 0px 10px;
		color: #FFFFFF !important;
	}
	header nav > ul li a:hover, header nav > ul li a.active {
		color: #FFFFFF;
	}
	header nav > ul li a:before {
		background: #FFFFFF !important;
	}
	.accordion {
		display: inline-block;
		vertical-align: middle;
		position: fixed;
		top: 18px;
		right: 5%;
		z-index: 910;
	}
	.homelink:hover, .homelink:focus, header.triggered .homelink {
		background-image: url(../images/home-icon.png);
	}
	.banner {
		padding-top: 65%;
	}
	.banner .inside {
		top: 63.5%;
	}
	.banner#mainpg .inside {
	    top: 60%;
	}
	.banner .banner-copy {
		width: 40%;
		margin-left: -5%;
	}
	.banner .right-graphics .slider {
		top: 47%;
		left: 53%;
		width: 100%;
	}
	.video {
		font-size: 1.75em;
		line-height: 1.4em;
	}
	.full-library-links a {
		font-size: 2.5em;
		line-height: 1em;
		margin-top: 2.5%;
		padding: .75em 5%;
	}
	footer {
		width: 100%;
		padding: 5% 0px;
		font-size: .8em;
	}
	.footer-inside {
	    text-align: left;
	}
	.footer-top-left {
		width: 133px;
	}
	.footer-top-mid {
		line-height: 1.2em;
		width: calc(100% - 165px);
		padding: 35px 0px 0px 25px;
		float: right;
	}
	.footer-top-right {
		padding-top: 15px;
		width: 133px;
	}
	footer ul, footer li {
		margin: 0px 3px;
	}
	.upload-intro {
		font-size: .9em;
		line-height: 1.25em;
	}
	.accordion-tos {
		text-align: left;
	}
	.orange-divider {
		height: 5px;
	}
	.upload-page {
		background-image: url("../images/mobile-top-back.jpg");
		opacity: 1;
	}
	
	.top-line::before {
		width: 2.4vw;
		padding-bottom: 2.4vw;
	}
	.top-line::after {
		width: 2.4vw;
		padding-bottom: 2.4vw;
	}
	.second-line {
		display: block;
		font-size: 2vw !important;
		line-height: 1em !important;
		margin-top: .5em;
	}
	.second-line strong {
		font-size: 2.2em;
		line-height: 1em !important;
		letter-spacing: .04em;
	}
	.banner-paragraph {
		font-size: 1.4vw;
		line-height: 1.5em;
		margin: 15px auto 8px;
	}
	.bottom-title {
		font-size: 2.15vw !important;
		line-height: 1.2em !important;
	}
	.bottom-title strong {
		font-size: 1.4em;
		letter-spacing: .03em;
	}
	h2 {
		font-size: 3vw;
		line-height: 1em;
		padding: 1% 0px .5% 1.75em;
	}
	h2::before {
		width: 4.5vw;
		padding-bottom: 4.5vw;
	}
	.banner#mainpg{
	padding-top: 60%;
}
	.banner#mainpg .banner-copy .fifthyeartext h1 {
	    font-size: 3.5vw !important;
        line-height: 1.1em;
}
	.banner#mainpg .banner-copy .fifthyeartext p {
	    font-size: 1.8vw;
        line-height: 1.5em;
	}
	.banner#mainpg .banner-copy .fifthyeartext {
  padding: 2% 4%;
}
	.banner#mainpg .banner-copy .fifthyearlogo img {
      width: 300px;
    height: 300px;
}
}

@media (max-width: 900px) {
/*
.banner#mainpg{
	padding-top: 90%;
}
*/
/*
	.banner#mainpg .banner-copy .fifthyearlogo img {
    width: 200px;
    height: 200px;
}
*/
	.banner#mainpg .banner-copy {
    flex-direction: column;
}
	.banner#mainpg .banner-copy .fifthyearlogo {
        margin: 0 auto 10px;
}
	.banner#mainpg .banner-copy .fifthyeartext {
   width: 92%;
    padding: 4%;
    background-color: rgba(0,120,190,.8);
}
		.banner#mainpg .banner-copy .fifthyeartext h1 {
	    font-size: 4vw !important;
}
	.banner#mainpg .banner-copy .fifthyeartext p {
	    font-size: 2.5vw;
	}
	.banner#mainpg{
	padding-top: 90%;
}
}
@media (max-width: 800px) {
	.banner {
		padding-top: 68%;
	}
	.banner .inside {
		top: 66%;
	}
	.banner#mainpg .inside {
	    top: 60%;
	}
	.orange-divider {
		height: 6px;
	}
	.banner .banner-copy .logo-text-wrap  {
		width: 120px;
        height: 120px;
	}
}

@media (max-width: 600px) {
	h2 {
		font-size: 5vw;
		line-height: 1em;
		padding: 1% 0px .5% 2.25em;
	}
	h2::before {
		width: 9.5vw;
		padding-bottom: 9.5vw;
	}
	.upload-page h2 {
		font-size: 5vw;
		line-height: 1em;
		padding: 1% 0px .5% 2.25em;
	}
	.upload-page h2::before {
		width: 9.5vw;
		padding-bottom: 9.5vw;
	}
	.banner {
		padding: 80px 0px 0px;
		background-image: url("../images/mobile-top-back.jpg");
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.banner::before {
		background-image: url("../images/blue-hearts.png");
		background-size: contain;
		background-position: center bottom;
		background-repeat: no-repeat;
		opacity: 1;
		z-index: -1;
	}
/* 	.banner::after {
		content: "";
		position: absolute;
		z-index: -2;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		background-image: url("../images/white-hearts.png");
		background-size: 70%;
		opacity: .3;
	} */
	.banner .foreground-tree {
		display: none;
	}
	.banner .shadow {
		position: absolute;
		z-index: 2;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		overflow: hidden;
		transform: translateY(0px);
	}
	.banner .shadow::before {
		top: -20%;
		left: -5%;
		right: -5%;
		bottom: -5%;
		z-index: -1;
		background-image: radial-gradient(rgba(0,120,190,0) 35%, rgba(0,120,190,.6) 70%, rgba(0,120,190,1) 90%);
		width: 120%;
		padding-bottom: auto;
	}
	.banner .shadow::after {
		content: "";
		position: absolute;
		z-index: 1;
		left: 0;
		right: 0;
		width: 100%;
		padding-top: 65%;
		background-image: url("../images/mobile-white-top-hearts.png");
		background-size: contain;
		background-repeat: no-repeat;
		background-position: top center;
	}
	.banner .inside {
		position: relative;
		z-index: 5;
		top: 0%;
		left: 0%;
		transform: translate(0%, 0%);
		width: 95%;
	}
	.banner .right-graphics {
		position: relative;
		z-index: 9;
		right: 0;
		top: 0;
		bottom: 0;
		left: 0%;
		padding-bottom: 85%;
	}
/* 	.banner .right-graphics::before {
		content: "";
		position: absolute;
		z-index: 1000000;
		right: 0;
		bottom: 3%;
		width: 25%;
		padding-bottom: 36%;
		background-image: url("../images/heart-highlights.png");
		background-size: contain;
		background-position: bottom right;
		background-repeat: no-repeat;
		
	} */
	.banner .right-graphics .slider {
		top: 55%;
		left: 52%;
		width: 85%;
	}
	.banner .right-graphics .slider::before, .banner .right-graphics .slider::after {
		border: 6px solid #ffffff;
	}
	.banner .right-graphics .slider ul.slide-holder {
		border: 6px solid #ffffff;
		width: calc(100% - 12px);
	}
	.banner .right-graphics .ghosts {
		position: absolute;
		z-index: 11;
		right: -3.5%;
		bottom: -2.5%;
		width: 25%;
		padding-bottom: 30%;
	}
	.banner .right-graphics .bats::before {
		left: -3.5%;
		bottom: -1%;
		width: 30%;
		padding-bottom: 20%;
	}
	.banner .right-graphics .bats::after {
		z-index: -11;
		left: 0%;
		top: 3%;
		transform: translateY(00%) rotateZ(-20deg);
		width: 28%;
		padding-bottom: 17%;
	}
	.banner .banner-copy {
		width: 90%;
		margin: 0px auto;
		padding: 5% 0% 5%;
	}
	.banner .banner-copy::after {
		content: none;
	}
	.top-line {
		font-size: 6.5vw !important;
		line-height: 1em !important;
		letter-spacing: .025em;
		color: #ffffff;
		text-shadow: 2px 2px 6px rgba(0,120,190,1);
	}
	.top-line::before, .top-line::after {
		width: 3.7vw;
		padding-bottom: 3.7vw;
	}
	.second-line {
		font-size: 4.2vw !important;
		line-height: 1em !important;
		letter-spacing: .025em;
		color: #ffffff;
		text-shadow: 2px 2px 6px rgba(0,120,190,1);
	}
	.banner-paragraph {
		font-size: 3.5vw;
		line-height: 1.6em;
		margin: 10px auto 0px;
		width: 90%;
		color: #ffffff;
		text-shadow: 2px 2px 6px rgba(0,120,190,1);
	}
	.bottom-title {
		font-size: 5vw !important;
		line-height: 1.15em !important;
	}
	.bottom-title strong {
		font-size: 1.15em;
		letter-spacing: .05em;
	}
	.banner .left-bat {
		position: absolute;
		z-index: 3;
		left: 0%;
		bottom: -10%;
		width: 70%;
		max-width: 100%;
		padding-bottom: 42%;
		transform: translateX(-20%) rotateZ(18deg);
	}
	.video-list .inside {
		padding: 20px 20px;
		width: calc(100% - 40px);
		background-color: rgba(255,255,255,0);
		background-image: linear-gradient(180deg, rgba(255,255,255,.85) 1%, rgba(255,255,255,0) 10%)
	}
	.list-container {
	    -moz-column-count: 1;
	    -webkit-column-count: 1;
	    column-count: 1;
	    -moz-column-gap: 1%;
	    -webkit-column-gap: 1%;
	    column-gap: 1%;
		column-fill: balance;
	}
	.video {
		font-size: 3.4em;
		line-height: 1.4em;
	}
	footer {
		width: 100%;
		padding: 7.5% 0px 10%;
		font-size: .8em;
	}
	.footer-inside {
	    text-align: left;
	}
	.footer-top-left {
		width: 90px;
	}
	.footer-top-mid {
		font-size: .9em;
		line-height: 1.4em;
		width: calc(100% - 110px);
		padding: 0px 0px 0px 0px;
		float: right;
	}
	.footer-top-right {
		padding-top: 15px;
		width: 95px;
	}
	footer ul, footer li {
		margin: 0px;
	}
	footer li img {
		width: 20px !important;
		height: 20px !important;
	}
	.form-container {
		padding: 8% 5%;
	}
	.upload-page::before {
		background-size: 56%;
		opacity: .75
	}
	.inside .pagination li {
		display: inline-block;
		vertical-align: middle;
		border-radius: 50%;
		margin: 0px .15em;
		font-size: .9em;
	}
	.banner#mainpg .banner-copy .fifthyeartext h1 {
	    font-size: 6vw !important;
        line-height: 1.2em;
}
	.banner#mainpg .banner-copy .fifthyeartext p {
	    font-size: 3.5vw;
		line-height: 1.35em;
		margin-top: 8px;
	}
	.banner#mainpg .banner-copy .fifthyearlogo {
  margin: 0 auto 10px;
}
	.banner#mainpg .inside {
      top: 60%;
}
	.banner#mainpg {
    padding-top: 150%;
}
	.banner#mainpg .banner-copy {
  padding: 15% 0% 0%;
}
	.banner#mainpg {
		background-image: url("../images/banner-background-02-mobile.jpg");
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	
}

@media (max-width: 450px) {
	header .inside {
		width: 85%;
	}
	.upload-intro {
		font-size: .8em;
		line-height: 1.35em;
		text-align: left;
		width: 90%;
		margin: .25em auto 1em; 
		display: block;
	}
	.upload-intro ul {
		margin: 0px;
		padding: 0px;
	}
	.upload-intro li {
		margin: 4px 0px 4px 15px;
	}
	.accordion-tos {
		padding: .5em 1.5em;
		background-color: #eeeeee;
		margin: 15px auto 15px;
		font-size: .8em;
		line-height: 1.2em;
		text-align: center;
	}
	.full-library-links a {
		font-size: 4.5em;
		line-height: 1em;
		margin-top: 5%;
		padding: 1em 5%;
	}
	footer {
		padding: 9.5% 0px 10%;
	}
	.accordion {
		display: inline-block;
		vertical-align: middle;
		position: fixed;
		top: auto;
		bottom: 0px;
		left: 0px;
		right: 0px;
		padding: 4% 7.5% 4.5%;
		margin: 0px;
		z-index: 910;
		background-color: rgba(0,120,190,1);
		box-shadow: 0px -3px 4px rgba(0,60,90,.15);
		border-top: 7px solid #004a98;
		//border-image: linear-gradient(90deg, rgba(255,55,70,1) 10%, rgba(255,110,130,1) 45%, rgba(255,110,130,1) 75%, rgba(255,55,70,1) 100%) 1;
	}
	.accordion-section-title {
		font-size: .8em;
		line-height: 1em;
		padding:  11px 3em 10px 2em;
		background-color: rgba(0,120,190,1);
		margin-top: 0px;
		color: #ffffff !important;
		border: 2px solid #ffffff;
		width: 100%;
	}
	.accordion-section-title:before {
		background: #ffffff;
	}
	.accordion-section-title:hover, .accordion-section-title:focus, .accordion-section-title:active, .accordion-section-title.active {
		color: rgba(0,120,190,1) !important;
	}
	.accordion-section-title:after {
		content: "";
		width: 14px;
		padding-bottom: 14px;
		background-image: url(../images/accordian-arrow-down-white.png);
		top: 51%;
		-webkit-transition: all .3s ease-out;
		transform: translateY(-50%) rotate(180deg);
		transition: all .15s linear 0s;
	}
	.accordion-section-title:hover:after, .accordion-section-title:focus:after, .accordion-section-title:active:after, .accordion-section-title.active:after {
		background-image: url("../images/accordian-arrow-down.png");
		width: 14px;
		padding-bottom: 14px;
		transform: translateY(-50%) rotate(0deg);
	}
	header.triggered .accordion-section-title, header.triggered .accordion-section-title.active {
		font-size: .8em;
		line-height: 1em;
		padding:  11px 3em 10px 2em;
		background-color: rgba(0,120,190,1);
		margin-top: 0px;
		color: #ffffff !important;
		border: 2px solid #ffffff !important;
		width: 100%;
	}
	header.triggered .accordion-section-title:before {
		background: #ffffff;
	}
	header.triggered .accordion-section-title:hover, header.triggered .accordion-section-title:focus, header.triggered .accordion-section-title:active, header.triggered .accordion-section-title.active {
		color: rgba(0,120,190,1) !important;
	}
	header.triggered .accordion-section-title:after {
		content: "";
		width: 14px;
		padding-bottom: 14px;
		background-image: url(../images/accordian-arrow-down-white.png);
		top: 51%;
		-webkit-transition: all .3s ease-out;
		transform: translateY(-50%) rotate(180deg);
		transition: all .15s linear 0s;
	}
	header.triggered .accordion-section-title:hover:after, header.triggered .accordion-section-title:focus:after, header.triggered .accordion-section-title:active:after, header.triggered .accordion-section-title.active:after {
		background-image: url(../images/accordian-arrow-down.png);
		width: 14px;
		padding-bottom: 14px;
		transform: translateY(-50%) rotate(0deg);
	}
	header .accordion-section-content, header.triggered .accordion-section-content, .accordion-section-content {
		position: static;
		width: 100%;
	    background-color: #ffffff;
    	padding: 8px 26px 10px 26px !important;
		border: 0px solid #ffffff !important;
		border-top: 1px dashed #419deb !important;
		margin: 0px;
	}
	.accordion-section-content li a, header.triggered .accordion-section-content ul li a, header .accordion-section-content ul li a {
		color: #0077bc;
    	font-size: 14px;
		line-height: 1em;
		text-transform: uppercase;
		font-weight: 500;
		letter-spacing: 0.15em;
	}
	footer {
		width: 100%;
		padding: 7.5% 0px 100px;
		font-size: .8em;
	}
	.footer-top-mid {
		font-size: .8em;
		line-height: 1.6em;
		width: calc(100% - 110px);
		padding: 5px 0px 0px 0px;
		float: right;
	}
	.footer-top-right {
		padding-top: 5px;
		width: 95px;
	}
	.mobile-top-button {
		display: block;
	}
	#optimator-form {
		margin-bottom: 1em;
	}
.snowflakes {
	position: absolute;
	z-index: 1;
	width: 100%;
	padding-bottom: 32%;
}
	.banner#mainpg {
  padding-top: 140%;
}
}