body{padding:0;margin:0;font-family: "work-sans",Helvetica,sans-serif;}
/* Grid */
section.grid{}
.container{
width: 100%;
margin-right: auto;
margin-left: auto;
max-width: 1440px;}
.container{height: auto;}
.row {
display: flex;
flex-wrap: wrap;}
.col {flex: 1 0 0%;}
.col-1 {flex: 0 0 auto;width: 8.33333333%;}
.col-2 {flex: 0 0 auto;width: 16.66666667%;}
.col-3 {flex: 0 0 auto;width: 25%;}
.col-4 {flex: 0 0 auto;width: 33.33333333%;}
.col-5 {flex: 0 0 auto;width: 41.66666667%;}
.col-6 {flex: 0 0 auto;width: 50%;}
.col-7 {flex: 0 0 auto;width: 58.33333333%;}
.col-8 {flex: 0 0 auto;width: 66.66666667%;}
.col-9 {flex: 0 0 auto;width: 75%;}
.col-10 {flex: 0 0 auto;width: 83.33333333%;}
.col-11 {flex: 0 0 auto;width: 91.66666667%;}
.col-12 {flex: 0 0 auto;width: 100%;}
/* Boxes */
.box-img-4 .box{height:180px;max-height:180px;min-height:180px;width:50%;max-width:180px;display:block;text-align: center;position:relative;overflow: hidden;}
.box-img-4 .box img{margin:auto;display: block;vertical-align: middle;position: absolute;top:0;right:0;bottom:0;left:0;}
.box-img-4 .box.singleImg img{width:100%;height:180px;}
.box-img-4 .box.logo{background:#293338;}
.box-img-4 .box.logo img{height:120px;max-height:120px;min-height:120px;}
.box-img-4 .d-pink{background:#F20180;}
.box-img-4 .pink{background:#FD7993;}
.box-img-4 .pink.dPink{background:#F20180;}
.box-img-4 .yellow{background:#E1CB34;}
.box-content .spacing{padding:47px 51px;overflow: hidden;}
.box-content.gray{background:#293338;color:#fff;height:360px;max-height:360px;min-height:360px;display:block;}
.box-content.gray h1{margin:24px 0 24px 0;font-size: 65px;letter-spacing: .4px;font-weight: 600;}
.box-content.gray h2{font-size: 22px;line-height: 29px;letter-spacing: 1.18px;font-weight: 600;color:#FD7993;}
.box-content.gray p{font-size: 18px;letter-spacing: .33px;line-height: 30px;font-weight: 100;}
.box-content.green{
transition: all .7s ease-in-out;background:#165A54;color:#fff;height:360px;max-height:360px;min-height:360px;display:block;position: relative;text-align: center;overflow: hidden;}
.box-content.green h2{color:#E1CB34;margin-top: 10rem;}
.box-content.green h3{margin-left:-5px;}
.box-content.green h2,.box-content.green h3{font-size: 45px;letter-spacing: 1.18px;line-height: 11px;font-family: "goldplay",Helvetica,sans-serif;}
.box-content.green img{
padding-top:90px;padding-left:42px;padding-right:42px;width:80%;max-width:582px;
opacity: 1;
transition: all 1s ease-in-out;}
.box-content h1{font-size: 32px;letter-spacing: 1.18px;line-height: 29px; font-family: "goldplay",Helvetica,sans-serif;}
.box-content h2{font-size: 22px;letter-spacing: 1.18px;line-height: 29px; font-family: "goldplay",Helvetica,sans-serif;}
.box-content p{}
.box-img{overflow: hidden;}
.box-photo1{
box-sizing: border-box;
background-image: url("img/Bob-Josh.png");
filter: grayscale();
transition: filter 0.4s ease-in-out;
transition: all .7s ease-in-out;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center;}
.box-photo2{
box-sizing: border-box;
background-image: url("img/boxBoxVid.png");
filter: grayscale();
transition: filter 0.4s ease-in-out;
transition: all .7s ease-in-out;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center;}
.box-photo3{
box-sizing: border-box;
background-image: url("img/sorting.jpeg");
filter: grayscale();
transition: filter 0.4s ease-in-out;
transition: all .7s ease-in-out;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center;}
.box-img-4 .box.singleImg img{
filter: grayscale();
transition: filter 0.4s ease-in-out;
transition: all .7s ease-in-out;}
.box-img-4 .box.singleImg img:hover,.box-photo1:hover,.box-photo2:hover,.box-photo3:hover {filter: none;}


/* Footer */
.footer{text-align: center;padding-bottom:100px;}
.footer h2{margin-bottom:3rem;padding:100px 1em 0 1em;}
.footer .logos{max-width:753px; margin:0 auto;}
.footer .col-4{align-items: flex-end;display: center;}
.footer .col-4 img{width:100%;max-width:170px;margin-left: 60px;}
.footer .col-12 img{width:100%;max-width:400px;}
/* Animation Shake */
.pink:hover .shake .shake-img{ 
animation: shake 75ms infinite;
animation-timing-function: linear;}
@keyframes shake {
0% { transform: rotate(10deg); }
50% { transform: rotate(-0.5deg); }
100% { transform: rotate(0.5deg); }}
/* Animation Flip */
.full-size, .flip-box .object, .flip-box .front, .flip-box .back, .flip-box2 .object, .flip-box2 .front, .flip-box2 .back {
width: 100%;
height: 100%;}
.slice, .flip-box .front, .flip-box .back, .flip-box .flank, .flip-box2 .front, .flip-box2 .back, .flip-box2 .flank {
display: block;
overflow: hidden;
position: absolute;}
.flip-box,.flip-box2 {
float: left;
display: block;
position: relative;
z-index: 2;
max-width: 180px;
width:100%;
height: 180px;
-webkit-perspective: 400px;
-moz-perspective: 400px;
-ms-perspective: 400px;
-o-perspective: 400px;
perspective: 400px;}
.flip-box .object ,.flip-box2 .object {
position: absolute;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;
-webkit-transition-timing-function: ease-in-out;
-moz-transition-timing-function: ease-in-out;
-o-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(-75px);
-moz-transform: translateZ(-75px);
-ms-transform: translateZ(-75px);
-o-transform: translateZ(-75px);
transform: translateZ(-75px);}
.flip-box .object:hover, .flip-box .object:focus,.flip-box2 .object:hover, .flip-box2 .object:focus {
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
transition-duration: 0.5s;
-webkit-transition-timing-function: ease-in-out;
-moz-transition-timing-function: ease-in-out;
-o-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
-webkit-transform: translateZ(-75px) rotateY(180deg);
-moz-transform: translateZ(-75px) rotateY(180deg);
-ms-transform: translateZ(-75px) rotateY(180deg);
-o-transform: translateZ(-75px) rotateY(180deg);
transform: translateZ(-75px) rotateY(180deg);}
.flip-box .front,.flip-box2 .front  {
z-index: 1;
background-color: #F20180;
-webkit-transform: rotateY(0deg) translateZ(75px);
-moz-transform: rotateY(0deg) translateZ(75px);
-ms-transform: rotateY(0deg) translateZ(75px);
-o-transform: rotateY(0deg) translateZ(75px);
transform: rotateY(0deg) translateZ(75px);}
.flip-box .back ,.flip-box2 .back {
z-index: 0;
background-color: #F20180;
-webkit-transform: rotateY(180deg) translateZ(75px);
-moz-transform: rotateY(180deg) translateZ(75px);
-ms-transform: rotateY(180deg) translateZ(75px);
-o-transform: rotateY(180deg) translateZ(75px);
transform: rotateY(180deg) translateZ(75px);}
.lPink .flip-box .front{background-color: #FD7993;}
.lPink .flip-box .back{background-color: #FD7993;}
.lYellow .flip-box .front{background-color: #E1CB34;}
.lYellow .flip-box .back{background-color: #E1CB34;}
.lWhite p{color:#000;}
.lWhite .flip-box .front{background-color: #fff;}
.lWhite .flip-box .back{background-color: #fff;}
.flip-box .flank,.flip-box2 .flank {
width: 150px;
height: 200px;
left: 75px;
background-color: #950752;
-webkit-transform: rotateY(-90deg) translateZ(150px);
-moz-transform: rotateY(-90deg) translateZ(150px);
-ms-transform: rotateY(-90deg) translateZ(150px);
-o-transform: rotateY(-90deg) translateZ(150px);
transform: rotateY(-90deg) translateZ(150px);}
.lPink .flip-box .flank{background-color: #93384a;}
.lYellow .flip-box .flank{background-color: #9d8d22;}
.lWhite .flip-box .flank{background-color: #4f4c4c;}
.flip-box.flip-up .object:hover, .flip-box.flip-up .object:focus,.flip-box2.flip-up .object:hover, .flip-box2.flip-up .object:focus {
-webkit-transform: translateZ(-75px) rotateX(180deg);
-moz-transform: translateZ(-75px) rotateX(180deg);
-ms-transform: translateZ(-75px) rotateX(180deg);
-o-transform: translateZ(-75px) rotateX(180deg);
transform: translateZ(-75px) rotateX(180deg);}
.flip-box.flip-up .back,.flip-box2.flip-up .back {
-webkit-transform: rotateX(180deg) translateZ(75px);
-moz-transform: rotateX(180deg) translateZ(75px);
-ms-transform: rotateX(180deg) translateZ(75px);
-o-transform: rotateX(180deg) translateZ(75px);
transform: rotateX(180deg) translateZ(75px);}
.flip-box.flip-up .flank,.flip-box2.flip-up .flank  {
width: 180px;
height: 150px;
top:5px;
left: 0;
-webkit-transform: rotateX(-90deg) translateZ(100px);
-moz-transform: rotateX(-90deg) translateZ(100px);
-ms-transform: rotateX(-90deg) translateZ(100px);
-o-transform: rotateX(-90deg) translateZ(100px);
transform: rotateX(-90deg) translateZ(100px);}
.flip-box .flip-content {
padding-top: 10px;
color: #fff;}
.flip-box .back .flip-content {
color: #fff;width:100%;}
.flip-box .back .flip-content img{margin-top:20px;}
.flip-box .back .flip-content p.flip-l1{margin-top: 90px;font-size:12px;letter-spacing: .18px;line-height: 13px;margin-bottom:0;padding-left:5px;padding-right:5px;}
.flip-box .back .flip-content p.flip-l2 span{font-size:12px;letter-spacing: .22px;line-height: 13px;margin:0;}
.flip-box .back .flip-content p.flip-l2{margin:0;line-height: 13px;padding-left:5px;padding-right:5px;}
.flip-box2 .flip-content {
padding-top: 10px;
color: #fff;}
.flip-box2 .front .flip-content {
color: #fff;width:100%;}
.flip-box2 .front .flip-content img{margin-top:20px;}
.flip-box2 .front .flip-content p.flip-l1{margin-top: 90px;font-size:12px;letter-spacing: .18px;line-height: 13px;margin-bottom:0;padding-left:5px;padding-right:5px;}
.flip-box2 .front .flip-content p.flip-l2 span{font-size:12px;letter-spacing: .22px;line-height: 13px;margin:0;}
.flip-box2 .front .flip-content p.flip-l2{margin:0;line-height: 13px;padding-left:5px;padding-right:5px;}
/* Animation Fireworks */
.spark-contain{position: absolute;width: 100%;max-width:720px;height: 360px;}
[class^=firework-] {
position: absolute;
width: 0.1rem;
height: 0.1rem;
border-radius: 50%;}
.firework-1 {
-webkit-animation: firework-lg 1.2s both infinite;
animation: firework-lg 1.2s both infinite;
-webkit-animation-delay: 1.2s;
animation-delay: 1.2s;
top: 20%;
left: 30%;}
.firework-2 {
-webkit-animation: firework-md 1.2s both infinite;
animation: firework-md 1.2s both infinite;
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
top: 15%;
left: 85%;}
.firework-3 {
-webkit-animation: firework-sm 1.2s both infinite;
animation: firework-sm 1.2s both infinite;
-webkit-animation-delay: 1.1s;
animation-delay: 1.1s;
top: 30%;
left: 35%;}
.firework-4 {
-webkit-animation: firework-sm 1.2s both infinite;
animation: firework-sm 1.2s both infinite;
-webkit-animation-delay: 1.1s;
animation-delay: 1.1s;
top: 60%;
left: 20%;}
.firework-5 {
-webkit-animation: firework-lg 1.2s both infinite;
animation: firework-lg 1.2s both infinite;
-webkit-animation-delay: 1.5s;
animation-delay: 1.5s;
top: 40%;
left: 75%;}
.firework-6 {
-webkit-animation: firework-md 1.2s both infinite;
animation: firework-md 1.2s both infinite;
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
top: 20%;
left: 15%;}
.firework-7 {
-webkit-animation: firework-md 1.2s both infinite;
animation: firework-md 1.2s both infinite;
-webkit-animation-delay: 0.6s;
animation-delay: 0.6s;
top: 15%;
left: 70%;}
.firework-8 {
-webkit-animation: firework-lg 1.2s both infinite;
animation: firework-lg 1.2s both infinite;
-webkit-animation-delay: 1.2s;
animation-delay: 1.2s;
top: 15%;
left: 75%;}
.firework-9 {
-webkit-animation: firework-sm 1.2s both infinite;
animation: firework-sm 1.2s both infinite;
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s;
top: 25%;
left: 45%;}
.firework-10 {
-webkit-animation: firework-sm 1.2s both infinite;
animation: firework-sm 1.2s both infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
top: 90%;
left: 75%;}
.firework-11 {
-webkit-animation: firework-md 1.2s both infinite;
animation: firework-md 1.2s both infinite;
-webkit-animation-delay: 1.5s;
animation-delay: 1.5s;
top: 85%;
left: 35%;}
.firework-12 {
-webkit-animation: firework-md 1.2s both infinite;
animation: firework-md 1.2s both infinite;
-webkit-animation-delay: 1.1s;
animation-delay: 1.1s;
top: 70%;
left: 65%;}
.firework-13 {
-webkit-animation: firework-sm 1.2s both infinite;
animation: firework-sm 1.2s both infinite;
-webkit-animation-delay: 1.5s;
animation-delay: 1.5s;
top: 30%;
left: 50%;}
.firework-14 {
-webkit-animation: firework-sm 1.2s both infinite;
animation: firework-sm 1.2s both infinite;
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
top: 30%;
left: 90%;}
.firework-15 {
-webkit-animation: firework-lg 1.2s both infinite;
animation: firework-lg 1.2s both infinite;
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s;
top: 25%;
left: 35%;}
@-webkit-keyframes firework-sm {
0%, 100% {opacity: 0;}
10%, 70% {opacity: 1;}
100% {
box-shadow: -0.5rem 0rem 0 #E1CB34, 0.5rem 0rem 0 #E1CB34, 0rem -0.5rem 0 #E1CB34, 0rem 0.5rem 0 #E1CB34, 0.35rem -0.35rem 0 #E1CB34, 0.35rem 0.35rem 0 #E1CB34, -0.35rem -0.35rem 0 #E1CB34, -0.35rem 0.35rem 0 #E1CB34;}}
@keyframes firework-sm {
0%, 100% {opacity: 0;}
10%, 70% {opacity: 1;}
100% {
box-shadow: -0.5rem 0rem 0 #E1CB34, 0.5rem 0rem 0 #E1CB34, 0rem -0.5rem 0 #E1CB34, 0rem 0.5rem 0 #E1CB34, 0.35rem -0.35rem 0 #E1CB34, 0.35rem 0.35rem 0 #E1CB34, -0.35rem -0.35rem 0 #E1CB34, -0.35rem 0.35rem 0 #E1CB34;}}
@-webkit-keyframes firework-md {
0%, 100% {opacity: 0;}
10%, 70% {opacity: 1;}
100% {
box-shadow: -0.7rem 0rem 0 #E1CB34, 0.7rem 0rem 0 #E1CB34, 0rem -0.7rem 0 #E1CB34, 0rem 0.7rem 0 #E1CB34, 0.49rem -0.49rem 0 #E1CB34, 0.49rem 0.49rem 0 #E1CB34, -0.49rem -0.49rem 0 #E1CB34, -0.49rem 0.49rem 0 #E1CB34;}}
@keyframes firework-md {
0%, 100% {opacity: 0;}
10%, 70% {opacity: 1;}
100% {
box-shadow: -0.7rem 0rem 0 #E1CB34, 0.7rem 0rem 0 #E1CB34, 0rem -0.7rem 0 #E1CB34, 0rem 0.7rem 0 #E1CB34, 0.49rem -0.49rem 0 #E1CB34, 0.49rem 0.49rem 0 #E1CB34, -0.49rem -0.49rem 0 #E1CB34, -0.49rem 0.49rem 0 #E1CB34;}}
@-webkit-keyframes firework-lg {
0%, 100% {opacity: 0;}
10%, 70% {opacity: 1;}
100% {
box-shadow: -0.9rem 0rem 0 #E1CB34, 0.9rem 0rem 0 #E1CB34, 0rem -0.9rem 0 #E1CB34, 0rem 0.9rem 0 #E1CB34, 0.63rem -0.63rem 0 #E1CB34, 0.63rem 0.63rem 0 #E1CB34, -0.63rem -0.63rem 0 #E1CB34, -0.63rem 0.63rem 0 #E1CB34;}}
@keyframes firework-lg {
0%, 100% {opacity: 0;}
10%, 70% {opacity: 1;}
100% {
box-shadow: -0.9rem 0rem 0 #E1CB34, 0.9rem 0rem 0 #E1CB34, 0rem -0.9rem 0 #E1CB34, 0rem 0.9rem 0 #E1CB34, 0.63rem -0.63rem 0 #E1CB34, 0.63rem 0.63rem 0 #E1CB34, -0.63rem -0.63rem 0 #E1CB34, -0.63rem 0.63rem 0 #E1CB34;}}
/* Animation Back To Top */
.back-to-top{
padding: 2px 5px;
cursor:pointer;
position:fixed;
right: 20px;
bottom: 20px;
display:none;}
#parcel {
transform: translate(-50%, -50%);
font-size: 32px;
animation: pop 1.2s infinite;}
@keyframes pop {
0% {transform: translate(-50%, -50%) scale(1.25, 0.75);}
50% {transform: translate(-50%, -150%) scale(1, 1);}
55% {transform: translate(-50%, -150%) rotate(15deg);}
60% {transform: translate(-50%, -150%) rotate(-15deg);}
65% {transform: translate(-50%, -150%) rotate(15deg);}
70% {transform: translate(-50%, -150%) rotate(-15deg);}
100% {transform: translate(-50%, -50%) scale(1.25, 0.75);}}
/* Animation Hanging Light */
.gray .area {
margin-top: -450px;
margin-left: 350px;
width: 200px;
height: 500px;
animation: swing2 1s infinite ease-in-out alternate;
-moz-transform-origin: top;
-webkit-transform-origin: top;
transform-origin: top;}
.gray .wire {
position: relative;
left: 98px;
height: 200px;
width: 4px;
background-color: black;}
.gray .fixture {
position: relative;
background-color: grey;
width: 16px;
height: 20px;
left: 92px;}
.gray .strip {
position: relative;
width: 18px;
height: 2px;
right: 1px;
top: 4px;
background-color: darkgrey;}
.gray .strip:nth-of-type(2) {top: 7px;}
.gray .strip:nth-of-type(3) {top: 10px;}
.gray .bulb {
position: relative;
width: 40px;
height: 40px;
left: 80px;
bottom: 2px;
z-index: -1;
background-color: rgba(226, 211, 161, 0.85);
border-radius: 50%;
-webkit-box-shadow: 0px 0px 300px 77px rgba(235, 209, 164, 1);
-moz-box-shadow: 0px 0px 300px 77px rgba(235, 209, 164, 1);
box-shadow: 0px 0px 300px 77px rgba(235, 209, 164, 1);}
.gray .zig {
position: relative;
background-color: transparent;
width: 10px;
height: 5px;
border-radius: 5px / 2.5px;
left: 14px;
border: black solid 1px;}
.gray .zig:nth-of-type(2) {top: -3px;}
.gray .zig:nth-of-type(3) {top: -6px;}
@keyframes swing2 {
from {
-moz-transform: rotate(3deg);
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
to {
transform: rotate(-3deg);}}
/* Animation Boots */
.center .leg {
position: absolute;
top: 0px;
left: 37px;
width: 151px;
height: 175px;
transform-origin: 50% 0;}
.center .shoe {
position: absolute;
width: 9.5em;
height: 8em;
left: 0;
bottom: 0.25em;
background: url("img/doc-martens.svg") center center no-repeat;
transform-origin: 0 95%;}
.center .left-leg {
-webkit-animation: swing 2s ease-in-out infinite;
animation: swing 2s ease-in-out infinite;}
.center .left-leg .shoe {
-webkit-animation: shoe-turn 2s ease-in-out infinite;
animation: shoe-turn 2s ease-in-out infinite;}
.center .right-leg {
-webkit-animation: swing 2s ease-in-out 1s infinite;
animation: swing 2s ease-in-out 1s infinite;}
.center .right-leg .shoe {
-webkit-animation: shoe-turn 2s ease-in-out 1s infinite;
animation: shoe-turn 2s ease-in-out 1s infinite;}
@-webkit-keyframes swing {
0%, 100% {transform: rotate(-20deg);}
50% {transform: rotate(30deg);}}
@keyframes swing {
0%, 100% {transform: rotate(-20deg);}
50% {transform: rotate(30deg);}}
@-webkit-keyframes shoe-turn {
0%, 100% {transform: rotate(-10deg) translateY(-5px);}
25% {transform: rotate(0deg) translateY(0px);}
50% {transform: rotate(10deg) translateY(-10px);}
75% {transform: rotate(0deg) translateY(-30px);}}
@keyframes shoe-turn {
0%, 100% {transform: rotate(-10deg) translateY(-5px);}
25% {transform: rotate(0deg) translateY(0px);}
50% {transform: rotate(10deg) translateY(-10px);}
75% {transform: rotate(0deg) translateY(-30px);}}
/* Animation Video Module */
.vid-btn{width:80px;margin:0 auto;left:0;right:0;z-index: 10!important;cursor: pointer;transition: all .2s ease-in-out;}
.vid-btn:hover{transform: scale(1.1);}
.lets-play{background-color: transparent;border: 0;width:100%;padding-top: 9rem;}
.vid-box{background:#efedf1;}
#video-wrap:not(.active) {
opacity: 0;
visibility: hidden;}
#video-wrap .video-overlay {
animation: fade-in .35s .25s ease both;
background-color: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(10px);
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;}
#video-wrap .video-container {
width: 100%;
max-width:700px;
transition: all 0.3s ease-in-out;
transform: scale(0.9);}
#video-wrap .close-video {
background-color: #fff;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
right: 5%;
top: 5%;
width: 42px;
height: 42px;
border-radius: 100%;
border: solid 2px #000;
padding: 0;
transition: all 0.3s ease-in-out;
z-index: 150;}
#video-wrap .close-video:before, #video-wrap .close-video:after {
content: "";
width: 60%;
height: 3px;
background-color: #000;
position: absolute;
transition: all 0.3s ease-in-out;}
#video-wrap .close-video:before {
transform: rotate(42deg);}
#video-wrap .close-video:after {
transform: rotate(-42deg);}
#video-wrap .close-video:focus {
outline: none;}
#video-wrap .close-video:hover {
background-color: #000;}
#video-wrap .close-video:hover:before, #video-wrap .close-video:hover:after {
background-color: #fff;}
#video-wrap video{
position: relative;
z-index: 10;
border-radius: 12px;
width: 100%;
height: auto;
background-color: #fff;
object-fit: cover;}
#video-wrap .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
#video-wrap .embed-container iframe, #video-wrap .embed-container object, #video-wrap .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#video-wrap iframe {
z-index: 10;
border-radius: 12px;
background-color: #fff;
background: #fff;}
.video-container{padding:12px;}
#video-wrap.active {
opacity: 1;
visibility: visible;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100vh;
display: flex;
transition: all 0.3s ease-in-out;
z-index: 9991;
align-items: center;
justify-content: center;}
#video-wrap.active .video-container {
transform: scale(1);}
/* Animation Box Hover Effect */
.hover-effect::before {
right: 0;
opacity:0.7;
top: 0;}
.hover-effect::after {
bottom: 0;
opacity: 0.7;
left: 0;}
.hover-effect::before, .hover-effect::after {
content: "";
background: #fff;
height: 0;
width: 0;
z-index: 1;
position: absolute;
-webkit-transition-duration: 1.3s !important;
-o-transition-duration: 1.3s;
transition-duration: 1.3s !important;}
.hover-effect:hover::after, .hover-effect:hover::before {
height: 100%;
opacity: 0;
width: 100%;}
/* Media Breaks */
/* Show Hide */
.show-box{display: none;}
.hide-box{display: block;}
/* End Show Hide */
@media (max-width: 1439.98px) {}
@media (max-width: 1199.98px) {}
@media (max-width: 1125px) {.box-content.gray p{font-size:16px;line-height: 24px;}}
@media (max-width: 1013px) {.box-content.green h2, .box-content.green h3{font-size:37px;}}
@media (max-width: 991.98px) {
/* Show Hide */
.show-box{display: block;}
.hide-box{display: none;}
/* End Show Hide */
.vid-bg{width:100%;}
.box-img-4{width:100%;}
.box-img-4 .box{width:25%;max-width:unset;overflow: hidden;}
.box-img-4 .box.logo img{width:auto;}
.flip-box,.flip-box.flip-up .flank,.flip-box2,.flip-box2.flip-up .flank{max-width:100%!important;width:100%!important;}
.box-content.gray{width:75%;}
.box-content.green{width:75%;}}
@media (max-width: 767.98px) {
.lets-play{padding-top: 19rem;}
.box-content.gray{width:100%;}
.box-content.green{width:100%;}
.footer .col-4{width:100%;padding-bottom:2rem;}
.footer .col-4 img{margin-left:0;}
.van{width:100%;display: block;min-height: 700px;}
	
.van,.van img{background-repeat:no-repeat;
background-size:contain;
background-position:center;}}
@media (max-width: 575.98px) {
.box-content.green h2{margin-top:7rem;}
.lets-play{padding-top: 15rem;}
.box-content .spacing {
padding: 37px 31px;}
.box-content.green{min-height: 280px;height: 280px;max-height: 280px;}
.gray .area {margin-left: 240px;}
.box-img-4 .box{width:25%;width:50%;}
.van{min-height: 540px;}
.flip-box2 .front .flip-content p.flip-l1{font-size: 16px!important;line-height: 24px!important;}}
@media (max-width: 479.98px) {.box-content.green h2, .box-content.green h3{font-size:27px;}.footer .col-4{width:100%;}.van{min-height: 420px;}}
@media (max-width: 379.98px) {.van{min-height: 370px;}}
@media (max-width: 329.98px) {.van{min-height: 310px;}}