/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Mar 2, 2017, 7:57:21 PM
    Author     : nicholasmcduffie
*/
div.elishapics{
    padding-top: 10%;
    padding-left: 27%;
}
a.instaeli {
  position: absolute;
  left: 36.7%;
  transform: translate(-50%, -50%);
  padding-bottom: 100px;
  text-decoration: none;
}
a.youeli {
  position: absolute;
  left: 58.7%;
  transform: translate(-50%, -50%);
  padding-bottom: 100px;
  text-decoration: none;
}
 a.noob:hover {


  text-decoration: none;

}
img.boxred {
  position: absolute;
  top: 72%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 7%;
  width: 9%;
  filter: brightness(68%);
}
  a.noob {
  position: absolute;
  left: 47.7%;
  transform: translate(-50%, -50%);
  padding-bottom: 100px;
  text-decoration: none;

}
img.Shoping {
   filter: brightness(70.5%);
   padding-left:23%;
}
a.google {
   margin: 0px;
   padding: 0px;
   padding-left: 58px;
}
a.apple {
   margin: 0px;
   padding: 0px;
   padding-left: 80px;

}
a.spotify {
   margin: 0px;
   padding: 0px;
   padding-left: 40px;

}
img.google {
    text-align: center; 
    width: 15%; 
    margin-right: 1%;
    margin-bottom: 0.5em;
}
img.apple {
   padding-bottom:1%; 
   width: 15%; 
   margin-right: 1%;
   margin-bottom: 0.5em; 
}
img.spotify {
    padding-left: 20%; 
    float:left; 
    width: 15%; 
    margin-right: 1%; 
    margin-bottom: 0.5em;
}
div.link {
    padding-left: 5%;
}
.pp {
    padding-left: 44%;
    font-size: 15px;
    
}
.lega a {
    font-size: 15px;
}
div.header{
    border-bottom:  2px solid white;
    background-color: black;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 999;
}

  div.credit a {
        font-size: 15px;
        padding-left: 600px;
    }
    div.links {
          
    text-align: center;
    padding-right: 7%;
    padding-top: 22px; 
}

p.credit {
    text-align: center;
}

.topnav {
  overflow: hidden;
  background-color: black;
}

span.opener {
    -webkit-text-stroke: 2px grey;
  color: white;
  float:right;
  padding-left:500px;
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 40px;
}

div.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;
}

div.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
 
}

div.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: white;
  display: block;
  transition: 0.3s;
  padding-left: 40px;
}

div.overlay a:hover, div.overlay a:focus {
  color: #f1f1f1;
}

div.overlay a.closebtn  {
 padding-right: 450px;
  font-size: 60px;
  
}

@media screen and (max-height: 1026px) {
  div.overlay {overflow-y: auto;}
  div.overlay a {font-size: 20px}
  div.overlay a.closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
    
  }
}
@media screen and (max-width: 1026px) and (min-width: 802px) {
  div.overlay {overflow-y: auto;}
  div.overlay a {font-size: 20px; padding-right: 60px; padding-left: 0px;}
 div.links a{display: none; font-size: 1px;}
 .nd {padding-top:150px;}
 h1.popo {font-size: 30px}
 img.nds {height: 140px; width: 160px;  float:none;padding-left:42%; }
 div.linked a {height: 80px;width: 80px;}
 span.opener {padding-left: 500px; padding-bottom: 30px;padding-left: 0px;float:right;}
 div.links{padding-right:0px; float:right;padding-left: 100px}
   h1 {padding-top:60px; font-size: 50%}
iframe.youPr {height:130px; width:145px;}
  p.lolp {font-size:13px;}
  a.pp {margin-left: 292px;}
   img.spotify {padding-left: 14%}
   a.closebtn {padding-left:0px; margin-left: 0px;}
  div.overlay-content {padding-right: 40px; padding-left: 0px;} 
  img.Shoping {height:500px; width:700px; padding-left: 170px;}
img.boxred {  height: 70px; width: 250px;top: 73%; left: 51.2%;}
a.noob {padding-right: 35px;}
  div.elishapics {padding-left: 0px;}
}
@media screen and (max-width: 361px) and (min-width: 10px){
 img.nds {margin-left: 1px;height: 100px; width: 120px; padding-left: 33%;}
 img.nd {padding-top: 100px;}
   a.pp {text-align: center; padding-left: 0%; margin-left: 18%;}
     a.spotify { margin: 0px; padding: 0px; padding-left: 1px;}
  a.google {margin: 0px; padding: 0px; padding-left: 39px;}
  a.apple {margin: 0px; padding: 0px; padding-left: 40px;}
  img.spotify { height: 30px; width: 60px; padding-left: 48px;}
  img.google {height: 30px; width: 60px;}
  img.apple {height: 20px; width: 60px;}
  div.link {padding-left: 0px;}
   img.Shoping {height:200px; width:300px; padding-left: 35px;}
img.boxred {  height: 50px; width: 100px;top: 55%; left: 50%;}
a.noob {padding-right: 35px; font-size: 18px;  left:40.3%;}
h2{font-size: 20px}
  div.elishapics {padding-left: 0px;}
}
@media screen and (max-width: 378px) and (min-width: 370px){
 img.nds { margin-left: 1px; height: 120px; width: 140px; padding-left: 31%;}
 img.nd {padding-top: 100px;}
   a.pp {text-align: center; padding-left: 0%; margin-left: 21%;}
     a.spotify { margin: 0px; padding: 0px; padding-left:1px;}
  a.google {margin: 0px; padding: 0px; padding-left: 41px;}
  a.apple {margin: 0px; padding: 0px; padding-left: 42px;}
  img.spotify { height: 30px; width: 60px; padding-left: 50px;}
  img.google {height: 30px; width: 60px;}
  img.apple {height: 20px; width: 60px;}
  div.link {padding-left: 0px;}
  img.Shoping {height:200px; width:300px; padding-left: 35px;}
img.boxred {  height: 50px; width: 100px;top: 55%; left: 50%;}
a.noob {padding-right: 35px; font-size: 18px;  left:40.8%;}
h2{font-size: 20px}
  div.elishapics {padding-left: 0px;}
}
@media screen and (max-width: 415px) and (min-width: 380px){
 img.nds { padding-left: 138px; height: 120px; width: 140px;}
 img.nd {padding-top: 150px;}
   a.pp {text-align: center; padding-left: 0%; margin-left: 23%;}
     a.spotify { margin: 0px; padding: 0px; padding-left: 1px;}
  a.google {margin: 0px; padding: 0px; padding-left: 20px;}
  a.apple {margin: 0px; padding: 0px; padding-left: 18px;}
    img.spotify { height: 30px; width: 60px;}
  img.google {height: 30px; width: 60px;}
  img.apple {height: 20px; width: 60px;}
 img.Shoping {height:200px; width:300px; padding-left: 60px;}
img.boxred {  height: 50px; width: 100px;top: 55%; left: 51%;}
a.noob {padding-right: 35px; font-size: 20px;  left:42.5%;}
  div.elishapics {padding-left: 0px;}
}
@media screen and (max-width: 769px) and (min-width: 417px){
  img.nds { padding-left: 299px; margin-left: 0px; height: 150px; width: 170px;}
 img.nd {padding-top: 100px;}
  a.pp {text-align: center; padding-left: 0%; margin-left: 36%;}
    a.spotify { margin: 0px; padding: 0px; padding-left: 8px; height: 50px; width: 70px;}
  a.google {margin: 0px; padding: 0px; padding-left: 26px;}
  a.apple {margin: 0px; padding: 0px; padding-left: 34px;}
  img.Shoping {height:400px; width:600px; padding-left: 90px;}
img.boxred {  height: 50px; width: 180px;top: 50%; left: 51%;}
a.noob {padding-right: 35px; font-size: 31px; left:46.8%;}
    div.elishapics {padding-left: 0px;}
}
@media screen and (max-width: 800px) and (min-width: 770px){
  img.nds { padding-left: 320px; margin-left: 0px; height: 150px; width: 170px;}
 img.nd {padding-top: 100px;}
  a.pp {text-align: center; padding-left: 0%; margin-left: 36%;}
  a.spotify { margin: 0px; padding: 0px; padding-left: 10px;}
  a.google {margin: 0px; padding: 0px; padding-left: 28px;}
  a.apple {margin: 0px; padding: 0px; padding-left: 36px;}
  img.Shoping {height:400px; width:600px; padding-left: 107px;}
img.boxred {  height: 50px; width: 180px;top: 38%; left: 51.9%;}
a.noob {padding-right: 70px; font-size: 31px; }
  div.elishapics {padding-left: 0px;}
}
@media screen and (max-width: 1440px) and (min-width: 1027px){
    div.elishapics {padding-left: 0px;}
 img.nds { padding-left: 465px; margin-left: 0px; }
 a.pp {padding-left: 39%;}
 img.spotify {padding-left: 16%}
img.Shoping {height:800px; width:1000px; padding-left: 220px;}
img.boxred {  height: 80px; width: 260px;top: 73%; left: 51.2%;}
a.noob {padding-right: 30px;}
}

@media screen and (min-width: 1026px) {
span.opener{display:none;float:right;size:  5px;}
}


.topnav a:hover {
    text-decoration: underline;
}

.active {
  background-color: #4CAF50;
  color: white;
}

.topnav .icon {
  display: none;
  
}

@media screen and (max-width: 1024px) {
  .topnav a {display: none;}  
  .topnav a.icon {
    float: right;
    display: block;
  }
}

div.photos {
   
    background-repeat: no-repeat;
    background-size: cover;
}
 body.bro {
     background-color: black;
     margin: 0;
     background-repeat: no-repeat;
     background-size: cover;
     background-position: 50% 33%; 
     background-size: 100% 80%;
     padding: 0;
 }
  p.credit {
    text-align: center;
  
}
body {
    background-color: black;
   padding: 0.1px;
   margin: 0%;
   
  
}
div.onl {
    background-color: white;
   
   
    
}
 div {
    //This is to make the div bigger
     //text-align: center;
}


a {
    -webkit-text-stroke: 2px grey;
    text-decoration: none;
    color: whitesmoke;
    font-size: 40px;
  
    text-align: center;
  margin-left: 50px;
  
    padding-top: 50px;
  
   
}
 /* unvisited link */


/* mouse over link */
a:hover { 
    color: white;
    -webkit-text-stroke: 2px #894c0c;
}

/* selected link */

h1 {
    font-size: 800%;  
    padding-top: 4%;
    text-align: center;
    color:  whitesmoke;
    -webkit-text-stroke: 2px grey;
    
 }
 h1.popo {
    font-size: 800%;  
     padding-left: 20%;
     padding-right: 20%;
   text-align: center;
    -webkit-text-stroke: 2px grey;
    color:  Black;
    
    
 }
 
 h2 {
     
     color:  whitesmoke; 
     padding-left: 35px;
     padding-right: 35px;
     padding-top: 0px;
     text-align: center;
    }
 
 img.img {
     
    
      padding-left: 6%;
    float: left;
     
     width: 170px; 
     height: 120px;
  
 }
.nds {
     
    padding-left: 40%;
    display: block;
    padding-bottom: 1%;
     
  
 }
 img.nd {
    padding-top: 30px; 
   width: 50%;
   height: 50%;
     margin: auto ;
    display: block;
     
  
 } 
 div.ended {
    background-color: white;
     
 }
 
 
  div.memberstext {
     height: auto;    
     float: right;
     width: 39%;
     padding-top: 13px;
 }
  div.memberpic {
     padding-top: 60px;
 }
 
 div.video {
     height: 0;
     padding-bottom: 15.0%;
 }
 
 p {
     color:  whitesmoke;
 }

 label {

     color: whitesmoke;
       display: block;
  font-weight: bold;
  font-size: 20px;
  text-align: left;
  padding-left:1260px;
  padding-bottom: 5px;
 }
 form {
     text-align: center;
     margin-bottom: 20px;
    
 }
 input {
font-size: 22px;
  
 }    
 textarea {
     padding-bottom: 300px;
     padding-right: 2300px;
     font-size: 20px;
     margin-bottom: 20px;
 }
 
 p.dp {
     
     font-size: 30px;
    
 }
 a.dsw {
     color: blue;
 }
 label.weblike {
  color: whitesmoke;
  display: block;
  font-weight: bold;
  font-size: 20px;
  text-align: left;
  padding-left: 1170px;
  padding-bottom: 20px;
  padding-top: 20px;
     
 }
 label.named {
     padding-left: 1250px;
 }
 label.why {
     padding-left: 1255px;
 }

 input[type=text], select {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

input[type=submit] {
  width: 100%;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: whitesmoke;
}

div.mack {
  border-radius: 5px;
  
  padding: 20px;
}
label.boimack     {
color: whitesmoke;
       display: block;
  font-weight: bold;
  font-size: 20px;
  text-align: left;
  padding-left:1px;
  padding-bottom: 5px;
  }
  input.value.submit {
 color: grey;
 font-size: 22px;
  }
  

@font-face {
     font-family: 'main';
     src: url('../fonts/breakaway.ttf')
}
div.links {
    text-align: center;
    padding-right: 16%;
    padding-top: 22px; 
}

p.credit {
    text-align: center;
}

.topnav {
  overflow: hidden;
  background-color: black;
}

span.opener {
    -webkit-text-stroke: 2px grey;
  color: white;
  float:right;
  padding-left:500px;
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 40px;
}

div.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;
}

div.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
 
}

div.overlay a {
 
  text-decoration: none;
  font-size: 36px;
  color: white;
  display: block;
  transition: 0.3s;
  padding-left: 30px;
}

div.overlay a:hover, div.overlay a:focus {
  color: #f1f1f1;
}

div.overlay a.closebtn {
  top: 20px;
  right: 0px;
  font-size: 60px;
}

@media screen and (max-height: 1026px) {
  div.overlay {overflow-y: auto;}
  div.overlay a {font-size: 20px}
  div.overlay a.closebtn {
  font-size: 40px;
  top: 15px;
  right: 0px;
    
  }
}
@media screen and (max-width: 1026px) {
  div.overlay {overflow-y: auto;}
  div.overlay a {font-size: 20px}
 div.links a{display: none; font-size: 1px;}
 img.nd {padding-top:150px;}
 h1.popo {font-size: 30px}
 div.linked a {height: 80px;width: 80px;}
 span.opener {padding-left: 500px; padding-bottom: 30px;padding-left: 0px;float:right;}
 div.links{padding-right:0px; float:right;padding-left: 100px}
   h1 {padding-top:60px;}
iframe.youPr {height:130px; width:145px;}
  p.lolp {font-size:13px;}
  .pp {text-align: center; padding-left: 10%}
}
@media screen and (min-width: 1026px) {
span.opener{display:none;float:right;size:  5px;}
}


.topnav a:hover {
    text-decoration: underline;
}

.active {
  background-color: #4CAF50;
  color: white;
}

.topnav .icon {
  display: none;
  
}

@media screen and (max-width: 1024px) {
  .topnav a {display: none;}  
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 1024px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }}
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }

  hr { 
    padding-top: 25px;
    }
    input.bigboi {
        color: blue;
    }