/* Welcome to Compass */
/* START MY SCSS - SASS */
html {
  font-size: 15px;
  line-height: 1.42857143;
  background-color: #000000; }

body {
  background-color: #000000;
  overflow-x: hidden;
  font-family: "Open Sans",Helvetica,Arial,sans-serif;
  animation: fadein 5s; }

@keyframes fadein {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }
p {
  font-size: 20px;
  line-height: 1.42857143;
  margin-bottom: 10.5px; }
  p .small {
    font-size: 16px; }

a {
  color: #5a67d0; }
  a:hover, a:focus, a:active, a.active {
    outline: 0;
    color: #ff8e07;
    text-decoration: none; }

h1, h2, h3, h4, h5, h6 {
  text-transform: uppercase;
  font-weight: 700;
  text-shadow: 1px 2px #666666; }

hr.leading {
  color: transparent;
  margin: 25px auto 30px;
  width: 0;
  size: 0; }

header {
  color: #000000;
  background: #ffffff url(/img/bg_header-home.jpg) no-repeat top left;
  height: 1289px; }
  header .container {
    padding-top: 50px;
    padding-bottom: 50px; }
  header .easternshore {
    color: #ffffff; }

/* * */
/* mike */
/* * */
header .intro-text div {
  padding: 0.5em 1em;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.5); }
header .intro-text img {
  width: 250px;
  padding-right: 1em; }
header .intro-text p {
  text-align: left;
  text-shadow: 0 2px 3px #000000;
  line-height: 1.4em;
  padding-top: 1.5em; }
header .intro-text h1 {
  color: #ffffff;
  text-shadow: 0 2px 3px #000000;
  font-size: 25px; }
  header .intro-text h1#mytitle {
    position: relative;
    display: inline-block; }

.clickable {
  cursor: pointer; }

.big-icon {
  font-size: 6em !important;
  color: #1429c5;
  text-shadow: 0 1px 0 #000000; }

.medium-icon {
  font-size: 5em !important;
  color: #ffd565;
  text-shadow: 0 1px 0 #000000; }

a .fa:hover {
  background-color: #ffd565;
  border-radius: 5px;
  color: #1429c5; }

.fa-text {
  padding-right: .5em; }

.img-centered {
  margin: 0 auto; }

.divider {
  margin: -.5em auto 1em;
  width: 20%;
  border-bottom: 5px solid #ffd565;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  font-size: 1em; }

.header-hero {
  margin-top: 1em;
  text-align: center;
  position: relative;
  display: inline-block;
  padding: 0.5em 1em;
  background-color: rgba(0, 0, 0, 0.2);
  overflow: hidden; }
  .header-hero ul.list-inline {
    display: inline-block;
    margin-left: 1em; }
    .header-hero ul.list-inline i {
      width: inherit;
      min-width: 75px;
      min-height: 75px; }
  .header-hero .easternshore {
    display: none;
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: 1em;
    padding-right: 1em; }
  .header-hero #caption-text {
    display: none;
    position: absolute;
    bottom: 2.5em;
    left: 50%;
    color: #ffd565;
    font-size: 1.625em;
    text-shadow: 1px 1px #000000; }
  .header-hero img {
    width: 150px; }

.flip-container {
  text-align: center; }
  .flip-container .flipthis {
    border: 1px solid #cccccc;
    background-color: #ffffff;
    color: #666666;
    display: inline-block;
    margin-bottom: 1em; }
  .flip-container .flip-content {
    padding: 1em 3em 1em 1em;
    text-align: left; }

.skills-btn-group {
  margin-bottom: 1em; }

/* * */
/* end mike */
/* * */
@media (min-width: 992px) {
  .header-hero {
    margin-left: 5%; }

  .modal-right {
    padding-top: 1em;
    min-height: 925px; }

  img {
    width: 100%; } }
@media (max-width: 992px) {
  .myboat img {
    float: none; }
  .myboat ul.mycontacts {
    transform: inherit; } }
@media (min-width: 768px) {
  header .container {
    padding-top: 100px;
    padding-bottom: 100px; }
  header .intro-text h1 {
    font-size: 39px; }
  header .header-hero .easternshore {
    display: inherit; }
  header .header-hero #caption-text {
    display: inherit; }
  header .header-hero img {
    width: 225px; } }
@media (min-width: 768px) {
  .navbar-fixed-top {
    padding: 5px 0;
    -webkit-transition: padding .3s;
    -moz-transition: padding .3s;
    transition: padding .3s;
    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#005090), to(#22C0F4));
    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(top, #005090, #22C0F4);
    background: linear-gradient(to bottom, #005090 0%, #22C0F4 100%) repeat scroll 0% 0% #22C0F4; }

  .navbar-fixed-top .navbar-brand {
    font-size: 1.5em;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
    text-shadow: 0 1px 2px #666666; }

  .navbar-fixed-top.navbar-shrink {
    padding: 5px 0; }

  .navbar-fixed-top.navbar-shrink .navbar-brand {
    font-size: 1.2em; } }
/* START BOOTSTRAP OVER-RIDE */
.nav .tooltip {
  background: transparent;
  font-size: 1em; }

.nav .tooltip-inner {
  background: #0769A6;
  color: #ffffff;
  border: 2px solid #ffd565;
  box-shadow: 1px 1px 5px #000000;
  text-align: left; }

.nav .tooltip.in {
  opacity: 1; }

.scoreHR {
  margin: 0.5em 1em 0.5em 0; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Open Sans",Helvetica,Arial,sans-serif; }

.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
  color: #ffd565;
  background-color: transparent; }

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #ffd565;
  background-color: transparent;
  cursor: pointer; }

.navbar-default .navbar-nav > li.scoreLink > a.dingding {
  color: #ffd565;
  text-decoration: normal;
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
  white-space: pre;
  animation: myblur .75s ease-out 2; }

@keyframes myblur {
  from {
    text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff,  0px 0px 25px #fff, 0px 0px 25px #fff, 0px 0px 25px #fff, 0px 0px 25px #fff, 0px 0px 25px #fff, 0px 0px 25px #fff, 0px 0px 50px #fff, 0px 0px 50px #fff, 0px 0px 50px #7B96B8, 0px 0px 150px #7B96B8, 0px 10px 100px #7B96B8, 0px 10px 100px #7B96B8, 0px 10px 100px #7B96B8, 0px 10px 100px #7B96B8, 0px -10px 100px #7B96B8, 0px -10px 100px #7B96B8; } }
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #ffd565;
  background-color: transparent; }

.navbar-default .navbar-nav > li > a {
  color: #ffffff;
  text-shadow: 1px 1px 0 #000000; }

.img-responsive {
  border: 1px solid #ccc; }

/* END BOOTSTRAP OVER-RIDE */
.navbar {
  text-transform: uppercase;
  font-weight: 700; }
  .navbar a:focus {
    outline: 0; }
  .navbar .navbar-nav {
    letter-spacing: 1px; }
    .navbar .navbar-nav li a:focus {
      outline: 0; }
  .navbar .navbar-default,
  .navbar .navbar-inverse {
    border: 0; }

section {
  padding: 100px 0 50px; }
  section h2 {
    margin: 0;
    font-size: 3em; }
  section .success {
    color: #ffffff;
    background: #ff8e07; }
  section .success a:hover, section .success a:focus, section .success a:active,
  section .success a .active {
    outline: 0;
    color: #5a67d0; }
  section#contact p {
    padding-left: 0; }
  section#portfolio {
    color: #666666;
    background: #ffffff; }
    section#portfolio img {
      box-shadow: 0 3px 25px #000; }
    section#portfolio h2 {
      color: #0780bb;
      text-shadow: 1px 2px #cccccc; }
    section#portfolio .grid {
      margin-top: 2em; }
  section#contact {
    color: #ffffff;
    background-color: #8155cf;
    padding-bottom: 2em; }
  section#about {
    color: #ffffff;
    background-color: #efefef; }
    section#about h2 {
      color: #0780bb;
      text-shadow: 1px 2px #cccccc; }
    section#about h3 {
      color: #0780bb;
      text-shadow: inherit; }
    section#about .about-footer {
      color: #666666; }

.secondary a {
  color: #ffd565; }
  .secondary a:hover, .secondary a:focus, .secondary a:active {
    outline: 0;
    color: #ff8e07; }

@media (max-width: 767px) {
  section {
    padding: 100px 0 2em; }

  section.first {
    padding-top: 75px; } }
#portfolio .grid-item .grid-item-content {
  height: 150px; }
  #portfolio .grid-item .grid-item-content .fa:hover {
    color: #ffffff;
    background-color: transparent; }
#portfolio .grid-item .portfolio-link {
  display: block;
  position: relative;
  margin: 0 auto;
  max-width: 400px;
  cursor: pointer; }
  #portfolio .grid-item .portfolio-link .caption {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(255, 142, 7, 0.9);
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s; }
    #portfolio .grid-item .portfolio-link .caption:hover {
      opacity: 1; }
  #portfolio .grid-item .portfolio-link .caption-content {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 20px;
    margin-top: -12px;
    text-align: center;
    font-size: 20px;
    color: #ffffff; }
    #portfolio .grid-item .portfolio-link .caption-content i {
      margin-top: -12px; }
    #portfolio .grid-item .portfolio-link .caption-content h3,
    #portfolio .grid-item .portfolio-link .caption-content .h4 {
      margin: 0; }

#portfolio * {
  z-index: 2; }

#portfolio .caption,
#portfolio img {
  border-radius: 50%;
  border: 3px solid #ffffff; }

/* ********************** REMOVE THIS
@media(min-width:767px) {
    #portfolio .portfolio-item {
        margin: 0 0 30px;
    }
}
*/
.btn-outline {
  margin-top: 15px;
  border: solid 2px #0780bb;
  font-size: 20px;
  color: #ffffff;
  background: 0 0;
  background-color: #ff8e07;
  transition: all .3s ease-in-out; }
  .btn-outline:hover, .btn-outline:focus, .btn-outline:active,
  .btn-outline .active {
    border: solid 2px #ffffff;
    color: #ffffff;
    background: #1429c5; }

.floating-label-form-group {
  position: relative;
  margin-bottom: 0;
  padding-bottom: .5em;
  border-bottom: 1px solid #eee; }

.floating-label-form-group input,
.floating-label-form-group textarea {
  z-index: 1;
  position: relative;
  padding-right: 0;
  padding-left: 0;
  border: 0;
  border-radius: 0;
  font-size: 1.5em;
  background: 0 0;
  box-shadow: none !important;
  resize: none; }

.floating-label-form-group label {
  display: block;
  z-index: 0;
  position: relative;
  top: 2em;
  margin: 0;
  font-size: .85em;
  line-height: 1.764705882em;
  vertical-align: middle;
  vertical-align: baseline;
  opacity: 0;
  -webkit-transition: top .3s ease,opacity .3s ease;
  -moz-transition: top .3s ease,opacity .3s ease;
  -ms-transition: top .3s ease,opacity .3s ease;
  transition: top .3s ease,opacity .3s ease; }

/* SCSS SEES THIS AS AN ERROR .floating-label-form-group::not(:first-child) { */
.floating-label-form-group::not(first-child) {
  padding-left: 14px;
  border-left: 1px solid #eee; }

.floating-label-form-group-with-value label {
  top: 0;
  opacity: 1; }

.floating-label-form-group-with-focus label {
  color: #ff8e07; }

form .row:first-child .floating-label-form-group {
  border-top: 1px solid #eee; }

footer {
  color: #ffffff; }
  footer h3 {
    margin-bottom: 30px; }
  footer .footer-above {
    padding-top: 50px;
    background-color: #2c3e50; }
  footer .footer-col {
    margin-bottom: 50px; }
  footer .footer-below {
    padding: 25px 0;
    background-color: #233140; }

.btn-social {
  display: inline-block;
  border: 2px solid #ffffff;
  border-radius: 100%;
  text-align: center;
  font-size: 4em;
  line-height: 45px; }
  .btn-social:focus, .btn-social:active,
  .btn-social .active {
    outline: 0; }

.scroll-top {
  z-index: 1049;
  position: fixed;
  right: 2%;
  bottom: 2%;
  width: 50px;
  height: 50px; }
  .scroll-top .btn {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 28px; }
    .scroll-top .btn:focus {
      outline: 0; }

/* Over-ride Bootstrap */
.modal {
  background: #ffffff url(/img/loading-blue.gif) no-repeat;
  background-position: center;
  /*
  max-height: 75%;
  margin-top: 10%;
  margin-left: 10%;
  width: 80%;
  */
  margin: 1%; }
  .modal .fade {
    transition: opacity 1s linear; }
  .modal .modal-body {
    padding: 0;
    margin-top: 0; }

.modal-clear {
  background-image: none; }

@media (min-width: 1200px) {
  .container {
    width: inherit; } }
@media (min-width: 992px) {
  .container {
    width: inherit; } }
@media (min-width: 768px) {
  .container {
    width: inherit; } }
/* End Bootstrap over-ride */
.portfolio-modal .modal-content {
  border: 0;
  border-radius: 0;
  text-align: center;
  background-clip: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
  background-color: #ffffff;
  color: #666666; }
  .portfolio-modal .modal-content button:first-child {
    float: left;
    margin-bottom: 1em; }
  .portfolio-modal .modal-content h2 {
    margin: 0;
    font-size: 2em;
    color: #0780bb;
    text-shadow: 0 0 transparent; }
  .portfolio-modal .modal-content img {
    margin-bottom: 30px; }
  .portfolio-modal .modal-content .container {
    padding-right: 0; }
  .portfolio-modal .modal-content .item-details {
    margin: 30px 0; }
  .portfolio-modal .modal-content .modal-right .modal-right-caption {
    margin: 1em 0 2em; }

.portfolio-modal .close-modal {
  cursor: pointer; }

.portfolio-modal .modal-backdrop {
  display: none;
  opacity: 0; }

/*
    START ANIMATIONS
*/
/* SPINNER */
@-webkit-keyframes spinner {
  from {
    -webkit-transform: rotateY(0deg); }
  to {
    -webkit-transform: rotateY(-360deg); } }
@keyframes spinner {
  from {
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg); }
  to {
    -moz-transform: rotateY(-360deg);
    -ms-transform: rotateY(-360deg);
    transform: rotateY(-360deg); } }
.header-hero {
  -webkit-perspective: 1200px;
  -moz-perspective: 1200px;
  -ms-perspective: 1200px;
  perspective: 1200px; }

.ani-spinner:hover {
  -webkit-animation-name: spinner;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  animation-name: spinner;
  animation-timing-function: linear;
  animation-iteration-count: 1;
  animation-duration: 1s;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d; }

/* END SPINNER */
/* SCALES */
@-webkit-keyframes scaleDown {
  to {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0; } }
@keyframes scaleDown {
  to {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0; } }
.ani-scaledown {
  -webkit-animation: scaleDown .7s ease both;
  -moz-animation: scaleDown .7s ease both;
  -ms-animation: scaleDown .7s ease both;
  animation: scaleDown .7s ease both; }

@-webkit-keyframes scaleUp {
  from {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0; }
  to {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }
@keyframes scaleUp {
  from {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0; }
  to {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1; } }
.ani-scaleup {
  -webkit-animation: scaleUp .7s ease both;
  -moz-animation: scaleUp .7s ease both;
  -ms-animation: scaleUp .7s ease both;
  animation: scaleUp .7s ease both; }

/* END SCALES */
/* CUBES */
@-webkit-keyframes rotateCubeLeftIn {
  0% {
    -webkit-transform: translateX(100%) rotateY(90deg);
    -moz-transform: translateX(100%) rotateY(90deg);
    -ms-transform: translateX(100%) rotateY(90deg);
    transform: translateX(100%) rotateY(90deg);
    opacity: .3; }
  50% {
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -ms-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -moz-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -ms-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -transform: translateX(50%) translateZ(-200px) rotateY(45deg); } }
@keyframes rotateCubeLeftIn {
  0% {
    -webkit-transform: translateX(100%) rotateY(90deg);
    -moz-transform: translateX(100%) rotateY(90deg);
    -ms-transform: translateX(100%) rotateY(90deg);
    transform: translateX(100%) rotateY(90deg);
    opacity: .3; }
  50% {
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -ms-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -moz-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -ms-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    transform: translateX(50%) translateZ(-200px) rotateY(45deg); } }
.ani-rotatecubeleftin {
  -webkit-animation-name: rotateCubeLeftIn;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  -moz-animation-name: rotateCubeLeftIn;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: 1;
  -moz-animation-duration: 1s;
  -ms-animation-name: rotateCubeLeftIn;
  -ms-animation-timing-function: linear;
  -ms-animation-iteration-count: 1;
  -ms-animation-duration: 1s;
  animation-name: rotateCubeLeftIn;
  animation-timing-function: linear;
  animation-iteration-count: 1;
  animation-duration: 1s; }

@-webkit-keyframes rotateCubeRightOut {
  50% {
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -ms-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -moz-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -ms-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    transform: translateX(50%) translateZ(-200px) rotateY(45deg); }
  100% {
    -webkit-transform: translateX(100%) rotateY(90deg);
    -moz-transform: translateX(100%) rotateY(90deg);
    -ms-transform: translateX(100%) rotateY(90deg);
    transform: translateX(100%) rotateY(90deg);
    opacity: .3; } }
@keyframes rotateCubeRightOut {
  50% {
    -webkit-animation-timing-function: ease-out;
    -moz-animation-timing-function: ease-out;
    -ms-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -moz-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    -ms-transform: translateX(50%) translateZ(-200px) rotateY(45deg);
    transform: translateX(50%) translateZ(-200px) rotateY(45deg); }
  100% {
    -webkit-transform: translateX(100%) rotateY(90deg);
    -moz-transform: translateX(100%) rotateY(90deg);
    -ms-transform: translateX(100%) rotateY(90deg);
    transform: translateX(100%) rotateY(90deg);
    opacity: .3; } }
.ani-rotatecuberightout {
  -webkit-animation-name: rotateCubeRightOut;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-duration: 1s;
  -moz-animation-name: rotateCubeRightOut;
  -moz-animation-timing-function: linear;
  -moz-animation-iteration-count: 1;
  -moz-animation-duration: 1s;
  -ms-animation-name: rotateCubeRightOut;
  -ms-animation-timing-function: linear;
  -ms-animation-iteration-count: 1;
  -ms-animation-duration: 1s;
  animation-name: rotateCubeRightOut;
  animation-timing-function: linear;
  animation-iteration-count: 1;
  animation-duration: 1s; }

/* END CUBES */
/*
    END ANIMATIONS
*/

/*# sourceMappingURL=screen.css.map */
