/* DudeSquare CSS */
html, body, h1, h2, h3, h4, h5, h6, h7 {font-family: 'Signika Negative', sans-serif; text-transform: none; font-weight: 300;}
h1 {font-size: 40px}

.container {max-width: 1240px;}

#about, #services, #portfolio, #contact, #header {padding-top: 140px; font-weight: 300;}
/* homepage */
.jumbotron {background-image: url("../assets/header-bg-haarlem.jpg")}

.jumbotron h1, .jumbotron p {color: #1bc724; text-shadow: none;}

.jumbotron h1 span {display: inline-block; border-radius: 20px; background: rgba(40,194,49,1); padding: 20px; color: #FFF;}


/* menu */
/* .navbar .navbar-nav .active, .navbar .navbar-nav li a:hover {background-image: linear-gradient(to bottom, #1bc724 0px, #1b9f22 100%); background-repeat: repeat-x;} */
.navbar .navbar-nav .active, .navbar .navbar-nav li a:hover {background: #1bc724;}

/* about */
#about h1, #portfolio h1 {color: #1bc724;}
	#about .social-icons  {margin-top: 40px;}
	
/* youtube */
#youtube {padding-bottom: 60px; text-align: center;}
#youtube .container {max-width: 800px; margin: 0 auto;}

.videoWrapper {
        position: relative;
        padding-bottom: 56.25%; /* 16:9 */
        padding-top: 25px;
        height: 0;
}
.videoWrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
}


/* services */
#services {background: #1bc724;} 
	#services .service-icon {box-shadow: none; background-color: transparent;}
	#services .service-column:hover {background-color: #138d19;}
	#services .service-column:hover i {color: #138d19;}
	#services h2 {font-size: 18px; display: inline-block; min-height: 44px; width: 100%;}
	
/* portfolio */
#portfolio .portfolio-row .portfolio-mix .portfolio-item a .caption-bg {box-shadow: 0 0 0 0px #6b6b6b inset, 0 0 0 0 #6b6b6b inset;}
#portfolio .portfolio-row .portfolio-mix .portfolio-item a:hover .caption-bg::before {box-shadow: 0 0 0 160px #1bc724 inset;}
#portfolio .portfolio-row .portfolio-mix .portfolio-item a .caption-bg::before { box-shadow: 0 0 0 0 #1b9f22 inset;}


/*contact */
#contact  {background-image: url("../assets/header-bg-contact.jpg"); background-position: bottom center}
	#contact form input, #contact form textarea {background-color: #FFF; color: #7b7b7b;}
	#contact form input:focus, #contact form textarea:focus {background-color: #e6e6e6; }
	#contact a {color: #FFF; text-decoration: underline;}
	#contact form button[type="submit"]:hover {background: #1bc724; color: #FFF;}
	
.scrolltotop {background-color: rgba(40, 194, 48, 1); }
	.scrolltotop i {opacity: 0.8;}
.scrolltotop:hover {background-color: #FFF;}
	.scrolltotop:hover i {color: #1bc724;}

.no-break {white-space: nowrap;}

/* footer */
.footer {background-color: #666666;}
	.footer p {color: #FFF;}
		.footer p a  {color: #FFF; text-decoration: underline;}
/* center columns */
.row-centered { text-align:center;}
.col-centered {display: inline-block; float:none; text-align:left; margin-right:-4px;}

#contact form ::-webkit-input-placeholder {
  color: #ACACAC;
}
#contact form :-moz-placeholder {
  color: #ACACAC;
}
#contact form ::-moz-placeholder {
  color: #ACACAC;
}
#contact form :-ms-input-placeholder {
  color: #ACACAC;
}
#contact form input::-webkit-input-placeholder,
#contact form textarea::-webkit-input-placeholder {
  color: #ACACAC;
}
#contact form input:-moz-placeholder,
#contact form textarea:-moz-placeholder {
  color: #ACACAC;
}

.footer p {font-size: 14px;}

/* Large desktops and laptops */
@media (max-width: 1200px) {
}

/* Portrait tablets and medium desktops */
@media (max-width: 992px) {
	#services h2 {min-height: 0px;}
}
			
/* Portrait tablets and small desktops */
@media (max-width: 768px) {
}

/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
.footer {padding-left: 40px; padding-right: 40px;}
.footer p {font-size: 16px;}
	#about, #services, #portfolio, #contact {padding-top: 120px;}
}

/* Landscape phones and smaller */
@media (max-width: 480px) {	
}

#g-recaptcha-response {
    display: block !important;
    position: absolute;
    margin: -78px 0 0 0 !important;
    width: 302px !important;
    height: 76px !important;
    z-index: -999999;
    opacity: 0;
}