/* Styles for McGhie.co.nz, created by Sam McGhie 2016 */

* {
  -webkit-border-radius: 0 !important;
          border-radius: 0 !important;
}

body {
	background-color: #2E6A8F;
}

#profilePic {
	opacity: 0;
	padding: 20px 0px 0px 80px;
	
    -webkit-animation-name: easeIn;
    -webkit-animation-duration: 0.8s;
    -webkit-animation-delay: 1.6s;
    -webkit-animation-fill-mode: forwards;
    
    animation-name: easeIn;
    animation-duration: 0.8s;
    animation-delay: 1.6s;
    animation-fill-mode: forwards;  
}

#mainTitle {
	opacity: 0;
	
    -webkit-animation-name: fadeIn;
    -webkit-animation-duration: 0.8s;
    -webkit-animation-delay: 0.2s;
    -webkit-animation-fill-mode: forwards;
    
    animation-name: fadeIn;
    animation-duration: 0.8s;
    animation-delay: 0.2s;
    animation-fill-mode: forwards;  
}

#subTyper {
	opacity: 0;
	
	-webkit-animation-name: fadeIn;
    -webkit-animation-duration: 0.8s;
    -webkit-animation-delay: 0.8s;
    -webkit-animation-fill-mode: forwards;
    
    animation-name: fadeIn;
    animation-duration: 0.8s;
    animation-delay: 0.8s;
    animation-fill-mode: forwards;  
    
    white-space: nowrap;
}

#typer {	
	margin-left: 7px;
}

.typed-cursor {
    opacity: 0;
    
    -webkit-animation: blink 0.8s infinite;
    -webkit-animation-delay: 1.3s;
    
    animation: blink 0.8s infinite;
    animation-delay: 1.3s;
}

#buttonBar {
	opacity: 0;
	
    -webkit-animation-name: fadeIn;
    -webkit-animation-duration: 1.8s;
    -webkit-animation-delay: 2.7s;
    -webkit-animation-fill-mode: forwards;
    
    animation-name: fadeIn;
    animation-duration: 1.8s;
    animation-delay: 2.7s;
    animation-fill-mode: forwards;  
}

#topHeadingCol {
	margin-top: 6%;
}

#topNavButton {
	visibility: hidden;
}

.container-fluid {
	background-color: white;
}

.videoFrame {
	height: 360px;
	width: 100%;
	border: 0px;
}

.jumbotron {
	background-color: #2E6A8F;
	color: #efefef;
	margin: 0px;
	padding-left: 0px;
	padding-right: 0px;
	padding-bottom: 20px;
}

.jumbotron .row {
	margin: 0px;
}

.footer {
	background-color: #2E6A8F;
	color: #efefef;
	margin: 0px;
}

.footer a {
	color: white;
}

.bg-grey {
	background-color: #efefef;
}

.container-fluid {
	padding: 50px 50px;
	margin: 0px;
}

.navbar {
    z-index: 9999;
    background-color: white;
    font-size: 13px !important;
    line-height: 1.4 !important;
    letter-spacing: 0.5px;
    border-radius: 0px;
    border: 0px;
}

.navbar-brand {
	color: white !important;
	letter-spacing: 0px;
	font-size: 23px !important;
}

.navbar-atTop li a {
    color: #2E6A8F !important;
}

.navbar-atTop li a:hover, 
.navbar-atTop li.active a {
    color: white !important;
    background-color: #2E6A8F !important;
}

.navbar-atSection li a {
    color: white !important;
}

.navbar-atSection li a:hover, 
.navbar-atSection li.active a {
    color: #2E6A8F !important;
    background-color: white !important;
}


.navbar-default .navbar-toggle {
    color: white;
    background-color: #2E6A8F !important;
    right: 15px;
}

.navbar-default .navbar-toggle .icon-bar {
	right: 15px;
	background-color: white !important;
}

.glyph-lrg-icon {
	color: #2E6A8F;
	font-size: 80px;
}

.btn-jumbotron {
	background: #4386b0;
	margin: 5px 10px 5px 6px;
}

.glyph-btn {
	margin: 0px 3px;
}

.label-default {
	background-color: #aeaeae;
}

.h4-skills-morph {
	display: none;
}

.h4-skills-static {
	padding: 0px;
	margin: 2px;
}

.img-skills {
	padding: 6px;
	-webkit-filter: grayscale(100%);
	-webkit-transition: .5s;
	-moz-filter: grayscale(100%); 
	-moz-transition: .5s;
	-o-filter: grayscale(100%); 
	-o-transition: .5s;
}

#sweetsCarousel {
	margin: 10px;
	border-style: solid;
    border-width: 1px;
    border-color: #b7b7b7;
}


.div-anchour-btn{
	width: 100%;
	height: 0px;
}

.btn-portfloat {
	position: relative;
	top: -60px;
	z-index: 10;
}

.img-port {
	margin-bottom: 8px !important;
	border-style: solid;
    border-width: 1px;
    border-color: #b7b7b7;

}

.no-padding {
	padding: 0px;
}

.port-desc {
	text-align: justify;
}

.img-responsive {
    margin: 0 auto;
}

#div-anchour-mobile {
	position: relative;
}

#div-carouselHolder {
	position: absolute;
	top: 10.20689655%;
	left: 10.08902077%;
	width: 83.02387268%;
	height: 75.17241379%;
	z-index: 10;
}

.img-mobile {
	width: 100%
}

.modal-dialog {
	margin: 90px auto !important;
}

.modal-video .modal-header {
	background-color: #818181;
	color: white;
}

.modal-video .modal-body {
	background-color: black;
}

.modal-video .close {
	color: white;
	opacity: 0.8;
}

.well:hover .img-skills {
	-webkit-filter: grayscale(0%);
    filter: grayscale(0%);
}

.thumbnail {
	padding: 10px;
}

#emailAddress a {
	color: #777;
}

@media screen and (max-width: 768px) {
    .col-sm-2 {
        text-align: center;
    }
    .img-skills {
	    display: none;
	    padding: 0px;
    }
    .h4-skills-morph {
	    display: block;
    }
    
    .h4-skills-static {
		padding: 10px 0px;
	}
	
	.text-contact {
		text-align: center;
	}
	
	#profilePic {
		padding: 25px 80px 0px 80px;
	}
	
	#top {
		text-align: center;
	}
	
	#topHeadingCol {
		padding-top: 0px;
		padding-bottom: 20px;
	}
	
	.navbar-brand {
		color: #4386b0 !important;
	}
	
	h2 {
		text-align: center;
	}
	
	.text-justify-sm {
		text-align: justify;
	}
}