/*************************************************************************** * general.css * ------------------- * * Begin : 19/02/07 * copyright : (C) gunth.be * Author : Gauthier Dumont * Version : 1 * ***************************************************************************/ /* * General Styles */ html, body{padding:0; margin:0; height:100%; min-height:100%; font-size:11px; font-family:Arial, Helvetica, sans-serif;} form{ margin:0; padding:0;} table{ border:none;} label{ cursor:pointer; display:block; float:left; vertical-align:middle} label.error{float:none} input, select, textarea{ vertical-align:middle; font-family:Arial, Helvetica, sans-serif; font-size:11px;} ul, li, h1, h2, h3, p {margin:0; padding:0;} h1{ line-height:normal; margin:5px 0;} .display{display:none} .clr{ clear:both; font-size:0; height:0; width:0; line-height:0;} .hr1{ background:url(/Design/Images/SiteImages/hr1.gif) repeat-x; margin-bottom:10px; height:2px; font-size:0; line-height:0;} .hr2{border-bottom:1px solid #e9e9e9; height:2px; font-size:0; line-height:0; margin:5px 0 5px 0} a,a:link,a:active,a:visited{color:#347392; text-decoration:none; outline-style: none; -moz-outline-style:none;} a:hover{color:#727272; text-decoration:underline} hr{background:#000; border:none; border:1px solid #E5EAEE; color:#000; clear:both; text-align:right} .indicator{background:url(/Design/Images/SiteImages/indicator.gif) center no-repeat; height:32px; width:32px; display:none} .loader{background:url(/Design/Images/SiteImages/indicator.gif) center no-repeat;} .blue{ background:#ccdde5} .white{ background:#fff} .tooltip{ position: absolute; top: 0; left: 0; z-index: 3; display: none; background:#91B5C3; color:#fff; padding:5px; -moz-border-radius:5px; border-radius:5px;} .postBy{ font-style:italic; margin-bottom:3px; color:#999; font-size:10px;} .postBy a, .postBy a:link, .postBy a:active, .postBy a:visited{color:#999; text-decoration:underline} .postBy a:hover{ text-decoration:none} .postBy img{ vertical-align:middle} .borderHeader{border-right:1px solid #fff;} #logo{ height:180px; width:207px; position:absolute; top:0; margin:10px 0 0 17px} #logo img{ border:none} #logo a{ position:relative} /* * Icons */ .nameIcon{ background:url(/Design/Images/SiteImages/sprite.png) 0px -1240px no-repeat; padding:2px 0 2px 25px} .totemIcon{ background:url(/Design/Images/SiteImages/sprite.png) 0px -1440px no-repeat; padding:2px 0 2px 25px} .dateIcon{ background:url(/Design/Images/SiteImages/sprite.png) 0px -480px no-repeat; padding:2px 0 2px 25px} .phoneIcon{ background:url(/Design/Images/SiteImages/sprite.png) 0px -1200px no-repeat; padding:2px 0 2px 25px} .emailIcon{ background:url(/Design/Images/SiteImages/sprite.png) 0px -837px no-repeat; padding:2px 0 2px 25px} .serviceFB img{background:url(/Design/Images/SiteImages/servicesSprite.png) 0px 0px no-repeat;} .serviceTweet img{background:url(/Design/Images/SiteImages/servicesSprite.png) -50px 0px no-repeat;} .serviceRSS img{background:url(/Design/Images/SiteImages/servicesSprite.png) -24px 0px no-repeat;} /* * Form Input */ .large{ width:438px; border:2px solid #E2E2E2; padding:2px;} .large:focus{border:2px solid #2D83DA;} .small{ width:200px; border:2px solid #E2E2E2; padding:2px} .small:focus{border:2px solid #2D83DA;} .textAreaSmall{width:200px; height:100px; border:2px solid #E2E2E2; padding:2px} .textAreaSmall:focus{border:2px solid #2D83DA;} .little{ width:100px; border:2px solid #E2E2E2; padding:2px} .little:focus{border:2px solid #2D83DA;} .calendarInput{ background:url('/Design/Images/SiteImages/sprite.png') 61px -438px no-repeat; width:75px; border:2px solid #E2E2E2; padding:2px;} #container .input-validation-error{border:1px solid #F00; color:#F00;} select{border:2px solid #E2E2E2; padding:1px} select:focus{border:2px solid #2D83DA;} #container textarea:focus{border:2px solid #2D83DA;} #container textarea.input-validation-error:focus{border:1px solid #F00;} .form2column{ float:left;} #adminForm .form2column .blockButton{ padding-left:0px} .form2column.left{ width:350px } #adminForm .form2column.left .blockButton{ padding-left:143px} .form2column.right{margin:0 0 0 30px; width:379px;} .form2column.right .uploadifyQueueItem{width:354px;} .form2column.right #uploadifyUploader { margin-top:-25px} .rangeDate{ float:left} .rangeDate.right{ float:left; margin-left:10px} #adminForm .rangeDate.right label{ padding-left:0; width:32px; text-align:center} /* * Admin Tools */ .editItem img, .deleteItem img, .deleteItem img, .rightRotationItem img, .leftRotationItem img, .defaultItem img{ width:17px; height:17px} .editItem img { background:url('/Design/Images/SiteImages/sprite.png') -0px -1160px no-repeat;} .deleteItem img { background:url('/Design/Images/SiteImages/sprite.png') -0px -720px no-repeat;} .rightRotationItem img { background:url('/Design/Images/SiteImages/sprite.png') -0px -1681px no-repeat;} .leftRotationItem img { background:url('/Design/Images/SiteImages/sprite.png') -0px -1721px no-repeat;} .defaultItem img { background:url('/Design/Images/SiteImages/sprite.png') -0px -279px no-repeat;} /* * Info box */ .infoBox{ color:#6B8A9C; border:#6B8A9C solid 1px; margin:10px 0 10px 0; padding:10px 10px 10px 30px; line-height:18px} .infoBox div{background:url('/Design/Images/SiteImages/sprite.png') no-repeat 0 -959px; height:16px; width:16px; position:absolute; margin:3px 0 0 -22px} /* * Error messages */ div.validation-summary-errors{ color:#F00; margin:10px 0 20px 0; border:1px solid #F00; padding:10px 10px 10px 10px;} .validation-summary-errors span { display:block; padding-left:30px; background:url('/Design/Images/SiteImages/sprite.png') no-repeat 0px -920px;} .validation-summary-errors ul{ color:#F00; margin:0; padding:10px 10px 0 0;} .validation-summary-errors ul li{ padding-left:25px; list-style:none; background:url('/Design/Images/SiteImages/sprite.png') no-repeat 5px -197px; margin-bottom:5px;} .field-validation-error{ background:url('/Design/Images/SiteImages/bad.gif') no-repeat; padding:1px 0 0 15px; display:block; float:left; color:#F00} form p:after{content:"."; display:block; height: 0; clear: both; visibility: hidden; line-height:0px; font-size:1px;} .errorContent{ color:#F00; margin:10px 0 20px 0; border:1px solid #F00; padding:10px 10px 10px 0;} .errorContent span{ display:block; background:url('/Design/Images/SiteImages/sprite.png') no-repeat 15px -920px; padding-left:40px;} .errorContent ul,.errorContent p{ padding-left:17px;} #convoc .errorContent ul{ margin-left:10px} .errorContent a, .errorContent a:link, .errorContent a:active, .errorContent a:visited{color:#F00; text-decoration:underline} .errorContent a:hover{color:#F00; text-decoration:none} .errorContent img{ vertical-align:middle; padding-bottom:5px; border:none} html*.errorContent img{margin-top:4px; padding:0;} .validMsg{ color:#0C0; margin:10px 0 20px 0; border:1px solid #0F0; padding:10px; line-height:17px;} .validMsg span{ display:block; background:url('/Design/Images/SiteImages/sprite.png') no-repeat 15px -877px; padding-left:40px;} html*.validMsg img{margin-top:4px; padding:0;} .validMsg a, .validMsg a:link, .validMsg a:active, .validMsg a:visited{ color:#0C0} .validMsg a:hover{ color:#0C0} #contentPage .validMsg p{margin:10px 0 0 0;} #contentPage .validMsg ul{ margin:0 0 0 45px; padding:0} .blockButton{ padding-top:10px; padding-left:200px;} #calendar .blockButton{ text-align:center; padding:0;} .blockButton img{ margin-right:10px;} #adminForm .blockButton{ padding-left:143px} #error{ background:url(/Design/Images/SiteImages/errorPage.jpg)} /* * Tooltips */ a.tt{position:relative; z-index:24; text-decoration:none} a.tt span{ display:none;} a.tt span img{ border:none} a.tt:hover{ z-index:25; background:; text-decoration:none} a.tt:hover span.ttContent{ display:block; position:absolute; top:0px; left:0; padding: 15px 0 0 0; width:210px; text-align: center;} a.tt:hover span.ttContent .top{display:block; height:21px;} a.tt:hover span.ttContent .middle{display:block;} a.tt:hover span.ttContent .bottom{display:block; height:12px;} a.tt .ttContent span[class="top"]{background: url(/Design/Images/SiteImages/headerTTLarge.png) no-repeat top;} a.tt .ttContent span[class="middle"]{background: url(/Design/Images/SiteImages/contentTTLarge.png) repeat-y top; padding-left:3px;} a.tt .ttContent span[class="bottom"]{background: url(/Design/Images/SiteImages/footerTTLarge.png) no-repeat top;} a.tt .ttContent .top{_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Design/Images/headerTTLittle.png', sizingMethod='image');} a.tt .ttContent .middle{_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Design/Images/contentTTLittle.png', sizingMethod='scale'); _height:10px;} a.tt .ttContent .bottom{_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Design/Images/footerTTLittle.png', sizingMethod='image');} /* * Layout */ #container{ margin:0 auto; padding:0; width:1024px;} #left{ float:left; width:225px; font-family:Verdana, Arial, Helvetica, sans-serif;} #animLeft{ height:400px;} #connect{ width:215px; margin:398px 0 0 -236px; border:5px solid #8ec543; position:absolute; top:0;} #connect img{ border:none; vertical-align:middle;} #connect div{ background:#81bd37; _height:164px; min-height:164px; padding:12px 10px 10px 10px; border:1px solid #97ce4f} #connect p{ margin-bottom:10px;} #connect span.error{ color:#F00; font-weight:bold;} #connect div div{ padding:0; border:none; height:auto; background:none;} #connect span{ display:block; margin-bottom:5px;} #connect span label, #connect span input{ display:inline; vertical-align:middle} #connect label{ float:none; margin-top:5px;} #connect .checkBox{ float:left; width:10px;} #connect a, #connect a:link, #connect a:active, #connect a:visited, #connect a:hover{color:#FFF} a#connectLink,a#disconnectLink,a#profilLink,a#myalbumLink,a#blogLink,a#adminLink,a#statsLink,.linkMDP,.linkInsc{padding-left:20px;} a#connectLink{background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -642px;} a#disconnectLink{background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -761px;} a#profilLink{background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -1520px;} a#myalbumLink{background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -240px; } a#adminLink{background:url(/Design/Images/SiteImages/bullet_wrench.png) no-repeat left;} a#statsLink{background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -1640px; } .linkMDP{ background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -1002px;} .linkInsc{ background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -1480px;} ul#adminMenu{border-top:1px solid #97CE4F; padding-top:5px} ul#adminMenu li{ list-style:none; margin-bottom:5px} ul#adminMenu li.create{ background:url(/Design/Images/SiteImages/sprite.png) no-repeat 0 0; padding-left:20px;} ul#adminMenu li.edit{ background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -1120px; padding-left:20px;} ul#adminMenu li.delete{ background:url(/Design/Images/SiteImages/sprite.png) no-repeat -0px -720px; padding-left:20px;} #right{ float:left; width:779px; background:#fff; padding:100px 10px 20px 10px; margin:0; min-height:600px; _height:600px;} #topLink{ position:absolute; top:0; margin:10px 0 0 445px; font-family:Verdana, Arial, Helvetica, sans-serif; text-align:right} #topLink a, #topLink a:link, #topLink a:active, #topLink a:visited{ background:url(/Design/Images/SiteImages/sprite.png) 4px -1355px no-repeat; padding-left:15px; margin-left:20px; color:#727272; text-decoration:none} #topLink a:hover{ background:url(/Design/Images/SiteImages/sprite.png) -0px -1400px no-repeat; color:#347392;} #services{position:absolute; top:0; margin:362px 0 0 -170px;} #services img{ border:none; margin-right:10px} #right #breadCrumb{ margin-bottom:20px; padding-left:10px; font-weight:bold; } #breadcrumbs a { text-decoration:none; color:#347392;} #breadcrumbs a:hover { color:#727272;} #breadcrumbs { list-style:none; padding:0; margin:0 0 15px 3px; background:url(/Design/Images/SiteImages/breadcrumb-bg.png) repeat-x center; border:1px solid #CCC; border-radius:0.4em; -moz-border-radius:0.4em; -webkit-border-radius:0.4em; overflow:hidden; color:#8EC543; font-family:Verdana, Arial, Helvetica, sans-serif; } #breadcrumbs li:first-child a { display:block; width:30px; text-indent:-9999px; background:url(/Design/Images/SiteImages/sprite.png) no-repeat 7px -274px; } #breadcrumbs li { float:left; background:url(/Design/Images/SiteImages/sprite.png) no-repeat right -320px; padding:0 20px 0 10px; height:28px; line-height:28px; } #breadcrumbs li:last-child{ background:none} #infoBread{ margin-top:-37px; padding-right:10px; text-align:right; float:right; position:relative; color:#347392} #infoBread .fb_iframe_widget iframe { margin-top:-3px} /* * Paging */ #paginator {padding:5px 0 5px 0; text-align:center; margin-bottom:5px;} #paginator .link-off, #paginator .this-page{padding:2px 6px 4px 6px; background:#8EC543; border:2px solid #81BD37; color:#FFF; font-weight:bold; text-decoration:none; margin:0 3px 0 3px} #paginator .this-page{ font-weight:bold;} #paginator a, #paginator a:link, #paginator a:active, #paginator a:visited{ padding:2px 6px 4px 6px; background:#fff; border:2px solid #E5EAEE; color:#069; text-decoration:none; margin:0 2px 0 2px;} #paginator a:hover{ color:#737373; background:#fff; border:2px solid #81BD37;} #navNextPrev{ padding:0 10px;} #navNextPrev p{ color:#999;} #navPrev{ float:left; width:380px;} #navNext{ float:left; width:379px; text-align:right} /* * Menu */ .menu { position:absolute; text-align:left; top:0; margin:45px 0 0 3px} #menu{ margin:0 auto;} .menu ul{margin:0; padding:0; list-style-type:none; background:none;} .menu ul li{position:relative; display:inline; font-weight:bold; float:left; padding:0; border-right:1px solid #636363; border-bottom:6px solid #80ABBC } .menu ul li.first{ text-align:right; width:105px} .menu ul li.first ul li{text-align:left} .menu ul li.last{ border-right:none; width:105px} .menu ul li a{ display:block; width:71px; padding:5px 11px; text-decoration:none;} .menu ul li.first a{ padding-right:6px; width:88px} .menu ul li.last a{ padding-right:6px; width:88px} .menu ul li ul{width:97px} .menu ul li.last ul{ width:85px} .menu ul li a span{ display:block; color:#636363} .menu ul li a:hover, .menu ul li.selected a{ color:#000; text-decoration:none; background:#F6F4F5} .menu ul li ul{left:0; position:absolute; top:1em; display:block; visibility:hidden; width:87px; z-index:120; background:#80ABBC} .menu ul li ul li{display:list-item; float:left; border:none; padding:0; margin:0; color:#fff} .menu ul li ul li ul{left:159px; top:0; border:none; padding:0; margin:0;} .menu ul li ul li a, .menu ul li ul li a:link, .menu ul li ul li a:active, .menu ul li ul li a:visited{display:block; border:none; color:#380000; text-decoration:none; background:#F6F4F5} .menu ul li ul li a:hover{ text-decoration:none; background:#80ABBC; color:#fff} .menu ul li ul li ul{ width:165px} .menu ul li ul li li a, .menu ul li ul li li a:link, .menu ul li ul li li a:active, .menu ul li ul li li a:visited{width:148px; color:#380000} .menu ul li ul li li a:hover{width:148px; color:#fff} /* * Admin Tools */ .adminTools{ position:absolute; display:none; margin:10px 0 0 700px } .adminTools img{ border:none} /* * Title */ h1{color:#82a757; font-size:16px; font-weight:bold;} h2{color:#5E8789; font-size:13px; font-weight:bold;} .subTitle{ color:#5e8789; font-weight:bold; font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif; margin-bottom:5px;} /* * Recaptcha */ #right .recaptchatable{ border:none !important;} #right .recaptcha_nothad_incorrect_sol{ border:none; margin:10px 0 0 193px; width:441px} #right .recaptchatable #recaptcha_image, #right .recaptchatable .recaptcha_input_area input{ border:2px solid #E2E2E2 !important;} #right .recaptchatable #recaptcha_image{ padding:0px 3px;} #right .recaptchatable .recaptcha_input_area input{ font-family:Arial,Helvetica,sans-serif; font-size:11px; vertical-align:middle; padding:2px;} #right label.recaptcha{margin:45px 0 0; position:absolute;} /* * Buttons */ .blockButton a{ margin-right:10px} #container .awesome, #container input.gsc-search-button, #container .gsc-search-button:visited, .awesome:visited {background:#222 ; display: inline-block; padding: 5px 14px 6px; color: #fff; text-decoration: none; -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5); box-shadow: 0 1px 3px rgba(0,0,0,0.5); text-shadow: 0 -1px 1px rgba(0,0,0,0.25); border-bottom: 1px solid rgba(0,0,0,0.25); cursor: pointer; } #container .gsc-search-button:hover,#container .awesome:hover { background-color: #111; color: #fff; } #container .awesome:active, #container input.gsc-search-button:active { top: 1px; } #container .awesome,.awesome:visited,#container input.gsc-search-button:visited, #container .mediumBtn.awesome, .mediumBtn.awesome:visited { font-size: 13px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); } #container .green.awesome, .green.awesome:visited, #container input.gsc-search-button, #container input.gsc-search-button:visited { background:url(/Design/Images/SiteImages/btn-loader.gif) #a8d26e no-repeat 3px 25px; } #container .green.awesome:hover, #container input.gsc-search-button:hover { background-color: #a8d26e; } #container .green.loading { background:url(/Design/Images/SiteImages/btn-loader.gif) #a8d26e no-repeat 3px 50%; padding:5px 7px 6px 21px; } #container .blue.awesome, .blue.awesome:visited { background-color: #69adf2; } #container .blue.awesome:hover { background-color: #69adf2; } #container .red.awesome, .red.awesome:visited { background-color: #f00; } #container .red.awesome:hover { background-color: #f00; } #container .grey.awesome { cursor:default } #container .grey.awesome, .grey.awesome:visited { background-color: #BFBFBF; } #container .grey.awesome:hover { background-color: #BFBFBF; } /* * Wizard */ #wizard{margin-bottom:50px;} #wizard:after{content:"."; display:block; height: 0; clear: both; visibility: hidden; line-height:0px; font-size:1px;} #wizard hr{ color:#E5EAEE; background:#E5EAEE; border:1px solid #E5EAEE} #wizard ul.step3{ position:absolute;} #wizard ul.step3 li{ float:left; list-style:none; margin:-23px 75px 0 63px; text-align:center; width:100px;} #wizard ul.step3 li span{ display:block; padding:8px; border:2px solid #E5EAEE; background:#fff; width:15px; margin:0 0 0 35px; font-weight:bold; color:#069; font-size:14px} #wizard ul.step3 li.current span{color:#fff; background:#8EC543; border-color:#81BD37; font-size:16px; padding:6px 8px;}