body {
    font-family: 'Montserrat', sans-serif;

}

h1, h2, h3, h4 {
    font-weight: 300;
}

img {
    max-width: 100%;
}

/* centered columns styles */
.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-1%;
    vertical-align: top;
}

.button {
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}

#banner {
    width: 100%;
    text-align: center;
    background-image: url('/assets/images/landing/carwash-optimized-main.jpg');
    background-size: cover;
    background-color: rgba(0,0,0,0.3);
    background-position: center;
}

/*.banner-darken {
    background: rgba(0,0,0,0.6);
    width: 100%;
    height: 100%;
        padding-top: 30px;
    padding-bottom: 40px;
}*/

#banner_wrapper {
    margin-left: 20%;
    margin-right: 20%;
}

.logo_img {
    
    margin-bottom: 10px;
    max-width: 100%;
    max-height: 200px;
}

.slogan {
    color: #FFF;
    margin-bottom: 20px;
    text-transform: capitalize;
}

.sign-in input {
    background: #FFF;
    border: none;
    padding: 10px 15px;
    border-radius: 2px;
    color: #333;
    margin-bottom: 5px;
}

.signup-button {
    padding: 10px 20px;
    border: 2px solid #FFF;
    border-radius: 20px;
    color: #FFF;
}

.signup-button:hover {
    background: rgba(0,0,0,0.1);
    text-decoration: none;
    color: #FFF;
}

#news {
    padding-top: 45px;
    padding-bottom: 15px;
    text-align: center;
}

#news h2 {
    margin-top: 0;
    margin-bottom: 40px;
}

.update {
    text-align: center;
    padding: 10px;
    min-height: 140px;
    width: 100%;
}

.update h4 {
    margin-top: 0;
    font-weight: 600;
}

.update-small-text {
    margin-top: 10px;
    font-size: 10px;
}

.location-row {
    padding-bottom: 20px;
    margin-bottom: 20px;
    margin-left: 5%;
    margin-right: 5%;
    border-bottom: 1px solid #EEE;
}

.location-info {
    font-size: 16px;
    
}

.location-feature {
    margin-top: 5px;
}

.locations-map-container {
    position: relative;
    box-shadow: 0 0 3px 3px rgba(0,0,0,0.05);
    padding-top: 30px;
    padding-bottom: 30px;
}

#map {
    min-height: 300px;
    width: 100%;
    height: 100%;
}

#social {
    background-image: url('/assets/images/landing/soap-cut.jpg');
    background-size: cover;
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
}

#social h2 {
    padding-top: 30px;
    padding-bottom: 30px;
    margin-top: 0;
    margin-bottom: 0;
    display: inline-block;
}

.social-msg { text-align: center; }
.social-icons { text-align: center; padding-left: 15px; padding-right: 15px;}

#social i {
    padding-left: 8px;
    padding-right: 8px;
}

#card {
    padding-top: 40px;
    text-align: center;
    padding-bottom: 40px;
}

.card-wrapper {
    width: 80%;
    max-width: 900px;
        margin-left: auto;
    margin-right: auto;
}

.iphone-mockup {
    max-width: 100%;
    height: auto;
    width: 100%;
}

.phone-container {
    position: relative;
    text-align: center;
}

#mobile-iframe-wrap {
        position: absolute;
    z-index: 99;
    top: 10.8%;
    width: 69.2%;
    left: 14.5%;
    height: 70%;
    overflow: hidden !important;
    
}

#mobile-iframe {
    width: 146%;
    height: 143%;
    transform: scale(0.692);
    transform-origin: 0 0;
    overflow: hidden !important;
    border: none;
}

.phone-logo {
    position: absolute;
    top: 27%;
    max-height: 6%;
    max-width: 100px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

.card-text {
    margin-top: 15px;
    text-align: left;
    font-size: 16px;
}

.front-card {
    margin-top: 20px;
    max-width: 100%;
}

.store-pic {
    margin-top: 20px;
}

#contact {
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

.contact-wrapper {
    width: 80%;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.contact-text {
    text-align: left;
    font-size: 16px;
    margin-bottom: 15px;
}

#contact-form {
    text-align: left;
}

#contact-form input, #contact-form textarea {
    border: 1px solid #DDD;
    padding: 8px;
    width: 100%;
    margin-bottom: 10px;
}

#contact-form input[type="submit"] {
    background: #DDD;
    width: auto;
    border: none;
    padding: 10px 15px;
}

.notification{ 
	padding:10px;
	font-size:12px;
	margin:8px 0px;
	cursor:pointer;
}

.notification_wrap{
	margin:0px 20px;	
}

.noti_type{
	font-weight:bold;
	text-transform:uppercase;
}

.success{
	border:1px solid #54b539;
	background-color:#d9fdce;
}

.error{
	border:1px solid #c77d7d;
	background-color:#fbcfcf;
}

.info{
	border:1px solid #5ba3c2;
	background-color:#cfeefb;
}

.notification strong{
	font-weight:bold;	
}

#footer {
    background: #22282b;
    color: rgba(255,255,255, 0.4);
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
}

.footer-logo {
    max-width: 100px;
    margin: auto;
    margin-bottom: 10px;
}

@media screen and (max-width: 768px) {
    #social h2 { padding-top: 10px; padding-bottom: 10px; }
    .social-msg { text-align: center; }
    .social-icons { text-align: center; }
    
    .slogan { font-size: 20px; }
}