/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
@font-face {
    font-family: 'impactreg';
    src: url('../fonts/impactreg.eot');
    src: local('impactreg'), url('../fonts/impactreg.woff') format('woff'), url('../fonts/impactreg.ttf') format('truetype');
}


html {
    color: #222;
    background-color: #red;
    font-size: 1em;
    line-height: 1.4;
    margin-left: 0;
    margin-right: 0;
    overflow:hidden;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}


hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

ul {-webkit-padding-start:0px;}

/* ===== Initializr Styles ==================================================
   Author: Jonathan Verrecchia - verekia.com/initializr/responsive-template
   ========================================================================== */

body {
    font: 16px/26px 'impactreg', Helvetica Neue, Arial;
    font-kerning: normal;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: red;
}

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

.whitebg {
    background-color: white;
}

.line1 {
    font-size:15vw;
    text-align: right;
    margin-right:10px;
    letter-spacing: 0.75vw;
    margin:20vw 10vw 0 0;
}

.line2 {
    font-size:3.5vw;
    text-align: right;
    margin-right:10px;
    letter-spacing: 2px;
    margin:9vw 10vw 0 0;
}

.portLinks {
    font-size:6vw;
    text-align: right;
    margin-right:10px;
    letter-spacing: 2px;
    margin-top: 20;
    margin-right:10vw;
    text-transform: uppercase;
}

.title {
    width:100%;
    font-size:4vw;
    text-align: right;
    margin-right:10px;
    margin-bottom:10px;
    letter-spacing: 2px;

    text-transform: uppercase;
}

.pLink a{font-color:black;}

.pLink a hover {
    font-color:red;
}

.tight {
    font-size:3.1vw;
}

.blacktext {
    color:#000;
   
}

.whitetext {
    color:#fff;
}

.redtext {
    color:red;
}

.header {
    margin-top: 15vh;
    padding-bottom: 3vh;
}

#portRight {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4vw 0 4vw 6vw;
    border-color: transparent transparent transparent red;
    float:right;
    position:relative;
    padding-right:4vw;
    margin-bottom:5vh;

}

#portLeft {
    width: 0;
    height: 0;
    border-style: solid;
    border-width:  4vw 6vw 4vw 0;
    border-color: transparent red transparent transparent;
    float:left;
    margin-left:50vw;
    left: 3px;
    position:relative;
}

a .portTxt {
    font-family:'Helvetica Neue', 'Lucida Grande', sans-serif;
    font-size:11px;
    line-height: 13px;
    font-weight: bold;
    margin:4px;
}

#f1Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4vw 0 4vw 6vw;
    border-color: transparent transparent transparent white;
    right:0vw;
    top: 18vw;
    position:absolute;
    padding-right:4px;
}

#f2Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6vw 4vw 0 4vw;
    border-color: red transparent transparent transparent;
    right:12vw;
    position:absolute;
    bottom: 3px;
}

#f3Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width:  4vw 6vw 4vw 0;
    border-color: transparent white transparent transparent;
    left: 3px;
    position:absolute;
    top: 18vw;
}

#f4Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width:  0 4vw 6vw 4vw;
    border-color: transparent  transparent red transparent;
    left: 10vw;
    position:absolute;
    top: 3px;
}


#f5Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width:  0 4vw 6vw 4vw;
    border-color: transparent  transparent white transparent;
    left: 10vw;
    position:absolute;
    top: 3px;
}

#f6Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width:  4vw 6vw 4vw 0;
    border-color: transparent red transparent transparent;
    right:1vw;
    top: 8vw;
    position:absolute;
    padding-right:4px;
}

#f7Triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width:  0 3vw 5vw 3vw;
    border-color: transparent  transparent red transparent;
    left: 25vw;
    position:absolute;
    top: 3px;
}




#slider {
    width:100vw;
    height:100vh;
    
    margin:0;
}
            
            #slider li { list-style:none; }
            
            #page {
                width:100vw;
                height:100vh;
                background-color: red;
                float:left;
                display:none;
            }

.fadein{visibility: hidden;}


.frame {position:absolute; float:left;  width:100%; height:100%; margin-right:10px;}

.portFrame {
    width:100%; 
    height:100%;
     margin-top:5%;
                margin-bottom:5%;
}
#rhino-item0 {
    background-color: red;
    color: black;
}

#rhino-item1 {
    background-color: white;
    color: black;
}

#rhino-item1 .line2 {
    font-size:3.1vw;

}

#rhino-item2 {
    background-color: black;
    color: white;
}

#rhino-item2 .line2 {
    font-size:3.1vw;

}

#rhino-item3 {
    background-color: white;
    color: black;
}

#rhino-item4 {
    background-color: red;
    color: black;
}

#rhino-item5 {
    background-color: black;
    color: white;
}

.email {
    text-decoration:none;
    color: white;
}

.hamburger{
  background:none;
  position:absolute;
  top:0;
  right:0;
  line-height:45px;
  padding:5px 15px 0px 15px;
  color:#fff;
  border:0;
  font-size:1.4em;
  font-weight:bold;
  cursor:pointer;
  outline:none;
  z-index:10000000000000;
}
.cross{
  background:none;
  position:absolute;
  top:0px;
  right:0;
  padding:13px 15px 0px 15px;
  color:#fff;
  border:0;
  font-size:3em;
  line-height:65px;
  font-weight:bold;
  cursor:pointer;
  outline:none;
  z-index:10000000000000;
}

.menu{
    z-index:1000000; 
    foth-weight:200;
    font-size:1.5em; 
    width:100%; 
    background:#131313;  
    position:absolute; 
    text-align:center;
}
.menu ul {
    margin: 0; 
    padding: 0; 
    list-style-type: none; 
    list-style-image: none;
}
.menu li {
    display: block;   
    padding:15px 0 15px 0; 
    border-bottom:#1d1f20 1px solid;
}
.menu li:hover{
    display: block;    
    background:#181818; 
    padding:15px 0 15px 0; 
    border-bottom:#1d1f20 1px solid;
}
.menu ul li a { 
    text-decoration:none;  
    margin: 0px; 
    color:#fff;
}
.menu ul li a:hover {  
    color: #fff; 
    text-decoration:none;
}
.menu a{
    text-decoration:none; 
    color:white;
}
.menu a:hover{
    text-decoration:none; 
    color:white;
}