Gravity Forms SCSS

_base.scss

/******************************************************************
Site Name:
Author:

Stylesheet: Responsive Gravity Forms Styles

Usage: Uncheck box in Gravity Forms Settings to "Not" Output default CSS

******************************************************************/

/* Import Other Styles */
@import "ready_classes";
@import "submission_and_errors";
@import "other_fields";
//@import "credit_cards";

/* GForm Wrapper */

.gform_wrapper {
	margin: 2em auto;
	overflow: inherit;
	width: 100%;
	font-family: $font__sans;
	
	&:focus {
		outline: 0;
	}
}
	
/* REQUIRED */

.gfield_required {
	color: red;
	font-weight: 700;
	margin-left: 4px;
}
	
/* INPUTS */

textarea.small {
	height: 80px;
}

textarea.medium {
	height: 150px;
}

textarea.large {
	height: 250px;
}
	
/* RADIO & CHECKBOXES */

.ginput_container_radio,
.ginput_container_checkbox {
	margin: 10px 0 15px;
}

ul.gfield_checkbox,
ul.gfield_radio {
	
	li {
		margin: 0 0 0.45em;
		
		&:last-child {
			margin-bottom: 0;
		}
		
		input {
			margin-left: 8px;
			width: auto;
		}
		
		label {
			margin-left: 8px;
			margin-bottom: 0;
			font-weight: 300;
		}
	}
}

/* HOVER & FOCUS */

.field_hover {
	border: 1px dashed #2175A9;
	cursor: pointer;
}

.field_selected {
	background-color: #DFEFFF;
	border: 1px solid #C2D7EF;
}

/* CUSTOM FIELDS */

.ginput_complex {
	overflow: hidden;
	
	.field_name_first,
	.field_name_last {
		width: 100%;
	}
	
	.ginput_left,
	.ginput_right,
	.ginput_full {
		min-height: 43px;
		display: block;
		overflow: hidden;
	}
	
	.ginput_left,
	.ginput_right  {
		width: 100%;
	}
	
	/*.name_prefix {
		float: left;
		width: 13%;
	}
	
	.name_first {
		float: left;
		width: 83%;
	}
	
	.name_last {
		clear: both;
		float: left;
		width: 73%;
	}
	
	.name_suffix {
		float: right;
		width: 23%;
	}*/
	
	input[type=text],
	input[type=url],
	input[type=email],
	input[type=tel],
	input[type=number],
	input[type=password] {
		width: 100%;
		
		&:focus+label {
			font-weight: bold;
		}
	}

	select {
		width: 100%;
	}
}

/* HEADER */

.gform_heading {
	width: 100%;
	margin-bottom: 15px;
}

/* BODY */

.gform_body {}

/* FOOTER */

.gform_footer {
	margin: 25px 0 15px 0;
	clear: both;
	text-align: center;

	&.right_label,
	&.left_label {
		padding: 16px 0 10px 31%;
	}
}

/* TITLES & DESCRIPTIONS */

h2.gsection_title {
	margin: 0 !important;
	padding: 0 !important;
	letter-spacing: normal !important;
}

h2.gsection_title,
h3.gform_title {
	font-weight: bold;
	font-size: 1.3em;
}

h3.gform_title {
	letter-spacing: normal !important;
	margin: 10px 0 6px 0;
}

span.gform_description {
	font-weight: normal;
}

h2.gsection_title,
.gsection_description,
h3.gform_title {
	width: 100%;
}

.gfield_description,
.gsection_description,
.instruction {
	font-size: 0.85em;
	line-height: 1.5em;
	clear: both;
	letter-spacing: normal;
}

.gfield_description,
.gsection_description {
	display: block;
    margin: 3px 0 0;
    font-size: 11px;
    letter-spacing: 0.5pt;
    font-weight: 400;
}

.left_label .gfield_description,
.right_label .gfield_description {
	width: 63%;
}

.gfield_date_year+.gfield_description {
	padding: 0;
}

.right_label .gfield_description,
.left_label .gfield_description,
.left_label .instruction,
.right_label .instruction {
	margin-left: 31%;
}

.left_label .gsection .gsection_description,
.right_label .gsection .gsection_description {
	margin-left: 0;
	padding-top: 4px;
	padding-left: 0;
	line-height: 1.5em;
}

/* LISTS */

form {
	ul {
		margin: 0 !important;
		list-style-type: none;
		
		li.gfield {
			clear: both;
			display: block;
			
			&.field_sublabel_below {
				margin-bottom: 15px;
			}
		}
	}
}

form li {
	margin-left: 0 !important;
	list-style-type: none !important;
	list-style-image: none !important;
	list-style: none !important;
	overflow: visible;
}

ul.gfield_radio li,
ul.gfield_checkbox li {
	overflow: hidden;
}

form ul.right_label li,
form ul.left_label li {
	margin-bottom: 14px;
}

form ul.right_label li ul.gfield_radio li,
form ul.left_label li ul.gfield_radio li,
form ul.right_label li ul.gfield_checkbox li,
form ul.left_label li ul.gfield_checkbox li {
	margin-bottom: 10px;
}

form {
	ul li:before,
	ul li:after,
	ul.gform_fields {
		padding: 0;
		margin: 0;
		overflow: visible;
	}

	.inline {
		display: inline !important;
	}
}

/* LABELS */

.ginput_complex {
	.ginput_left,
	.ginput_right,
	.ginput_full {
		input:focus+label {
			font-weight: bold;
		}
	}
}

.ginput_complex label,
.gfield_time_hour label,
.gfield_time_minute label,
.gfield_date_month label,
.gfield_date_day label,
.gfield_date_year label,
.instruction {
	display: block;
	margin: 1px 0 0;
	font-size: 11px;
	letter-spacing: 0.5pt;
	font-weight: 400;
}

.top_label {
	.gfield_label {
		margin: 0 0 4px 0;
		font-weight: 400;
		display: block;
		clear: both;
	}
}

.left_label { 
	.gfield_label {
		float: left;
		margin: 0 15px 0 0;
		width: 29%;
		font-weight: 400;
	}
}

.right_label {
	.gfield_label {
		float: left;
		margin: 0 15px 0 0;
		width: 29%;
		font-weight: 400;
		text-align: right;
	}
}

.left_label ul.gfield_checkbox,
.right_label ul.gfield_checkbox,
.left_label ul.gfield_radio,
.right_label ul.gfield_radio {
	margin-left: 32%;
	overflow: hidden;
}

.gsection .gfield_label {
	font-weight: bold;
	font-size: 1.3em;
}

/* SECTIONS */

#gform_4 #field_4_10.gsection {
	margin-top: 0;
}

.gsection {
	border-bottom: 1px dotted #CCC;
	padding: 0 0 8px 0;
	margin: 2em 0 0.675em;
	clear: both;
	
	&:first-child {
		margin-top: 0;
	}
}


@media only screen and (min-width: $screen-sm-min) {

	.gform_wrapper {
		max-width: 100%;
	}
		
	textarea {
		width: 100% !important;
	}

	.gform_heading {
		width: auto;
	}
	
	.ginput_complex {
		
		.name_last {
			clear: none;
		}
		
		&.has_prefix.has_first_name.has_middle_name.has_last_name.has_suffix {
			.name_prefix,
			.name_first,
			.name_middle,
			.name_last {
				float: left;
			}
			.name_suffix {
				float: right;
			}
			.name_prefix,
			.name_suffix {
				width: 10%;
			}
			.name_prefix {
				margin-right: 2%;
			}
			.name_first,
			.name_middle,
			.name_last {
				margin-right: 2%;
				width: 24%;
			}
		}
		
		&.no_prefix.has_first_name.has_middle_name.has_last_name.no_suffix {
			.name_first,
			.name_middle,
			.name_last {
				width: 32%;
			}
			.name_first,
			.name_middle {
				float: left;
				margin-right: 2%;
			}
			.name_last {
				float: right;
			}
		}
		
		&.no_prefix.has_first_name.no_middle_name.has_last_name.no_suffix {
			.name_first {
				float: left;
				width: 49%;
			}
			.name_last {
				float: right;
				width: 49%;
			}
		}
		
		&.has_prefix.has_first_name.no_middle_name.has_last_name.no_suffix {
			.name_prefix {
				float: left;
				margin-right: 2%;
				width: 20%;
			}
			.name_first {
				float: left;
				margin-right: 2%;
				width: 38%;
			}
			.name_last {
				float: right;
				width: 38%;
			}
		}
		
		&.no_prefix.has_first_name.no_middle_name.has_last_name.has_suffix {
			.name_first,
			.name_last {
				float: left;
				margin-right: 2%;
				width: 38%;
			}
			.name_suffix {
				float: right;
				width: 20%;
			}
		}
		
		.ginput_full {
			clear: both;
		}
		
		.ginput_left {
			float: left;
			width: 49%;
		}
		
		.ginput_right {
			float: right;
			width: 49%;
		}
	}
	
	li.has-select {
		height: 234px;
	}
	
	li.has-select.gfield_error {
		height: 300px;
	}

}

@media only screen and (min-width: $screen-md-min) {}

@media only screen and (min-width: $screen-lg-min) {}

_credit_cards.scss

/******************************************************************
Site Name:
Author:

Stylesheet: Credit Card Styles for Gravity Forms

Usage: Uncheck box in Gravity Forms Settings to "Not" Output default CSS

******************************************************************/

.gform_card_icon_container {
	margin: 8px 0 6px 0;
	height: 32px;
}

div.gform_card_icon {
	margin-right: 4px;
	text-indent: -9000px;
	background-image: url("#{$plugins-path}gravityforms/images/gf-creditcard-icons.png");
	background-repeat: no-repeat;
	width: 36px;
	height: 32px;
	float: left;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_visa {
	background-position: 0 0;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_visa {
	background-position: 0 -32px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_visa {
	background-position: 0 -64px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_mastercard {
	background-position: -36px 0;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_mastercard {
	background-position: -36px -32px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_mastercard {
	background-position: -36px -64px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_amex {
	background-position: -72px 0;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_amex {
	background-position: -72px -32px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_amex {
	background-position: -72px -64px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_discover {
	background-position: -108px 0;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_discover {
	background-position: -108px -32px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_discover {
	background-position: -108px -64px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_maestro {
	background-position: -144px 0;
}

.gform_wrapper .gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_maestro {
	background-position: -144px -32px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_maestro {
	background-position: -144px -64px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_jcb {
	background-position: -180px 0;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_jcb {
	background-position: -180px -32px;
}

.gform_card_icon_container.gform_card_icon_style1 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_jcb {
	background-position: -180px -64px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_visa {
	background-position: 0 -192px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_visa {
	background-position: 0 -224px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_visa {
	background-position: 0 -256px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_mastercard {
	background-position: -36px -192px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_mastercard {
	background-position: -36px -224px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_mastercard {
	background-position: -36px -256px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_amex {
	background-position: -72px -192px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_amex {
	background-position: -72px -224px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_amex {
	background-position: -72px -256px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_discover {
	background-position: -108px -192px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_discover {
	background-position: -108px -224px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_discover {
	background-position: -108px -256px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_maestro {
	background-position: -144px -192px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_maestro {
	background-position: -144px -224px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_maestro {
	background-position: -144px -256px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_jcb {
	background-position: -180px -192px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_selected.gform_card_icon_jcb {
	background-position: -180px -224px;
}

.gform_card_icon_container.gform_card_icon_style2 div.gform_card_icon.gform_card_icon_inactive.gform_card_icon_jcb {
	background-position: -180px -256px;
}

/* CREDIT CARD FIELDS */

.gform_card_icon_container input[type=radio]#gform_payment_method_creditcard {
	float: left;
	position: relative;
	top: 4px!important
}

.ginput_complex .ginput_cardinfo_left,
.ginput_complex .ginput_cardinfo_right {
	min-height: 43px;
	position: relative;
	float: left;
}

.ginput_complex .ginput_cardinfo_left {
	width: 50%;
	margin-right: 1%;
}

.ginput_complex .ginput_cardinfo_right {
	min-width: 85px !important;
}

.ginput_complex .ginput_cardinfo_left label,
.ginput_complex .ginput_cardinfo_right label {
	white-space: nowrap !important;
}

.ginput_complex span.ginput_cardextras {
	display: block;
	overflow: hidden;
}

.ginput_complex .ginput_cardinfo_left span.ginput_card_expiration_container {
	position: relative;
	display: block;
	min-width: 160px !important;
}

.ginput_complex select.ginput_card_expiration.ginput_card_expiration_month,
.ginput_complex select.ginput_card_expiration.ginput_card_expiration_year {
	width: 48% !important;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
}

.ginput_complex .ginput_cardinfo_left select.ginput_card_expiration.ginput_card_expiration_month {
	margin-right: 4px;
}

.ginput_complex .ginput_cardinfo_right input.ginput_card_security_code {
	max-width: 50% !important;
}

.ginput_complex .ginput_cardinfo_right span.ginput_card_security_code_icon {
	width: 32px;
	height: 23px;
	background-image: url('#{$plugins-path}gravityforms/images/gf-creditcard-icons.png');
	background-repeat: no-repeat;
	background-position: 0 -128px;
	position: relative;
	top: -1px;
	left: 6px;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
}

@media only screen and (min-width: $screen-sm-min) {}

@media only screen and (min-width: $screen-md-min) {}

@media only screen and (min-width: $screen-lg-min) {}

_other_fields.scss

/******************************************************************
Site Name:
Author:

Stylesheet: Extra Form Field Styles for Gravity Forms

Usage: Uncheck box in Gravity Forms Settings to "Not" Output default CSS

******************************************************************/

/* DATE & TIME */

.gfield_time_hour,
.gfield_time_minute,
.gfield_date_month,
.gfield_date_day,
.gfield_date_year {
	width: 70px;
	vertical-align: top;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
}

.gfield_date_month,
.gfield_date_day,
.gfield_date_year {
	margin-right: 12px;
	width: 50px;
	float: left;

	input {
		width: 85% !important;
	}
}

.gfield_date_dropdown_month,
.gfield_date_dropdown_day,
.gfield_date_dropdown_year {
	vertical-align: top;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
	margin-right: 6px;
}

.gfield_time_ampm {
	vertical-align: top;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
}

.gfield_time_ampm select {
	width: 60px !important;
}

.gfield_time_hour input,
.gfield_time_minute input,
.gfield_date_month input,
.gfield_date_day input,
.gfield_date_year input {
	width: 70% !important;
}

/* DATE PICKER */

.datepicker {
	width: 110px;
}

input.datepicker.datepicker_with_icon {
	margin-right: 4px !important;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;
}

.ui-datepicker {
	width: 250px;
	height: auto;
	margin: 5px auto 0;
	font-family: $font__sans;
	font-size: 0.875em;
	border: 1px solid #DDD;
	//@include box-shadow(0 0 10px 0 rgba(0,0,0,.5));
}

.ui-datepicker a {
	text-decoration: none;
}

.ui-datepicker table {
	width: 100%;
	border-collapse: collapse;
}

.ui-datepicker-header {
	background-color: #444; /* set the header background color */
	color: #EEE;
	font-weight: bold;
	//@include box-shadow(inset 0 1px 1px 0 rgba(250,250,250,.2));
	//filter: dropshadow(color=#000, offx=1, offy=-1);
	line-height: 35px;
	min-height: 30px !important;
	//border-width: 1px 0 0 0;
	//border-style: solid;
	//border-color: #666;
	font-size: 0.875em;
}

.ui-datepicker-title {
	text-align: center;
	clear: both;
	@include clearfix;
	padding: 0 4% 5% 4%;

	.ui-datepicker-month {
		//margin-right: 5px;
		width: 45%;
		float: left;
	}
	
	.ui-datepicker-year {
		width: 45%;
		float: right;
	}
}

.ui-datepicker-title select {
	margin-top: 2.5%;
	height: 25px;
	line-height: 25px;
}

.ui-datepicker-prev:before {
	font-family: "FontAwesome";
	font-size: 1em;
	color: #FFF;
	content: "\f104";
	margin-right: 5px;
	margin-left: 5px;
}

.ui-datepicker-next:after {
	font-family: "FontAwesome";
	font-size: 1em;
	color: #FFF;
	content: "\f105";
	margin-right: 5px;
	margin-left: 5px;
}

.ui-datepicker-prev,
.ui-datepicker-next {
	display: inline-block;
	text-align: center;
	cursor: pointer;
	overflow: hidden;
	color: #FFF !important;
	height: 30px;
}

.ui-datepicker-prev {
	float: left;
	background-position: center -30px;
}

.ui-datepicker-next {
	float: right;
	background-position: center 0px;
}

.ui-datepicker tr {
	background: none !important;
}

.ui-datepicker thead {
	/*background: #f7f7f7;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y3ZjdmNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmMWYxZjEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #f7f7f7 0%, #f1f1f1 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#f1f1f1));
	background: -webkit-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	background: -o-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	background: -ms-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	background: linear-gradient(to bottom,  #f7f7f7 0%,#f1f1f1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#f1f1f1',GradientType=0 );
	border-bottom: 1px solid #bbb;*/
}

.ui-datepicker th {
	text-transform: uppercase;
	text-align: center;
	font-size: 10px;
	padding: 5px 0;
	color: #666;
	background: #FFF;
	//text-shadow: 1px 0px 0px #fff;
	//filter: dropshadow(color=#fff, offx=1, offy=0);
	border: 0;
}

.ui-datepicker tbody td {
	padding: 0;
	border: 0;
	border-top: 1px solid #bbb;
	border-right: 1px solid #bbb;
}

.ui-datepicker tbody td:last-child {
	border-right: 0;
}

.ui-datepicker tbody tr {
	border-bottom: 1px solid #bbb;
}

.ui-datepicker tbody tr:last-child {
	border-bottom: 0;
}

.ui-datepicker td span,
.ui-datepicker td a {
	//display: inline-block;
	display: block;
	font-weight: bold;
	text-align: center;
	//width: 30px;
	//height: 30px;
	line-height: 30px;
	color: #666;
	//text-shadow: 1px 1px 0px #fff;
	//filter: dropshadow(color=#fff, offx=1, offy=1);
}

.ui-datepicker-calendar .ui-state-default {
	background: #EEE;
	/*background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VkZWRlZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkZWRlZGUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #ededed 0%, #dedede 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#dedede));
	background: -webkit-linear-gradient(top,  #ededed 0%,#dedede 100%);
	background: -o-linear-gradient(top,  #ededed 0%,#dedede 100%);
	background: -ms-linear-gradient(top,  #ededed 0%,#dedede 100%);
	background: linear-gradient(to bottom,  #ededed 0%,#dedede 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#dedede',GradientType=0 );
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
	-moz-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
	box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);*/
}

.ui-datepicker-calendar .ui-state-hover {
	background: #f7f7f7;
}

.ui-datepicker-calendar .ui-state-active {
	background: $color__link; /* set the active date background color */
	//border: 1px solid ; /* set the active date border color */
	color: #FFF; /* set the active date font color */
	//-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	//-moz-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	//box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	//text-shadow: 0px 1px 0px #444;
	//filter: dropshadow(color=#444, offx=0, offy=1);
	position: relative;
	//margin: -1px;
	//width: 32px;
	//height: 32px;
	//line-height: 32px;
}

.ui-datepicker-unselectable .ui-state-default {
	background: #f4f4f4;
	color: #b4b3b3;
}

.ui-datepicker-calendar td:first-child .ui-state-active {
	width: 29px;
	margin-left: 0;
}

.ui-datepicker-calendar td:last-child .ui-state-active {
	width: 29px;
	margin-right: 0;
}

.ui-datepicker-calendar tr:last-child .ui-state-active {
	height: 29px;
	margin-bottom: 0;
}

td.ui-datepicker-unselectable.ui-state-disabled {
	background-color: #d7d7d7;
}

table.ui-datepicker-calendar {
	margin: 0 0 0 0 !important;
}

body div#ui-datepicker-div[style] {
	z-index: 9999 !important;
}

/* TEXTAREA CHARACTER COUNT */

div.charleft {
	font-size: 11px;
	margin-top: 4px;
	color: #B7B7B7;
	width: 92% !important;
	white-space: nowrap !important;
}

div.charleft[style] {
	width: 92% !important;
}

.left_label div.charleft,
.right_label div.charleft {
	margin-left: 32%;
}

div.charleft.warningTextareaInfo {
	color: #A1A1A1;
}

li.gf_hide_charleft div.charleft  {
	display: none !important;
}

/* SUBMISSION LIMIT MESSAGE */

.gf_submission_limit_message {
	color: #790000;
	font-size: 1.4em;
}

/* PRICING FIELDS */

.ginput_price {
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	-khtml-opacity: 0.7;
	opacity: 0.7;
}

span.ginput_total {
	color: #060;
	font-size: 1.2em;
}

.top_label span.ginput_total {
	margin: 8px 0;
}

span.ginput_product_price_label {
	margin-right: 2px;
}

span.ginput_product_price {
	color: #900
}

span.ginput_quantity_label {
	margin-left: 10px;
	margin-right: 2px;
}

input.ginput_quantity {
	width: 40px;
}

/* MULTI PAGE */

.gform_page_footer {
	margin: 20px 0;
	width: 99%;
	border-top: 1px dotted #CCC;
	padding: 16px 0 0 0;

	input.gform_previous_button {
		float: left;
		width: auto !important;
		padding-left: 1em;
		padding-right: 1em;
	}

	input.gform_next_button, .button.gform_button {
		float: right;
		width: auto !important;
		padding-left: 1em;
		padding-right: 1em;
	}
}

.gf_progressbar_wrapper {
	clear: both;
	width: 99%;
	margin: 0 0 8px 0;
	padding: 0 0 16px 0;
	border-bottom: 1px dotted #CCC;

	h3.gf_progressbar_title {
		font-size: 13px;
		line-height: 1em !important;
		margin: 0 0 6px 0 !important;
		padding: 0 !important;
		clear: both;
		filter: alpha(opacity=60);
		-moz-opacity: 0.6;
		-khtml-opacity: 0.6;
		opacity: 0.6;
	}
}

.gf_progressbar {
	width: 100%;
	height: 20px;
	overflow: hidden;
	line-height: 20px !important;
	border: 1px solid #CCC;
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-bg.png');
	background-repeat: repeat-x;
	background-position: bottom;
	background-color: #FFF;
}

.gf_progressbar_percentage {
	height: 20px;
	text-align: right;
	font-family: $font__sans;
	font-size: 1em;
}

.gf_progressbar_percentage span {
	display: block;
	width: auto;
	float: right;
	margin-right: 5px;
	margin-left: 5px;
	line-height: 18px;
}

.gf_progressbar_percentage.percentbar_0 span {
	color: #959595;
	text-shadow: none;
}

.percentbar_blue {
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-blue.png');
	background-repeat: repeat-x;
	background-color: #0072BC;
	color: #FFF;
}

.percentbar_gray {
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-gray.png');
	background-repeat: repeat-x;
	background-color: #666;
	color: #FFF;
}

.percentbar_green {
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-green.png');
	background-repeat: repeat-x;
	background-color: #94DC21;
	color: #FFF;
}

.percentbar_orange {
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-orange.png');
	background-repeat: repeat-x;
	background-color: #DC7021;
	color: #FFF;
}

.percentbar_red {
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-red.png');
	background-repeat: repeat-x;
	background-color: #DC2521;
	color: #FFF;
}

.percentbar_custom {
	background-image: url('#{$plugins-path}gravityforms/images/gf-percentbar-custom.png');
	background-repeat: repeat-x;
}

.gf_page_steps {
	width: 99%;
	margin: 0 0 8px 0;
	padding: 0 0 4px 0;
	border-bottom: 1px dotted #CCC;
}

.gf_step {
	width: auto !important;
	margin: 0 10px 10px 0;
	font-size: 14px;
	height: 20px;
	line-height: 20px !important;
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
	font-family: arial,sans-serif;
	display: -moz-inline-stack;
	display: inline-block;
	zoom: 1;

	span.gf_step_number {
		font-size: 20px;
		float: left;
		font-family: arial,sans-serif;
	}

	&.gf_step_active {
		filter: alpha(opacity=100);
		-moz-opacity: 1.0;
		-khtml-opacity: 1.0;
		opacity: 1.0;
	}
}

.gf_step_clear {
	display: block;
	clear: both;
	height: 1px;
	overflow: hidden;
}

/* PASSWORD STRENGTH INDICATOR */

.gfield_password_strength {
	border: 1px solid #DDD;
	margin: 0;
	padding: 3px 5px;
	text-align: center;
	width: 200px;
	background-color: #EEE;

	&.bad {
		background-color: #FFB78C;
		border-color: #FF853C;
	}

	&.good {
		background-color: #FFEC8b;
		border-color: #FC0;
	}

	&.short,
	&.mismatch {
		background-color: #FFA0A0;
		border-color: #f04040;
	}

	&.strong {
		background-color: #C3FF88;
		border-color: #8DFF1C;
	}
}

/* LIST FIELDS */

table.gfield_list,
table.gfield_list caption,
table.gfield_list tbody,
table.gfield_list tfoot,
table.gfield_list thead,
table.gfield_list tr,
table.gfield_list th,
table.gfield_list td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	background: none;
}

table.gfield_list {
	border-spacing: 0;
	border-collapse:collapse;
}

table.gfield_list thead th {
	font-weight: bold;
	text-align: left;
}

li.gfield.gfield_error table.gfield_list thead th {
	color: #790000;
}

table.gfield_list thead,
table.gfield_list tr {
	padding: 0;
	margin: 0;
}

table.gfield_list th,
table.gfield_list td {
	padding:0 0 0.5em 0;
}

table.gfield_list th + th,
table.gfield_list td + td {
	padding:0 0 0.5em 0.7em;
}

.left_label .gfield_list, .right_label .gfield_list {
	width: 64%;
}

.top_label .gfield_list {
	width: 100%;
}

.left_label .gf_list_one_column, .right_label .gf_list_one_column {
	width: 45%;
}

.top_label .gf_list_one_column {
	width: 46%;
}

.gfield_list input{
	width: 98%;
}

.gfield_icon_disabled {
	cursor: default !important;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	-khtml-opacity: 0.6;
	opacity: 0.6;
}

table.gfield_list td.gfield_list_icons {
	min-width: 45px !important;
}

/* MULTI-FILE UPLOAD */

.gform_fileupload_multifile .gform_drop_area {
	padding: 25px;
	border: 2px dashed #CCC;
	text-align: center;
	color: #111;
	margin-bottom: 10px;

	input[type=button] {
		padding: 5px 1em;
		font-size: 0.875em;
		margin-left: 10px;
		line-height: 1.3;
		width: auto !important;
		background: #999;
		
		&:hover,
		&:focus {
			background: darken(#999, 10%);
		}
	}
}

.right_label .gform_fileupload_multifile,
.left_label .gform_fileupload_multifile{
	margin-left: 31%;
}

.gform_delete{
	vertical-align:middle;
	cursor:pointer;
}

/* HTML */

div.gform_body ul.gform_fields li.gfield.gfield_html ul li,
form div.gform_body ul.gform_fields li.gfield.gfield_html ul li {
	list-style-type: disc !important;
	margin: 0 0 0.5em;
	overflow: visible;
	padding-left: 0;
}

div.gform_body ul.gform_fields li.gfield.gfield_html ul,
form div.gform_body ul.gform_fields li.gfield.gfield_html ul {
	list-style-type: disc !important;
	margin: 1em 0 1em 1.5em;
	padding-left: 0;
}

div.gform_body ul.gform_fields li.gfield.gfield_html ol li,
form div.gform_body ul.gform_fields li.gfield.gfield_html ol li {
	list-style-type: decimal!important;
	overflow:visible;
	margin: 0 0 0.5em;
	padding-left: 0;
}

div.gform_body ul.gform_fields li.gfield.gfield_html ol,
form div.gform_body ul.gform_fields li.gfield.gfield_html ol {
	list-style-type: decimal!important;
	margin: 1em 0 1.5em 2.0em;
	padding-left: 0;
}

div.gform_body ul.gform_fields li.gfield.gfield_html ol li ul,
form div.gform_body ul.gform_fields li.gfield.gfield_html ol li ul li {
    list-style-type: disc !important;
    padding-left: 0;
}

div.gform_body ul.gform_fields li.gfield.gfield_html ol li ul {
	margin: 1em 0 1em 1.5em;
}

form div.gform_body ul.gform_fields li.gfield.gfield_html ol li ul li {
	margin: 0 0 0.5em;
}

div.gform_body ul.gform_fields li.gfield.gfield_html dl {
	margin: 0 0 1.5em 0;
	padding-left: 0;
}

div.gform_body ul.gform_fields li.gfield.gfield_html dl dt {
	font-weight: bold;
}

div.gform_body ul.gform_fields li.gfield.gfield_html dl dd {
	margin: 0 0 1em 1.5em;
}

.left_label li.gfield_html_formatted,
.right_label li.gfield_html_formatted {
	margin-left: 32%;
}

.gfield_html.gfield_no_follows_desc {
	margin-top: 10px;
}


@media only screen and (min-width: $screen-sm-min) {}

@media only screen and (min-width: $screen-md-min) {}

@media only screen and (min-width: $screen-lg-min) {}

_ready_classes.scss

/******************************************************************
Site Name:
Author:

Stylesheet: Read Class Styles for Gravity Forms

Usage: Uncheck box in Gravity Forms Settings to "Not" Output default CSS
Reference: http://www.gravityhelp.com/documentation/page/CSS_Ready_Classes,
https://wordpress.org/plugins/gravity-forms-css-ready-selector/

******************************************************************/

/* inline fields */

li.gf_inline div.ginput_container {
	white-space: nowrap !important;
}

.right_label input.small,
.right_label select.small,
.left_label input.small,
.left_label select.small {
	width: 15%;
}

.right_label input.medium,
.right_label select.medium,
.left_label input.medium,
.left_label select.medium {
	width: 35%;
}

.right_label input.large,
.right_label select.large,
.left_label input.large,
.left_label select.large,
textarea.textarea {
	width: 63%;
}

.right_label div.ginput_complex,
.left_label div.ginput_complex {
	width: 64%;
}

.top_label {

	input.small,
	select.small,
	input.medium,
	select.medium,
	input.large,
	select.large,
	textarea.textarea {
		width: 100%;
	}

	li.gfield.gf_inline {
		vertical-align: top;
		width: auto !important;
		margin-right: 14px;
		float: none !important;
		display: -moz-inline-stack;
		display: inline-block;
		zoom: 1;

		input[type=text].large,
		input[type=url].large,
		input[type=email].large,
		input[type=tel].large,
		input[type=number].large,
		input[type=password].large {
			width: 25.4em !important;
		}

		input[type=text].medium,
		input[type=url].medium,
		input[type=email].medium,
		input[type=tel].medium,
		input[type=number].medium,
		input[type=password].medium {
			width: 18.7em !important;
		}

		input[type=text].datepicker.medium {
			width: 6em !important;
		}

		input[type=text].small,
		input[type=url].small,
		input[type=email].small,
		input[type=tel].small,
		input[type=number].small,
		input[type=password].small {
			width: 5em !important;
		}

		select  {
			width: auto !important;
		}

		textarea {
			width: 95% !important;
		}

		div.gfield_time_hour input[type=text],
		div.gfield_time_minute input[type=text] {
			width: 70% !important;
		}

		div.gfield_time_hour,
		div.gfield_time_minute,
		div.gfield_date_month,
		div.gfield_date_day,
		div.gfield_date_year {
			width: 50px;
		}

		div.gfield_time_ampm {
			width: auto;
		}
	} /* end li.gfield.gf_inline */

	/* 2 column */
	
	li.gfield.gf_left_half,
	li.gfield.gf_right_half {
		width: 100%;
		
		input.medium,
		input.large,
		select.medium,
		select.large,
		input.medium,
		input.large,
		select.medium,
		select.large {
			width: 100%;
		}
		
		textarea {
			width: 100%;
		}
		
		input.small {
			width: 100%;
		}
	}

	li.gfield.gf_left_half+li.gsection,
	li.gfield.gf_right_half+li.gsection {
		padding: 16px 0 8px 0;
	}

	li.gfield.gf_left_half+li.gfield.gsection.gf_left_half,
	li.gfield.gf_right_half+li.gfield.gsection.gf_left_half,
	li.gfield.gf_left_half+li.gfield.gsection.gf_right_half,
	li.gfield.gf_right_half+li.gfield.gsection.gf_right_half,
	li.gfield.gsection.gf_left_half+li.gfield.gsection.gf_left_half,
	li.gfield.gsection.gf_right_half+li.gfield.gsection.gf_left_half,
	li.gfield.gsection.gf_right_half+li.gfield.gsection.gf_right_half {
		padding: 16px 0 8px 0;
	}

	li.gfield.gsection.gf_left_half+li.gfield.gsection.gf_right_half {
		padding: 0 0 8px 0;
	}

	li.gfield.gsection.gf_left_half+li.gfield.gsection.gf_right_half+li.gfield.gsection.gf_left_half+li.gfield.gsection.gf_right_half {
		padding: 16px 0 8px 0;
	}

	li.gfield.gf_left_half+li.gfield,
	li.gfield.gf_right_half+li.gfield,
	li.gfield.gf_left_half+.gform_footer,
	li.gfield.gf_right_half+.gform_footer {
		clear: both
	}

	/* 3 column */

	li.gfield.gf_left_third,
	li.gfield.gf_middle_third,
	li.gfield.gf_right_third {
		width: 100%;
	}

	li.gfield.gfield_error.gf_left_third,
	li.gfield.gfield_error.gf_middle_third,
	li.gfield.gfield_error.gf_right_third {
		width: 100%;
	}

	li.gfield.gf_left_third+li.gsection,
	li.gfield.gf_right_third+li.gsection {
		padding: 16px 0 8px 0;
	}

	li.gfield.gf_left_third+li.gfield,
	li.gfield.gf_middle_third+li.gfield,
	li.gfield.gf_right_third+li.gfield,
	li.gfield.gf_left_third+.gform_footer,
	li.gfield.gf_middle_third+.gform_footer,
	li.gfield.gf_right_third+.gform_footer {
		clear: both;
	}
	
} /* end .top_label */

/* radio/checkbox sub-column */

li.gfield.gf_list_2col ul.gfield_checkbox li,
li.gfield.gf_list_2col ul.gfield_radio li,
li.gfield.gf_2col ul.gfield_checkbox li,
li.gfield.gf_2col ul.gfield_radio li {
	width: 100%;
	margin: 0 0 8px 0;
	min-height: 1.8em;
}

li.gfield.gf_list_3col ul.gfield_checkbox li,
li.gfield.gf_list_3col ul.gfield_radio li,
li.gfield.gf_3col ul.gfield_checkbox li,
li.gfield.gf_3col ul.gfield_radio li {
	width: 100%;
	margin: 0 0 8px 0;
	min-height: 1.8em;
}

li.gfield.gf_list_4col ul.gfield_checkbox li,
li.gfield.gf_list_4col ul.gfield_radio li {
	width: 100%;
	margin: 0 0 8px 0;
	min-height: 1.8em;
}

li.gfield.gf_list_5col ul.gfield_checkbox li,
li.gfield.gf_list_5col ul.gfield_radio li {
	width: 100%;
	float: left;
	margin: 0 0 8px 0;
	min-height: 1.8em;
}

li.gfield.gf_list_2col,
li.gfield.gf_list_3col,
li.gfield.gf_list_4col,
li.gfield.gf_list_5col,
li.gfield.gf_2col,
li.gfield.gf_3col {
	ul.gfield_checkbox,
	ul.gfield_radio {
		overflow: hidden;
	}
}

li.gfield.gf_list_2col,
li.gfield.gf_list_3col,
li.gfield.gf_list_4col,
li.gfield.gf_list_5col,
li.gfield.gf_list_inline {
	label.gfield_label {
		margin: 10px 0 10px 0;
	}
}

/* optional height settings for the radio/checkbox columns */

li.gfield.gf_list_height_25 {
	ul.gfield_checkbox li,
	ul.gfield_radio li {
		height: 25px;
	}
}

li.gfield.gf_list_height_50 {
	ul.gfield_checkbox li,
	ul.gfield_radio li {
		height: 50px;
	}
}

li.gfield.gf_list_height_75 {
	ul.gfield_checkbox li,
	ul.gfield_radio li {
		height: 75px;
	}
}

li.gfield.gf_list_height_100 {
	ul.gfield_checkbox li,
	ul.gfield_radio li {
		height: 100px;
	}
}

li.gfield.gf_list_height_125 {
	ul.gfield_checkbox li,
	ul.gfield_radio li {
		height: 125px;
	}
}

li.gfield.gf_list_height_150 {
	ul.gfield_checkbox li,
	ul.gfield_radio li {
		height: 150px;
	}
}

/* radio/checkbox inline list */

li.gfield.gf_list_inline {
	ul.gfield_checkbox li
	ul.gfield_radio li {
		width: auto !important;
		float: none !important;
		margin: 0 10px 10px 0;
		display: -moz-inline-stack;
		display: inline-block;
		zoom: 1;
	}
}

/* hide am/pm field */

li.gf_hide_ampm div.gfield_time_ampm {
	display: none !important;
}

/* scrolling text section break */

li.gsection.gf_scroll_text {
	height: 180px;
	width: 96%;
	overflow: auto;
	border: 1px solid #CCC;
	border-bottom: 1px solid #CCC !important;
	
	h2.gsection_title {
		margin: 10px 10px 0 10px !important;
	}
	
	.gsection_description {
		margin: 10px;
		font-size: 0.8em;
	}
}

div.gform_ul.gform_fields li.gfield.gsection.gf_scroll_text div.gsection_description,
form div.gform_ul.gform_fields li.gfield.gsection.gf_scroll_text div.gsection_description {
	ul {
		list-style-type: disc !important;
		margin: 1em 0 1em 1.5em;
		padding-left: 0;
		
		li {
			margin: 0 0 0.5em;
			overflow: visible;
			padding-left: 0;
		}
	}

	ol {
		list-style-type: decimal!important;
		margin: 1em 0 1.5em 2.0em;
		padding-left: 0;
		
		li {
			overflow:visible;
			margin: 0 0 0.5em;
			padding-left: 0;
			
			ul {
				margin: 1em 0 1em 1.5em;
				
				li {
					padding-left: 0;
					margin: 0 0 0.5em;
				}
			}
		}
	}
}

div.gform_ul.gform_fields li.gfield.gsection.gf_scroll_text div.gsection_description dl {
	margin: 0 0 1.5em 0;
	padding-left: 0;
	
	dt {
		font-weight: bold;
	}
	
	dd {
		margin: 0 0 1em 1.5em;
	}
}

/* HTML field alert style */

li.gfield.gfield_html.gf_alert_green,
li.gfield.gfield_html.gf_alert_red,
li.gfield.gfield_html.gf_alert_yellow,
li.gfield.gfield_html.gf_alert_gray,
li.gfield.gfield_html.gf_alert_blue {
	margin: 20px 0 !important;
	padding: 20px !important;
}

li.gfield.gfield_html.gf_alert_green {
	border: 1px solid #97B48A;
	background-color: #CBECA0;
	text-shadow: #DFB 1px 1px;
	color: #030;
}

li.gfield.gfield_html.gf_alert_red {
	border: 1px solid #CFADB3;
	background-color: #FAF2F5;
	text-shadow: #FFF 1px 1px;
	color: #832525;
}

li.gfield.gfield_html.gf_alert_yellow {
	border: 1px solid #E6DB55;
	background-color: #FFFBCC;
	text-shadow: #FCFAEA 1px 1px;
	color: #222;
}

li.gfield.gfield_html.gf_alert_gray {
	border: 1px solid #CCC;
	background-color: #EEE;
	text-shadow: #FFF 1px 1px;
	color: #424242;
}

li.gfield.gfield_html.gf_alert_blue {
	border: 1px solid #a7c2e7;
	background-color: #D1E4F3;
	text-shadow: #E0F1FF 1px 1px;
	color: #314475;
}

/* confirmation styles */

div.gform_confirmation_wrapper.gf_confirmation_simple_yellow {
	margin: 30px 0;
	max-width: 99%;
	border-top: 1px solid #E6DB55;
	border-bottom: 1px solid #E6DB55;
	padding: 2em;
	background-color: #FFFBCC;
	color: #424242;
	font-size: 1.6em;
}

div.gform_confirmation_wrapper.gf_confirmation_simple_gray {
	margin: 30px 0;
	max-width: 99%;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 2em;
	background-color: #EAEAEA;
	color: #424242;
	font-size: 1.6em;
}

div.gform_confirmation_wrapper.gf_confirmation_yellow_gradient {
	position: relative;
	background-color: #FFFBD2;
	margin: 30px 0;
	border: 1px solid #E6DB55;
	@include box-shadow(0 0 5px rgba(221,215,131,0.75));
	
	div#gforms_confirmation_message {
		margin: 0;
		padding: 40px;
		max-width: 99%;
		font-size: 1.8em;
		border-top: 2px solid #FFF;
		border-bottom: 1px solid #E6DB55; 
		background-color:#FFFBCC; 
		color:#424242;
		background: #fffce5;
		background: -moz-linear-gradient(top,  #fffce5 0%, #fff9bf 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fffce5), color-stop(100%,#fff9bf));
		background: -webkit-linear-gradient(top,  #fffce5 0%,#fff9bf 100%);
		background: -o-linear-gradient(top,  #fffce5 0%,#fff9bf 100%);
		background: -ms-linear-gradient(top,  #fffce5 0%,#fff9bf 100%);
		background: linear-gradient(to bottom,  #fffce5 0%,#fff9bf 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffce5', endColorstr='#fff9bf',GradientType=0 );
	}
}

div.gform_confirmation_wrapper.gf_confirmation_green_gradient {
	position: relative;
	background-color: #f1fcdf;
	margin: 30px 0;
	border: 1px solid #a7c37c;
	@include box-shadow(0 0 5px rgba(86,122,86,0.4));
	
	div#gforms_confirmation_message {
		margin: 0;
		padding: 40px;
		max-width: 99%;
		font-size: 1.8em;
		border-top: 2px solid #effade;
		border-bottom: 1px solid #a7c37c;
		background-color:#FFFBCC; 
		text-shadow: #DFB 1px 1px;
		color: #030;
		background: rgb(219,242,183);
		background: -moz-linear-gradient(top,  rgba(219,242,183,1) 0%, rgba(180,208,136,1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(219,242,183,1)), color-stop(100%,rgba(180,208,136,1)));
		background: -webkit-linear-gradient(top,  rgba(219,242,183,1) 0%,rgba(180,208,136,1) 100%);
		background: -o-linear-gradient(top,  rgba(219,242,183,1) 0%,rgba(180,208,136,1) 100%);
		background: -ms-linear-gradient(top,  rgba(219,242,183,1) 0%,rgba(180,208,136,1) 100%);
		background: linear-gradient(to bottom,  rgba(219,242,183,1) 0%,rgba(180,208,136,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dbf2b7', endColorstr='#b4d088',GradientType=0 );
	}
}

div.gform_confirmation_wrapper.gf_confirmation_yellow_gradient
div.gform_confirmation_wrapper.gf_confirmation_green_gradient {
	&:before, &:after {
		z-index: -1; 
		position: absolute; 
		content: "";
		bottom: 15px;
		left: 10px;
		width: 50%; 
		top: 80%;
		max-width:40%;
		background: rgba(0, 0, 0, 0.2); 
		@include box-shadow(0 15px 10px rgba(0,0,0,0.2));
		@include transform(rotate(-3deg));
	}
	
	&:after {
		@include transform(rotate(3deg));
		right: 10px;
		left: auto;
	}
}

@media only screen and (min-width: $screen-sm-min) {
	.top_label {
		input.large,
		select.large,
		textarea.textarea {
			width: 100%;
		}
	
		input.small,
		select.small,
		.select2-container.small {
			width: 25%;
		}

		input.medium,
		select.medium,
		.select2-container.medium {
			width: 49%;
		}
		
		li.gf_list_inline {
			ul.gfield_radio,
			ul.gfield_checkbox {
				li {
					display: inline-block;
					label {
						margin-right: 2em;
					}
				}
			}
		}
		
		li.gfield.gf_left_half,
		li.gfield.gf_right_half,
		li.gfield_medium {
			width: 49%;
			
			input.small {
				width: 35%;
			}
		}
		
		li.gfield.gf_left_half {
			float: left;
			clear: left !important;
		}

		li.gfield.gf_right_half {
			float: right;
			clear: right !important;
		}
		
		li.gfield.gf_left_half,
		li.gfield.gf_right_half {
			input.large,
			select.large,
			.select2-container.large,
			textarea.textarea,
			input.medium,
			select.medium,
			.select2-container.medium {
				width: 100% !important;
			}
		}
		
		li.gfield.gf_left_third,
		li.gfield.gf_middle_third,
		li.gfield.gf_right_third {
			width: 32%;
			
			input.medium,
			input.large,
			select.medium,
			select.large,
			.select2-container.medium,
			.select2-container.large {
				width: 100%;
			}
		}

		li.gfield.gfield_error.gf_left_third,
		li.gfield.gfield_error.gf_middle_third,
		li.gfield.gfield_error.gf_right_third {
			width: 29%;
		}

		li.gfield.gf_left_third {
			float: left;
			clear: left !important;
		}

		li.gfield.gf_middle_third {
			float: left;
			margin-left: 2% !important;
			clear: none !important;
		}

		li.gfield.gfield_error.gf_middle_third {
			margin-left: 3%;
		}

		li.gfield.gf_right_third {
			float: right;
			clear: right !important;
		}
	} /* end .top_label */
	
	li.gfield.gf_list_2col,
	li.gfield.gf_list_3col,
	li.gfield.gf_list_4col,
	li.gfield.gf_list_5col {
		label {
			margin-bottom: 10px;
		}
	}
	
	li.gfield.gf_list_2col ul.gfield_checkbox li,
	li.gfield.gf_list_2col ul.gfield_radio li,
	li.gfield.gf_2col ul.gfield_checkbox li,
	li.gfield.gf_2col ul.gfield_radio li {
		width: 50%;
		float: left;
	}

	li.gfield.gf_list_3col ul.gfield_checkbox li,
	li.gfield.gf_list_3col ul.gfield_radio li,
	li.gfield.gf_3col ul.gfield_checkbox li,
	li.gfield.gf_3col ul.gfield_radio li {
		width: 33%;
		float: left;
	}

	li.gfield.gf_list_4col ul.gfield_checkbox li,
	li.gfield.gf_list_4col ul.gfield_radio li {
		width: 25%;
		float: left;
	}

	li.gfield.gf_list_5col ul.gfield_checkbox li,
	li.gfield.gf_list_5col ul.gfield_radio li {
		width: 20%;
		float: left;
	}
}

@media only screen and (min-width: $screen-md-min) {}

@media only screen and (min-width: $screen-lg-min) {}

_submission_and_errors.scss

/******************************************************************
Site Name:
Author:

Stylesheet: Submission and Error Styles for Gravity Forms

Usage: Uncheck box in Gravity Forms Settings to "Not" Output default CSS

******************************************************************/

/* ERRORS */

.gform_wrapper.gform_validation_error {
	::-webkit-input-placeholder {
		color: #a00;
	}
	:-moz-placeholder {
		color: #a00;
	}
	::-moz-placeholder {
		color: #a00;
	}
	:-ms-input-placeholder {
		color: #a00;
	}
}

li.gfield.gfield_error,
li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
	/*background-color: #FFDFE0;
	margin-bottom: 6px !important;
	padding: 6px 6px 4px 6px !important;
	border-top: 1px solid #C89797;
	border-bottom: 1px solid #C89797;*/
}

li.gfield.gfield_creditcard_warning {
	margin-bottom: 6px !important;
	padding: 6px 6px 4px 6px !important;
	border: 1px dashed #a00;
}

li.gfield.gfield_creditcard_warning div.gfield_creditcard_warning_message {
	font-size:1em;
	font-family: $font__sans;
	padding: 10px 20px 10px 45px;
	min-height: 25px;
	background-image: url('#{$plugins-path}gravityforms/images/stopbanner.png');
	background-repeat: no-repeat;
	background-position: 0 0;
	background-color: #a00;
	border-bottom: 1px solid #620101;
	color: #FFF;
	text-shadow: 0 1px 1px rgba(0,0,0,0.50);
	line-height: 1.3em;
	letter-spacing: 0.2pt;
}

li.gfield + li.gfield.gfield_creditcard_warning {
	margin-top: 14px !important;
}

.gfield_error .gfield_label {
	//color: #a00;
}

li.gfield.gfield_error.gfield_contains_required {
	//margin-top: 12px;
	//margin-bottom: 12px !important;
	//padding-left: 10px !important;
}

li.gfield.gfield_error.gfield_contains_required label.gfield_label,
li.gfield.gfield_error.gfield_contains_required div.ginput_container  {
	//margin-top: 12px;
}

div.validation_error {
	color: #a00;
	border: 1px solid #a00;
	background: #FFDFE0;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 1.6em;
	padding: .5em .5em .5em 1em;
	//-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
	//-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
	//box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

div.gf_page_steps+div.validation_error {
	margin-top: 16px;
}

div.gfield_description.validation_error {
	color: #AF3124;
	font-weight: bold;
	font-size: 0.85em;
	line-height: 1.2em;
	margin-bottom: 16px;
}

.validation_message {
	color: #a00;
	font-weight: bold !important;
	letter-spacing: normal;
}

li.gfield_error {
	input[type=text],
	input[type=url],
	input[type=email],
	input[type=tel],
	input[type=number],
	input[type=password],
	textarea,
	input,
	.select2-container .select2-choice {
		border: 1px solid lighten(#a00, 20%);
		//border: 1px solid #a00;
		//background: #FFDFE0;
		
		&:focus {
			border: 1px solid #a00;
			//background: #FFF;
		}
	}
}

li.gfield_error div.ginput_complex.ginput_container label,
li.gfield_error ul.gfield_checkbox,
li.gfield_error ul.gfield_radio {
	color: #a00;
}

.top_label .gfield_description.validation_message,
.gfield_description.validation_message {
	//padding: 10px 0 !important;
}

.ginput_container + .gfield_description.validation_message {
	//margin-top: 6px;
}

.gfield_description + .gform_wrapper .gfield_description.validation_message {
	//margin-top: 6px;
}

.ginput_container.ginput_list + .gfield_description.validation_message {
	margin-top: 0;
}

/* AJAX FORMS */

.gform_ajax_spinner {
	padding-left: 10px;
}

/* CAPTCHA */

.gfield_captcha_input_container {
	padding-top: 3px;
}

.simple_captcha_small input {
	width: 100px;
}

.simple_captcha_medium input {
	width: 150px;
}

.simple_captcha_large input {
	width: 200px;
}

.gform_wrapper .left_label .simple_captcha_small,
.right_label .simple_captcha_small,
.left_label .simple_captcha_medium,
.right_label .simple_captcha_medium,
.left_label .simple_captcha_large,
.right_label .simple_captcha_large {
	margin-left: 32%;
}

.gfield_captcha_container img.gfield_captcha {
	border: none !important;
	background: none !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* MATH CHALLENGE */


.math_small input {
	width: 69px;
}

.math_medium input {
	width: 90px;
}

.math_large input {
	width: 108px;
}

.left_label .math_small,
.right_label .math_small,
.left_label .math_medium,
.right_label .math_medium,
.left_label .math_large,
.right_label .math_large {
	margin-left: 32%;
}

/* HIDDEN FIELDS */

input[type=hidden],
input.gform_hidden,
.gform_hidden,
.gf_hidden {
	display: none !important;
	max-height: 1px !important;
	overflow: hidden;
}

.ginput_full br,
.ginput_left br,
.ginput_right br {
	display: none !important;
}

/* HIDE HONEYPOT */

.gform_validation_container,
.gform_wrapper .gform_validation_container,
body .gform_wrapper li.gform_validation_container,
body .gform_wrapper .gform_body ul.gform_fields li.gfield.gform_validation_container,
body .gform_wrapper ul.gform_fields li.gfield.gform_validation_container {
	display: none !important;
	position: absolute !important;
	left: -9000px;
}

@media only screen and (min-width: $screen-sm-min) {}

@media only screen and (min-width: $screen-md-min) {}

@media only screen and (min-width: $screen-lg-min) {}