/****************************/
/* Reset */
/****************************/

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:700;}dfn{font-style:italic;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace, serif;font-size:1em;}pre{white-space:pre-wrap;word-wrap:break-word;}q{quotes:\201C \201D \2018 \2019;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-.5em;}sub{bottom:-.25em;}img{border:0;}svg:not(:root){overflow:hidden;}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,html input[type=button],/* 1 */
input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;}button[disabled],input[disabled]{cursor:default;}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}body,figure{margin:0;}legend,button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}

/****************************/
/* Global */
/****************************/

*, *:before, *:after { 
    box-sizing: inherit; 
}

html, body {
    height: auto;
    min-height: 100%;
    width: 100%;
    display: block;
    box-sizing: border-box;
}

body {
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    padding: 0;
    text-align: center;
}

ul {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: white;
}

h1 {
    font-size: 70px;
    margin: 0;
    padding: 3% 0;
    color: white;
}

h2 {
    font-size: 30px;
    margin: 0;
    padding: 1% 0;
    color: white;
}

h3 {
    display: inline-block;
}


/****************************/
/* Classes */
/****************************/

.clearfix:after {
    visibility: hidden; 
    display: block; 
    font-size: 0; 
    content: " "; 
    clear: both; 
    height: 0; 
}

.wrapper {
    height: auto;
    width: 100%;
    min-height: 100%;
    position: absolute;
    overflow: hidden;
}

.home-bg {
    background-color: #32CD32;
    transition: background 1s;
}

.images img {
    width: 200px;
    border: 5px solid white;
}

/*.images {
    width: 100%;
    display: block;
    height: 0;
    padding: 0 0 100% 0;
    position: absolute;
    top: 0;
    left: 0;
}*/
/*.images img {
    border: 5px solid white;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.5s;
}*/
/*.images img:nth-of-type(1) {
    opacity: 1;
}*/
/*nav {
    position: relative;
    max-width: 400px;
    width: 90%;
    margin: 0 auto;
}*/
  /*  nav:before {
        width: 100%;
        height: 0;
        padding: 0 0 100% 0;
        position: relative;
        display: block;
        content: '';
    }*/
/*a:nth-of-type(1):hover ~ .images img:nth-of-type(1) {
    opacity: 1;
}*/
/*a:nth-of-type(2):hover ~ .images img:nth-of-type(2) {
    opacity: 1;
}*/

.job-box {
    width: 300px;
    border: 5px solid white;
    margin: 1%;
}

.ent-h3 {
    color: white;
}

.job-box:hover {
    background-color: darkslateblue;
}

.first-role {
    display: inline-block;
}

.dev-box, .vid-box, .vol-box, .dj-box {
    display: inline-block;
}

.social-icon-container {
    width: 100%;
    text-align: center;
    margin: 0 auto;
}

.fa {
    font-size: 40px;
    margin: 1%;
}

.fa:hover {
    color: darkslateblue;
}

p.lee-email {
    margin-bottom: 1%;
    font-size: 20px;
}

footer {
    margin: 0;
}

footer p {
    margin: 0;
}

.me:hover {
    color: darkslateblue;
}


/*Begin Ent Page Styles*/
.wrapper-overlay {
    width: 100%;
    height: auto;
    min-height: 100vh;
    position: relative;
    background: linear-gradient(rgba(72, 61, 139, 0.6), rgba(72, 61, 139, 0.6));
}
.video {
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100vh;
    transform: translate3d(-50%, -50%, 0);
}
.video video {
    width: auto;
    height: 100%;
}
.sig-lee {
    width: 100px;
    position: absolute;
    top: 0;
    left: 0;
}
.ent-h1 {
    width: 90%;
    margin: 0 auto;
}
.ent-lee {
    color: mediumspringgreen;
}
.ent-period {
    color: mediumspringgreen;
}
.ent-h2 {
    width: 70%;
    margin: 0 auto;
    font-size: 25px;
}
.ent-h3 {
    font-size: 20px;
    color: white;
}
.beez-link {
    color: #02d2df;
}
    .beez-link:hover {
        color: #f16a74;
    }
.nbs-link {
    color: #FFCC03;
}
    .nbs-link:hover {
        color: black;
    }
/*.baus-link {
    color: black;
}
    .baus-link:hover {
        color: #10B0B8;
    }*/
.skates-link {
    color: gold;
}
    .skates-link:hover {
        color: #FF9950;
    }
.chat-link {
    color: mediumspringgreen;
}
    .chat-link:hover {
        color: gold;
    }
.screen-overlay {
    display: inline-block;
    width: 300px;
    position: relative;
}
.screen-overlay:after {
    content:'\A';
    position:absolute;
    width:100%; 
    height:100%;
    top:0; 
    left:0;
    /*background:rgba(0, 250, 154, 0.4);*/
    background: rgba(255, 204, 3, 0.4);
    opacity:0;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
}
.screen-overlay:hover:after {
    opacity: 1;
}
.screenshots {
    width: 100%;
    border: 5px solid white;
    vertical-align: top;
}
.iwf-screenshot {
    margin-right: 1%;
}
/*.tms-screenshot {
    margin-left: 1%;
}*/

/*Begin Vid Page Styles*/
h1.vid-h1 {
    width: 90%;
    margin: 0 auto;
    padding: 3% 0 1% 0;
}
.vid-period {
    color: #e52d27;
}
.vid-lee {
    color: #e52d27;
}
.vid-h2 {
    font-size: 20px;
    display: inline-block;
    width: 70%;
    line-height: 125%;
}
.vid-youtube {
    color: #e52d27;
    font-size: 500px;
    display: inline-block;
    margin: -3% 0 0 0;
}
    .vid-youtube:hover {
        color: white;
    }
.tube {
    color: #e52d27;
}
iframe {
    border: 5px solid white;
}
.click-here {
    color: #e52d27;
}
    .click-here:hover {
    color: #b31217;
}

/*Begin Vol Page Styles*/
.vol-bg {
    background: linear-gradient(rgba(72, 61, 139, 0.6), rgba(72, 61, 139, 0.6)), url(../img/vol-bg-pic.jpg);
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
}
h1.vol-h1 {
    width: 90%;
    margin: 0 auto;
}
h2.vol-h2 {
    width: 70%;
    margin: 0 auto;
    font-size: 25px;
}
.vol-lee {
    color: gold;
}
.vol-period {
    color: gold;
}
.createspace {
    color: #1EB298;
}
    .createspace:hover {
        color: white;
    }
.llc {
    color: #ff57ff;
}
    .llc:hover {
        color: black;
    }
.vol-link {
    color: gold;
}
    .vol-link:hover {
        color: black;
    }

/*Begin DJ Page Styles*/
h1.dj-h1 {
    width: 90%;
    margin: 0 auto;
    padding: 2% 0 1% 0;
}
h2.dj-h2 {
    width: 70%;
    margin: 0 auto;
    font-size: 25px;
}
.dj-lee {
    color: deepskyblue;
}
.dj-period {
    color: deepskyblue;
}
.dj-email {
    color: deepskyblue;
}
    .dj-email:hover {
        color: gold;
    }
.form-inputs {
    padding: 0 4% 1% 0.5%;
    margin: 1%;
    font-size: 18px;
}
textarea {
    padding-right: 7%;
    font-size: 18px;
    margin: 1%;
}
.dj-submit-button {
    margin: 2% 0;
    border: 5px solid white;
    background-color: deepskyblue;
    color: white;
    padding: 1% 2%;
    font-size: 20px;
}
    .dj-submit-button:hover {
        background-color: white;
        border: 5px solid deepskyblue;
        color: deepskyblue;
    }

/*-----------------------------*/
/*Begin Media Queries*/
/*-----------------------------*/

/*Ent Page Media Queries*/
@media (max-width: 768px) {
    h1.ent-h1 {
        width: 80%;
    }
}
@media (max-width: 620px) {
    h1.ent-h1 {
        font-size: 55px;
    }
    h2.ent-h2 {
        font-size: 22px;
    }
@media (max-width: 435px) {
    h1.ent-h1 {
        padding-top: 16%;
    }
}
@media (max-width: 375px) {
    h1.ent-h1 {
        font-size: 45px;
    }
}

/*Vid Page Media Queries*/
@media (max-width: 768px) {
    h1.vid-h1 {
        width: 80%;
    }
}
@media (max-width: 620px) {
    h1.vid-h1 {
        font-size: 55px;
    }
    .vid-h2 {
        font-size: 18px;
    }
    .vid-youtube {
        font-size: 450px;
    }
}
@media (max-width: 435px) {
    h1.vid-h1 {
        padding-top: 16%;
    }
    .vid-youtube {
        font-size: 360px;
    }
}
@media (max-width: 375px) {
    h1.vid-h1 {
        font-size: 45px;
    }
    .vid-youtube {
        margin-top: -6%;
        font-size: 320px;
    }
}

/*Vol Page Media Queries*/
@media (max-width: 620px) {
    h1.vol-h1 {
        font-size: 55px;
    }
    .vol-h2 {
        font-size: 18px;
    }
}
@media (max-width: 435px) {
    h1.vol-h1 {
        padding-top: 16%;
    }
    h2.vol-h2 {
        font-size: 22px;
    }
}
@media (max-width: 375px) {
    h1.vol-h1 {
        font-size: 45px;
    }

/*DJ Page Media Queries*/
@media (max-width: 620px) {
    h1.dj-h1 {
        font-size: 55px;
    }
    .dj-h2 {
        font-size: 18px;
    }
}
@media (max-width: 435px) {
    h1.dj-h1 {
        padding-top: 16%;
    }
    h2.dj-h2 {
        font-size: 22px;
    }
}
@media (max-width: 375px) {
    h1.dj-h1 {
        font-size: 45px;
    }