body {
font-family: 'Rubik', sans-serif;
background-color: #000;
margin: 0px;
cursor: url(images/curse.gif), auto;
}

::selection {
background-color: #;
color: #00ffba;
}
::-moz-selection {
background-color: #000;
color: #000;
}

ul{
list-style-type:square;
list-style-position:inside;
padding-left: 25px;
margin-top: 0px;
}

.more {
display: none;
margin-bottom: 0px;
}

img,
object {
max-width: 100%;
min-width: 100%;
-webkit-user-drag: none;
}

a {
text-decoration: none;
color: #b1b1b1;
opacity: 0.9;
}

a:hover {
font-weight: ;
text-decoration: ;
color: #fff;
font-weight: ;
opacity: 1;
cursor: url(images/finger.gif), auto;
}

/* main headings / titles in projects */
h1 {
margin-left: 0%;
margin-top: 2%;
margin-bottom: 3%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 2.5em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* information paragraphs */
h2 {
margin-left: 0%;
margin-right: 0%;
margin-top: 0em;
margin-bottom: 3%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 1.2em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* base page info */
h3 {
margin-left: 0%;
margin-top: 0%;
margin-bottom: 0%;
text-align: left;
color: #9c9c9c;
letter-spacing: 0.0em;
font-size: 0.9em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* small lastly */
h4 {
margin-left: 0%;
margin-top: 0%;
margin-bottom: 0%;
text-align: left;
color: #777;
letter-spacing: 0.0em;
font-size: .7em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* credits */
h5 {
margin-left: 0%;
margin-top: 0%;
margin-bottom: 0%;
text-align: left;
color: #9c9c9c;
letter-spacing: 0.0em;
font-size: 0.9em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* hamburger inner */
h6 {
margin-left: 0px;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
text-align: left;
color: #777;
letter-spacing: 0.0em;
font-size: 2.0em;
font-weight: 400;
font-style: ;
background-color: #;
text-transform: ;
}

/* project titles */
.h7{
margin-left: 0px;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0em;
font-size: 1.2em;
font-weight: 500;
font-style: ;
background-color: #;
text-transform: ;
}

/* unused */
.h8{
margin-left: 0px;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 0.9em;
font-weight: 400;
font-style: ;
background-color: #;
text-transform: ;
}

/* pather */
.h9{
left: auto;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 0.9em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* home large */
.h12 {
margin-left: 0%;
margin-top: 2%;
margin-bottom: 0%;
text-align: left;
color: #d94777;
letter-spacing: 0.0em;
font-size: 3.2em;
font-weight: 400;
line-height: 1.1;
background-color: #;
font-style: ;
text-transform: uppercase;
}

/* home headings / titles in projects */
.h10 {
margin-left: 0%;
margin-top: 0%;
margin-bottom: 3%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 2.9em;
font-weight: 400;
line-height: 1.1;
background-color: #;
font-style: ;
text-transform: uppercase;
}

/* home information paragraphs */
.h11 {
margin-left: 0%;
margin-right: 0%;
margin-top: 0em;
margin-bottom: 3%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 1.5em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* quotes */
.h13 {
margin-left: 0%;
margin-right: 0%;
margin-top: 0em;
margin-bottom: 2%;
text-align: left;
color: #fff;
letter-spacing: 0.0em;
font-size: 1.2em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}

/* below are some */
.h14 {
margin-left: 0%;
margin-top: 2%;
margin-bottom: 0%;
text-align: left;
color: #d94777;
letter-spacing: 0.0em;
font-size: 2.0em;
font-weight: 400;
line-height: 1.1;
background-color: #;
font-style: ;
text-transform: uppercase;
}

#page {
width: 100%;
margin: auto;
background-color: #;
}

#logo {
position: fixed;
z-index: 5;
width: 17%;
float: left;
margin-left: 5%;
margin-right: 0%;
margin-top: 3%;
margin-bottom: %;
background-color: #000;
}

#phaser1 {
position: fixed;
z-index: 3;
width: 5px;
float: left;
margin-left: 35%;
margin-right: 0%;
margin-top: 18%;
margin-bottom: %;
background-color: #;
}

#phaser2 {
position: fixed;
z-index: 3;
width: 15px;
float: left;
margin-left: 75%;
margin-right: 0%;
margin-top: 35%;
margin-bottom: %;
background-color: #;
}

#phaser3 {
position: fixed;
z-index: 3;
width: 35%;
float: left;
right: 15%;
bottom: 0px;
margin-right: auto;
margin-left: auto;
background-color: #;
}

#phaser6 {
position: fixed;
z-index: -1;
width: 35px;
float: left;
margin-left: 31%;
margin-right: 0%;
margin-top: 60%;
margin-bottom: %;
background-color: #;
}

#hero {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 1%;
background-color: #;
}

#heroin {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#fullon {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#fullblue {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 3%;
padding-top: 5%;
padding-bottom: 5%;
background-color: #00a2da;
}

#purehalf {
width: 50%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#purethird {
width: 33.3%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#thirdsies {
width: 29.3%;
float: left;
margin-left: 0%;
margin-right: 4%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#centrehalf {
width: 30%;
float: left;
margin-left: 35%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#infohalf {
width: 47%;
float: left;
margin-left: 0%;
margin-right: 3%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#pather {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#inner {
width: 90%;
float: right;
margin-left: 5%;
margin-right: 5%;
margin-top: 0%;
margin-bottom: 2%;
background-color: #;

    -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 2s; /* Firefox < 16 */
        -ms-animation: fadein 2s; /* Internet Explorer */
         -o-animation: fadein 2s; /* Opera < 12.1 */
            animation: fadein 2s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

#inner2 {
width: 85%;
float: right;
margin-left: 15%;
margin-right: 5%;
margin-top: 1%;
margin-bottom: 3%;
background-color: #;
}

#endtag {
width: 90%;
float: right;
margin-left: 5%;
margin-right: 5%;
margin-top: 6%;
margin-bottom: 10%;
background-color: #;
}

#fuor {
width: 30.2%;
float: left;
margin-left: 0%;
margin-right: 3%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#social {
width: 35px;
float: left;
margin-left: 0%;
margin-right: 3%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

.videoWrapper {
     position: relative;
     padding-bottom: 47.3%; /* 16:9 Aspect Ratio */
     height: 0;
     width: 100%; /* You can set this width to whatever suits your needs */
     margin: 0 auto;
}

.videoWrapper video {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

#navbar {
display: table;
position: fixed;
float: left;
z-index: 2;
width: 100%;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
padding-top: 0%;
background-color: #;
opacity: 0.95;
}

#menu {
width: 100%;
min-height: 100%;
margin-left: 0%;
margin-right: 0%;
margin-top: 0px;
padding-top: 0px;
padding-bottom: 20px;
float: right;
background-color: #;
}

/* the thing opening menu*/
#menuico {
width: 6.6%;
float: right;
margin-left: 0%;
margin-right: 5%;
margin-top: 3%;
margin-bottom: 0%;
background-color: #000;
}

#menuin {
width: 100%;
margin-left: 0%;
margin-right: 0%;
margin-top: 0px;
padding-bottom: 500%;
float: right;
background-color: #000;
opacity: ;
}

#box1 {
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 2%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

#box2 {
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 2%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

#box3 {
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 15%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

#box4 {
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
float: left;
background-color: #1f1f1f;
}

#box5 {
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 1%;
margin-bottom: 1%;
float: left;
background-color: #1f1f1f;
}

#box6 {
width: 90%;
height: 2px;
margin-left: 5%;
margin-right: 5%;
margin-top: 0%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

#gapdev {
display: none;
width: 100%;
height: 10%;
margin-top: 2%;
margin-bottom: 2%;
float: left;
background-color: #;
}

#gapdev2 {
display: none;
width: 100%;
height: 0%;
margin-top: 2%;
margin-bottom: 2%;
float: left;
background-color: #;
}

#null {
width: 100%;
float: left;
background-color: #;
}

#gap2 {
width: 100%;
height: 2%;
float: left;
background-color: #;
}

#gap5 {
width: 100%;
height: 5%;
float: left;
background-color: #;
}

#gap10 {
width: 100%;
height: 10%;
float: left;
background-color: #;
}

#gap15 {
width: 100%;
height: 15%;
float: left;
background-color: #;
}

#gap50 {
width: 100%;
height: 50%;
float: left;
background-color: #;
}

.embed-container {
z-index: 0;
position: relative;
padding-bottom: 56.25%; /* 16/9 ratio */
padding-top: 0px; /* IE6 workaround*/
height: 0;
overflow: hidden;
margin-top: 0%;
margin-bottom: 0%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

#slidespot {
width: 100%;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
float: left;
}

.sss {
height: 0;
margin: 0;
padding: 0;
position: relative;
display: block;
overflow: hidden;
}

.ssslide {
width: 100%;
margin: 0;
padding: 0;
position: absolute;
top: 0;
left: 0;
display: none;
overflow: hidden;
}

.ssslide img {
max-width: 100%;
height: auto;
margin: 0;
padding: 0;
position: relative;
display: block;
}

html {
overflow-y: scroll;
-webkit-text-size-adjust: 100%;
}



@media screen and (max-width: 700px)
{


#logo {
position: fixed;
z-index: 3;
width: 30%;
float: left;
margin-left: 5%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: %;
background-color: #000;
}

/* the thing opening menu*/
#menuico {
width: 15%;
float: right;
margin-left: 0%;
margin-right: 5%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #000;
}

#phaser5 {
display: none;
position: fixed;
z-index: 3;
width: 25%;
float: left;
right: 15%;
bottom: 0px;
margin-right: auto;
margin-left: auto;
background-color: #;
}

#inner2 {
width: 90%;
float: right;
margin-left: 5%;
margin-right: 5%;
margin-top: 1%;
margin-bottom: 3%;
background-color: #;
}

#purehalf {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#purethird {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#thirdsies {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 03%;
background-color: #;
}

#centrehalf {
width: 80%;
float: left;
margin-left: 10%;
margin-right: 10%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#infohalf {
width: 100%;
float: left;
margin-left: 0%;
margin-right: 0%;
margin-top: 0%;
margin-bottom: 0%;
background-color: #;
}

#fuor {
width: 47%;
float: left;
margin-left: 0%;
margin-right: 3%;
margin-top: 2%;
margin-bottom: 2%;
background-color: #;
}

#gapdev2 {
display: inline;
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 2%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

#box3 {
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 20%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

#gapdev {
display: inline;
width: 100%;
height: 2px;
margin-left: 0%;
margin-right: 0%;
margin-top: 2%;
margin-bottom: 2%;
float: left;
background-color: #1f1f1f;
}

/* home pink */
.h12 {
margin-left: 0%;
margin-top: 2%;
margin-bottom: 0%;
text-align: left;
color: #d94777;
letter-spacing: 0.0em;
font-size: 2.5em;
font-weight: 400;
line-height: 1.1;
background-color: #;
font-style: ;
text-transform: uppercase;
}

/* home headings / titles in projects */
.h10 {
margin-left: 0%;
margin-top: 0%;
margin-bottom: 3%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 2.5em;
font-weight: 400;
line-height: 1.1;
background-color: #;
font-style: ;
text-transform: ;
}

/* home information paragraphs */
.h11 {
margin-left: 0%;
margin-right: 0%;
margin-top: 0em;
margin-bottom: 3%;
text-align: left;
color: #b1b1b1;
letter-spacing: 0.0em;
font-size: 1.2em;
font-weight: 400;
background-color: #;
font-style: ;
text-transform: ;
}



}


@media screen and (max-width: 400px)
{





}