/* Theme Name: riaanlos.nl Theme URI: http://www.riaanlos.nl/ Description: Custom theme designed for website www.riaanlos.nl. Version: 1.0 Author: Riaan Los Author URI: http://www.riaanlos.nl Tags: small, vcard, custom, gray, red */ body { margin:0; padding:0; font-family:Arial, Helvetica, sans-serif; color:#403F3F; letter-spacing:0.02em; font-size:62.5%; } .fright { float:right; } .clear { clear:both; } .bold { font-weight:bold; } #top, #header, #content { font-size:1.2em; } .wrapper { margin:0 auto; width:500px; } #top .wrapper { padding:0 10px 0 0; width:490px; } #header .wrapper { padding:10px 15px; width:470px; } #content .wrapper { padding:10px 15px; width:470px; } h1 { color:#403F3F; font-size:1.8em; } h2 { color:#403F3F; font-size:1.6em; } h3 { color:#403F3F; font-size:1.4em; } a,a:link,a:active,a:visited { color:#962d2d; text-decoration:underline; } a:hover { text-decoration:none; color:#403F3F; background:#fff; } .navigation { display:block; text-align:center; margin:10px 0; } p img { padding:0; max-width:100%; } img.centered { display:block; margin-left:auto; margin-right: auto; } img.alignright { padding:4px; margin:0 0 2px 7px; display:inline; } img.alignleft { padding:4px; margin:0 7px 2px 0; display:inline; } .alignright { float:right; } .alignleft { float:left; } #top { height:81px; background:#3d3b3b url(images/top-bg.png) center top repeat-x; } #nav { float:right; } #nav ul { margin:0; padding:0; } #nav li { list-style-image:none; list-style-position:outside; list-style-type:none; float:left; } #nav a,#nav a:link,#nav a:active,#nav a:visited { display:block; text-decoration:none; text-transform:lowercase; color:#b3b3b3; font-size:1.3em; padding:30px 10px; outline:none; } #nav a:hover { color:#cbcbcb; } #nav li.current-cat a { color:#FFF } #logo { width:250px; height:81px; } #logo a { outline:none; background:none; } #logo img { border:none; } #header { border-bottom:solid 1px #a1a1a1; background:#cfcfcf url(images/header-bg.gif) center top repeat-x; min-height:100px; height:auto !important; height:100px; } #header ul { margin:0; padding:0; } #header li { list-style-image:none; list-style-position:outside; list-style-type:none; } #header .wrapper .textwidget .text { float:right; text-align:right; line-height:25px; } #header .wrapper .textwidget .text .r1 { color:#962d2d; margin-top:3px; } #header .wrapper .textwidget .text .r2 { color:#8f2323; } #header .wrapper .textwidget .text .r3 { color:#7a1a1a; } #header .wrapper .textwidget .text .r4 { color:#651212; } #header .wrapper .textwidget .text .s1 { font-size:1.3em; } #header .wrapper .textwidget .text .s2 { font-size:1.4em; } #header .wrapper .textwidget .text .s3 { font-size:1.5em; } #header .wrapper .textwidget .text .s4 { font-size:1.6em; } #header .wrapper .textwidget .text .s5 { font-size:1.8em; } #header .wrapper #socials .links { margin:0; } #header .wrapper #socials .links li { width:50%; float:left; margin-top:15px; } #header .wrapper #socials .links li a,#header .wrapper #socials .links li a:link,#header .wrapper #socials .links li a:active,#header .wrapper #socials .links li a:visited { display:block; text-decoration:none; text-transform:lowercase; color:#a1a1a1; background:transparent left top no-repeat; padding:8px 2px 6px 43px; height:19px; font-size:1.2em; } #header .wrapper #socials .links .facebook a,#header .wrapper #socials .links .facebook a:link,#header .wrapper #socials .links .facebook a:active,#header .wrapper #socials .links .facebook a:visited { background-image:url(images/icon/facebook.png); } #header .wrapper #socials .links .twitter a,#header .wrapper #socials .links .twitter a:link,#header .wrapper #socials .links .twitter a:active,#header .wrapper #socials .links .twitter a:visited { background-image:url(images/icon/twitter.png); } #header .wrapper #socials .links .linkedin a,#header .wrapper #socials .links .linkedin a:link,#header .wrapper #socials .links .linkedin a:active,#header .wrapper #socials .links .linkedin a:visited { background-image:url(images/icon/linkedin.png); } #header .wrapper #socials .links .hyves a,#header .wrapper #socials .links .hyves a:link,#header .wrapper #socials .links .hyves a:active,#header .wrapper #socials .links .hyves a:visited { background-image:url(images/icon/hyves.png); } #header .wrapper #socials .links .youtube a,#header .wrapper #socials .links .youtube a:link,#header .wrapper #socials .links .youtube a:active,#header .wrapper #socials .links .youtube a:visited { background-image:url(images/icon/youtube.png); } #header .wrapper #socials .links .rss a,#header .wrapper #socials .links .rss a:link,#header .wrapper #socials .links .rss a:active,#header .wrapper #socials .links .rss a:visited { background-image:url(images/icon/rss.png); } #header .wrapper #socials .links li a:hover { background-position:left bottom; color:#373737; } #content { background:#fff url(images/content-bg.png) center top repeat-x; min-height:265px; height:auto !important; height:265px; } #content form { margin:15px 0 0 0; } #content form .row { clear:both; margin:0 0 15px 0; } #content form .text input { border:solid 3px #e4e4e4; background:#fff; padding:6px; width:300px; color:#962d2d; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content form .textarea textarea { border:solid 3px #e4e4e4; background:#fff; padding:6px; width:450px; font-family:Arial, Helvetica, sans-serif; color:#962d2d; letter-spacing:0.02em; font-size:80%; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content form .row input.blur,#content form .row textarea.blur { color:#e4e4e4; } #content form .row input.filled,#content form .row textarea.filled { color:#444343; } #content form .row input.focus,#content form .row textarea.focus { border-color:#b3b3b3; } #content form .submit { text-align:right; width:469px; } #content form .submit input { border:none; background:#373737; padding:6px 15px; width:auto; color:#fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content .wpcf7-response-output { margin: 2em 0.5em 1em; padding: 6px; font-size:1em; } #content .wpcf7-mail-sent-ok { background:#DFF2BF; border:solid 3px #4F8A10; color:#4F8A10; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content .wpcf7-mail-sent-ng { background:#FFBABA; border:solid 3px #D8000C; color:#D8000C; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content .wpcf7-spam-blocked { background:#BDE5F8; border:solid 3px #00529B; color:#00529B; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content .wpcf7-validation-errors { background:#FEEFB3; border:solid 3px #9F6000; color:#9F6000; -moz-border-radius: 5px; -webkit-border-radius: 5px; } #content .wpcf7-not-valid-tip { position:absolute; top:20%; left:20%; z-index:99999; background:#FFBABA; border:solid 3px #D8000C; color:#D8000C; width:280px; padding:3px; -moz-border-radius:3px; -webkit-border-radius:3px; font-size:1em; } #content .wpcf7-not-valid-tip-no-ajax { display:block; background:#BDE5F8; border:solid 3px #00529B; color:#00529B; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .back { overflow:auto; width:auto; } .back a,.back a:link,.back a:active,.back a:visited { display:block; padding:1px 3px; float:left; -moz-border-radius: 3px; -webkit-border-radius: 3px; background:#fff; text-decoration:none; } .back a:hover { background:#962d2d; color:#fff; } .post .thumbnail-container { position:relative; margin-bottom:20px; } .post .thumbnail-container a,.post .thumbnail-container a:link,.post .thumbnail-container a:active,.post .thumbnail-container a:visited { display:block; padding:0; border:none; text-decoration:none; color:#fff; } .post .thumbnail-image { z-index:1; } .post .thumbnail-image img { border:none; background:none; } .post .thumbnail-overlay { z-index:2; position:absolute; width:460px; height:90px; border:5px solid #e4e4e4; } .post .thumbnail-bar { width:460px; height:30px; position:absolute; bottom:0px; right:0px; background:#403F3F; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; } .post .thumbnail-text { position:absolute; bottom:10px; right:10px; font-size:1.4em; z-index:3; margin:0; padding:0; color:#fff; font-weight:normal; } .post .thumbnail-container a:hover { color:#e4e4e4; } .post .thumbnail-container a:hover .thumbnail-bar { background:#651212; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } .post .thumbnail-container a:hover .thumbnail-overlay { border-color:#d3d3d3; } .post .postmetadata { background:#e3e3e3; padding:5px; margin:0; font-size:0.9em; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .post .postmetadata li { list-style-position:outside; list-style-type:none; padding:2px 0 2px 24px; background:transparent 2px center no-repeat; overflow:auto; width:auto; } .post .postmetadata .postmetadata-date { background-image:url(images/icon/small_date.png); } .post .postmetadata .postmetadata-tags { background-image:url(images/icon/small_tag.png); } .postmetadata-tags a,.postmetadata-tags a:link,.postmetadata-tags a:active,.postmetadata-tags a:visited { display:block; float:left; padding:1px 3px; margin-right:3px; background:#f4f4f4; text-decoration:none; -moz-border-radius: 3px; -webkit-border-radius: 3px; } .postmetadata-tags a:hover { background:#962d2d; color:#fff; } .post .postmetadata .postmetadata-trackback { background-image:url(images/icon/small_trackback.png); } #header .thumbnail-container { position:relative; } #header .thumbnail-image { z-index:1; } #header .thumbnail-image img { border:none; background:none; } #header .thumbnail-overlay { z-index:2; position:absolute; width:460px; height:90px; border:5px solid #e4e4e4; } #header .thumbnail-bar { width:460px; height:30px; position:absolute; bottom:0px; right:0px; background:#403F3F; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; } #header .thumbnail-text { position:absolute; bottom:10px; right:10px; font-size:1.4em; z-index:3; margin:0; padding:0; color:#fff; font-weight:normal; } .portfolio .metadata { float:right; color:#962d2d; font-size:1em; margin-top:5px; text-transform:uppercase; } .portfolio .metadata a,.portfolio .metadata a:link,.portfolio .metadata a:active,.portfolio .metadata a:visited { color:#962d2d; text-decoration:underline; } .portfolio .metadata a:hover { text-decoration:none; color:#403F3F; } .portfolio-image { width:150px; height:113px; padding:10px 1px 3px 1px; margin:0 15px 0 0; background:url(images/portfolio-bg.png) center top no-repeat; text-align:center; float:left; } .portfolio h3 { margin:0; padding:0; } .portfolio-content { float:left; margin:0; padding:0; } .comment-logged-in { margin-bottom:10px; overflow:auto; width:auto; } .comment-logged-in-avatar { float:left; margin-right:10px; border:solid 3px #e4e4e4; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .comment-logged-in-avatar a, .comment-logged-in-avatar img { border:none; } .comment-logged-in-who { margin:5px 0; } .comment-logged-in-buttons { overflow:auto; width:auto; } .comment-logged-in-buttons a,.comment-logged-in-buttons a:link,.comment-logged-in-buttons a:active,.comment-logged-in-buttons a:visited { display:block; float:left; padding:3px 5px; background:#373737; color:#fff; margin-right:5px; text-decoration:none; font-size:0.8em; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .comment-logged-in-buttons a:hover { background:#962d2d; } .download { margin-bottom:10px; } .download a,.download a:link,.download a:active,.download a:visited { text-decoration:none; display:block; background:#f4f4f4; padding:5px; overflow:auto; width:auto; -moz-border-radius: 5px; -webkit-border-radius: 5px; } .download a:hover { background:#e4e4e4; } .download .download-image { display:block; float:left; margin-right:10px; } .download .download-image img { border:none; width:30px; height:30px; } .download .download-title { display:block; font-size:1.2em; } .download .download-description { display:block; font-size:0.8em; color:#b3b3b3; margin:-1px 0 0 45px; font-style:italic; } #footer { position:fixed; bottom:0px; font-size:1.1em; text-align:center; width:100%; padding:3px 0; background:#373737; color:#cbcbcb; } div.sociable { margin:10px 0 6px 0; } /*span.sociable_tagline { position: relative; } span.sociable_tagline span { display: none; width: 14em; } span.sociable_tagline:hover span { position: absolute; display: block; top: -5em; background: #ffe; border: 1px solid #ccc; color: black; line-height: 1.25em; }*/ .sociable span { display:block; } .sociable ul { display:inline; margin:0 !important; padding:0 !important; } .sociable ul li { background:none; display:inline !important; list-style-type:none; list-style-position:outside; margin:0; padding:0; } /*.sociable ul li:before { content: ""; }*/ .sociable img { float:none; width:33px; height:33px; border:0; margin:0; padding:0; } .sociable-hovers { opacity:.8; -moz-opacity:.8; filter:alpha(opacity=80); } .sociable-hovers:hover { opacity:1; -moz-opacity:1; filter:alpha(opacity=100); } /* #suckerfishnav {background:#1F3E9F url("../multi-level-navigation-plugin/images/suckerfish_blue.png") repeat-x;font-size:18px;font-family:verdana,sans-serif;font-weight:bold; width:100%;}#suckerfishnav, #suckerfishnav ul {float:left;list-style:none;line-height:40px;padding:0;border:1px solid #aaa;margin:0; width:100%;}#suckerfishnav a {display:block;color:#dddddd;text-decoration:none;padding:0px 10px;}#suckerfishnav li {float:left;padding:0;}#suckerfishnav ul {position:absolute;left:-999em;height:auto; width:151px;font-weight:normal;margin:0;line-height:1; border:0;border-top:1px solid #666666; }#suckerfishnav li li { width:149px;border-bottom:1px solid #666666;border-left:1px solid #666666;border-right:1px solid #666666;font-weight:bold;font-family:verdana,sans-serif;}#suckerfishnav li li a {padding:4px 10px; width:130px;font-size:12px;color:#dddddd;}#suckerfishnav li ul ul {margin:-21px 0 0 150px;}#suckerfishnav li li:hover {background:#1F3E9F;}#suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a {color:#dddddd;}#suckerfishnav li:hover a, #suckerfishnav li.sfhover a {color:#dddddd;}#suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a {color:#dddddd;}#suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul {left:-999em;}#suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul {left:auto;background:#444444;}#suckerfishnav li:hover, #suckerfishnav li.sfhover {background:#5E7AD3;} */