/css/gray.css |
@@ -4,34 +4,36 @@ |
html{ |
height: 100%; |
} |
.formoid-default-dark-gray{ |
body { |
background-color:#ebebeb; |
} |
.dark-grey{ |
margin:0 auto; |
} |
.formoid-default-dark-gray>div, |
.formoid-default-dark-gray>.title{ |
.dark-grey>div, |
.dark-grey>.title{ |
margin: 8px; |
text-align: center; |
} |
.formoid-default-dark-gray .error-field .required{ |
.dark-grey .error-field .required{ |
color:#FF9999; |
} |
.formoid-default-dark-gray .error-field input, |
.formoid-default-dark-gray .error-field input[type=text], |
.formoid-default-dark-gray .error-field input[type=password], |
.formoid-default-dark-gray .error-field input[type=email], |
.formoid-default-dark-gray .error-field input[type=url], |
.formoid-default-dark-gray .error-field input[type=date], |
.formoid-default-dark-gray .error-field input[type=number], |
.formoid-default-dark-gray .error-field textarea{ |
.dark-grey .error-field input, |
.dark-grey .error-field input[type=text], |
.dark-grey .error-field input[type=password], |
.dark-grey .error-field input[type=email], |
.dark-grey .error-field input[type=url], |
.dark-grey .error-field input[type=date], |
.dark-grey .error-field input[type=number], |
.dark-grey .error-field textarea{ |
border-color:#D893A1; |
background-color: #FBE6F2; |
} |
.formoid-default-dark-gray label.error{ |
.dark-grey label.error{ |
display:inline-block; |
font-size:0.9em; |
} |
.formoid-default-dark-gray .error, |
.formoid-default-dark-gray .error #recaptcha_widget_div{ |
.dark-grey .error, |
.dark-grey .error #recaptcha_widget_div{ |
padding: 3px 14px; |
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); |
background-color: #fcf8e3; |
@@ -45,53 +47,53 @@ |
border-color: #eed3d7; |
color: #c09853; |
} |
.formoid-default-dark-gray .error h4 { |
.dark-grey .error h4 { |
color: #b94a48; |
margin: 0; |
} |
|
.formoid-default-dark-gray .error .close { |
.dark-grey .error .close { |
position: relative; |
top: -2px; |
right: -21px; |
line-height: 20px; |
} |
.formoid-default-dark-gray .column{ |
.dark-grey .column{ |
float:left; |
} |
/* width = parseInt(100/columns.length)*/ |
.formoid-default-dark-gray .column1{ width:100%;} |
.formoid-default-dark-gray .column2{ width:50%; } |
.formoid-default-dark-gray .column3{ width:33%; } |
.formoid-default-dark-gray .column4{ width:25%; } |
.formoid-default-dark-gray .column5{ width:20%; } |
.dark-grey .column1{ width:100%;} |
.dark-grey .column2{ width:50%; } |
.dark-grey .column3{ width:33%; } |
.dark-grey .column4{ width:25%; } |
.dark-grey .column5{ width:20%; } |
|
|
|
.formoid-default-dark-gray .large{ |
.dark-grey .large{ |
width: 100%; |
*width: 94%; |
} |
.formoid-default-dark-gray .medium{ |
.dark-grey .medium{ |
width: 50%; |
*width: 47%; |
} |
.formoid-default-dark-gray .small{ |
.dark-grey .small{ |
width: 25%; |
*width: 23%; |
} |
|
.formoid-default-dark-gray textarea.large{ |
.dark-grey textarea.large{ |
width: 100%; |
*width: 94%; |
height: 20em; |
} |
.formoid-default-dark-gray textarea.medium{ |
.dark-grey textarea.medium{ |
width: 100%; |
*width: 94%; |
height: 10em; |
} |
.formoid-default-dark-gray textarea.small{ |
.dark-grey textarea.small{ |
width: 100%; |
*width: 94%; |
height: 5.5em; |
@@ -183,25 +185,25 @@ |
font-style: normal; |
} |
|
.formoid-default-dark-gray{ |
.dark-grey{ |
-webkit-border-radius: 4px; |
-moz-border-radius: 4px; |
border-radius: 4px; |
} |
.formoid-default-dark-gray, |
.formoid-default-dark-gray select, |
.formoid-default-dark-gray input[type=button], |
.formoid-default-dark-gray .btn, |
.formoid-default-dark-gray input[type=submit] , |
.formoid-default-dark-gray .element-file .button{ |
.dark-grey, |
.dark-grey select, |
.dark-grey input[type=button], |
.dark-grey .btn, |
.dark-grey input[type=submit] , |
.dark-grey .element-file .button{ |
color: inherit; |
padding: 5px; |
} |
.formoid-default-dark-gray h2 { |
.dark-grey h2 { |
margin: 0.2em 0; |
} |
|
.formoid-default-dark-gray label { |
.dark-grey label { |
display: block; |
font-size: 1em; |
margin-bottom: 3px; |
@@ -208,7 +210,7 @@ |
clear: both; |
} |
|
.formoid-default-dark-gray div, .formoid-default-dark-gray span, .formoid-default-dark-gray label, .formoid-default-dark-gray input, .formoid-default-dark-gray textarea, .formoid-default-dark-gray select, .formoid-default-dark-gray button, .formoid-default-dark-gray ul, .formoid-default-dark-gray li, .formoid-default-dark-gray a{ |
.dark-grey div, .dark-grey span, .dark-grey label, .dark-grey input, .dark-grey textarea, .dark-grey select, .dark-grey button, .dark-grey ul, .dark-grey li, .dark-grey a{ |
font-family: inherit; |
color: inherit; |
} |
@@ -222,7 +224,7 @@ |
----------------------------------------------------- |
*/ |
|
.formoid-default-dark-gray .btn{ |
.dark-grey .btn{ |
display: -moz-inline-box; |
display: inline-block; |
vertical-align: middle; |
@@ -231,11 +233,11 @@ |
} |
|
/* Button & submit*/ |
.formoid-default-dark-gray select, |
.formoid-default-dark-gray input[type=button], |
.formoid-default-dark-gray .btn, |
.formoid-default-dark-gray input[type=submit], |
.formoid-default-dark-gray .element-file .button{ |
.dark-grey select, |
.dark-grey input[type=button], |
.dark-grey .btn, |
.dark-grey input[type=submit], |
.dark-grey .element-file .button{ |
display: -moz-inline-box; |
display: inline-block; |
*display: inline; |
@@ -263,14 +265,14 @@ |
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); |
outline: 0 none; |
} |
.formoid-default-dark-gray .element-file .button{ |
.dark-grey .element-file .button{ |
-webkit-border-radius: 0 4px 4px 0; |
-moz-border-radius: 0 4px 4px 0; |
border-radius: 0 4px 4px 0; |
} |
.formoid-default-dark-gray select, |
.formoid-default-dark-gray .btn, |
.formoid-default-dark-gray .element-file .button{ |
.dark-grey select, |
.dark-grey .btn, |
.dark-grey .element-file .button{ |
background-color: #f5f5f5; |
*background-color: #e6e6e6; |
background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6); |
@@ -280,29 +282,29 @@ |
background-image: linear-gradient(to bottom, #ffffff, #e6e6e6); |
background-repeat: repeat-x; |
} |
.formoid-default-dark-gray select{ |
.dark-grey select{ |
text-align: left; |
width: 100%; |
} |
|
.formoid-default-dark-gray select:hover, |
.formoid-default-dark-gray input[type=button]:hover, |
.formoid-default-dark-gray .btn:hover, |
.formoid-default-dark-gray input[type=button]:active, |
.formoid-default-dark-gray input[type=button][disabled]{ |
.dark-grey select:hover, |
.dark-grey input[type=button]:hover, |
.dark-grey .btn:hover, |
.dark-grey input[type=button]:active, |
.dark-grey input[type=button][disabled]{ |
background-color: #e6e6e6; |
*background-color: #d9d9d9; |
} |
|
.formoid-default-dark-gray select:active, |
.formoid-default-dark-gray .btn:active, |
.formoid-default-dark-gray input[type=button]:active{ |
.dark-grey select:active, |
.dark-grey .btn:active, |
.dark-grey input[type=button]:active{ |
background-color: #cccccc; |
} |
|
.formoid-default-dark-gray select:hover, |
.formoid-default-dark-gray .btn:hover, |
.formoid-default-dark-gray input[type=button]:hover { |
.dark-grey select:hover, |
.dark-grey .btn:hover, |
.dark-grey input[type=button]:hover { |
text-decoration: none; |
background-position: 0 -15px; |
-webkit-transition: background-position 0.1s linear; |
@@ -311,9 +313,9 @@ |
transition: background-position 0.1s linear; |
} |
|
.formoid-default-dark-gray select:active, |
.formoid-default-dark-gray .btn:active, |
.formoid-default-dark-gray input[type=button]:active { |
.dark-grey select:active, |
.dark-grey .btn:active, |
.dark-grey input[type=button]:active { |
background-image: none; |
outline: 0; |
-webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); |
@@ -321,8 +323,8 @@ |
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05); |
} |
|
.formoid-default-dark-gray .btn[disabled], |
.formoid-default-dark-gray input[type=button][disabled] { |
.dark-grey .btn[disabled], |
.dark-grey input[type=button][disabled] { |
cursor: default; |
background-image: none; |
opacity: 0.65; |
@@ -332,15 +334,15 @@ |
box-shadow: none; |
} |
|
.formoid-default-dark-gray input[type=submit], |
.formoid-default-dark-gray .element-file .button { |
.dark-grey input[type=submit], |
.dark-grey .element-file .button { |
font-size: 1em; |
font-family: inherit; |
color: #ffffff; |
} |
|
.formoid-default-dark-gray input[type=submit]:hover, |
.formoid-default-dark-gray .element-file .button:hover { |
.dark-grey input[type=submit]:hover, |
.dark-grey .element-file .button:hover { |
color: #ffffff; |
text-decoration: none; |
background-position: 0 -15px; |
@@ -350,10 +352,10 @@ |
transition: background-position 0.1s linear; |
} |
|
.formoid-default-dark-gray input[type=submit]:active, |
.formoid-default-dark-gray input[type=submit][disabled], |
.formoid-default-dark-gray .element-file .button:active, |
.formoid-default-dark-gray .element-file .button[disabled] { |
.dark-grey input[type=submit]:active, |
.dark-grey input[type=submit][disabled], |
.dark-grey .element-file .button:active, |
.dark-grey .element-file .button[disabled] { |
background-image: none; |
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset, 0 1px 2px rgba(0, 0, 0, 0.05); |
outline: 0 none; |
@@ -360,13 +362,13 @@ |
} |
|
/* Radio & checkbox */ |
.formoid-default-dark-gray div.element-checkbox, |
.formoid-default-dark-gray div.element-radio{ |
.dark-grey div.element-checkbox, |
.dark-grey div.element-radio{ |
overflow:hidden; |
} |
/* clearfix */ |
.formoid-default-dark-gray div.element-checkbox:after, |
.formoid-default-dark-gray div.element-radio:after { |
.dark-grey div.element-checkbox:after, |
.dark-grey div.element-radio:after { |
content: "."; |
display: block; |
height: 0; |
@@ -374,8 +376,8 @@ |
visibility: hidden; |
} |
|
.formoid-default-dark-gray input[type=checkbox], |
.formoid-default-dark-gray input[type=radio]{ |
.dark-grey input[type=checkbox], |
.dark-grey input[type=radio]{ |
z-index:1; |
position: absolute; |
float: left; |
@@ -387,8 +389,8 @@ |
cursor: pointer; |
} |
|
.formoid-default-dark-gray input[type=radio]+span, |
.formoid-default-dark-gray input[type=checkbox]+span{ |
.dark-grey input[type=radio]+span, |
.dark-grey input[type=checkbox]+span{ |
height: 19px; |
margin-right:-19px; |
padding-top: 0; |
@@ -399,8 +401,8 @@ |
vertical-align:top; |
line-height: 1.4; |
} |
.formoid-default-dark-gray input[type=radio]+span:before, |
.formoid-default-dark-gray input[type=checkbox]+span:before{ |
.dark-grey input[type=radio]+span:before, |
.dark-grey input[type=checkbox]+span:before{ |
font-family: formoid; |
color: transparent; |
text-align: center; |
@@ -423,7 +425,7 @@ |
-moz-osx-font-smoothing: grayscale; |
} |
/* checkbox */ |
.formoid-default-dark-gray input[type=checkbox]+span:before{ |
.dark-grey input[type=checkbox]+span:before{ |
content: "\e004"; |
font-size: 0.8em; |
padding: 0.1em; |
@@ -433,15 +435,15 @@ |
-moz-border-radius:0.3em; |
border-radius:0.3em; |
} |
.formoid-default-dark-gray input[type=checkbox]:hover+span:before{ |
.dark-grey input[type=checkbox]:hover+span:before{ |
box-shadow: 0 0 2px 2px #F1F1F1; |
} |
.formoid-default-dark-gray input[type=checkbox]:checked+span:before{ |
.dark-grey input[type=checkbox]:checked+span:before{ |
color: #616161; |
} |
|
/* radio */ |
.formoid-default-dark-gray input[type=radio]+span:before{ |
.dark-grey input[type=radio]+span:before{ |
font-family: formoid; |
content: "\e005"; |
font-size: 1.1em; |
@@ -452,22 +454,22 @@ |
-moz-border-radius: 50%; |
border-radius: 50%; |
} |
.formoid-default-dark-gray input[type=radio]:hover+span:before{ |
.dark-grey input[type=radio]:hover+span:before{ |
box-shadow: 0 0 2px 2px #F1F1F1; |
} |
.formoid-default-dark-gray input[type=radio]:checked+span:before{ |
.dark-grey input[type=radio]:checked+span:before{ |
color: #616161; |
} |
|
|
.formoid-default-dark-gray input[type=text], |
.formoid-default-dark-gray input[type=password], |
.formoid-default-dark-gray input[type=email], |
.formoid-default-dark-gray input[type=url], |
.formoid-default-dark-gray input[type=number], |
.formoid-default-dark-gray input[type=date], |
.formoid-default-dark-gray .element-file .file_text, |
.formoid-default-dark-gray textarea { |
.dark-grey input[type=text], |
.dark-grey input[type=password], |
.dark-grey input[type=email], |
.dark-grey input[type=url], |
.dark-grey input[type=number], |
.dark-grey input[type=date], |
.dark-grey .element-file .file_text, |
.dark-grey textarea { |
padding: 6px 2%; |
/*margin-left:-1px;*/ |
font-family:inherit; |
@@ -495,10 +497,10 @@ |
-o-box-sizing: border-box; |
box-sizing: border-box; |
} |
.formoid-default-dark-gray .element-address input[type=text], |
.formoid-default-dark-gray .element-name input[type=text], |
.formoid-default-dark-gray .element-file .file_text, |
.formoid-default-dark-gray textarea{ |
.dark-grey .element-address input[type=text], |
.dark-grey .element-name input[type=text], |
.dark-grey .element-file .file_text, |
.dark-grey textarea{ |
width: 100%; |
*width: 94%; |
} |
@@ -505,12 +507,12 @@ |
|
|
/* prevent conflicts with bootstrap */ |
.formoid-default-dark-gray .dropdown-menu input[type=checkbox]{ |
.dark-grey .dropdown-menu input[type=checkbox]{ |
display:none; |
} |
|
/* NAME last first */ |
.formoid-default-dark-gray .element-name .nameFirst{ |
.dark-grey .element-name .nameFirst{ |
width: 40%; |
*width: 39%; |
left: 0; |
@@ -520,7 +522,7 @@ |
zoom: 1; |
*display: inline; |
} |
.formoid-default-dark-gray .element-name .nameLast{ |
.dark-grey .element-name .nameLast{ |
width: 55%; |
*width: 50%; |
display: inline-block; |
@@ -530,8 +532,8 @@ |
} |
|
/* ADDRESS */ |
.formoid-default-dark-gray .element-address .city, |
.formoid-default-dark-gray .element-address .zip{ |
.dark-grey .element-address .city, |
.dark-grey .element-address .zip{ |
width: 47%; |
*width: 44%; |
display: inline-block; |
@@ -540,8 +542,8 @@ |
vertical-align: top; |
margin-right: 6%; |
} |
.formoid-default-dark-gray .element-address .state, |
.formoid-default-dark-gray .element-address .country{ |
.dark-grey .element-address .state, |
.dark-grey .element-address .country{ |
width: 47%; |
*width: 44%; |
display: inline-block; |
@@ -549,48 +551,48 @@ |
*display: inline; |
vertical-align: top; |
} |
.formoid-default-dark-gray .element-address .country select{ |
.dark-grey .element-address .country select{ |
cursor: pointer; |
} |
.formoid-default-dark-gray .element-address label, |
.formoid-default-dark-gray .element-name label{ |
.dark-grey .element-address label, |
.dark-grey .element-name label{ |
font-size: 0.8em; |
} |
.formoid-default-dark-gray .element-address label.title, |
.formoid-default-dark-gray .element-name label.title{ |
.dark-grey .element-address label.title, |
.dark-grey .element-name label.title{ |
font-size: 1em; |
} |
|
|
/* type number */ |
.formoid-default-dark-gray input[type=number]::-webkit-inner-spin-button, |
.formoid-default-dark-gray input[type=number]::-webkit-outer-spin-button{ |
.dark-grey input[type=number]::-webkit-inner-spin-button, |
.dark-grey input[type=number]::-webkit-outer-spin-button{ |
-webkit-appearance: none; |
} |
|
/* File input */ |
.formoid-default-dark-gray .element-file label{ |
.dark-grey .element-file label{ |
position: relative; |
} |
.formoid-default-dark-gray .element-file .title{ |
.dark-grey .element-file .title{ |
position: static; |
} |
.formoid-default-dark-gray .element-file .button{ |
.dark-grey .element-file .button{ |
z-index: 1; |
position: absolute; |
right: -2px; |
} |
.formoid-default-dark-gray .element-file .file_text{ |
.dark-grey .element-file .file_text{ |
right: 0; |
overflow: hidden; |
cursor: pointer; |
background-color: #fff; |
} |
.formoid-default-dark-gray .element-file .file_text:before{ |
.dark-grey .element-file .file_text:before{ |
content: "_"; |
opacity: 0; |
} |
.formoid-default-dark-gray .element-file .file_input { |
.dark-grey .element-file .file_input { |
position: absolute; |
top: 0; |
right: 0; |
@@ -601,8 +603,8 @@ |
filter: alpha(opacity=0); |
width: 100%; |
} |
* html .formoid-default-dark-gray .element-file .file_input, |
*+html .formoid-default-dark-gray .element-file .file_input{ |
* html .dark-grey .element-file .file_input, |
*+html .dark-grey .element-file .file_input{ |
position: relative; |
left: auto; |
right: auto; |
@@ -612,31 +614,31 @@ |
opacity: 1; |
filter: alpha(opacity=100); |
} |
* html .formoid-default-dark-gray .element-file .button, |
*+html .formoid-default-dark-gray .element-file .button{ |
* html .dark-grey .element-file .button, |
*+html .dark-grey .element-file .button{ |
display: none; |
} |
* html .formoid-default-dark-gray .element-file label, |
*+html .formoid-default-dark-gray .element-file label, |
* html .formoid-default-dark-gray .element-file .file_text, |
*+html .formoid-default-dark-gray .element-file .file_text{ |
* html .dark-grey .element-file label, |
*+html .dark-grey .element-file label, |
* html .dark-grey .element-file .file_text, |
*+html .dark-grey .element-file .file_text{ |
border: none; |
} |
* html .formoid-default-dark-gray .element-file .title, |
*+html .formoid-default-dark-gray .element-file .title{ |
* html .dark-grey .element-file .title, |
*+html .dark-grey .element-file .title{ |
display: block; |
} |
|
|
@media all and (max-width:400px){ |
.formoid-default-dark-gray .element-radio .column, |
.formoid-default-dark-gray .element-checkbox .column, |
.formoid-default-dark-gray .element-name .nameFirst, |
.formoid-default-dark-gray .element-name .nameLast, |
.formoid-default-dark-gray .element-address .city, |
.formoid-default-dark-gray .element-address span.state, |
.formoid-default-dark-gray .element-address .zip, |
.formoid-default-dark-gray .element-address .country{ |
.dark-grey .element-radio .column, |
.dark-grey .element-checkbox .column, |
.dark-grey .element-name .nameFirst, |
.dark-grey .element-name .nameLast, |
.dark-grey .element-address .city, |
.dark-grey .element-address span.state, |
.dark-grey .element-address .zip, |
.dark-grey .element-address .country{ |
width: 100%; |
display: block; |
margin-right: 0; |
@@ -1337,10 +1339,10 @@ |
cursor: pointer; |
width: 16px; |
height: 16px; |
}/* .formoid-default-dark-gray color scheme begin */ |
}/* .dark-grey color scheme begin */ |
|
.formoid-default-dark-gray input[type=submit], |
.formoid-default-dark-gray .element-file .button { |
.dark-grey input[type=submit], |
.dark-grey .element-file .button { |
background-color: #222222; |
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); |
background-image: -moz-linear-gradient(top, #444444, #222222); |
@@ -1353,15 +1355,15 @@ |
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#222222', GradientType=0); |
/* border-color: #1598d9 #1598d9 #007bb8 #1598d9; */ |
} |
.formoid-default-dark-gray input[type=submit]:hover, |
.formoid-default-dark-gray .element-file .button:hover { |
.dark-grey input[type=submit]:hover, |
.dark-grey .element-file .button:hover { |
background-color: #222222; |
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#47b4eb', endColorstr='#222222', GradientType=0); |
} |
.formoid-default-dark-gray input[type=submit]:active, |
.formoid-default-dark-gray input[type=submit][disabled], |
.formoid-default-dark-gray .element-file .button:active, |
.formoid-default-dark-gray .element-file .button[disabled]{ |
.dark-grey input[type=submit]:active, |
.dark-grey input[type=submit][disabled], |
.dark-grey .element-file .button:active, |
.dark-grey .element-file .button[disabled]{ |
background-color: #222222; |
*background-color: #222222; |
} |
@@ -1368,14 +1370,14 @@ |
|
|
|
.formoid-default-dark-gray input[type=text]:focus, |
.formoid-default-dark-gray input[type=password]:focus, |
.formoid-default-dark-gray input[type=email]:focus, |
.formoid-default-dark-gray input[type=url]:focus, |
.formoid-default-dark-gray input[type=number]:focus, |
.formoid-default-dark-gray input[type=date]:focus, |
.formoid-default-dark-gray textarea:focus, |
.formoid-default-dark-gray .element-file .file_text:focus{ |
.dark-grey input[type=text]:focus, |
.dark-grey input[type=password]:focus, |
.dark-grey input[type=email]:focus, |
.dark-grey input[type=url]:focus, |
.dark-grey input[type=number]:focus, |
.dark-grey input[type=date]:focus, |
.dark-grey textarea:focus, |
.dark-grey .element-file .file_text:focus{ |
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #222222; |
-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #222222; |
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #222222; |
@@ -1453,4 +1455,4 @@ |
} |
|
|
/* .formoid-default-dark-gray color scheme end */ |
/* .dark-grey color scheme end */ |