.clear { /* generic container (i.e. div) for floating buttons */ overflow: hidden; width: 100%; } a.command-button { color: #ffffff; display: block; float: left; font: normal 12px arial, sans-serif; height: 18px; margin-right: 6px; padding-right: 7px; /* sliding doors padding */ text-decoration: none; font-weight:bold } a.command-button span { display: block; padding: 1px 0 1px 6px; } a:hover.command-button span { display: block; padding: 1px 0 1px 6px; background-position: 0% -18px } a:hover.command-button { /*Colour Moved*/ color: #88dddd; display: block; float: left; font: normal 12px arial, sans-serif; height: 18px; padding-right: 7px; /* sliding doors padding */ text-decoration: none; font-weight:bold; background-position: 100% -18px } a.command-button { color: #ffffff; display: block; float: left; font: normal 12px arial, sans-serif; height: 18px; margin-right: 6px; padding-right: 7px; /* sliding doors padding */ text-decoration: none; font-weight:bold } /*Menu Button*/ .main-button { display: block; margin: 0 auto; text-align: center } a.main-button { margin: 5px; display: block; float: left; font: normal 12px arial, sans-serif; height: 36px; padding-right: 15px; /* sliding doors padding */ text-decoration: none; font-weight:bold } a.main-button span { display: block; padding: 10px 0 10px 15px; } a:hover.main-button span { display: block; padding: 10px 0 10px 15px; background-position: 0% -36px } a:hover.main-button { display: block; float: left; font: normal 12px arial, sans-serif; padding-right: 15px; /* sliding doors padding */ text-decoration: none; font-weight:bold; background-position: 100% -36px } .smallButton, a.smallButton { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #606060), color-stop(1, #000000) ); background:-moz-linear-gradient( center top, #606060 5%, #000000 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#606060', endColorstr='#000000'); background-color:#202020; -moz-border-radius:8px; -webkit-border-radius:8px; -opera-border-radius:8px; -khtml-border-radius:8px; border-radius:8px; border:1px solid #dddddd; color:#ffffff; font-family:arial; font-size:10px; /* font-weight:bold; */ padding:2px 10px; text-decoration:none; text-shadow:1px 1px 0px #000000; text-align: center; } .smallButton:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #606060) ); background:-moz-linear-gradient( center top, #000000 5%, #606060 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#606060'); background-color:#000000; } .smallButton:active { position:relative; top:1px; } .largeButton, a.largeButton { /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2MDYwNjAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #000000 0%, #606060 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#606060)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #000000 0%,#606060 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #000000 0%,#606060 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #000000 0%,#606060 100%); /* IE10+ */ background: linear-gradient(to bottom, #000000 0%,#606060 100%); /* W3C */ -moz-border-radius:10px; -webkit-border-radius:10px; -opera-border-radius:10px; -khtml-border-radius:10px; border-radius:10px; border:1px solid #dddddd; background-color:#202020; color:#ffffff; font-family:arial; font-size:11px; /* font-weight:bold; */ padding:4px 20px; text-decoration:none; text-shadow:1px 1px 0px #000000; text-align: center; display:block; width: 170px; } .largeButton:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #606060) ); background:-moz-linear-gradient( center top, #000000 5%, #606060 100% ); background-color:#000000; } .largeButton:active { position:relative; top:1px; } .formButton { /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2MDYwNjAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #000000 0%, #606060 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#606060)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #000000 0%,#606060 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #000000 0%,#606060 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #000000 0%,#606060 100%); /* IE10+ */ background: linear-gradient(to bottom, #000000 0%,#606060 100%); /* W3C */ -moz-border-radius:10px; -webkit-border-radius:10px; -opera-border-radius:10px; -khtml-border-radius:10px; border-radius:10px; background-color:#202020; border:1px solid #dddddd; color:#ffffff; font-family:arial; font-size:11px; /* font-weight:bold; */ padding:3px 2px; text-decoration:none; text-shadow:1px 1px 0px #000000; text-align: center; display:block; width: 200px; } .formButton:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #606060) ); background:-moz-linear-gradient( center top, #000000 5%, #606060 100% ); background-color:#000000; } .formButton:active { position:relative; top:1px; } .smallSize { width: 140px; }