@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,400i,700');
/* CSS Document */

/* GLOBAL */

a {
	color: #212529;
}

/* BACKGROUNDS */

section#about, section#services, .py-5  {
	background: #ffffff;
}

header.masthead {
	background-image: none;
}

/*HEADER*/

#mainNav .navbar-brand {
	color: #ffffff;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
}

#mainNav .navbar-brand:hover,
#mainNav .navbar-brand:active,
#mainNav .navbar-brand:focus {
	color: lightgray;
}


header.masthead .intro-text .intro-lead-in {
	font-family: 'Montserrat', sans-serif;
    font-style: normal;
}

.intro-line, .intro-lead-in {
	text-transform: uppercase;
	margin-bottom: 10%;	
}

.intro-line {
  font-size: 2em;
}

.second-intro-line {
	letter-spacing: .3em;
	word-spacing: 1em;
	line-height: 2;
}

#header-btn {
	margin-top: 20px;
}

#video-background {
/*  making the video fullscreen  */
  position: fixed;
  right: 0; 
  bottom: 0;
  min-width: 100%; 
  min-height: 100%;
  width: auto; 
  height: auto;
  z-index: -100;
}

/* NAVBAR */

#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
	color: lightgrey;
}


#mainNav .navbar-toggler {
	background-color: #ffffff;
	color: #212529;
}

/* BUTTONS */

.btn-primary {
	background-color: #ffffff;
    border: none;
    color: #212529;
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    background-color: grey !important;
	box-shadow: none !important;
    border: none !important;
    color: #ffffff;
}

/* PORTFOLIO */

.portfolio-modal .modal-content h2 {
    font-size: 2.5em;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover {
	background: #212529;
}

iframe {
  max-width: 450px;
  height: 200%;
}

    section#clients img{
        margin-bottom: 50px;
    }


a.portfolio-link:focus {
	outline: none;
}

/* DEMO REEL */

#demo-reel .modal-body iframe {
	border: 4px solid #000000;
    background: #000000;
}

/* CONTACT */

section#contact {
	background-image: none;
}

section#contact .form-control:focus {
	border: none;
}

#portfolio .portfolio-item .portfolio-caption {
	background: none;
}


/* FOOTER */

footer a, footer span.copyright {
	color: #ffffff;
}

footer a:hover {
	text-decoration: none;
	color: grey;
}

ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover  {
	background-color: grey;
}


/* MEDIA QUERIES */

@media only screen and (max-width: 767px) {
    section#clients img{
		width: 75%;
    }
}


@media only screen and (max-width: 450px) {
  .portfolio-modal .modal-content h2 {
    font-size: 1.5em;
  }
	
  .portfolio-modal .modal-content p {
    font-size: .8em;
  }
}