img { 

  -webkit-user-select: none; /* For Chrome/Safari */

  -moz-user-select: none;  /* For Firefox */

  -ms-user-select: none;   /* For IE 10+ */

  user-select: none;       /* General fallback */

  -webkit-touch-callout: none; /* Disable tap-and-hold on iOS */

  -moz-user-select: none; 

  -ms-user-select: none; 

  user-select: none; 

}

.no-right-click {
    pointer-events: none;
}

::-moz-selection {
    background: #000000;
    color: #ccccff;
    text-shadow: none;
}

::selection {
    background: #000000;
    color: #ccccff;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

 hr {
    display: block;
    height: 1px;
    border: 0;
    margin: 1em 0;
    padding: 0;
}

.centered {
	text-align: center
}

.mt {
	margin-top: 80px;
}

.mb {
	margin-bottom: 80px;
}

/* ==========================================================================
   General styles
   ========================================================================== */

img {
  width: 100%;
  max-width: 300px;
  height: auto;
  object-fit: cover;
  object-position: bottom;
}

iframe {
  width: 100%;
  max-width: 300px;
  height: auto;
  object-fit: cover;
  object-position: bottom;
}

body {
    font-family: Arial, sans-serif;
    font-weight: 400;
    font-size: calc(16px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
    line-height: calc(1.3em + (1.5 - 1.2) * ((100vw - 300px)/(1600 - 300)));
    color: #000000;
	
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
}


h1 {
	font-weight: 700;
	font-size: calc(24px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
	color:#000000;
	padding-top: 0px;
	padding-bottom: 0px;
	letter-spacing: 2px;
  	text-shadow: 2px 2px #ccccff;

}

h2 {
    	font-weight: 700;
    	color: #000000;
	font-size: calc(18px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
	padding-top: 0px;
  	text-shadow: 1px 1px #ccccff;
	text-align: left;
}

h3 {
    	font-weight: 700;
    	color: #000000;
	font-size: calc(18px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
	padding-top: 0px;
  	text-shadow: 1px 1px #ccccff;
	text-align: center;
}

h4 {
    	color: #000000;
	padding-top: 0px;
	padding-bottom: 20px;
	font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
	text-align: left;
}

h5 {
	font-weight: 700;
	font-size: calc(24px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
	color:#000000;
	padding-top: 0px;
	padding-bottom: 0px;
	letter-spacing: 2px;
  	text-shadow: 2px 2px #ccccff;
}

h6 {
    	color: #000000;
	padding-top: 0px;
	padding-bottom: 0px;
	font-size: calc(14px + (24 - 14) * ((100vw - 300px) / (1600 - 300)));
	text-align: center;
}

/* ==========================================================================
   Navbar stuff
   ========================================================================== */

.navbar-brand {
	font-weight: 400;
  	font-size: calc(18px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));

}

.navbar-default .navbar-brand, .navbar-default .navbar-brand:hover {
	color: #000000;
}

.navbar-default {
	border-color: #000000;
  background-color: #ffffff;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
	color: #000000;
        font-weight:bold;
	background-color: #ffffff;
}

.navbar-default .navbar-nav > li > a {
	color: #636363;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
	color: #000000;
        text-decoration:underline;
}

.navbar-default .navbar-toggle {
  border: none;
  border-color: #000000;
}

.navbar-default .navbar-toggle:hover {
  background: #ffffff;
}

.navbar-default .navbar-toggle .icon-bar {
  background-color: #000000;
}

/* ==========================================================================
   Buttons and drop caps etc
   ========================================================================== */

.button {
  background: linear-gradient(45deg,#000000,#ccccff);
  border: 1px solid #000000;
  border-radius: 12px;
  color: #ffffcc;
  padding: 1px 4px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
  cursor: pointer;
}
.button:hover {
  background: linear-gradient(45deg,#000000,#999999);
  border: 1px solid #00ffff;
  border-radius: 12px;
  color: #00ffff;
  padding: 1px 4px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));
  cursor: pointer;
}

#TopBtn {
  display: none;
  position: fixed;
  bottom: 6vw;
  right: 5vw;
  z-index: 99;
  font-size: 12;
  font-weight: 700;
  border: 1px solid #000000;
  outline: none;
  background: linear-gradient(45deg,#000000,#ccccff);
  color: #ffffcc;
  cursor: pointer;
  padding: 1vw;
  border-radius: 50px;
}

#TopBtn:hover {
  background: linear-gradient(45deg,#000000,#999999);
  border: 1px solid #00ffff;
  color: #00ffff
}

.span {
  float: left;
  padding: 3px;
  font-size: 400%;
  font-family: Arial, sans-serif;
  line-height: 65%;
}

.padded-dropcap {
  float: left;
  padding: 3px;
  font-size: 400%;
  font-family: Arial, sans-serif;
  line-height: 45%;
}


/* ==========================================================================
   Wrap Sections
   ========================================================================== */

#headerwrap {
	background: url(img/abovebelow1.jpg) no-repeat center top;
	margin-top: -90px;
	padding-top: 200px;
	text-align:center;
	background-position: center center;
	min-height: 550px;
	width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}

#bioheaderwrap {
	background: url(img/abovebelow1.jpg) no-repeat center top;
	margin-top: -90px;
	padding-top: 200px;
	text-align:center;
	background-position: center center;
	min-height: 550px;
	width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}

#contactheaderwrap {
	background: url(img/abovebelow1.jpg) no-repeat center top;
	margin-top: -90px;
	padding-top: 200px;
	text-align:center;
	background-position: center center;
	min-height: 550px;
	width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}

#projectsheaderwrap {
	background: url(img/abovebelow1.jpg) no-repeat center top;
	margin-top: -90px;
	padding-top: 200px;
	text-align:center;
	background-position: center center;
	min-height: 550px;
	width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}

#headerwrap h4 {
	font-weight: 400;
	color: #000000
}

@media (max-width: 768px) {
  #headerwrap {
    padding-top: 180px;
  }
}





#footerwrap {
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #000000;
}

#footerwrap p {
	color: #000000;
	margin-left: 10px;
}


@-webkit-keyframes animate-loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes animate-loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/* Copyrights */

#copyrights {
  background: #ffffff;
  padding: 10px 0;
  text-align: center;
}

#copyrights p {
  margin-bottom: 5px;
  color: #000000;
  font-size: 14px;
}

#copyrights a {
  color: #000000;
}