/* ____________________________________________________________________________________ _(D)__David_Martineau_._net_________________________________________________________ Application : eXpoPhoto Web : http://padml.davidmartineau.net File : screen.css Content : CSS stylesheet for screen media Author : David MARTINEAU Email : developement@davidmartineau.net Web : http://www.davidmartineau.net Licence : © COPYRIGHTS DAVID MARTINEAU. ALL RIGHTS RESERVED. Disclaimer : THIS IS BETA SOFTWARE, DON'T COPY, DON'T DISTRIBUTE, DON'T SHARE, DON'T EDIT, DON'T MODIFY. ____________________________________________________________________________________ */ /* color table */ /* dark blue : #0056B1*/ /* light blue : #6892D3*/ /* dark gray : #2F2F2F*/ /* medium gray: #D1D1D1*/ /* light gray : #ECECEC*/ /* elements */ body { margin: 0px; padding: 0px; color: #2F2F2F; background-color: white; } body, p, li, td, input, select, textarea { font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif; font-size: 12px; } a { color: #003399; text-decoration: underline } a:hover { color: #0056B1; text-decoration: underline } h1, h2, h3, h4, h5, h6 { margin: 0px; font-weight: normal; } h1 { font-size: 24px; } h2 { font-size: 22px; } h3 { font-size: 18px; } h4 { font-size: 14px; } small { font-size: 10px; } big { font-size: 14px; } em { font-size: 14px; font-weight: bold; } img { border: 0px; } fieldset { margin: 10px; border: 1px solid #D1D1D1; background-color: #ECECEC; } fieldset:hover { border: 1px solid #0056B1; } fieldset:hover legend { border: 1px solid #0056B1; background-color: #6892D3; color: white; } legend { height: 15px; width: 230px; color: #2D2D2D; border: 1px solid #D1D1D1; padding-left: 5px; font-weight: normal; font-size: 11px; text-align: left; background-color: white; } button { margin: 5px; padding: 3px; border: 2px outset #D1D1D1; background-color: #ECECEC; color: #2F2F2F; text-decoration: none; text-transform: capitalize; font-size: 12px; font-weight: bold; } button:active { border: 2px inset #0056B1; background-color: #6892D3; color: white; } /* topcontent block */ #topcontent { height: 60px; padding: 0; color: white; background-color: #0056B1; position: relative; } #topcontent h1 { color: white; margin: 0; font-family: Georgia, Courrier, serif; font-size: 32px; position: absolute; top: 0; left: 0px; padding: 5px 0 0 10px; z-index: 100; } #topcontent h2 { color: white; margin: 0; font-family: Georgia, Courrier, serif; font-size: 13px; position: absolute; top: 0; left: 0px; padding: 40px 0 0 10px; z-index: 100; } #topcontent h3 { text-align: right; padding: 10px 10px 0px 0px; margin: 0; font-family: Georgia, Courrier, serif; font-size: 13px; } #topcontent h3 a:hover{ text-decoration: underline; } #topcontent a { color: white; text-decoration: none; } #topcontent a:hover { color: white; text-decoration: none; } #topcontent ul { display: block; position: absolute; width: auto; bottom: 0; right: 0; margin: 0; padding: 0 8px 0 0; z-index: 90; list-style: none; } #topcontent li { float: right; margin: 0 2px 0 0; padding: 0 7px 0 0; background: transparent url(../images/blue-tabs.gif) 100% 0px no-repeat; } #topcontent li a { color: white; text-decoration: none; border: 0; } #topcontent li a:hover { color: white; text-decoration: none; border-bottom: 2px solid white; } #topcontent li span { float: left; display: block; padding: 4px 4px 6px 34px; background: transparent url(../images/blue-tabs.gif) 0% 0px no-repeat; font-weight: bold; color: white; } #topcontent li.albumtab span { background: transparent url(../images/blue-tabs.gif) 0% 0px no-repeat; } #topcontent li.accounttab span { background: transparent url(../images/blue-tabs.gif) 0% -200px no-repeat; } #topcontent li.favoritestab span { background: transparent url(../images/blue-tabs.gif) 0% -400px no-repeat; } #topcontent li.baskettab span { background: transparent url(../images/blue-tabs.gif) 0% -600px no-repeat; } #topcontent li.admintab span { background: transparent url(../images/blue-tabs.gif) 0% -800px no-repeat; } #topcontent li.albumtab2 { background: transparent url(../images/gray-tabs.gif) 100% 0px no-repeat;} #topcontent li.accounttab2 { background: transparent url(../images/gray-tabs.gif) 100% 0px no-repeat;} #topcontent li.favoritestab2 { background: transparent url(../images/gray-tabs.gif) 100% 0px no-repeat;} #topcontent li.baskettab2 { background: transparent url(../images/gray-tabs.gif) 100% 0px no-repeat;} #topcontent li.admintab2 { background: transparent url(../images/gray-tabs.gif) 100% -800px no-repeat;} #topcontent li.albumtab2 span { float: left; display: block; padding: 4px 4px 6px 34px; font-weight: bold; color: #2F2F2F; } #topcontent li.accounttab2 span { float: left; display: block; padding: 4px 4px 6px 34px; font-weight: bold; color: #2F2F2F; } #topcontent li.favoritestab2 span { float: left; display: block; padding: 4px 4px 6px 34px; font-weight: bold; color: #2F2F2F; } #topcontent li.baskettab2 span { float: left; display: block; padding: 4px 4px 6px 34px; font-weight: bold; color: #2F2F2F; } #topcontent li.admintab2 span { float: left; display: block; padding: 4px 4px 6px 34px; font-weight: bold; color: #2F2F2F; } #topcontent li.albumtab2 span { background: transparent url(../images/gray-tabs.gif) 0% 0px no-repeat; } #topcontent li.accounttab2 span { background: transparent url(../images/gray-tabs.gif) 0% -200px no-repeat; } #topcontent li.favoritestab2 span { background: transparent url(../images/gray-tabs.gif) 0% -400px no-repeat; } #topcontent li.baskettab2 span { background: transparent url(../images/gray-tabs.gif) 0% -600px no-repeat; } #topcontent li.admintab2 span { background: transparent url(../images/gray-tabs.gif) 0% -800px no-repeat; } #connected { display: none; } #disconnected { display: none; } #admin { display: none; } /* leftcontent block */ #leftcontent { position: relative; width: 180px; float: left; } #leftcontent ul { display: block; width: auto; margin: 0; padding: 0; list-style: none; } #leftcontent li { margin: 10px 0 0 10px; } #leftcontent li a { display: block; height: 23px; padding-top: 5px; padding-left: 34px; border: 1px solid #D1D1D1; background-color: #ECECEC; color: #2F2F2F; text-decoration: none; } /* IE bug fixing \*/ * html #leftcontent li a { height: 30px; heig\ht: 23px; } /* IE bug fixing */ #leftcontent li a:hover { color: white; border: 1px solid #0056B1; background-color: #6892D3; text-decoration: none; } #leftcontent p { margin: 10px 0 0 10px; } #leftcontent p a { text-decoration: none; } #leftcontent p a:hover { text-decoration: underline; color: #0056B1; } #leftcontent p small { font-size: 9px important; } #searchfield { display: block; padding: 5px 2px 4px 34px; border: 1px solid #D1D1D1; background: #ECECEC url(../images/search.icon.gif) no-repeat; color: #2F2F2F; font-size: 12px; } /* actions block */ ul#actionscontent { position: fixed; display: block; width: 180px; z-index: 100; float: left; margin: 0; padding: 0; list-style: none;} ul#actionscontent li { margin: 10px 0 0 10px; } ul#actionscontent li a { display: block; border: 1px solid #D1D1D1; background-color: #ECECEC; color: #2F2F2F; text-decoration: none; height: 28px; width: 0px; padding: 0px 0px 0px 28px; overflow: hidden; } ul#actionscontent li a:hover { height: 23px; width: auto; padding: 5px 0px 0px 34px; overflow: visible; color: white; border: 1px solid #0056B1; background-color: #6892D3; text-decoration: none; } /* actions items */ a.homeaction { background-image: url(../images/home.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.homeaction:hover { background-image: url(../images/home.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.menuaction { background-image: url(../images/albums.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.menuaction:hover { background-image: url(../images/albums.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.albumaction { background-image: url(../images/album.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.albumaction:hover { background-image: url(../images/album.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.photoaction { background-image: url(../images/photo.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.photoaction:hover { background-image: url(../images/photo.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.videoaction { background-image: url(../images/photo.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.videoaction:hover { background-image: url(../images/photo.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.panoramaaction { background-image: url(../images/photo.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.panoramaaction:hover { background-image: url(../images/photo.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.printaction { background-image: url(../images/print.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.printaction:hover { background-image: url(../images/print.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.fullaction { background-image: url(../images/full.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.fullaction:hover { background-image: url(../images/full.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.prefaction { background-image: url(../images/pref.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.prefaction:hover { background-image: url(../images/pref.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.sendaction { background-image: url(../images/send.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.sendaction:hover { background-image: url(../images/send.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.addtofavoritesaction { background-image: url(../images/favorites-add.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.addtofavoritesaction:hover { background-image: url(../images/favorites-add.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.addtobasketaction { background-image: url(../images/basket-add.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.addtobasketaction:hover { background-image: url(../images/basket-add.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.slideshowaction { background-image: url(../images/slideshow.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.slideshowaction:hover { background-image: url(../images/slideshow.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.rssaction { background-image: url(../images/rss.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.rssaction:hover { background-image: url(../images/rss.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.castaction { background-image: url(../images/cast.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.castaction:hover { background-image: url(../images/cast.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.downloadaction { background-image: url(../images/download.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.downloadaction:hover { background-image: url(../images/download.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.formatsaction { background-image: url(../images/formats.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.formatsaction:hover { background-image: url(../images/formats.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.logoutaction { background-image: url(../images/logout.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.logoutaction:hover { background-image: url(../images/logout.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; border: 1px solid #E50000 !important; background-color: #FF6E6E !important; } a.clearaction { background-image: url(../images/clear.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.clearaction:hover { background-image: url(../images/clear.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; border: 1px solid #E50000 !important; background-color: #FF6E6E !important; } a.accountaction { background-image: url(../images/account.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.accountaction:hover { background-image: url(../images/account.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.emailaction { background-image: url(../images/email.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.emailaction:hover { background-image: url(../images/email.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.postcardaction { background-image: url(../images/postcard.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.postcardaction:hover { background-image: url(../images/postcard.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.favoritesaction { background-image: url(../images/favorites.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.favoritesaction:hover { background-image: url(../images/favorites.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.basketaction { background-image: url(../images/basket.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.basketaction:hover { background-image: url(../images/basket.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.profileaction { background-image: url(../images/user.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.profileaction:hover { background-image: url(../images/user.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.albumsaction { background-image: url(../images/books.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.albumsaction:hover { background-image: url(../images/books.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.usersaction { background-image: url(../images/users.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.usersaction:hover { background-image: url(../images/users.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.cacheaction { background-image: url(../images/cache.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.cacheaction:hover { background-image: url(../images/cache.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.configurationaction { background-image: url(../images/configuration.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.configurationaction:hover { background-image: url(../images/configuration.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.dataaction { background-image: url(../images/data.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.dataaction:hover { background-image: url(../images/data.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.adminaction { display: none; background-image: url(../images/admin.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.adminaction:hover { background-image: url(../images/admin.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } a.registeraction { display: none; background-image: url(../images/register.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; } a.registeraction:hover { background-image: url(../images/register.icon.gif); background-position: 0px -28px; background-repeat: no-repeat; } /* rightcontent block */ #rightcontent { position: relative; margin-left: 180px; } #rightcontent p, h1, h2, h3, h4, fieldset { margin: 10px; } /* IE bug fixing \*/ * html div#rightcontent p, h1, h2, h3 { margin-left: 7px; } /* IE bug fixing */ /* navigation area */ #navigationmenu { height: 28px; margin: 10px; border: 1px solid #D1D1D1; background-color: #ECECEC; } /* IE bug fixing \*/ * html #navigationmenu { margin-left: 7px; height: 30px; heig\ht: 28px;} /* IE bug fixing */ #navigationmenu a { display: block; height: 23px; padding-top: 5px; float: left; color: #2F2F2F; text-decoration: none; } #navigationmenu a:hover { text-decoration: underline; } div.sepnavigation { height: 23px; float: left; padding: 5px 5px 0px 5px; } /* IE bug fixing \*/ * html div.sepnavigation { height: 28px; heig\ht: 23px; } /* IE bug fixing */ a.topnavigation { padding-left: 28px; background-image: url(../images/top.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; text-transform: capitalize; } a.topnavigation:hover { background-image: url(../images/top.icon.gif); background-position: 0px -56px; background-repeat: no-repeat; } /* position area */ #positionmenu { height: 1%; margin: 10px; border: 1px solid #D1D1D1; background-color: #ECECEC; } /* IE bug fixing \*/ * html #positionmenu { margin-left: 7px; } /* IE bug fixing */ a.previousposition { display: block; float: left; height: 23px; padding-top: 5px; padding-left: 28px; background-image: url(../images/left.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; color: #2F2F2F; text-decoration: none;} a.previousposition:hover { background-image: url(../images/left.icon.gif); background-position: 0px -56px; background-repeat: no-repeat; text-decoration: underline;} /* IE bug fixing \*/ * html a.previousposition { height: 28px; heig\ht: 23px; } /* IE bug fixing */ a.nextposition { display: block; float: right; height: 23px; padding-top: 5px; padding-right: 28px; background-image: url(../images/right.icon.gif); background-position: right 0px; background-repeat: no-repeat; color: #2F2F2F; text-decoration: none;} a.nextposition:hover { background-image: url(../images/right.icon.gif); background-position: right -56px; background-repeat: no-repeat; text-decoration: underline;} /* IE bug fixing \*/ * html a.nextposition { height: 28px; heig\ht: 23px; } /* IE bug fixing */ a.itemposition { display: block; float: left; height: 21px; width: 20px; padding-top: 7px; background-image: url(../images/circle.back.gif); background-position: 0px 0px; background-repeat: no-repeat; color: white; text-align: center; text-decoration: none; font-size: 11px; } a.itemposition:hover { background-image: url(../images/circle.back.gif); background-position: 0px -56px; background-repeat: no-repeat; color: white; text-decoration: none; } /* IE bug fixing \*/ * html a.itemposition { height: 28px; heig\ht: 21px; } /* IE bug fixing */ div.currentposition { display: block; float: left; height: 21px; width: 20px; padding-top: 7px; background-image: url(../images/circle.back.gif); background-position: 0px -56px; background-repeat: no-repeat; color: white; text-align: center; font-size: 11px; } /* IE bug fixing \*/ * html div.currentposition { height: 28px; heig\ht: 21px; } /* IE bug fixing */ /* slideshow commands */ #commandmenu { height: 28px; margin: 10px; border: 1px solid #D1D1D1; background-color: #ECECEC; text-align: center; } /* IE bug fixing \*/ * html #commandmenu { margin-left: 7px; height: 30px; heig\ht: 28px;} /* IE bug fixing */ #commandmenu a { display: block; height: 23px; padding-top: 5px; float: left; color: #2F2F2F; text-decoration: none; } #commandmenu a:hover { text-decoration: underline; } a.closecommand { padding-left: 28px; background-image: url(../images/close.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; text-transform: capitalize; } a.closecommand:hover { background-image: url(../images/close.icon.gif); background-position: 0px -56px; background-repeat: no-repeat; } a.playcommand { padding-left: 28px; background-image: url(../images/play.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; text-transform: capitalize; } a.playcommand:hover, a.playcommand2 { padding-left: 28px; background-image: url(../images/play.icon.gif); background-position: 0px -56px; background-repeat: no-repeat; text-transform: capitalize; } a.pausecommand { padding-left: 28px; background-image: url(../images/pause.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; text-transform: capitalize; } a.pausecommand:hover, a.pausecommand2 { padding-left: 28px; background-image: url(../images/pause.icon.gif); background-position: 0px -56px; background-repeat: no-repeat; text-transform: capitalize; } a.stopcommand { padding-left: 28px; background-image: url(../images/stop.icon.gif); background-position: 0px 0px; background-repeat: no-repeat; text-transform: capitalize; } a.stopcommand:hover, a.stopcommand2 { padding-left: 28px; background-image: url(../images/stop.icon.gif); background-position: 0px -56px; background-repeat: no-repeat; text-transform: capitalize; } /* source code */ #sourcecode { margin: 10px; border: 1px solid #D1D1D1; padding: 10px; text-align: left; } #sourcecode code { font: monaco, serif; font-size: 11px; color: black; text-align: left; } /* preferences */ #preferences fieldset { margin: 15px; border: 1px solid #D1D1D1; background-color: #ECECEC; } #preferences fieldset:hover legend { border: 1px solid #0056B1; background-color: #6892D3; color: white; } #preferences legend { height: 15px; width: 130px; color: #2D2D2D; border: 1px solid #D1D1D1; padding-left: 5px; font-weight: normal; font-size: 11px; text-align: left; text-transform: capitalize; background-color: white; } #preferences button { margin: 5px; padding: 3px; border: 2px outset #D1D1D1; background-color: #ECECEC; color: #2F2F2F; text-decoration: none; text-transform: capitalize; font-size: 12px; font-weight: bold; } #preferences button:active { border: 2px inset #0056B1; background-color: #6892D3; color: white; } /* genaral */ div.intro { text-align: center; } div.info { text-align: center; } img.icon { vertical-align: middle; text-decoration: none; } div#photoframe { margin: 10px; text-align: center; } img.photo { border: 1px solid #D1D1D1;} div.thumbframe { margin: 0px 0px 10px 10px; padding: 10px; float: left; width: 140px; height: 150px; overflow: hidden; text-align: center; } /* IE bug fixing \*/ * html div.thumbframe { width: 160px; height: 170px; widt\h: 140px; heig\ht: 150px; } /* IE bug fixing */ div.thumbframe a { color: #2F2F2F; text-decoration: none; } div.thumbframe a:hover { color: #0056B1; text-decoration: underline; } div.thumbframe h4 { font-size: 12px; margin: 0; } img.thumb { border: 1px solid #D1D1D1; } img.thumb:hover { border: 1px solid #0056B1; } a.smooth { text-decoration: none; } a.smooth:hover { text-decoration: underline; } a.clean { text-decoration: none; color: inherit;} a.clean:hover { text-decoration: none; } /* menu abstract */ table.abstract { margin: 10px; } table.abstract td { vertical-align: top; } div.operations { text-align: left; } div.favoriteframe { margin: 0px 0px 10px 10px; padding: 10px; float: left; width: 140px; height: 170px; overflow: hidden; text-align: center; } /* IE bug fixing \*/ * html div.favoriteframe { width: 160px; height: 190px; widt\h: 140px; heig\ht: 170px; } /* IE bug fixing */ div.favoriteframe a { color: #2F2F2F; text-decoration: none; } div.favoriteframe a:hover { color: #0056B1; text-decoration: underline; } div.favoriteframe h4 { font-size: 12px; margin: 0; } /* account divisions */ div.account { width: 450px; margin-left: auto; margin-right: auto; } div#have { width: 50%; float: left; } div#have p, h1, h2, h3 { margin: 10px; } div#create { margin-left: 50%; } div#create p, h1, h2, h3 { margin: 10px; } /* simple forms layout */ .label { float: left; clear: right; width: 130px; text-align: right; padding: 10px; } /* IE bug fixing \*/ * html .label { width: 150px; widt\h: 130px; }/* IE bug fixing */ .field { margin-left: 130px; text-align: left; padding: 10px; } /* IE bug fixing \*/ * html .field { margin-left: 150px; mar\gin-left: 130px; }/* IE bug fixing */ /* enhanced form layout*/ .fieldcontainer { margin: 0px !important; } .fieldstart { margin: 0px !important; padding: 5px !important; width: 30%; float: left; text-align: right; } .fieldend { padding: 5px 5px 5px 10px !important; margin-left: 30% !important; text-align: left; } .buttons { text-align: center; padding: 10px; } /* with frames form layout*/ .fieldframe { width: 550px; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 10px; border: 1px solid #D1D1D1; background-color: white; } .fieldlabel { width: 120px; float: left; padding: 5px; background-color: white; text-align: right; } .fielditem { margin-left: 130px; background-color: #ECECEC; padding: 5px; overflow: visible; } .alternatives { margin-left: 110px; } div#termsofuse { border: 1px solid #D1D1D1; margin-left: auto; margin-right: auto; width: 80%; height: 300px; background-color: white; overflow: auto; } div#termsofuse p { text-align: justify; } /* listing table */ table.listing { margin-left: auto; margin-right: auto; border: 1px solid #D1D1D1; border-collapse : collapse; } table.listing th { background-color: #ECECEC; border-bottom: 1px solid #D1D1D1; } table.listing td, th { border-left: 1px solid #D1D1D1; padding: 5px; } /* list layout */ ul.list li { margin: 10px; list-style: square; } ul.list h3 { margin: 0px; font-size: 14px; } ul.list p { margin: 0px !important; }