/* Psyli.fi CSS Document 20111020 */ /** * HTML5 ✰ Boilerplate * * style.css contains a reset, font normalization and some base styles. * * Credit is left where credit is due. * Much inspiration was taken from these projects: * - yui.yahooapis.com/2.8.1/build/base/base.css * - camendesign.com/design/ * - praegnanz.de/weblog/htmlcssjs-kickstart */ /** * html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline) * v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark * html5doctor.com/html-5-reset-stylesheet/ */ html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; } ins { background-color: #ff9; color: #000; text-decoration: none; } mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } del { text-decoration: line-through; } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; } table { border-collapse: collapse; border-spacing: 0; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* Normalize monospace sizing: en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome */ pre, code, kbd, samp { font-family: monospace, sans-serif; } /** * Minimal base styles. */ /* 1) Always force a scrollbar in non-IE 2) Remove iOS text size adjust without disabling user zoom: www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */ html { overflow-y: scroll; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; } /* j.mp/webkit-tap-highlight-color */ a:link { -webkit-tap-highlight-color: #FF5E99; } /* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */ a:hover, a:active { outline: none; } a, a:active, a:visited { color: #607890; } a:hover { color: #036; } ul, ol { margin-left: 2em; } ol { list-style-type: decimal; } /* Remove margins for navigation lists */ nav ul, nav li { margin: 0; list-style:none; list-style-image: none; } small { font-size: 85%; } b, strong, th { font-weight: bold; } td { vertical-align: top; } td[valign="middle"] { vertical-align: middle; } /* Set sub, sup without affecting line-height: gist.github.com/413930 */ sub, sup { font-size: 75%; line-height: 0; position: relative; } sup { top: -0.5em; } sub { bottom: -0.25em; } pre { /* www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/ */ white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px; } .ie6 legend, .ie7 legend { margin-left: -7px; } /* 1) Make inputs and buttons play nice in IE: www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ 2) WebKit browsers add a 2px margin outside the chrome of form elements. Firefox adds a 1px margin above and below textareas 3) Set font-size to match 's, and font-family to sans-serif 4) Align to baseline */ button, input, select, textarea { width: auto; overflow: visible; margin: 0; font-size: 100%; font-family: sans-serif; vertical-align: baseline; } /* 1) Remove default scrollbar in IE: www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ 2) Align to text-top */ textarea { overflow: auto; vertical-align:text-top; } /* Hand cursor on clickable input elements */ label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; } /* Remove extra padding and inner border in Firefox */ input::-moz-focus-inner, button::-moz-focus-inner { border: 0; padding: 0; } /* Colors for form validity */ input:valid, textarea:valid { } input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; } .no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; } /* Bicubic resizing for non-native sized IMG: code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */ .ie7 img { -ms-interpolation-mode: bicubic; } /** * You might tweak these.. */ body, select, input, textarea { /* #444 looks better than black: twitter.com/H_FJ/statuses/11800719859 */ color: #444; /* Set your base font here, to apply evenly */ /* font-family: Georgia, serif; */ } /* Headers (h1, h2, etc) have no default font-size or margin; define those yourself */ h1, h2, h3, h4, h5, h6 { font-weight: bold; } /* These selection declarations have to be separate No text-shadow: twitter.com/miketaylr/status/12228805301 Also: hot pink! */ ::-moz-selection { background: #f0f7e1; color:#fff; text-shadow: none; } ::selection { background:#f0f7e1; color:#000; text-shadow: none; } #register ::selection {background:#d3ddf0;} #register ::-moz-selection { background: #d3ddf0;} #member ::selection {background:#fff0d2;} #member ::-moz-selection { background: #fff0d2;} /********************************************************************** * Primary styles * * Author: Poutapilvi ********************************************************************** */ body { margin:0; padding:0; font-size:12px; font-family:Arial, Helvetica, sans-serif; text-align:center; background-color:#e6dccf; width:100%; } body.contentbg { background-color:#fff; background-image:none; text-align:left; } body.bodybg_1 {background: url(../images/bg_julkinen1.jpg) no-repeat center 44px #fff;} body.bodybg_2 {background: url(../images/bg_julkinen2.jpg) no-repeat center 44px #fff;} body.bodybg_3 {background: url(../images/bg_julkinen3.jpg) no-repeat center 44px #fff;} body.bodybg_4 {background: url(../images/bg_julkinen4.jpg) no-repeat center 44px #fff;} body.bodybg_5 {background: url(../images/bg_julkinen5.jpg) no-repeat center 44px #fff;} body#member { background: url(../images/bg_member.jpg) no-repeat center 44px #fff; } body#register { background: url(../images/bg_register.jpg) no-repeat center 44px #fff; } body.adminloggedin { background-position:center 70px !important; } .notpublic { color:#af2626; } br.eoc { font-size:0; height:0; } .box { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; behavior: url(js/PIE.php); } .round3 { -moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; behavior: url(js/PIE.php); } #wrap { width: 1024px; margin:0 auto; text-align:center; } #header { margin: 0 auto; width: 918px; height:21px; margin-top:11px; text-align:left; } #name, #lang, #font, #search, #sitemap { float:left; display:block; height:21px; position:absolute; } #name { margin-top:4px; margin-left:12px; } #lang { margin-left:384px; } #lang a { display: block; float: left; height: 18px; padding-top: 4px; margin: 0 9px 0 0; } #lang a:first-child { border-right:1px solid #bbbbbb; padding-right: 9px; } #font { margin-left:538px; } #font span { margin-top: 4px; display:block; float:left; margin-right:5px; } #search { margin-left:686px; width:158px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } #searchboxinput { background: #f0f0f0; border:0; padding: 4px 8px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-border-radius: 15px; border-radius: 15px; -webkit-border-radius: 15px; color:#777; width:114px; behavior: url(js/PIE.php); } #sitemap { margin-top:4px; margin-left:861px; } #header, #header a { color:#777; text-decoration:none; } #header a:hover { text-decoration:underline; } #header_image { margin: 39px 0 0 65px; float: left; } #nav { float: left; width: 947px; clear: both; text-align: left; background: white; height: 42px; padding-top: 11px; margin: 71px 0 0 37px; padding-left:20px; } #register #nav, #member #nav { width:240px; text-align:center; padding:15px 0 0; } #register #nav a, #member #nav a { background: url(../images/arrow.png) left center no-repeat; padding-left: 20px; font-family:Arial, sans-serif; font-size: 12px; font-weight:bold; text-decoration:none; color:#212121; } #register #nav a:hover { color:#7891bb; background: url(../images/arrow_register.png) left center no-repeat; } #member #nav a:hover { color:#d16900; background: url(../images/arrow_member.png) left center no-repeat; } #nav .horbaritem, #nav .horbaritemselected { display:block; float:left; font-size:12px; font-weight:bold; } #nav .horbaritem a, #nav .horbaritemselected a { border-left:1px solid #bbbbbb; padding:0 8px 0 7px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } #nav .horbar div:first-child a { border:0; } #nav .horbaritem a { color:#111; text-decoration:none; line-height:20px; } #nav .horbaritemselected { background:url(../images/mainnav_bg.png) no-repeat center bottom; height:38px; } #nav .horbaritem a:hover, #nav .horbaritemselected a { color:#2b8849; text-decoration:none; line-height:20px; } #content_wrap { width:947px; background:#fff; margin: 15px 0 0 36px; clear:both; float:left; padding:15px 15px 15px 15px; text-align:left; } #content_wrap #submenu { width: 224px; margin-right:32px; float:left; height:100%; } #content_wrap .loginbox { background:#7ec291; padding:13px; color:#fff; clear:both; float:left; width:100%; margin-bottom:13px; text-align:left; line-height: 20px; height: 97px; } .loggedin #content_wrap .loginbox { text-align:center; } #content_wrap .loginbox a { color: #fff; font-weight:bold; text-decoration:none; } #content_wrap .loginbox a:hover { text-decoration:underline; } #content_wrap .loginbox input.logoutsubmit { background: url(../images/arrow_bw_bg.png) no-repeat right center #292929; padding: 4px 25px 4px 11px; border:0; color: #fff; font-weight:normal; margin-top: 4px; } #member #content_wrap .loginbox { background:#f5b25a; } #content_wrap .loginbox .buttons { width: 166px; margin-top: 3px; } #content_wrap .loginbox p { margin-left: 1px; margin-top: -3px; margin-bottom: 3px; } #content_wrap .loginbox .loginsubmit { margin: 14px 0 0 14px; } #content_wrap .loginbox .buttons input { border:0; width: 146px; -moz-border-radius: 15px; border-radius: 15px; -webkit-border-radius: 15px; padding: 4px 8px; color:#777; background: #fff; clear:both; float:left; margin: 1px 0; behavior: url(js/PIE.php); } #maincontent { float:left; width:649px; } .default #maincontent { width: 408px; } .wide #maincontent { width:649px; } #frontpage #maincontent { width:408px; } .banner { text-align:center; } #footer { text-align:left; width:918px; min-height:114px; background:#f0f0f0; margin: 15px 0 0 50px; clear:both; float:left; padding:14px; } #footer #address { width:236px; float:left; } #footer #footercontent { width:443px; width:652px; float:left; margin-top:0px; background:url(../images/footer.gif) repeat; } #footer .footersection { width: 142px; margin-left: 14px; float: left; margin-right: 4px; } #footer #footerlogo { width: 210px; float: left; margin-top: 1px; margin-left: 1px; } .madebypoutapilvi { clear: both; float: left; margin: 20px auto; width: 960px; } .madebypoutapilvi a { text-decoration:none; color:#777; } /*sidemenu shortcuts*/ #submenu .content a { display:block; font-size:12px; font-weight:bold; /*padding:3px 13px 4px;*/ padding:7px 13px; background-color:#d4e8c5; margin-bottom:1px; color:#222; text-decoration:none; -moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; behavior: url(js/PIE.php); } #submenu .content a:hover { color:#2b8849; } #extra { margin-left:27px; float:left; width:225px; padding-top: 3px; } #extra #paper { width: 199px; padding: 14px; } #extra .content, #extra .content p { font-family: Arial, sans-serif; font-size: 12px; line-height:17px; } #extra #quicklinks .etsitko_psykologia { background:url(../images/etsitko_psykologia.gif); } #extra #quicklinks .psylin_blogi { background:url(../images/psylin_blogi.gif); } #extra #quicklinks .psykologien_kustannus { background:url(../images/psykologien_kustannus.gif); } #extra #quicklinks .podcast { background:url(../images/podcast.gif); } #extra #quicklinks a { display: block; width: 226px; height: 29px; text-indent: -99999px; } #extra #quicklinks a { background-position: left top; } #extra #quicklinks a:hover { background-position: left bottom; } #extra #quicklinks a { display:block; margin-bottom:3px; } /* Sidemenu */ /*member and register -colours d4e8c5 -> ffdc97 -> d3ddf0 f0f7e1 -> fff0d2 -> e2e8f0 // hatusta 2b8849 -> de7e00 -> 2e5585 */ #member .sidemenulevel .sidemenulevel a { background-color:#fff0d2; color: #111; border-top:1px solid #ffdc97; margin-top:0px; } #member .sidemenulevel .sidemenulink:first-child a { margin-top:0px; } #member .sidemenulevel .sidemenulevel .sidemenulink:first-child a { border:0; } #member .sidemenulink a { color:#222; background:#ffdc97; } #member .sidemenulevel .sidemenulevel .sidemenulink a { background:#fff0d2; } #member .sidemenulink a:hover { color:#de7e00; } #member .sidemenulevel .sidemenulevel .sidemenulevel .sidemenufirst { border-top:1px solid #ffdc97; margin:0; } /*register*/ #register .sidemenulevel .sidemenulevel a { background-color:#e9f1ff; color: #111; } #register .sidemenulevel .sidemenulevel a { border-top:1px solid #d3ddf0; } #register .sidemenulevel .sidemenulink:first-child a { border-top:0px; margin-top:1px; } #register .sidemenulink a { color:#222; background:#d3ddf0; } #register .sidemenulevel .sidemenulevel .sidemenulink a { background:#e9f1ff; } #register .sidemenulink a:hover { color:#2e5585; } #register .sidemenulevel .sidemenulevel .sidemenulevel .sidemenufirst { border-top:1px solid #e9f1ff; margin:0; } /* general */ .sidemenulevel { font-size:12px; font-weight:bold; padding-bottom:0px; font-family:Arial, Helvetica, sans-serif; margin-bottom:13px; line-height: 17px; } .sidemenulink { margin-bottom:1px; } .sidemenulevel .sidemenulevel .sidemenulink { margin-bottom:0px; } .sidemenulevel .sidemenulevel { margin-bottom:1px; font-weight:normal; } .sidemenulevel > .sidemenulevel { margin-bottom:1px; font-weight:normal; } .sidemenulevel > .sidemenulevel > .sidemenulevel { margin-bottom:0px; font-weight:normal; } .sidemenulevel .sidemenulevel a { background-color:#f0f7e1; color: #111; } .sidemenulevel .sidemenulevel .sidemenulink { border-top:1px solid #f0f7e1; padding:0; background-color:transparent; } .sidemenulevel .sidemenulevel .sidemenufirst { border:0; } .sidemenulevel .sidemenulevel .sidemenulevel .sidemenufirst { border-top:1px solid #f0f7e1; margin:0; } .sidemenulevel .sidemenulevel .sidemenulink a { background:#f0f7e1; padding-left:26px; } .sidemenulevel .sidemenulevel .sidemenulevel .sidemenulink { } .sidemenulevel .sidemenulevel .sidemenulevel a { padding-left: 50px; display: list-item; list-style-type: disc; list-style-position: inside; text-indent: -12px; } .sidemenulevel .sidemenulevel a { border-top:1px solid #d4e8c5; margin:0; -moz-border-radius: 0px; border-radius: 0px; -webkit-border-radius: 0px; behavior: url(js/PIE.php); } .sidemenulevel .sidemenulevel .sidemenulink:first-child a { border-top:0px; margin-top:1px; } .sidemenuarrow { float:right; margin: 7px 8px 0 0; } .sidemenulink a { color:#222; background:#d4e8c5; text-decoration:none; padding:7px 13px; display:block; width: 225px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; behavior: url(js/PIE.php); } .sidemenulink a:hover { color:#2b8849; } #register .sidemenulevel a.sidemenuselected, #member .sidemenulevel a.sidemenuselected, .sidemenulevel a.sidemenuselected { font-weight:bold; text-decoration:none; background: #000; color:#fff; } .sidemenulevel .sidemenulevel a.sidemenuselected, #member .sidemenulevel .sidemenulevel a.sidemenuselected, #register .sidemenulevel .sidemenulevel a.sidemenuselected { text-decoration:none; background: #000; color:#fff; font-weight:normal; } .sidemenuarrow, .sidemenublank { display:inline; } #top { width:649px; float:left; border-bottom:1px solid #a7a7a7; padding-bottom: 10px; margin-bottom: 21px; } #frontpage #top { clear:both; width:100%; } #printer { float:right; clear:right; } .path { float:left; } .path a { color:#333333; font-size:12px; text-decoration:none; } .path a:hover { text-decoration:underline; } a.pathlink { margin-right:3px; margin-left: 3px; } a.pathlink:first-child { margin-left: 0px; } a:hover.pathlink { } .path a.pathlinkcurrent { color:#2b8849; text-decoration:none; margin-left: 3px; } #member .path a.pathlinkcurrent { color: #d16900; } #register .path a.pathlinkcurrent { color:#7891bb; } /* News */ .content .newstitle { font-size:18px; font-weight:normal; line-height:normal; margin:0 0 10px 0; color:#2b8849; font-family:Georgia, "Times New Roman", Times, serif; } .content .news p.prevnext a.prevlink { margin-right: 20px; } #member .content .newstitle { color: #d16900; } #register .content .newstitle { color:#7891bb; } .content .newsdigesttitle { font-size:18px; font-weight:normal; line-height:normal; margin:0 0 10px 0; color:#2b8849; font-family:Georgia, "Times New Roman", Times, serif; } #member .content .newsdigesttitle { color: #d16900; } #register .content .newsdigesttitle { color:#7891bb; } .content .news h1 { font-size:16px; margin-bottom:8px; } .content .news h2 { font-size:14px; margin-bottom:6px; } .content .news h3 { font-size:12px; font-weight:bold; margin-bottom:6px; } .newsdate { font-size:11px; display:block; } .newsdigestitem .newsheading, .news .newsheading { margin:3px 0px 0; font-weight:bold; border-top: 1px dashed #a7a7a7; padding-top: 9px; font-size: 13px; } .newsdigestitem:first-child .newsheading, .news .content:first-child .newsheading { border-top: 1px solid #a7a7a7; } .newsdigestitem { margin-bottom:12px; line-height:normal; } .newsreadmore { display:none; } .newsingress { color:#444; } div.news .newsingress { margin:2px 0px; } .content p.newsitemingress { margin-bottom:15px; } .content p.newsitemreadmore { margin-top:20px; display: block; } div.news .content { padding-bottom:0px; } .content .newsname { color:#666; font-size:11px; } .newsdigestimage, .newsimage { float:left; } .content .newsdigestimage img, .content .newsimage img { margin:0px 10px 10px 0px; } .content .newsdigesttitle img { margin:1px 0 0 2px; float:right; } .content .newstitle img { margin:1px 0 0 2px; float:right; } .content .newsclear { clear:both; font-size:1px; height:1px; } /* Search - Sitemap */ .searchhilited { text-decoration:underline; } a.searchhilited { text-decoration:underline; } a:hover.searchhilited { text-decoration:none !important; } .searchresult { margin-bottom: 17px; } .searchresultcount { margin:20px 0px 10px 0px; line-height:18px; font-size:12px; font-weight:bold; } .searchheading a { font-size:12px; text-decoration:none; } .searchheading { margin-bottom: 5px; } .searchsummary { font-size: 12px; } .content input.searchsubmit { background: url(../images/arrow_bw_bg.png) no-repeat right center #292929; padding: 4px 25px 4px 11px; border:0; color: #fff; width:auto; font-weight:normal; margin-top: 4px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; behavior: url(js/PIE.php); } .sitemaplevel0 { background-color:#f1f1f1; } .sitemaplevel1 { background-color:#e5e5e5; } /* Attachments */ a.attachment, a.file { display: block; background-position: left center; background-repeat: no-repeat; padding: 5px 0px 5px 24px; } a.file { background-image:url(../aimg/icons/file.gif); } a.pdf { background-image:url(../aimg/icons/pdf.gif); } a.txt { background-image:url(../aimg/icons/txt.gif); } a.jpg { background-image:url(../aimg/icons/jpg.gif); } a.gif { background-image:url(../aimg/icons/gif.gif); } a.zip { background-image:url(../aimg/icons/zip.gif); } a.word { background-image:url(../aimg/icons/word.gif); } a.powerpoint { background-image:url(../aimg/icons/powerpoint.gif); } a.excel { background-image:url(../aimg/icons/excel.gif); } a.rtf { background-image:url(../aimg/icons/rtf.gif); } .content_image a.attachment, .content_image a.file, .content_image a.jpg, .content_image a.gif { background: none; padding: 0px; } /* Sisaltopankki */ .content .contentadmin td { padding:10px 10px 10px 0px; } .content .contentadmin .ca_button_common, .content .contentadmin .ca_button_delete, .content .contentadmin .button { background-color:#848484; color:#fff; border:1px solid #504f4f; margin:5px 5px 5px 0px; } .content .ca_link_common { color:#000 !important; background-color: #E9F1FF; border: 1px solid #504F4F; margin:5px 5px 5px 0px; padding:5px; text-decoration:none !important; } .content .ca_link_common:hover { text-decoration:underline !important; } .content .ps_search td { padding:5px 10px 5px 0; } .content .ps_list { margin-top:20px; border-collapse:collapse; } .content .ps_list td { padding:10px; border-bottom:1px solid #e1e1e1; } .content .ps_list th { text-align:left; padding:10px; background-color:#f7f7f7; } .content .ps_search .searchboxsubmit { cursor:pointer; background-color:#e9880c; border:none; color:#fff; padding:3px 5px; } .content .ps_back { margin:10px 0; } .content input.list_submit { background-color:#666665; padding:2px 4px; overflow:visible; color:#fff; font-weight:normal; border:0; font-size:11px; cursor:pointer; } table.therapist_details { border-collapse:collapse; } table.therapist_details th { width:200px; text-align:left; font-weight:bold; } table.therapist_details th, table.therapist_details td { padding:4px 10px 4px 0; border-bottom:1px dashed #ccc; } div.therapist_moreinfo, div.therapist_additinfo { margin-top:25px; } /* XM */ #therapist_list th.header { background-image:url(../images/bg_sort.gif); cursor: pointer; font-weight: bold; background-repeat: no-repeat; background-position: center left; padding-left: 20px; padding-right: 5px; border-right: 1px solid #eee; margin-left: -1px; text-align: left; padding-top: 5px; padding-bottom: 5px; } th.headerSortDown { background-image: url(../images/desc.gif); background-color: #eee; } th.headerSortUp { background-image: url(../images/asc.gif); background-color: #eee; } /*form*/ .content .form_input textarea { width: 385px; } .content .formsubmit { background: url(../images/arrow_bw_bg.png) no-repeat right center #292929; padding: 4px 25px 4px 11px; border:0; color: #fff; font-weight:normal; margin-top: 4px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; behavior: url(js/PIE.php); -moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; behavior: url(js/PIE.php); } .content p.required { color:red; }