body,html{
	margin:0;
	padding:0;
	background-color:#0c151c;
}

header{
    width:100%;
	height:70px;
	background-color:#282828;
	border-bottom:5px solid rgba(0, 166, 255,0.6);
}

h1#logo{
   position:absolute;
   padding:3px 3px 3px 0px;
   float:left;
   margin-left:20px;
   margin-top:5px;	
   font-family: 'Oswald', sans-serif;
   color:#ffffff;
}

ul#navbar{
   max-width:auto;
   min-width: 700px;
   position:relative;
   float:right;
   margin-top:3px;
   margin-right:100px;
  }

nav{
	 display:inline;
}

li{
   display:inline-block;
   padding:15px 32px;

}

a.nav{
   text-align:center;
   color:#ffffff;
   text-decoration:none;   
   font-size:22px;
   font-family: 'Open Sans', sans-serif;
	
}

a#current{
   color:#00a6ff; 
}

a.nav:hover{
   color:#00a6ff;
   transition:0.5s; 
}

a#logo{
	text-decoration:none; 
}

img#logo{
	display:inline-block;
	padding:6px 0px 3px 100px;
}


i{
    margin:0px 10px 0px -3px;
    font-size:18px;
}


div.main_body{
   width: 1430px;
   height:auto;
   padding-top:1px;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:auto;
   background-image:url('bg.png');
   background-repeat:repeat-y;
   -webkit-box-shadow:0px 15px 31px 10px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
   box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
}

div.main_body_white{
   width: 1430px;
   height:auto;
   padding-top:1px;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:auto;
   background-color:#ffffff;
   background-repeat:repeat-y;
   -webkit-box-shadow:0px 15px 31px 10px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
   box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
}

h1.large_heading{
   font-family: 'Bangers', cursive;
   color:#ffffff;
   letter-spacing:3px;
   text-shadow:-3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000;
   font-size:50px;
   padding-top:15px;
   padding-bottom:10px;
   margin-left:120px
}

h1#bio.large_heading{
   font-family: 'Bangers', cursive;
   color:#ffffff;
   letter-spacing:3px;
   text-shadow:-3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000;
   font-size:50px;
   padding-top:15px;
   margin-bottom:-10px;
   margin-left:120px
}

h1.const_head{
   font-family: 'Bangers', cursive;
   color:#ffffff;
   display:block;
   letter-spacing:3px;
   text-shadow:-3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000;
   font-size:80px;
   padding-top:15px;
	
}


iframe#recent_video{
	 margin-left:350px;
	 margin-bottom:75px;
	 
}

div.bottom_body{
   border-top:7px solid #0071b8;
   width: 1430px;
   height:auto;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:auto;
   background-color:#ffffff;
   -webkit-box-shadow:0px 15px 31px 10px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
   box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
}

.video{
	 margin-left:350px;
	 margin-bottom:75px;
	
	
}

p#subheading{
	 font-family: 'Open Sans', sans-serif;
	 margin-left:350px;
	 margin-bottom:45px;
	 
		
}

div.videosbyside{
	 margin-left:125px;
	 margin-right:125px;
	 position:relative;
	 padding-bottom:15%; 
}

iframe.video1{
	float: left;
    padding-right:40px;
	padding-bottom:3px;
	padding-top:3px;
    box-sizing:border-box;
}

iframe.video2{
	float: center;
    padding-right:40px;
	padding-bottom:3px;
	padding-top:3px;
    box-sizing:border-box;
}

iframe.video3{
	float: center;
    padding-right:40px;
	padding-bottom:3px;
	padding-top:3px;
    box-sizing:border-box;
}

footer{
	padding: 2px;
	margin-top: 0px;
	color: #ffffff; 
	background-color: #0071b8; 
	text-align: center; 
	font-family: 'Open Sans', sans-serif;

}


ul#bottom_nav{
	width:auto;
}


ul#bottom_nav li a i{
	font-size:24px;
	color:#ffffff; 
}

p#bio{
	margin-left:120px;
	margin-right:120px;
	font-family: 'Open Sans', sans-serif;
	color:#000000; 
	font-size:24px;
    display: inline-block;
	text-align:center;
}

img#aboutpic{
	height:375px;
	width:375px;
    display: block;
    margin-left: auto;
    margin-right: auto;
	padding-bottom: 50px;
	
}

dl.pcspecs{
    font-family: 'Open Sans', sans-serif;
    margin-left: 100px;
    margin-right: 45px;
    padding-top: 5px;
	padding-bottom: 103px;
}

.pcspecs dt{
    font-weight: 900;
    margin-bottom:5px;
    margin-top:30px;
    font-size:20px;

}

.pcspecs dd{
   font-size:18px;
   padding-bottom:18px;


}

p#PC_spec_desc{
	font-family: 'Open Sans', sans-serif;
	font-size:25px;
    margin-left: 120px;
	margin-right: 120px;
    padding-top: 10px;
	text-align: center;
	display: inline-block;
}

.twitter-timeline{
	margin-left:350px;
	display: inline-block;
}

div.bottom_body_colour{
   width: 1430px;
   height:auto;
   padding-top:1px;
   margin-left:auto;
   margin-right:auto;
   margin-bottom:auto;
   background-image:url('bg.png');
   background-repeat:repeat-y;
   -webkit-box-shadow:0px 15px 31px 10px rgba(0,0,0,0.75);
   -moz-box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
   box-shadow: 0px 15px 31px 10px rgba(0,0,0,0.75);
   border-top:7px solid #0071b8;
}




.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

.tooltip .tooltiptext2 {
  visibility: hidden;
  width: auto;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: -5px;
  left: 150%;
}


.tooltip:hover .tooltiptext{
  visibility: visible;
}

.tooltip:hover .tooltiptext2 {
  visibility: visible;
}
.tooltip .tooltiptext2::after {
  content: " ";
  position: absolute;
  top: 5%;
  right: 100%; /* To the left of the tooltip */
  margin-top: -5px;
  border-width: 10px;
  border-style: solid;
  border-color: transparent black transparent transparent;
}

.tooltip .tooltiptext {
  width: 120px;
  bottom: 100%;
  left: 50%;
  margin-left: -60px; /* Use half of the width (120/2 = 60), to center the tooltip */
}

.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  left: 45%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}