/* ----------------------------------------------------------------------------------- - myDay LIVE CSS ----------------------------------------------------------------------------------- Credits : myday.fr / Innov ID webmaster@myday.fr Note: Needs YUI Reset-Font-Grid CSS */ /* --------------------------------------------------------------------------------------------- GLOBAL ---------------------------------------------------------------------------------------------*/ /* --------------- GENERAL --------------- */ html { height: 100%; /* here instead of to fix a problem with color filling only space of page visible at the page loading */ background-color: #3F6CA3 !important; } body { line-height: 1.4em; height: 100%; background: transparent url(images/back.png) repeat-x scroll left top; } /* ---------------HEADERS --------------- */ h1 { color: #20384E; font-size: 153.9%; font-weight: bold; font-family: "Lucida Sans","Lucida Grande",Arial,sans-serif; padding-bottom: 6px; margin-bottom: 10px; } h1 img { vertical-align: text-bottom; margin-right: 10px; } h2 { color: #192F44; font-size: 100%; font-weight: bold; font-family: "Lucida Sans","Lucida Grande",Arial,sans-serif; margin-bottom: 15px; } h5 { margin-bottom: 5px; } /* --------------- HTML TAGS --------------- */ p { margin-bottom: 5px; } hr { display: none; } strong, .strong { font-weight: bold; } /* --------------------------------------------------------------------------------------------- LINKS ---------------------------------------------------------------------------------------------*/ a:link, a:visited { color: #20384E; text-decoration: none;} a:hover, a:active { color: #20384E; text-decoration: underline; } .sub-elements a:link, .sub-elements a:visited { color: #20384E; text-decoration: none; font-weight: bold;} .sub-elements a:hover, .sub-elements a:active { color: #20384E; text-decoration: underline; font-weight: bold; } /* top right box on header */ #myday-connectbox a:link, #myday-connectbox a:visited { color: #456C9A; text-decoration: none; font-weight: bold; } #myday-connectbox a:hover, #myday-connectbox a:active { color: #456C9A; text-decoration: underline; font-weight: bold; } /* --------------- UTILS -------------- */ .clear { clear: both; } .left { text-align: left ! important;} .center { text-align: center ! important; } .right { text-align: right ! important; } .top { margin-top: 15px ! important; } .hr { border-top: 1px dotted #B5CED7; height: 1px; margin: auto; margin-bottom: 10px; } .errorTxt { color: red; font-weight: bold; } .errorTxt { color: red; font-weight: bold; } #tooltip { display: none; position: absolute; z-index: 3000; width: 200px; color: black; font-size: 93%; padding: 5px; margin-left: 10px; border: 1px solid #97AFCC; background-color: #E2E9F1; opacity: 0.92; } /* --------------- IMAGES MISC --------------- */ .icon { vertical-align: text-bottom; margin-left: -5px; margin-right: 5px; } .imgtick { vertical-align: text-bottom; margin-right: 0px; } /* --------------------------------------------------------------------------------------------- BOXES --------------------------------------------------------------------------------------------- */ /* ---------------------------------------------------------- BOX 1 ---------------------------------------------------------- */ .box-1 { padding: 10px 15px; border: 1px solid #C0D4ED; background: #F1F7FD url(images/live_box_back_top2bot.gif) repeat-x scroll left top; } .box-1 .box-title { color: #192F44; font-size: 108%; font-weight: bold; font-family: "Lucida Sans","Lucida Grande",Arial,sans-serif; margin-top: 2px 0 4px; } .box-1 .box-content { padding: 8px 0 0; } /* ---------------------------------------------------------- BOX 2 ---------------------------------------------------------- */ .box-2 { padding: 5px 2px 2px; border: 1px solid #C0D4ED; background: #F1F7FD url(images/live_box_back_top2bot.gif) repeat-x scroll left top; } .box-2 .box-title { color: #192F44; font-size: 100%; font-weight: bold; font-family: "Lucida Sans","Lucida Grande",Arial,sans-serif; padding-left: 9px; margin: 1px 0 4px 2px; } .box-2 .box-content { border: 1px solid #C1D4EC; padding: 10px 12px 5px; background-color: white; } .box-2 .box-title .icon { position: relative; top: -2px; vertical-align: -5px; margin-right: 8px; } /*---------------------------------------------------------- BOX 3 ---------------------------------------------------------- */ /* Dark blue head - light blue borders */ .box-3 { padding: 0; border: 1px solid #C1D4EC; background: transparent url(images/live_box_back_top2bot.gif) repeat-x scroll left 20px; } .box-3 .box-title { height: 20px; color: #FFF9F1; font-size: 93%; font-weight: bold; font-family: "Lucida Sans","Lucida Grande",Arial,sans-serif; padding-left: 8px; margin: -1px; margin-bottom: 1px; background: transparent url(images/live_box_head1.gif) repeat-x scroll left top; } .box-3 .box-content { padding: 8px 7px 0 10px; margin: 5px; border: 1px solid #C1D4EC; background-color: white; } /*---------------------------------------------------------- BOX 4 ---------------------------------------------------------- */ /* FORMS */ .box-4 { padding: 5px 5px 5px 10px; border: 1px solid #E5EFF3; border-left: 3px solid #82A9CE; background: #F6F9FE url(images/live_box_back_bot2top.gif) repeat-x scroll left bottom; } /*---------------------------------------------------------- BOX 5 ---------------------------------------------------------- */ .box-5 { color: #FFF9F1; font-size: 93%; font-weight: bold; padding: 3px 5px; border-bottom: 1px solid #C1D4EC; background: #3E709F url(images/live_box_head3.gif) repeat-x scroll left center; } /*---------------------------------------------------------- BOX 6 ---------------------------------------------------------- */ .box-6 { padding-top: 10px; border: 1px solid #C1D4EC; } /*---------------------------------------------------------- BOX ERROR ---------------------------------------------------------- */ .box-error { padding: 5px 10px; border: 1px solid #DD3C10; border-left: 3px solid #DD3C10; background-color: #FFEBE8; } .box-error .errorlist { display: inline; } .box-error .errorlist { display: inline; } .box-error .errorlist li { list-style-type: disc; list-style-position: inside; } /*---------------------------------------------------------- BOX OK ---------------------------------------------------------- */ .box-ok { color: #464c42; padding: 5px 10px; border: 1px solid #7bbb7f; border-left: 3px solid #7bbb7f; background-color: #f0fff1; } /*---------------------------------------------------------- BOX AJAX ---------------------------------------------------------- */ /* loading anim */ .box-ajax { text-align: center; } .box-ajax .icon { margin-left: 10px; } /* --------------- BOX IMAGES --------------- */ /* for images in titles etc */ .box-title .icon { position: relative; top: -2px; vertical-align: -9px; } .box-ok .icon, .box-error .icon, .box-ajax.icon { margin-right: 5px; } /* just some margins for all boxes */ .box-1, .box-2, .box-3, .box-4, .box-error { margin-bottom: 10px; } /* --------------- FORMS -------------- */ .formdiv { padding: 10px 15px 0px; margin: 0 0 15px 0; } .formdiv .label-hd1, .formdiv .label-hd3, .formdiv .label-hd5 { display: block; float: left; font-weight: bold; text-align: right; margin-right: 16px; } .formdiv .label-hd1 { width: 165px; } .formdiv .label-hd2 { width: 90px; } .formdiv .label-hd3 { float: none !important; text-align: left !important; } .formdiv .label-hd4 { width: 90px; font-weight: normal; } .formdiv .label-hd5 { width: 200px; } .formdiv .form-line { clear: both; margin: 0 0 15px 0; } .formdiv .form-line2 { clear: both; margin: 0 0 7px 0; } .formdiv .form-line-hd { clear: both; margin: 0 0 5px 0; } .formdiv .form-line-hd2 { clear: both; padding-bottom: 5px; margin: 0 0 15px 0; border-bottom: 1px solid #C9DBF2; } .formdiv .colspan { text-align: center; padding-left: 40px; } .formdiv .rowspan { float: left; clear: none !important; width: 80%; margin: 0 !important; } .formdiv .rowspan div { clear: none; margin: 0 0 8px; } .form-input-note { text-align: right; font-size: 85%; margin-right: 30px; } .form-input-note2 { font-size: 85%; padding: 4px; padding-left: 6px; border: 1px solid #527A98; background-color: white; } /* submit ALT: normal margin */ .formdiv .submit { text-align: right; margin-bottom: 10px; } /* submit: negative margin */ .formdiv .submit-alt { text-align: right; margin-top: -20px; margin-bottom: 10px; } /* submit: negative margin */ .formdiv .submit-alt2 { text-align: left; margin-bottom: 0px; } /* AJAX LOADING GIF inside form */ .formdiv .submit .box-ajax { float: left; font-weight: normal; margin-left: 50px; } input[type=text] { height: 18px; padding-left: 3px; border: 1px solid #A5ACB2; background:#FFFFFF url(images/input-back-grey.gif) repeat-x scroll left center; } input[type=password] { height: 18px; padding-left: 3px; border: 1px solid #A5ACB2; background:#FFFFFF url(images/input-back-grey.gif) repeat-x scroll left center; } input:focus { border-color: #6D6D6D; } /* -- SUBMIT BUTTON -- */ /* GREEN SUBMIT */ .submit1 { height: auto; width:auto; overflow:visible; color: #F8FFF4; font-weight: bold; font-family: "Trebuchet MS",Arial,Verdana; text-align: center; padding: 1px 20px; border: 1px solid #699852; background: #67A54B url(images/input-back-green.gif) repeat-x scroll left center; } .submit1:hover { /* 67A54B save bright */ background: #5C9941 none repeat scroll 0%; } /* BLUE SUBMIT */ .submit2 { height: auto; width:auto; overflow:visible; color: #F8FFF4; font-weight: bold; font-family: "Trebuchet MS",Arial,Verdana; text-align: center; padding: 1px 20px; border: 1px solid #527A98; background: #5090BE url(images/input-back-blue.gif) repeat-x scroll left center; } .submit2:hover { background: #5090BE none repeat scroll 0%; } .formbtn-img { margin-left: 10px; padding-top: 20px; } .formbtn-img input { background: none; } /* PAYPAL FORM */ #paypalform table { } /* --------------------------------------------------------------------------------------------- HEADER & MENU --------------------------------------------------------------------------------------------- */ #hd { height: 82px; } #logo { display: block; padding-left: 20px; } #menu { height:70px; width: 450px; padding:0; margin: 8px 0 0 140px; } #menu li { float:right; height:67px; list-style-image:none; list-style-position:outside; list-style-type:none; margin:0; padding:0; } #menu li a { position:relative; color:#FFFFFF; font-size:15px; font-weight:bold; text-align:center; text-decoration:none; line-height:20px; height: 65px; width: 68px; padding-top: 9px; margin: 0 5px; } #menu li > a { display:block; } #menu li:hover { background: transparent url(images/live_menu_hover.png)no-repeat scroll bottom center; } /* top right boxes */ #myday-connectbox { float: right; width: 100px; height: 60px; text-align: center; color: #456C9A; font-size: 85%; padding: 3px 0 0 0; margin-top: 8px; border: 1px solid #456C9A; /* background-image: url(images/box-connect.png); background-repeat: no-repeat; background-position: top left; */ } /* --------------------------------------------------------------------------------------------- FOOTER --------------------------------------------------------------------------------------------- */ #footer { color: white; text-align: center; } /* --------------------------------------------------------------------------------------------- CONTENT --------------------------------------------------------------------------------------------- */ #yui-main { padding: 0; margin: 0; margin-top: 10px; } /* TOP/BOTTOM ROUND CORNER DIVS */ #content-top { font-size: 1px; line-height: 0; height: 10px; background: transparent url(images/content-top.png) no-repeat scroll top left; margin: 0; padding: 0; } #content-bottom { height: 10px; margin: 0; background: transparent url(images/content-bottom.png) no-repeat scroll top left; } /* REAL CONTENT DIV */ #content-content { padding: 5px 23px 0; border: 1px solid #82A9CE; border-top: 0; border-bottom: 0; background-color: #FAFAFA; } /* --------------------------------------------------------------------------------------------- PAGE : LOGIN --------------------------------------------------------------------------------------------- */ #form-login { width: 370px; margin-top: 10px; } #registerbtn { width:200px; height:50px; font-size: 100%; font-weight: bold; color: #3A3E31; margin:auto; padding-top: 17px; background: transparent url(images/register.png) no-repeat scroll top left; } /* --------------------------------------------------------------------------------------------- PAGE : REGISTER --------------------------------------------------------------------------------------------- */ #form-register { width: 600px; margin-top: 10px; } #form-register-error { width: 500px; } #form-register .label-hd5 { width: 250px; } #form-register input[type=text], #form-register input[type=password] { width: 250px; } /* --------------------------------------------------------------------------------------------- PAGE : SHOPPING LIST --------------------------------------------------------------------------------------------- */ #form-shoplist { width: 93%; } #form-shoplist textarea { width: 99%; height: 150px; } #shop-fav-box { width: 100%; } /* --------------------------------------------------------------------------------------------- PAGE : WELCOME --------------------------------------------------------------------------------------------- */ .sub-elements { margin-top: 0px; } .sub-elements li { list-style: none; height: 49px; padding: 10px 0 10px 5px; margin: 0; } #home-choice .sub-elements li { } #home-choice .sub-elements li:hover { background: #F6F9FE url(images/live_box_back_top2bot.gif) repeat-x scroll bottom left; } .sub-element-img { float: left; margin-right: 13px; } .sub-element-title { } .sub-element-desc { font-size: 85%; } /* --------------------------------------------------------------------------------------------- PAGE : PHOTOS --------------------------------------------------------------------------------------------- */ /* ACCORDION */ .jqaccordion input[type=text] { width: 80%; } .jqaccordion-header { cursor:pointer; display:block; text-decoration: none; color: #FFF9F1; font-size: 93%; font-weight: bold; padding: 3px; padding-left: 5px; border-bottom: 1px solid #C1D4EC; background: #3E709F url(images/live_box_head3.gif) repeat-x scroll left center; } .jqaccordion-content { } .jqaccordion-content-inner { padding: 5px 10px 10px; margin-bottom: 5px; border: 1px solid #C0D4ED; background: #F1F7FD url(images/live_box_back_top2bot.gif) repeat-x scroll left top; } #photos-collections { margin-top: 10px; text-align: center; } #table-photos { width: 99.99%; margin: auto; border-collapse: separate; border-spacing: 5px; } #table-photos td { height: 150px; width: 25%; vertical-align: top; text-align: center; padding: 5px 5px 10px; border: 1px dashed #C1D4EC; background-color: #F3F5FA; } .photo-title { font-weight: bold; font-size: 77%; } .photo-img { } .photo-link { margin-top: 3px; } .photo-link img, .jqaccordion img { vertical-align:middle; margin-right: 4px; } .photos-pagination { text-align: right; font-size: 85%; padding-right: 15px; } /* --------------------------------------------------------------------------------------------- PAGE : MESSAGES --------------------------------------------------------------------------------------------- */ #form-im { width: 91%; } #form-im textarea { width: 99%; height: 150px; } #im-sent { padding: 5px 15px 10px; margin-top: 10px; } #im-sent li { list-style-type: disc; list-style-position: inside; } /* History Box */ #im-log .box-content { padding: 0 5px; } .im-log-one { padding: 5px 0; border-bottom: 1px dotted #B9DAE8; } .im-log-one-datetime { font-size: 85%; } .im-log-one-txt { font-size: 85%; } #im-log .imgtick { padding:0; margin: 0 0 0 5px; } .im-log-readed { display: block; float: right; } .nomsgyet { font-size: 85%; padding: 5px; } #charCount { font-size: 93%; text-align: right; margin-top: 2px 0 -10px; } /* --------------------------------------------------------------------------------------------- PAGE : RSS --------------------------------------------------------------------------------------------- */ #form-rss { width: 95%; } #form-rss ul { padding: 3px 12px; border: 1px solid #C1D4EC; background-color: white; } #form-rss li { padding: 8px 0; border-bottom: 1px dotted #B9DAE8; } .rss-title { font-weight: bold; } .rss-description { font-size: 85%; } .rss-url { font-style: italic; } .rss-action { float: right; } .rss-delete, .rss-disable { font-size: 85%; } #form-rss2 input[type=text] { width: 400px; } /* --------------------------------------------------------------------------------------------- PAGE : CONFIG --------------------------------------------------------------------------------------------- */ #menu2 { padding-top: 5px 0; border-right: 1px solid #C9DAF4; } #menu2 li.current { background-color: #E8F2FC; } #menu2 .sub-elements li.misc:hover { background-color: #F0F5FA; } #menu2 .sub-elements li.current:hover { background-color: #DFECF9 !important; } #menu2 .sub-elements .sub-choices { clear: both; padding-right: 20px; margin-left: 30px; } #menu2 .sub-elements .sub-choices div { clear: left; text-align: right; } .config-one-bloc { margin: 0 30px 30px; } .config-one-bloc .config-one-modify, .config-one-bloc .config-one-quickdisplay { float: right; } .config-one-bloc .config-one-modify { font-size: 93%; color: #55595D; } .config-one-bloc .config-one-quickdisplay, .config-one-bloc .config-one-desc { font-size: 85%; color: #55595D; } .config-one-bloc .config-one-title { color: #333333; font-weight: bold; font-size: 100%; } .config-one-bloc .config-one-header { cursor: pointer; border-bottom: 1px solid #C9DAF4; }