//
// CONTACT PAGE & FORM
// --------------------------


#agave_contact {
    
    .overview-section {
        padding: 60px 15px 30px;
        background-color: #fff;
        
        h1{
            font-size:36px;
            line-height:1;
            margin-bottom: 30px;
        }
        
        p{
            font-size: 20px;
            margin-bottom: 20px;
            line-height: 32px;
        }
    }
    
    
    .contact_form_wrapper {
    	background: #fff;
    	
    	.form_intro {
    		margin-top: 50px;
    
    		h2 {
    			font-size: 30px;
    			margin-bottom: 0;
    			line-height: 1.2;
    			color: #22262A;
    			font-family:$hdr-font;
    			text-align: center;
    			@include breakpoint(large){
    				font-size: 40px;
    				margin-bottom: 30px;
    			}
    		}
    
            .intros{
                font-size: 16px;
                line-height: 24px;
                padding: 20px 0px 40px;
            }
    
    		p {
    			font-family: $body-font;
    			font-size:18px;
    			font-weight:500;
    			text-align: center;
                color: #22262A;
    
    			@include breakpoint(large){
    				font-size:24px;
    				margin-bottom: -45px;
    			}
    		}
    	}
    
    	.gform_body {
    
    		h2{
    			font-family: $hdr-font;
    			font-size: 18px;
    			font-weight: 300;
    
    			@include breakpoint(large) {
    				font-size: 30px;
    				margin-bottom: 45px;
    			}
    		}
    	}
    
    	.gsection {
    		border: 0;
    		margin: 0;
    		padding-top: 30px;
    
    		h2 {
    			font-size: 30px;
    			line-height: 34px;
    			text-align: center;
    			color: $agave-light-blue;
    			font-family: $hdr-font;
    			font-weight: 300;
    			letter-spacing: 1.5px !important;
    			padding-top: 53px !important;
    		}
    	}
    
    	li.gfield{
    		position: relative;
    	}
    
    	.gfield {
    		padding-top: 15px;
    
    		&.single-center {
    			max-width: 750px!important;
    			margin-left: auto!important;
    			margin-right: auto!important;
    			padding-right: 0;
    		}
    
    		&.bold {
    			input[type=text], input[type=email], input[type=number], input[type=tel], select {
    				font-weight:700;
    			}
    		}
    
    		input[type=text], input[type=email], input[type=number], input[type=tel], select {
    			width:100%;
    			margin:0;
    			border-style: solid;
    			border-color: transparent transparent $agave-light-blue transparent;
    			border-width:0 0 2px 0;
    			font-family:$body-font;
    			font-size:16px;
    			line-height:28px;
    			background:transparent;
    			box-shadow:none;
    		}
    
    		select {
    			min-height: 39px;
    			position: relative;
    		}
    
    		.ginput_container_select {
    			position:relative;
    
    			&:after {
    				content:'';
    				width: 0;
    				height: 0;
    				border-style: solid;
    				border-width: 6px 6px 0 6px;
    				border-color: $agave-light-blue transparent transparent transparent;
    				top: 18px;
    				right: 12px;
    				z-index: 9;
    				position: absolute;
    				pointer-events:none;
    			}
    		}
    
    		textarea {
    			border: 2px solid $agave-light-blue;
    			background:transparent;
    			font-family: $body-font;
    			font-size: 16px;
    		}
    
    		&.clear {
    			clear:both;
    		}
    
    		input::placeholder, textarea::placeholder, select::placeholder {
    			color: #888;
    		}
    
    		.charleft.ginput_counter {
    			color: #888;
    		}
    	}
    
    	.gform_validation_error label{
    		top: 0 !important;
    		// color: $agave-light-blue !important;
    	}
    
    	.gfield_label {
    		//display:none;
    		position: absolute;
            top: 30px;
            left: .625rem;
    		color: #3c4252;
    		-webkit-transition: all .3s ease;
    		-o-transition: all .3s ease;
    		transition: all .3s ease;
    		font-size: 14px;
    		margin-top: 0 !important;
    	}
    
    	#field_177458163_33 {
    		.gfield_label {
    			top: 0 !important;
    		}
    	}
    
    	#field_1835901543_34 {
    	    .gfield_label {
    	        top: 30px;
    	        left: .625rem;
    	    }
    	}
    
    
    	.accom.animated label.active-weight {
    		@include breakpoint(small only) {
    		    font-size: 14px;
    		}
    
    		@include breakpoint(medium only) {
    		    font-size: 14px;
    		}
    	}
    
    	.accom.animated label.active-position {
    		@include breakpoint(small only){
    		    top: -10px;
    		}
    
    		@include breakpoint(medium only) {
    		    top: -10px;
    		}
    	}
    
    	.prefs.animated label.active-weight {
    		@include breakpoint(small only) {
    		    font-size: 14px;
    		}
    
    		@include breakpoint(medium only) {
    		    font-size: 14px;
    		}
    	}
    
    	.prefs.animated label.active-position {
    		@include breakpoint(small only) {
    		    top: -14px;
    		}
    
    		@include breakpoint(medium only) {
    		    top: -14px;
    		}
    	}
    
    	.animated label.active-weight {
        	font-weight: 700 !important;
        	font-size: 16px;
        }
    
        .animated label.active-color {
        	color: $agave-light-blue;
        }
    
        .animated label.active-position {
        	top: 0px;
        }
    
    	.gform_footer {
    		text-align: center;
		    margin-top: 25px;
    	}
    
    	.validation_error {
    		display: none;
    	}
    
    	.gfield_error {
    		background: transparent;
    		border: 0;
    
    		@media screen and (min-width: 40em) {
    			padding-right: 16px;
    		}
    
    		.ginput_container {
    			margin-top: 0;
    		}
    
    		.validation_message {
    			font-size: 13px;
    			font-weight: 600;
    			padding: 7px 0 0 0;
    			color: #F44336!important;
    		}
    	}
    
    	.gform_confirmation_wrapper {
    		margin: 80px 0 50px;
    		text-align: center;
    		font-weight: 700;
    		border: 2px solid #3b576c;
    		padding: 10px;
    	}
    
    	.text-area-top {
    	    margin-top: 20px;
    		padding-top: 20px;
    		position:relative;
    		top:25px;
    	}
    
    	/* Medium and up */
    	@media screen and (min-width: 40em) {
    		.col-6 {
    			width: 50%;
    			float: left;
    			clear: none;
    		}
    	}
    
    	input[type=submit] {
            border: 3px solid $agave-light-blue;
            color: $agave-light-blue;
            font-size: 20px;
            font-weight: 700;
            line-height: 25px;
            padding: 11px 20px;
            cursor: pointer;
            transition: all 0.2s linear;
            background: transparent;
            
            &:hover {
                background-color: $agave-light-blue;
                color: #fff;
            }
    	} // input[type=submit]
    }    
}