|
/****************************************************************** |
|
* |
|
* COMPONENTS: BUTTONS AND BUTTON-STYLE LINKS |
|
* e.g. <button>Click me!</button> |
|
* or <a class="button">Click me!</a> |
|
* or <input type="submit" value="Click me!" /> |
|
* |
|
******************************************************************/ |
|
.outer a.button, |
|
.outer a.button:link, |
|
.outer a.button:visited, |
|
.outer button, |
|
.outer input[type='button'], |
|
.outer input[type='submit'], |
|
.outer input[type='reset'] { |
|
margin: 0; |
|
padding: 0.375em 0.75em; /* 5px 10px */ |
|
vertical-align: baseline; |
|
font-size: 1.111111em; |
|
color: #000000; |
|
line-height: normal; |
|
text-align: center; |
|
text-decoration: none; |
|
text-shadow: 0.075em 0.075em 0 #FAFAFA; |
|
background: #DBE1EB url("/Style Library/Sesame/Images/formbutton.png") repeat-x left top; /* Fallback position */ |
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FBFBFD), color-stop(40%,#E7EBF3), color-stop(45%,#DEE4EB), color-stop(100%,#DBE1EB)); /* Chrome,Safari4+ */ |
|
background-image: -webkit-linear-gradient(top, #FBFBFD 0%, #E7EBF3 40%, #DEE4EB 45%, #DBE1EB 100%); /* Chrome10+,Safari5.1+ */ |
|
background-image: -moz-linear-gradient(top, #FBFBFD 0%, #E7EBF3 40%, #DEE4EB 45%, #DBE1EB 100%); /* FF3.6+ */ |
|
background-image: -o-linear-gradient(top, #FBFBFD 0%, #E7EBF3 40%, #DEE4EB 45%, #DBE1EB 100%); /* Opera 11.10+ */ |
|
background-image: linear-gradient(to bottom, #FBFBFD 0%, #E7EBF3 40%, #DEE4EB 45%, #DBE1EB 100%); /* W3C */ |
|
border-radius: 0.225em; |
|
border-width: 0.075em; |
|
border-style: solid; |
|
border-color: #DADADA #A5ABB5 #A5ABB5 #DADADA; |
|
cursor: pointer; |
|
} |
|
.outer a.button, |
|
.outer a.button:link { |
|
-webkit-background-clip: padding-box; /* Fix a border-radius colour bleed issue in Chrome */ |
|
display: inline-block; |
|
} |
|
.outer button, |
|
.outer input[type='button'], |
|
.outer input[type='submit'], |
|
.outer input[type='reset'] { |
|
-webkit-appearance: button; /* Corrects some iOS issues */ |
|
overflow: visible; /* Fixes the IE7 button too wide issue */ |
|
} |
|
.outer a.button:hover, |
|
.outer button:hover, |
|
.outer input[type='button']:hover, |
|
.outer input[type='submit']:hover, |
|
.outer input[type='reset']:hover { |
|
text-decoration: underline; |
|
color: #181818; |
|
} |
|
.outer a.button:focus, |
|
.outer a.button:active, |
|
.outer button:focus, |
|
.outer input[type='button']:focus, |
|
.outer input[type='submit']:focus, |
|
.outer input[type='reset']:focus { |
|
text-decoration: none; |
|
border-color: #A5ABB5 #DADADA #DADADA #A5ABB5; |
|
color: #181818; |
|
} |