/*************************************/ /* CSS RESET */ /*************************************/ * { outline:none; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,container table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* tables still need 'cellspacing="0"' in the markup */ .clear { clear: both; } /*************************************/ /* STRUCTURE */ /*************************************/ /*************************************/ /* GENERAL STYLING */ /*************************************/ body { background: url(../images/bg.gif) left top repeat; font-family: Arial, Verdana, sans; font-size: 12px; color: #2f2e2c; } #main-wrapper { width: 950px; margin: 0 auto; margin-bottom: 30px; overflow: hidden; } #container { background: url(../images/bg_container.png) right bottom no-repeat; padding-bottom: 14px; } #content { background: #ecebeb; height: 381px; overflow: hidden; } #content .left { width: 498px; height: 381px; float: left; } #content .right { width: 452px; height: 381px; float: right; position: relative; } #content h1 { color: #41403b; font-weight: normal; font-size: 42px; line-height: 45px; font-family: 'SlimbachBoldItalic'; text-transform: uppercase; } #content h2 { color: #7d7c7c; font-weight: normal; font-size: 14px; line-height: 18px; font-family: 'SlimbachBoldItalic'; } #content p { color: #2f2e2c; font-size: 12px; line-height: 16px; } /*************************************/ /* HEADER */ /*************************************/ #header { } #logo { display: block; width: 280px; height: 127px; background: url(../images/logo_fr.png) no-repeat; text-indent: -9999px; margin: 18px; float: left; } #main-nav { height: 76px; float: right; background: url(../images/bg_mainnav.png) right no-repeat; } #main-nav ul { height: 61px; background: #ffffff; margin: 0 11px 0 0; padding: 0 0 0 15px; } #main-nav ul li { display: block; float: left; position: relative; border-bottom: 2px solid #b1b0af; padding: 15px; } #main-nav ul li a { display: block; float: left; font-family: 'SlimbachBoldItalic', serif; color: #403e3a; text-decoration: none; background: url(../images/arrow_mainnav.png) left no-repeat; padding-left: 14px; } #main-nav ul li a.contact { cursor: default; } #main-nav ul li a:hover, #main-nav ul li.active a { color: #bbbbbb; background-image: url(../images/arrow_mainnav_over.png); } #main-nav ul li.lang { border-bottom: none; padding-top: 16px; } #main-nav ul li.lang a { color: #2358A8; font-size: 10px; font-family: Arial, sans-serif; font-weight: bold; text-transform: uppercase; } #main-nav ul li.lang a:hover { color: #403e3a; } #main-nav ul li .popup-container { display: none; position: absolute; top: 30px; left: -165px; width: 290px; padding-top: 27px; background: url(../images/bubble-top.png) top no-repeat; z-index: 9999; } #main-nav ul li:hover .popup-container { display: block; } #main-nav ul li .popup-content { color: #ffffff; line-height: 16px; background: url(../images/bubble-bg.png) bottom no-repeat; padding: 15px 15px 20px 15px; overflow: hidden;} #main-nav ul li .popup-content h3 { font-size: 14px; font-weight: bold; margin-top: 15px; } #main-nav ul li .popup-content h3:first-child { margin-top: 0px; } #main-nav ul li .popup-content p { margin-top: 10px; } /*************************************/ /* FOOTER */ /*************************************/ #footer { margin-top: -14px; } #footer #copy { float: left; color: #41403b; font-size: 10px; margin: 20px 10px 10px 10px; width:340px; } /* */ /* #footer .footer_nav { float: left; padding-left: 10px; } #footer .footer_nav li { display: block; float: left; height: 60px; background: url(../images/bg_button_footer.png) right no-repeat; margin-left: 4px;} #footer .footer_nav li a { display: block; height: 55px; line-height: 55px; margin-right: 4px; float: left; font-size: 10px; font-weight: bold; text-transform: uppercase; padding: 0 20px 0 35px; color: #2358A8; background: #ffffff url(../images/arrow_mainnav.png) 20px no-repeat; text-decoration: none; } #footer .footer_nav li a:hover { color: #bbbbbb; background-image: url(../images/arrow_mainnav_over.png); } */ #footer .partners { float: right; margin-top: 20px; } #footer .partners li { display: inline; } #footer .partners li a { display: block; float: left; text-indent: -9999px; margin-left: 25px; } #footer .partners li:first-child a { margin-left: 0; } #footer .partners li a.fonds_recherche { width: 91px; height: 55px; background: url(../images/CIHR-noir.png); margin-top: 0px; } #footer .partners li a.chaire_pratiques { width: 118px; height: 59px; background: url(../images/logo_chaire-recherche-politique-infirmiere.png); } #footer .partners li a.chum_fr { width: 154px; height: 60px; background: url(../images/CRchum-FR-noir.png); margin-top: 0px; } #footer .partners li a.chum_en { width: 154px; height: 60px; background: url(../images/CRchum-EN-noir.png); margin-top: 0px; } #footer .partners li a.chum_noir { width: 70px; height: 60px; background: url(../images/CHUM_noir.png); margin-top: 0px; } #footer .partners li a.udem { width: 150px; height: 55px; background: url(../images/CATIE_noir.png); margin-top: 0px; } #footer .partners li a.cocq { width: 116px;height: 55px; background: url(../images/logo_cocq.png); margin-top: 0px;} #footer .partners li a.ctn { width: 318px;height: 55px; background: url(../images/CTN-noir.png); margin-top: 0px;} /*************************************/ /* LANDING */ /*************************************/ #landing .right h1 { padding: 100px 0 0 20px; } /*#landing .right h1 { margin: 60px 0 35px 20px; } #landing .right p { display: block; margin: 0 0 20px 20px; padding-left: 40px; color: #7d7c7c; font-family:'SlimbachBoldItalic'; font-size: 14px; line-height: 20px; position: relative; } #landing span.no{ display: block; height: 25px; width: 25px; position: absolute; top: 0; left: 0; text-indent: -9999px;} #landing span.no01{ background: url(../images/no1.png); } #landing span.no02{ background: url(../images/no2.png); }*/ /*************************************/ /* CONFIRMATION */ /*************************************/ #confirmation .right h1 { margin: 75px 0 0 20px; } #confirmation .right h2 { margin: 45px 0 20px 20px; } #confirmation .right p { padding: 0 20px; } /*************************************/ /* PARTICIPATION */ /*************************************/ #participate .right h1 { margin: 60px 0 35px 20px; } #participate .right p { display: block; margin: 0 0 20px 20px; padding-left: 40px; color: #7d7c7c; font-family:'SlimbachBoldItalic'; font-size: 14px; line-height: 20px; position: relative; } #participate span.no{ display: block; height: 25px; width: 25px; position: absolute; top: 0; left: 0; text-indent: -9999px;} #participate span.no01{ background: url(../images/no1.png); } #participate span.no02{ background: url(../images/no2.png); } #participate .bt_participate { display: block; width: 152px; height: 150px; background: url(../images/bt_participate.png) top no-repeat; text-indent: -9999px; position: absolute; bottom: 40px; right: 20px; } #participate .bt_participate:hover { background-position: bottom; } #participate .bt_participate:hover { background-position: bottom; } #container #content .left #flashContent{ margin-top:15px; margin-left:15px; } /*************************************/ /* INSCRIPTION */ /*************************************/ #inscription .left { width: 478px; } #inscription .left h1 { font-size: 20px; line-height: 20px; margin: 20px 0 10px 25px; } #inscription .left h2 { font-size: 18px; line-height: 12px; margin: 0 0 20px 25px; } #inscription .left .check_ls { margin: 0 25px 20px 25px; font-size: 15px; color: #2f2e2c; line-height: 14px; list-style-type: disc !important;list-style-position: outside; } #inscription .left .check_ls li{ margin-bottom: 10px; line-height: 20px;} #lastli{display: block;overflow: hidden;margin:5px 0 0 -20px;} #inscription .left .check_ls input{ width: 12px; height: 12px; float: left; vertical-align: middle; margin-right: 5px; } #inscription .left .check_ls label{ float: left; width: 390px; padding-top: 2px; } #inscription .left a.link_more{ margin-left: 25px; font-size: 12px; font-weight: bold; color: #2358A8; background: url(../images/arrow_mainnav.png) left no-repeat; padding-left: 15px; text-decoration: none; text-transform: uppercase; } #inscription .left a.link_more:hover { color: #41403b; background-image: url(../images/arrow_mainnav_over.png); } #inscription .right { background: #ffffff; width: 472px; } #inscription .right h1{ margin: 35px 0 40px 20px; } #inscription .form_ls { margin: 0 20px; } #inscription .form_ls li{ display: block; clear: both; overflow: hidden; margin-bottom: 10px; padding-left: 95px; } #inscription .form_ls li.infos p{ font-size: 11px; } #inscription .form_ls .req{ color: #2358A8; padding: 0 5px; } #inscription .form_ls .input { padding-left: 0; } #inscription .form_ls .input label{ display: block; float: left; width: 95px; color: #2f2e2a; font-size: 10px; height: 30px; line-height: 30px; font-weight: bold; text-transform: uppercase; } #inscription .form_ls .input input{ font-size: 12px; width: 320px; padding: 5px; border: 1px solid #cccccc; vertical-align: middle; } #inscription .form_ls .input select{height: 30px; line-height: 30px; width: 333px; display: block; border: 1px solid #ccc;} #inscription .form_ls .input select option{height: 30px; line-height: 30px;} #inscription .right .bt_validate { display: block; margin-top: 10px; height: 28px; line-height: 28px; font-size: 11px; font-weight: bold; color: #2358A8; text-decoration: none; text-transform: uppercase; background: url(../images/bt_validate.png) top right no-repeat; padding-right: 35px; float: right; margin-right: 20px; } #inscription .right .bt_validate:hover { color: #41403b; background-position: bottom right; } /*************************************/ /* INFORMATIONS */ /*************************************/ #informations #content { background: #ffffff; height: auto; padding: 30px 20px; overflow: hidden; } #informations h1 { font-size: 20px; line-height: 20px; margin-bottom: 25px; float: left; } #informations h2 { font-family: Arial; font-size: 12px; font-weight: bold; color: #2f2e2c; text-transform: uppercase; } #informations p { margin-top: 15px; line-height: 15px; } #informations ol { margin-top: 15px; line-height: 18px; } #informations .hr { height: 1px; background: #d8d7d7; margin: 20px 0; } #informations .bt_back { float: right; font-size: 11px; font-weight: bold; color: #2358A8; text-decoration: none; text-transform: uppercase; height: 28px; line-height: 28px; background: url(../images/bt_back.png) left top no-repeat; padding-left: 40px; } #informations .bt_back:hover { color: #41403b; background: url(../images/bt_back.png) left bottom no-repeat; } #informations .bt_validate { margin-left: 10px;display: block; height: 28px; line-height: 28px; font-size: 11px; font-weight: bold; color: #2358A8; text-decoration: none; text-transform: uppercase; background: url(../images/bt_validate.png) top right no-repeat; padding-right: 35px; float: right; margin-right: 20px; } #informations .bt_validate:hover { color: #41403b; background-position: bottom right; } /*************************************/ /* LINKS */ /*************************************/ #links #content { padding: 70px 20px 40px 20px; height: auto; } .ls_links { margin-top: 35px; width: 420px; float: left; margin-left: 40px; } .ls_left { margin-left: 0; } .ls_links li { margin-bottom: 15px; } .ls_links li a{ display: block; color: #2358A8; font-size: 12px; font-family: 'SlimbachBoldItalic'; background: url(../images/arrow_mainnav.png) left no-repeat; text-decoration: none; padding-left: 15px; margin-bottom: 5px; } .ls_links li a:hover{color: #41403b; background: url(../images/arrow_mainnav_over.png) left no-repeat; } .ls_links li p{ padding-left: 15px; } #links .bt_download{ display: block; height: 16px; line-height: 16px; color: #2358A8; font-size: 12px; background: url(../images/bt_download.png) left top no-repeat; padding-left: 25px; float: right; margin-top: 35px; } #links .bt_download:hover{ color: #41403b; background-position: left bottom; } .bt_download_info{ display: block; height: 16px; line-height: 16px; color: #2358A8; font-size: 12px; background: url(../images/bt_download.png) left top no-repeat; padding-left: 25px; float: left; margin-top: 10px; } .bt_download_info:hover{ color: #41403b; background-position: left bottom; } /* LIGHTBOX OVER */ #lightbox_bg { height: 100%; width: 100%; position: fixed; background: url(../images/lightbox_bg.png); top: 0; left: 0; } #lightbox_box { position: absolute; top: 50%; left: 50%; margin-top: -185px; margin-left: -243px; width: 467px; height: 380px; padding: 10px; background: #ffffff; } #lightbox_box .bt_skip { display: block; float: right; height: 10px; line-height: 10px; font-size: 9px; font-weight: bold; text-decoration: none; text-transform: uppercase; color: #2358A8; background: url(../images/bt_skip.png) left top no-repeat; padding-left: 14px; margin: 10px ;} #lightbox_box .bt_skip:hover { color: #41403b; background-position: left bottom; } #lightbox_bg #lightbox_box #lightbox_content #flashContent{ } #capt{ margin-left:20px; width:317px; height: 127px; } .top_mar{margin-top: 20px;} .partner_label{font-size: 18px; color: #2358a8; text-decoration: none;} .headline{float: left; width: 100%; height: auto; display: block;} #cihr_irsc{width: 100%; height: auto; display: block; float: left;} #cihr_irsc .left{width: 30%; height: auto; display: block; float: left;} #cihr_irsc .left a{float: left; margin-left: 10%;width: 200px; height: 132px; background: url(../images/CIHR-200px.png);} #cihr_irsc .right{width: 70%; height: auto; display: block; float: right; line-height: 132px;} #ctn{width: 100%; height: auto; display: block; float: left;} #ctn .left{width: 30%; height: auto; display: block; float: left;} #ctn .left a{float: left; margin-left: 10%;width: 200px; height: 55px; background: url(../images/CTN-200px.png);} #ctn .right{width: 70%; height: auto; display: block; float: right; line-height: 55px;} #mcgill_health{width: 100%; height: auto; display: block; float: left;} #mcgill_health .left{width: 30%; height: auto; display: block; float: left;} #mcgill_health .left a{float: left; margin-left: 10%;width: 200px; height: 52px;background: url(../images/MUHC-200px.png);} #mcgill_health .right{width: 70%; height: auto; display: block; float: right; line-height: 52px;} #chaire_de_recherche{width: 100%; height: auto; display: block; float: left;} #chaire_de_recherche .left{width: 30%; height: auto; display: block; float: left;} #chaire_de_recherche .left a{float: left; margin-left: 10%;width: 200px; height: 85px; background: url(../images/chaire-200px.png);} #chaire_de_recherche .right{width: 70%; height: auto; display: block; float: right; line-height: 85px;} #cr_chum_fr{width: 100%; height: auto; display: block; float: left;} #cr_chum_fr .left{width: 30%; height: auto; display: block; float: left;} #cr_chum_fr .left a{float: left; margin-left: 10%;width: 200px; height: 87px; background: url(../images/CRchum-FR-200px.png);} #cr_chum_fr .right{width: 70%; height: auto; display: block; float: right; line-height: 87px;} #cr_chum_en{width: 100%; height: auto; display: block; float: left;} #cr_chum_en .left{width: 30%; height: auto; display: block; float: left;} #cr_chum_en .left a{float: left; margin-left: 10%;width: 200px; height: 87px; background: url(../images/CRchum-EN-200px.png);} #cr_chum_en .right{width: 70%; height: auto; display: block; float: right; line-height: 87px;} #chum_en{width: 100%; height: auto; display: block; float: left;} #chum_en .left{width: 30%; height: auto; display: block; float: left;} #chum_en .left a{float: left; margin-left: 10%;width: 200px; height: 100px; background: url(../images/CHUM-200px.png);} #chum_en .right{width: 70%; height: auto; display: block; float: right; line-height: 100px;} #chum_fr{width: 100%; height: auto; display: block; float: left;} #chum_fr .left{width: 30%; height: auto; display: block; float: left;} #chum_fr .left a{float: left; margin-left: 10%;width: 200px; height: 100px; background: url(../images/CHUM-200px.png);} #chum_fr .right{width: 70%; height: auto; display: block; float: right; line-height: 100px;} #cocq_sida{width: 100%; height: auto; display: block; float: left;} #cocq_sida .left{width: 30%; height: auto; display: block; float: left;} #cocq_sida .left a{float: left; margin-left: 10%;width: 200px;height: 104px; background: url(../images/COCQ-200px.png);} #cocq_sida .right{width: 70%; height: auto; display: block; float: right; line-height: 68px;} #catie_fr{width: 100%; height: auto; display: block; float: left;} #catie_fr .left{width: 30%; height: auto; display: block; float: left;} #catie_fr .left a{float: left; margin-left: 10%;width: 200px; height: 68px; background: url(../images/catie-fr-200px.png);} #catie_fr .right{width: 70%; height: auto; display: block; float: right; line-height: 68px;} #catie_en{width: 100%; height: auto; display: block; float: left;} #catie_en .left{width: 30%; height: auto; display: block; float: left;} #catie_en .left a{float: left; margin-left: 10%;width: 200px; height: 68px; background: url(../images/catie-en-200px.png);} #catie_en .right{width: 70%; height: auto; display: block; float: right; line-height: 68px;} #udem_au{width: 100%; height: auto; display: block; float: left;} #udem_au .left{width: 30%; height: auto; display: block; float: left;} #udem_au .left a{float: left; margin-left: 10%;width: 200px; height: 93px; background: url(../images/UdeM-200px.png);} #udem_au .right{width: 70%; height: auto; display: block; float: right; line-height: 93px;} #laval{width: 100%; height: auto; display: block; float: left;} #laval .left{width: 30%; height: auto; display: block; float: left;} #laval .left a{float: left; margin-left: 10%;width: 200px; height: 81px; background: url(../images/laval-200px.png);} #laval .right{width: 70%; height: auto; display: block; float: right; line-height: 81px;} #uqtr{width: 100%; height: auto; display: block; float: left;} #uqtr .left{width: 30%; height: auto; display: block; float: left;} #uqtr .left a{float: left; margin-left: 10%;width: 200px; height: 93px; background: url(../images/UQTR-200px.png);} #uqtr .right{width: 70%; height: auto; display: block; float: right; line-height: 93px;} #mcgill{width: 100%; height: auto; display: block; float: left;} #mcgill .left{width: 30%; height: auto; display: block; float: left;} #mcgill .left a{float: left; margin-left: 10%;width: 200px; height: 68px; background: url(../images/mcGill-200px.png);} #mcgill .right{width: 70%; height: auto; display: block; float: right; line-height: 68px;} #ptm{width: 100%; height: auto; display: block; float: left;} #ptm .left{width: 30%; height: auto; display: block; float: left;} #ptm .left a{float: left; margin-left: 10%;width: 200px; height: 112px; background: url(../images/poly-200px.png);} #ptm .right{width: 70%; height: auto; display: block; float: right; line-height: 112px;} #ryrsn_univ{width: 100%; height: auto; display: block; float: left;} #ryrsn_univ .left{width: 30%; height: auto; display: block; float: left;} #ryrsn_univ .left a{float: left; margin-left: 10%;width: 200px; height: 93px; background: url(../images/ryerson-200px.png);} #ryrsn_univ .right{width: 70%; height: auto; display: block; float: right; line-height: 93px;} #victoria{width: 100%; height: auto; display: block; float: left;} #victoria .left{width: 30%; height: auto; display: block; float: left;} #victoria .left a{float: left; margin-left: 10%;width: 200px; height: 89px; background: url(../images/victoria-200px.png);} #victoria .right{width: 70%; height: auto; display: block; float: right; line-height: 89px;} #vidc{width: 100%; height: auto; display: block; float: left;} #vidc .left{width: 30%; height: auto; display: block; float: left;} #vidc .left a{float: left; margin-left: 10%;width: 200px; height: 80px; background: url(../images/vidc.png); background-repeat: no-repeat;} #vidc .right{width: 70%; height: auto; display: block; float: right; line-height: 89px;} #actuel{width: 100%; height: auto; display: block; float: left;} #actuel .left{width: 30%; height: auto; display: block; float: left;} #actuel .left a{float: left; margin-left: 10%;width: 200px; height: 80px; background: url(../images/Logo_LACTUEL_WEB.jpg);} #actuel .right{width: 70%; height: auto; display: block; float: right; line-height: 89px;} #acttionpo{width: 100%; height: auto; display: block; float: left;} #acttionpo .left{width: 30%; height: auto; display: block; float: left;} #acttionpo .left a{float: left; margin-left: 10%;width: 200px; height: 80px; background: url(../images/Action-positive-logo1.png);} #acttionpo .right{width: 70%; height: 25px; display: block; float: right; line-height: 89px;} #pg_content{padding: 10px;} #pg_content h2{margin-top: 10px;} .video {width: 100%;} .vid-wrapper {display: table; width: auto; position: relative; width: 100%;} .playpause {background-image: url(../images/play.png); background-repeat: no-repeat; width: 25%; height: 25%; position: absolute; left: 0%; right: 0%; top: -25px; bottom: 0%; margin: auto; background-size: contain; background-position: center; }