/* Theme Name: DIL Theme URI: http://dil.berkeley.edu/ Description: Custom Wordpress theme for Development Impact Lab Site. Author: Raymon Sutedjo-The (ray-mon.com) Version: 1.0 License: GNU General Public License License URI: license.txt Tags: */ /* reset */ html, body, address, blockquote, del, div, h1, h2, h3, h4, h5, h6, hr, ins, noscript, p, pre, dl, dt, dd, li, ol, ul, table, caption, colgroup, col, thead, tfoot, tbody, tr, td, th, form, button, fieldset, legend, label, select, optgroup, option, textarea, a, bdo, br, img, map, area, object, param, q, script, span, sub, sup, abbr, acronym, cite, code, del, dfn, em, ins, kbd, samp, strong, var, b, big, i, small, tt{border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;outline:0;padding:0;vertical-align:baseline;} ol, ul{list-style:none;} th{text-align:left;} table{border-collapse:collapse;} /* global */ /* dark brown - #493b2a light brown - #8e816b red - #ed1c24 blue - #6b93a5 green - #6b8d5b purple - #795d8f */ body {background:url(images/bg.jpg) repeat; color:#555; font-family:helvetica,arial,sans-serif; font-size:1em;} a:link, a:visited {color:#ed1c24; text-decoration:none; -webkit-transition:color .1s ease-in; -moz-transition:color .1s ease-in; -o-transition:color .1s ease-in; transition:color .1s ease-in; } a:hover, a:visited:hover {color:#a71319; text-decoration:none;} a:active {color:#851014; text-decoration:none;} table td {} h1 {clear:left; color:#111; font-family:'Oswald',sans-serif; font-size:2em; font-weight:700; margin:0 20px 10px 20px; text-transform:uppercase;} h2 {clear:left; color:#8e816b; font-family:'Oswald',sans-serif; font-size:1.5em; font-weight:300; line-height:1.4; margin:0 20px 50px 20px;} h3 {clear:left; color:#333; font-family:'Oswald',sans-serif; font-size:1.5em; font-weight:400; line-height:1.5; margin:0 20px 15px 20px;} h4 {color:#8e816b; font-family:'Oswald',sans-serif; font-size:1em; font-weight:400; letter-spacing:1px; line-height:1.375; margin:0 20px 10px 20px; text-transform:uppercase;} h5 {font-size:1em; font-weight:bold; margin:0 0 5px 0;} h6 {color:#8f816c; font-size:.75em; font-weight:bold; margin:0 20px 20px 20px; text-transform:uppercase;} p {font-size:.875em; line-height:1.5; margin:0 20px 15px 20px;} span {} hr {border-top:10px solid #222; clear:left; height:0; margin:30px 0 30px 0; width:60px;} label {} input {font-family:helvetica,arial,sans-serif;} input[type=text] {background:#f0f0f0; border:0; padding:5px; font-size:1em; width:210px;} input[type=text]:focus {} input[type=submit] {background:#ed1c24; border:0; color:#fff !important; cursor:pointer; display:block; font-size:1em; font-weight:bold; padding:5px 10px; text-transform:uppercase;} textarea {background:#f0f0f0; padding:5px; width:370px;} blockquote {border-top:10px solid #8f816c; color:#8f816c; float:right; font-family:'Oswald',sans-serif; font-size:1.75em; font-weight:300; margin:0 20px 20px 20px; padding:5px 0 0 0; width:220px;} blockquote p {line-height:1.25; margin:0;} ::selection {} ::-moz-selection {} .link-cta {background:url(images/arrow.png) right 2px no-repeat; clear:both; display:inline-block; font-weight:bold; line-height:1.25; padding:0 15px 0 0; text-transform:uppercase;} .link-cta:hover {} /* post */ body.single #section, body.single #branding {display:none;} /* wrapper */ #wrapper {/* box-shadow:0 -20px 30px #222 */; margin:0 auto 80px; overflow:hidden; padding:0 20px; position:relative; width:980px;} #section-title {background:#333; color:#fff; display:block; font-family:'Oswald',sans-serif; font-size:3em; font-weight:700; line-height:1.125; height:54px; overflow:hidden; padding:10px 40px 10px 12px; right:-20px; position:absolute; text-align:right; text-transform:uppercase; top:357px; z-index:100;} #section-sub {background:#666; font-family:'Oswald',sans-serif; font-size:1.25em; font-weight:400; position:absolute; line-height:1.25; padding:20px 40px 15px 20px; right:-20px; text-align:right; top:431px; width:220px; z-index:99;} #section-sub li {margin:0 0 10px 0;} #section-sub .current_page_item a {color:#fff !important;} .page-template-page-landing-projects-php #section-title, .page-template-page-projects-php #section-title {background:#6b93a5;} .page-template-page-landing-projects-php #section-sub, .page-template-page-projects-php #section-sub {background:#b1cbd7;} .page-template-page-landing-projects-php #section-sub a, .page-template-page-projects-php #section-sub a {color:#6b93a5;} .page-template-page-landing-projects-php #section-sub a:hover, .page-template-page-projects-php #section-sub a:hover{color:#fff;} .page-template-page-landing-ecosystem-php #section-title, .page-template-page-ecosystem-php #section-title {background:#6b8d5b;} .page-template-page-landing-ecosystem-php #section-sub, .page-template-page-ecosystem-php #section-sub {background:#b2cba6;} .page-template-page-landing-ecosystem-php #section-sub a, .page-template-page-ecosystem-php #section-sub a {color:#6b8d5b;} .page-template-page-landing-ecosystem-php #section-sub a:hover, .page-template-page-ecosystem-php #section-sub a:hover{color:#fff;} .page-template-page-landing-overview-php #section-title, .page-template-page-overview-php #section-title, .page-template-page-news-php #section-title, .page-template-page-events-php #section-title {background:#795d8f;} .page-template-page-landing-overview-php #section-sub, .page-template-page-overview-php #section-sub, .page-template-page-news-php #section-sub, .page-template-page-events-php #section-sub {background:#c4bacd;} .page-template-page-landing-overview-php #section-sub a, .page-template-page-overview-php #section-sub a, .page-template-page-news-php #section-sub a, .page-template-page-events-php #section-sub a {color:#795d8f;} .page-template-page-landing-overview-php #section-sub a:hover, .page-template-page-overview-php #section-sub a:hover, .page-template-page-news-php #section-sub a:hover, .page-template-page-events-php #section-sub a:hover {color:#fff;} /* header */ #logo-container {display:block; float:left; height:145px; position:relative; width:250px;} #logo {background:url(images/logo.png) 0 0 no-repeat; display:block; height:145px; left:0; position:absolute; top:0; transition: opacity .1s; -moz-transition: opacity .1s; -webkit-transition: opacity .1s; -o-transition: opacity .1s; width:250px;} #branding {background:#000; clear:both; height:245px; margin:1px 0 10px 0; overflow:hidden; position:relative;} #branding img {display:none;} #access {} #nav-categories {clear:right; float:left; font-family:'Oswald',sans-serif; font-size:1.25em; font-weight:300; height:65px; line-height:1; margin:0 0 20px 0; overflow:hidden; position:relative; width:730px;} #nav-categories li {border-left:1px solid #777; display:none; padding:45px 0 0 8px; position:absolute; text-transform:uppercase; top:0;} #nav-categories-projects {left:0;} #header .menu-header {float:left; position:relative;} #menu-main {font-family:'Oswald',sans-serif; font-size:.75em; font-weight:400; letter-spacing:1px; position:relative; text-transform:uppercase;} #menu-main > li {float:left; margin:0 1px 0 0; position:relative;} #menu-main li a {color:#fff; display:block; height:37px; overflow:hidden; padding:10px 10px 12px 10px; /* transition: background .1s; -moz-transition: background .1s; -webkit-transition: background .1s; -o-transition: background .1s; */ } #menu-main li a:hover {height:38px;} #menu-main a.open {display:block; height:38px;} #menu-name {display:none;} #menu-parent-1 a:hover, #menu-parent-1 a.open, #menu-parent-2 a:hover, #menu-parent-2 a.open {background:#6b93a5;} #menu-parent-3 a:hover, #menu-parent-3 a.open, #menu-parent-4 a:hover, #menu-parent-4 a.open {background:#6b8d5b;} #menu-parent-5 a:hover, #menu-parent-5 a.open, #menu-parent-6 a:hover, #menu-parent-6 a.open {background:#795d8f;} #menu-main .sub-menu {border-bottom:1px solid #222; display:none; left:0; position:absolute; top:60px; width:220px; z-index:100;} #menu-parent-1 .sub-menu, #menu-parent-2 .sub-menu {background:#6b93a5;} #menu-parent-3 .sub-menu, #menu-parent-4 .sub-menu {background:#6b8d5b;} #menu-parent-5 .sub-menu, #menu-parent-6 .sub-menu {background:#795d8f;} #menu-parent-1 .sub-menu a:hover, #menu-parent-1 .sub-menu a.open, #menu-parent-2 .sub-menu a:hover, #menu-parent-2 .sub-menu a.open {background:#b1cbd7 !important; color:#6b93a5;} #menu-parent-3 .sub-menu a:hover, #menu-parent-3 .sub-menu a.open, #menu-parent-4 .sub-menu a:hover, #menu-parent-4 .sub-menu a.open {background:#b2cba6 !important; color:#6b8d5b;} #menu-parent-5 .sub-menu a:hover, #menu-parent-5 .sub-menu a.open, #menu-parent-6 .sub-menu a:hover, #menu-parent-6 .sub-menu a.open {background:#c4bacd !important; color:#795d8f;} #menu-main .sub-menu li {clear:both; display:block;} #menu-main .sub-menu li a {height:auto; padding:10px; width:200px;} #menu-main .sub-menu a.open {display:block;} #menu-main .sub-menu .sub-menu {left:221px; position:absolute; top:0;} .page-template-page-landing-projects-php #menu-main .current-menu-item > a, .page-template-page-projects-php #menu-main .current-menu-ancestor > a, .page-template-page-projects-php #menu-main .current-menu-item > a{background:#6b93a5;} .page-template-page-landing-ecosystem-php #menu-main .current-menu-item > a, .page-template-page-ecosystem-php #menu-main .current-menu-ancestor a, .page-template-page-ecosystem-php #menu-main .current-menu-item > a{background:#6b8d5b;} .page-template-page-landing-overview-php #menu-main .current-menu-item > a, .page-template-page-news-php #menu-main .current-menu-ancestor a, .page-template-page-news-php #menu-main .current-menu-item a, .page-template-page-overview-php #menu-main .current-menu-ancestor a, .page-template-page-overview-php #menu-main .current-menu-item a{background:#795d8f;} #menu-toggle {display:none;} #photo-credit {display:none;} #photo-credit-text {background:#333; color:#fff; font-size:.75em; left:20px; position:absolute; top:220px;} /* main */ #main {margin:0 0 20px 0; overflow:hidden; position:relative; width:980px;} #container {background:#fff; float:left; width:820px;} .landing {background:none !important; width:1000px !important;} /* content */ #content {overflow:hidden; padding:40px 0 60px 0;} .single-post #content {padding-top:30px;} #breadcrumbs {font-size:.75em; margin:18px 0 18px 20px;} #content ul {font-size:.875em; line-height:1.5; margin:0 20px 20px 20px;} #content ul li {background:url(images/arrow.png) 0 4px no-repeat; margin:0 0 5px 0; padding:0 0 0 15px;} #content .module {float:left; margin:0 0 20px 20px; overflow:hidden; width:220px;} #content .module h4, #content .module p {margin-left:0; margin-right:0;} #content .module p {font-size:.75em;} #content .module-4 {float:left; margin:0 0 20px 20px; overflow:hidden; width:165px;} #content .module-4 h4, #content .module-4 p {margin-left:0; margin-right:0; margin-bottom: 0;} #content .module-4 p {font-size:.75em;} #content .module-text {} #content .module-horizontal {float:left; margin:0 0 20px 20px; overflow:hidden; width:380px;} #content .module-horizontal .module-image {display:block; float:left; margin:0 20px 10px 0; width:140px;} #content .module-horizontal .module-text {display:block; float:left; width:200px;} #content .module-horizontal h4, #content .module-horizontal p, #content .module-horizontal ul {margin-left:0; margin-right:0;} #content .module-horizontal p, #content .module-horizontal ul {font-size:.75em;} #content .module-horizontal ul li {background-position:0 2px;} #content .module-horizontal .link-cta {background-position:right 1px;} #content .spacer {display:block; float:right; height:100px; width:100px;} #content .module-horizontal-wide {float:left; margin:0 0 30px 20px; overflow:hidden; width:380px;} #content .module-horizontal-wide .module-image {display:block; float:left; margin:0 20px 10px 0; width:140px;} #content .module-horizontal-wide .module-text-01 {display:block; float:left; width:200px;} #content .module-horizontal-wide .module-text-02 {display:block; clear:both; float:none; width:380px;} #content .module-horizontal-wide h3, #content .module-horizontal-wide h4, #content .module-horizontal-wide p, #content .module-horizontal-wide ul {margin-left:0; margin-right:0;} #content .module-horizontal-wide .collapseomatic {font-weight:bold; margin-left:0;} #content .module-horizontal-wide .collapseomatic_content{margin-left:0;} #content .module-news-first {padding:0 0 30px 0; width:380px;} #content .module-news-first h4 {font-size:2em; line-height:1.4; margin:0 0 10px 0;} #content .module-news-first .date {font-size:.75em;} #content .module-news-wrapper {margin:0 0 20px 20px; float:left; overflow:hidden; width:380px;} #content .module-news {margin:0 0 10px 0; padding:0; width:380px;} #content .module-news h4 {letter-spacing:0; margin:0 0 10px 0; text-transform:none;} #content .module-news p {font-size:.875em;} #content .module-news .date {color:#666; font-size:.875em; font-style:italic; margin:0 0 10px 0;} #content .module-news .module-image {background:#000; display:block; height:95px; overflow:hidden; position:relative; width:380px;} #content .module-news .module-image img {height:auto; left:0; position:absolute; top:-40px; width:380px;} #content .module-news-textonly {border-top:1px solid #ddd; padding:5px 0 0 0;} #content #module-events {} #content #module-events li {background:none; margin:0 0 30px 0; padding:0; overflow:hidden;} #content #module-events h4 {font-size:2em; line-height:1.4; margin:0 0 10px 0; text-transform:none;} #content #module-events p {margin:0 0 10px 0;} #content #module-events .module-image {float:left; height:190px; margin:0; overflow:hidden; position:relative; width:380px;} #content #module-events .module-image img {height:auto; left:0; position:absolute; top:0; width:380px;} #content #module-events .module-text {float:left; margin:0 0 0 20px; width:380px;} #content #module-events .module-text-full {width:780px;} a.module-image {display:block; margin:0 0 15px 0; -webkit-transition:opacity .1s ease-in; -moz-transition:opacity .1s ease-in; -o-transition:opacity .1s ease-in; transition:opacity .1s ease-in; } a.module-image:hover {opacity:.5;} /* home */ body.home #section-title, body.home #section-sub, body.home #branding, body.home #footer-updates {display:none;} body.home #container {background:none; color:#fff; width:980px;} body.home h1 {color:#ed1c24; font-size:3em; margin:0; text-align:right;} body.home h2 {border-top:10px solid #fff; clear:both; color:#fff; display:inline-block; font-size:1.75em; font-weight:400; margin:0 0 20px 0; padding:2px 0 0 0;} #content-home-updates {font-size:.875em; line-height:1.5; margin:0 20px 40px 20px; overflow:hidden; width:940px;} #content-home-updates h4 {clear:none; color:#fff; float:none; margin:0 0 5px 0;} #content-home-updates .c-01, #content-home-updates .c-02 {float:left; margin:0 20px 0 0; overflow:hidden; width:300px;} #content-home-updates .c-03 {float:left; margin:0; overflow:hidden; width:500px;} #content-home-updates .column {float:left;} #content-home-updates .left {width: 25%;} #content-home-updates .right {width: 75%;} #content-home-updates li {margin:0 0 15px 0; overflow:hidden;} #content-home-updates .c {margin:0 42px 42px 0;} #content-home-updates .module-image {height:100px; margin:0 0 10px 0; overflow:hidden; width:300px;} #content-home-updates .module-image img {height:auto; width:300px;} #content-home-updates .date {color:#dbb1b1;} #content-home-updates p {line-height:1.35; margin:0 0 5px 0;} #content-home-updates .link-cta {margin:10px 0 0 0;} #content-home-updates .module-image a {display:block; -webkit-transition:opacity .1s ease-in; -moz-transition:opacity .1s ease-in; -o-transition:opacity .1s ease-in; transition:opacity .1s ease-in; } #content-home-updates .module-image a:hover {opacity:.5;} #home-quick-links {background: -moz-linear-gradient(top, #3f3f3f 0%, #333333 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#393939), color-stop(100%,#333333)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #3f3f3f 0%,#333333 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #3f3f3f 0%,#333333 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #3f3f3f 0%,#333333 100%); /* IE10+ */ background: linear-gradient(to bottom, #3f3f3f 0%,#333333 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f3f3f', endColorstr='#333333',GradientType=0 ); /* IE6-8 */ padding:12px 20px 8px 20px; width:260px;} #home-quick-links h2 {border:0; padding:0;} #home-quick-links a {color:#fff; font-weight:bold;} #home-quick-links a:hover {color:#ccc;} #home-quick-links a:active {color:#aaa;} #content-home-gallery {height:490px; margin:0 0 60px 0; overflow:hidden; position:relative; width:980px;} #content-home-gallery ul {height:490px; overflow:hidden; width:980px;} #content-home-gallery ul a {display:block; -webkit-transition:opacity .1s ease-in; -moz-transition:opacity .1s ease-in; -o-transition:opacity .1s ease-in; transition:opacity .1s ease-in;} #content-home-gallery ul a:hover {opacity:0.9;} #content-home-gallery .caption {background:url(images/content-home-gallery-bg.png) repeat; bottom:0; padding:10px 20px 35px 20px; position:absolute; right:20px; width:520px; z-index:100;} #content-home-gallery .caption p {font-family:'Oswald',sans-serif; font-size:1.5em; font-weight:300; margin:0; padding:0; text-align:right;} #content-home-gallery .prev {background:url(images/content-home-gallery-nav.png) left top no-repeat; bottom:20px; display:block; height:80px; left:20px; position:absolute; -webkit-transition:opacity .1s ease-in; -moz-transition:opacity .1s ease-in; -o-transition:opacity .1s ease-in; transition:opacity .1s ease-in; text-indent:-999em; width:60px; z-index:101;} #content-home-gallery .next {background:url(images/content-home-gallery-nav.png) right top no-repeat; bottom:20px; display:block; height:80px; left:180px; position:absolute; -webkit-transition:opacity .1s ease-in; -moz-transition:opacity .1s ease-in; -o-transition:opacity .1s ease-in; transition:opacity .1s ease-in; text-indent:-999em; width:60px; z-index:101;} #content-home-gallery .prev:hover, #content-home-gallery .next:hover {opacity:0.5;} #content-home-gallery .prev:active, #content-home-gallery .next:active {opacity:0.2;} #content-home-categories {background:url(images/content-home-categories-bg.png) 0 0 repeat-x; overflow:hidden; padding:50px 20px 0 20px;} #content-home-categories .c-01 {display:block; float:left; margin:0 20px 0 0; width:460px;} #content-home-categories .c-02 {display:block; float:left; padding:5px 0 0 0; width:460px;} #content-home-categories .c-01 h3 {color:#393939; font-size:5em; font-weight:700; line-height:1; margin:0;} #content-home-categories .c-01 span {color:#fff;} #content-home-categories a {color:#fff; text-decoration:underline;} #content-home-categories a:hover {color:#fff; text-decoration:none;} #content-home-categories-projects {background:url(images/home-projects.png) 0 0 no-repeat; height:150px; margin:0 0 30px 0; overflow:hidden; width:460px;} #content-home-categories-ecosystem {background:url(images/home-ecosystem.png) 0 0 no-repeat; height:150px; margin:0 0 30px 0; overflow:hidden; width:460px;} #content-home-categories-overview {background:url(images/home-overview.png) 0 0 no-repeat; height:150px; margin:0 0 30px 0; overflow:hidden; width:460px;} #content-home-categories-projects h3, #content-home-categories-ecosystem h3, #content-home-categories-overview h3 {color:#fff; float:left; font-size:3em; font-weight:700; height:110px; margin:0 1px 0 0; padding:40px 0 0 0; width:300px;} #content-home-categories-projects div {background:#6b93a5; float:left; height:150px; font-size:.875em; line-height:1.4; padding:10px; width:139px;} #content-home-categories-ecosystem div {background:#6b8d5b; float:left; height:150px; font-size:.875em; line-height:1.4; padding:10px; width:139px;} #content-home-categories-overview div {background:#795d8f; float:left; height:150px; font-size:.875em; line-height:1.4; padding:10px; width:139px;} .widget-container {list-style:none;} body.home .entry-content {display:none;} #content .collapseomatic {color:#ed1c24; background:url(images/accordion.png) 0 2px no-repeat; display:block; font-size:.875em; margin:0 0 0 20px; padding:0 0 0 20px; -webkit-transition:color .1s ease-in; -moz-transition:color .1s ease-in; -o-transition:color .1s ease-in; transition:color .1s ease-in; } #content .collapseomatic:hover {color:#a71319; text-decoration:none;} #content .colomat-close {background:url(images/accordion.png) 0 -98px no-repeat; text-decoration:none;} #content .collapseomatic_excerpt, #content .collapseomatic_content {margin-left:20px;} #content .collapseomatic_content h4, #content .collapseomatic_content p {margin-left:0;} /* landing */ .landing #content {padding-top:0;} .landing h1 {display:none;} .landing h2 {background:#222; border-bottom:10px solid #191919; margin:15px 0 60px 0; padding:30px 20px 20px 20px; width:600px;} .landing-projects .landing-section {border-color:#6b93a5;} .landing-ecosystem .landing-section {border-color:#6b8d5b;} .landing-overview .landing-section {border-color:#795d8f;} .page-template-page-landing-projects-php #section-sub, .page-template-page-landing-projects-php #primary, .page-template-page-landing-ecosystem-php #section-sub, .page-template-page-landing-ecosystem-php #primary, .page-template-page-landing-projects-php #section-sub, .page-template-page-landing-overview-php #primary {display:none;} .landing-section {border-top:5px solid #aaa; float:left; margin:0 0 40px 20px; padding:1px 0 0 0;width:300px;} .landing-section h3 {color:#fff; line-height:1.3; margin:0 0 15px 0; text-transform:uppercase;} .landing-section p {color:#fff; font-weight:bold; margin:0 0 10px 0;} .landing-section .image {margin:0 0 2px 0;} .landing-section .image a {display:block; -webkit-transition:opacity .1s ease-in; -moz-transition:opacity .1s ease-in; -o-transition:opacity .1s ease-in; transition:opacity .1s ease-in; } .landing-section .image a:hover {opacity:.5;} .landing .spacer {display:none !important;} /* sidebar */ #primary {color:#fff; float:left; font-size:.75em; width:160px;} #primary li {} .single-events #primary {display:none;} #primary h3.widget-title {border-top:1px solid #444; color:#aaa; margin:50px 0 20px 0; padding:5px 0 0 20px;} #primary .textwidget {margin:0 0 0 20px;} #primary .textwidget li {margin:0 0 10px 0;} /* post */ .single #section-title, .single #section-sub {display:none;} .single #content {border-top:10px solid #333;} /* caption */ .wp-caption {margin-left:20px !important;} .wp-caption-text {font-size:.75em; font-style:italic; margin:0;} /* form */ div.wpcf7-response-output {margin:0 !important;} div.wpcf7-mail-sent-ok, div.wpcf7-validation-errors {background:none; border:0 !important; font-weight:bold; margin:0 0 0 20px !important; padding:0 !important;} span.wpcf7-not-valid-tip {background:none !important; border:0 !important; color:#db7a19; font-weight:bold; left:240px !important; padding:0 !important; top:0 !important;} /* calendar */ .calnk a {} .calnk a span {display:none;} .calnk a:hover span {color:#333333; background:#eee; display:block; position:absolute; margin-top:5px; padding:5px 5px 10px 5px; width:220px; z-index:100; line-height:1.25;} .calendar-table {border:0 !important; margin:0 20px; width:780px; border-collapse:separate !important; border-spacing:2px !important;} .calendar-heading {background:#fafafa; padding:10px 0 !important; text-align:center;} .calendar-next {font-size:.75em; font-weight:bold; text-align:center; text-transform:uppercase; width:25%;} .calendar-prev {font-size:.75em; font-weight:bold; text-align:center; text-transform:uppercase; width:25%;} .calendar-month {font-size:1.5em; text-align:center; font-weight:bold; width:50%;} .normal-day-heading {text-align:center; font-size:0.75em; font-weight:bold; text-transform:uppercase; border:0; background-color:#eee; padding:5px 0 8px 0 !important;} .weekend-heading {text-align:center; font-size:0.75em; font-weight:bold; text-transform:uppercase; border:0; background-color:#eee; color:#b3b3b3; padding:8px 0 8px 0 !important;} .day-with-date {font-size:.875em; vertical-align:text-top; text-align:left; height:60px; line-height:1; border:1px solid #DFE6DE; padding:5px !important; width:90px;} .no-events {} .day-without-date {height:60px; border:1px solid #fafafa;} span.weekend {color:#b3b3b3;} .current-day {color:#fff; font-size:.875em; vertical-align:text-top; text-align:left; height:60px; border:1px solid #8e816b; background-color:#8e816b; padding:5px !important;} .current-day a {color:#fff;} span.event {font-size:0.75em; line-height:1;} .kjo-link {font-size:0.75em; text-align:center;} .calendar-date-switcher {height:25px; text-align:center; border:1px solid #D6DED5; background-color:#E4EBE3;} .calendar-date-switcher form {margin:2px;} .calendar-date-switcher input {border:1px #D6DED5 solid; margin:0;} .calendar-date-switcher select {border:1px #D6DED5 solid; margin:0;} .calnk a:hover span span.event-title {padding:0; text-align:center; font-weight:bold; font-size:1.25em; margin-left:0px;} .calnk a:hover span span.event-title-break {display:none;} .calnk a:hover span span.event-content-break {width:96%; text-align:center; height:1px; margin-top:5px; margin-right:2%; padding:0; background-color:#000000; margin-left:0px;} .page-upcoming-events {font-size:80%;} .page-todays-events {font-size:80%;} .calendar-table table,tbody,tr,td {margin:0 !important; padding:0 !important;} table.calendar-table {margin-bottom:5px !important;} .cat-key {width:100%; margin-top:30px; padding:5px; border:0 !important;} .cal-separate {border:0 !important; margin-top:10px;} table.cat-key {margin-top:5px !important; border:1px solid #DFE6DE !important; border-collapse:separate !important; border-spacing:4px !important; margin-left:2px !important; width:99.5% !important; margin-bottom:5px !important;} .cat-key td {border:0 !important;} /* footer */ #footer {background:url(images/footer-bg.png) left 200px repeat-x; width:100%;} #colophon {width:100%;} #footer .byline {clear:both; color:#fdacaf; font-size:.75em; letter-spacing:1px; margin:0 0 0 20px; text-transform:uppercase;} #footer .byline a {color:#fdacaf; font-weight:bold; text-decoration:none;} #footer-updates {background:url(images/footer.png) 20px 0 no-repeat; font-size:.75em; margin:0 auto; padding:0 20px; width:980px;} #footer-updates h4 {color:#493c2a; margin:0 0 10px 0;} #footer-updates ul {margin:0 0 20px 0;} #footer-updates li {margin:0 0 10px 0;} #footer-updates .content {background:url(images/footer-updates-bg.png) 0 bottom repeat-x #f1f0ee; margin:0 0 0 160px; overflow:hidden; padding:20px 20px 40px 20px; width:780px;} #footer-updates .c-01, #footer-updates .c-02 {float:left; margin:0 20px 0 0; width:300px;} #footer-updates .c-03 {float:left; width:140px;} #footer-updates .content {position:relative;} #footer-links {background:#ed1c24; color:#fff; font-size:.75em; overflow:hidden; width:100%;} #footer-links .content {margin:0 auto; overflow:hidden; padding:20px 0 20px 0; width:980px;} #footer-links p {font-size:1em; margin:0;} #footer-links a {color:#fff; text-decoration:underline;} #footer-links a:hover {text-decoration:none;} #footer-links a:active {text-decoration:none;} #footer-links .c-01 {float:left; margin:0 20px 20px 20px; width:300px;} #footer-links .c-01 p {margin:0 0 20px 0;} #footer-links .c-02 {float:left; line-height:1.5; margin:0; overflow:hidden; width:640px;} #footer-links .c-02 .c {float:left; line-height:1.3; margin:0 20px 20px 0; width:140px;} #footer-links .c-02 li {margin:0 0 5px 0;} #footer-quick-links {margin:0 0 40px 0;} /* edit */ .edit-link {clear:both; display:block; margin:0 0 0 20px;} .post-edit-link {background:#ed1c24; color:#fff !important; font-weight:bold; padding:5px 10px; text-transform:uppercase;} /* 404 */ .error404 #branding, .error404 #section-title, .error404 #section-sub {display:none;} .error404 #searchform {margin:0 0 0 20px;} .error404 #content {border-top: 10px solid #333;} /* search */ .search-results #branding, .search-results #section-title, .search-results #section-sub, .search-results .nav-previous, .search-results .nav-next, .search-results .entry-meta, .search-results .entry-utility, .search-results #primary {display:none;} .search-results h1 span {color:#8e816b;} .search-results h2 {margin-bottom:5px;} #searchform {margin:0 0 20px 0;} #searchform input[type=text] {background:#fff; color:#333; padding:6px 10px 5px 10px; width:120px;} #searchform input[type=submit] {margin:0;} /* misc */ small {font-size:.75em;} strong {font-weight:bold;} em {font-style:italic;} .alignleft {float:left; margin:0 20px 20px 0;} .alignright {float:right; margin:0 0 20px 20px;} .cl {clear:left;} .cb {clear:both;} .screen-reader-text {position:absolute; left:-9000px;} /* responsive design css rules */ /* iPad 768 by Hyperarts.com */ @media only screen and (max-width: 768px) { /* Wrapper and container classes */ #wrapper, #main, body.home #container, #content-home-gallery, #content-home-gallery ul, #content-home-updates { width: 728px; } /* Header Nav Categories */ #nav-categories { width: 470px; height: 105px; } #nav-categories-ecosystem { left: 172px !important; } #nav-categories-overview { left: 344px !important; } #nav-categories li { padding: 85px 0 0 8px; } /* Home Page */ /* Main Container Area */ body.home h1 { font-size: 2em; } /* Image Gallery */ #content-home-gallery { height: 370px; } #content-home-gallery .prev { left: 0px; } #content-home-gallery .next { left: 160px; } #content-home-gallery img { width: 728px; height: auto !important; } #content-home-gallery .caption { bottom: 20px; width: 460px; padding: 10px 20px 20px 20px; } #content-home-gallery .caption p { font-size: 1em; } #content-home-updates { margin: 0 20px 40px 0px; } #content-home-updates .c-01, #content-home-updates .c-02, #content-home-updates .c-03 { width: 344px; } #twitter-widget-0 { width: 344px !important; } #content-home-categories .c-01, #content-home-categories .c-02 { margin: 0 auto; float: none; } /* End Homepage */ /* Page */ body.page #container { max-width: 728px; width: 100%; } #section-title { top: 420px; } #section-sub { display: none !important; } .calendar-table { width: 680px; } /* For iframes // youtube and other videos */ .entry-content iframe { width: 680px !important; } #content .module-horizontal-wide { margin: 0 0 30px 60px; width: 300px; height: auto; min-height: 340px; } #content .module-horizontal-wide .module-text-01 { width: 200px; } .landing h2 { margin: 0 auto; } .landing .landing-section { height: 380px; margin: 0 0 40px 43px; float: none; display: inline-block; vertical-align: top; } #content .module-horizontal-wide .module-text-02 { width: 300px; } #content .spacer { /* Why does this class even exist? */ height: 0 !important; } #content .module-horizontal { margin: 0 0 20px 60px; width: 300px; } /* Specific page tweaks */ body.page-id-61 .module-horizontal-wide { /*specific styles to override the general for this page for USAID Pro in Resident */ width: 80% !important; } body.page-id-61 #content .module-horizontal-wide .module-text-02 { /*specific styles to override the general for this page for USAID Pro in Resident */ width: 100% !important; } body.page-id-65 iframe { margin-left: 20px; } /* Footer */ #footer-updates .content { margin: 0px; overflow: hidden; padding: 20px 20px 40px 20px; width: 688px; background: rgba(241, 240, 238, 1.0); } /* Specific Page Tweaks */ body.page-id-59 #footer-updates { padding: 0 !important; } } /* phones */ @media only screen and (max-width: 480px) { body {} h1 {font-size:1.5em;} h2 {font-size:1.25em; margin-bottom:20px;} h3 {font-size:1.25em; line-height:1.5;} h4 {font-size:1em; line-height:1.375;} h5 {font-size:1em;} h6 {font-size:.75em;} p {font-size:1em; line-height:1.4;} hr {margin:30px 0;} blockquote {font-size:1.5em; margin:10px 5% 30px 5%; width:90%;} form {width:95%;} form select {width:100%;} form textarea {width:100%;} .link-cta {background:url(images/arrow.png) right 4px no-repeat;} #branding {height:80px; margin-bottom:5px; width:100%;} #branding img {height:auto; width:100%;} #logo-container {background:#000; height:60px; padding:0 0 1px 0; width:24%;} #logo {background:url(images/logo@2x.png) 10px 0 no-repeat; background-size:60px 60px; display:block; float:left; height:60px; width:100%;} #nav-categories {display:none;} #menu-toggle {background:url(images/menu@2x.png) 0 bottom no-repeat; background-size:60px 120px; display:block; float:right; height:60px; text-indent:-999em; width:60px;} #menu-toggle.open {background:url(images/menu@2x.png) 0 top no-repeat !important; background-size:60px 120px !important;} #menu-main {display:none;} #menu-container {background:#333; border-bottom:5px solid #000; display:none; font-size:1.375em; line-height:1.25; padding:5%; position:absolute; right:0; top:60px; width:90%; z-index:200;} #header {background:#000; overflow:hidden;} #header .menu-header {float:none; position:static;} #menu-main li {} #menu-main a, #menu-main a:hover {background:none !important;} #menu-main > li {float:left; margin:0 0 25px 0; position:static; width:50%;} #menu-main > li:nth-child(odd) {clear:left;} #menu-main > li > a, #menu-main > li > a:hover {display:inline; height:auto; margin:0; padding:0;} #menu-main li ul {display:inline !important; position:static !important; text-transform:none; width:auto;} #menu-main .sub-menu {letter-spacing:0; margin:10px 0 0 0;} #menu-main .sub-menu li {margin:0; padding:8px 20px 0 0;} #menu-main .sub-menu li a {display:inline !important; height:auto; padding:0; width:auto;} #menu-main .sub-menu li a:hover {background:none !important; color:#fff !important;} #menu-main .sub-menu li li {font-weight:300 !important; margin:0 0 0 10px;} #menu-main a.open {display:inline !important; height:auto;} #menu-main .sub-menu .sub-menu {display:none;} #menu-main .sub-menu a.open {background:none !important; color:#fff !important;} #menu-name {color:#fff; display:block; font-family:'Oswald',sans-serif; font-size:1em; font-weight:700; left:26%; top:17px; position:absolute; text-transform:uppercase;} #section-title, #section-sub {display:none;} #wrapper {margin-bottom:0; padding:0; width:100%;} #main {margin-bottom:40px; width:100%;} #container {width:100%;} #content {padding:20px 0;} #content ul {font-size:1em; margin:0 20px 20px 20px;} #content ul li {background:url(images/arrow.png) 0 6px no-repeat;} #content .module {clear:both; float:none; margin:0 0 30px 20px; width:90%;} #content .module h4 {clear:none;} #content .module p {font-size:.875em;} #content .module .module-image {float:left; margin:0 20px 0 0; width:40%;} #content .module .module-image-wide {width:80%;} #content .module .module-image img {height:auto; width:100%;} #content .module .module-text {float:left; width:50%;} #content .module-horizontal {width:100%;} #content .module-horizontal .module-image {width:20%;} #content .module-horizontal .module-image img {height:auto; width:100%;} #content .module-horizontal .module-text {width:60%;} #content .module-horizontal ul, #content .module-horizontal p {font-size:.875em;} #content .module-horizontal-wide {width:90%;} #content .module-horizontal-wide .module-image {width:30%;} #content .module-horizontal-wide .module-image img{height:auto; width:100%;} #content .module-horizontal-wide .module-text-01{width:60%;} #content .module-horizontal-wide .module-text-02{width:100%;} #content .module-horizontal-wide ul, #content .module-horizontal-wide p {font-size:.875em;} #content .size-medium, #content .size-full, #content .image-full {height:auto; width:100%;} body.home #container {width:100%;} #content-home-gallery {height:auto; margin-bottom:40px; width:100%;} #content-home-gallery ul {height:300px; width:100%;} #content-home-gallery ul li {height:300px;} #content-home-gallery ul img {height:auto; width:100%;} #content-home-gallery .caption {bottom:5%; padding:10px 5% 15px 5%; right:0; width:90%;} #content-home-gallery .caption h1 {font-size:1.5em;} #content-home-gallery .caption p {font-size:1em;} #content-home-gallery .prev, #content-home-gallery .next {background-size:96px 64px; height:64px; width:48px;} #content-home-gallery .prev {left:7%; top:20%;} #content-home-gallery .next {left:auto; right:7%; top:20%;} #content-home-updates {font-size:1em; margin:0 5% 40px 5%; overflow:hidden; width:90%;} #content-home-updates .c-01 {margin:0; width:100%;} #content-home-updates .c-02 {margin-bottom:40px; width:100%;} #content-home-updates .c-03 {width:100%;} #content-home-updates .column {width:100%;} #content-home-updates #twitter-widget-0 {height:350px !important;} #home-quick-links {width:100%;} #content-home-categories .c-01 {display:none;} #content-home-categories .c-02 {width:100%;} #content-home-categories-projects, #content-home-categories-ecosystem, #content-home-categories-overview {position:relative; width:100%;} #content-home-categories-projects h3, #content-home-categories-ecosystem h3, #content-home-categories-overview h3 {font-size:1.75em; height:auto; padding:50px 0 0 0; width:56%;} #content-home-categories-projects div, #content-home-categories-ecosystem div, #content-home-categories-overview div {border-left:1px solid #222; font-size:.875em; height:100%; padding:2%; position:absolute; right:0; top:0; width:40%;} #content .module-news-wrapper {margin:0 0 0 5%; width:90%;} #content .module-news-wrapper h3 {margin:0 0 0 5%;} #content .module-news-wrapper .module {margin:0; width:100%;} #content .module-news-wrapper .module-news-first h4{font-size:1.5em;} #content .module-news-wrapper .module-text {width:100%;} #content .module-news-wrapper .module-image {margin:0 0 10px 0; width:100%;} #content .spacer {display:none !important;} #content .collapseomatic {background-position:0 6px; font-size:1em;} #content .colomat-close {background-position:0 -94px;} #main .landing {width:100% !important;} .landing h2 {margin-top:0; padding-top:15px; width:auto;} .landing-section {clear:both; margin-left:0; width:100%;} .landing-section .image {float:left; margin:0 0 10px 0; width:50%;} .landing-section h3 {clear:none; float:left; padding:5px 0 0 20px; width:40%;} .landing-section p {clear:both; line-height:1.3; padding:0 20px;} .calendar-table {width:90%;} #primary {display:none; width:100%;} /* #primary h3 {padding:5px 0 0 5%;} #primary .textwidget {margin:0 5%;} */ #footer-updates {font-size:.875em; margin:0; padding:0; width:100%;} #footer-updates .c-01, #footer-updates .c-02, #footer-updates .c-03 {margin:0; width:100%;} #footer-updates .c-02 {margin:0 0 20px 0;} #footer-updates .content {margin:0; width:auto;} #footer-links {width:100%;} #footer-links .content {width:100%;} #footer-links .c-01 {clear:both; margin:0 0 30px 5%; width:auto;} #footer-links .c-01 p {margin:0;} #footer-links .c-02 {clear:both; margin:0 5% 30px 5%; width:90%;} #photo-credit-text {background:#333; color:#fff; font-size:.75em; left:20px; position:absolute; top:55px;} #searchform input[type=text] {width:100%;} /* Hyperarts Additions */ .landing .landing-section { height: auto; margin: 0 0 40px 20px; } #content .module-horizontal { margin: 0 0 20px 20px; } .entry-content iframe { width: 440px !important; margin: 10px auto; } /* Specific Page Tweaks */ body.page-id-61 .module-horizontal-wide { /*specific styles to override the general for this page for USAID Pro in Resident */ width: 80% !important; margin: 0 0 30px 20px !important; } body.page-id-61 #content .module-horizontal-wide .module-text-02 { /*specific styles to override the general for this page for USAID Pro in Resident */ width: 100% !important; } } @media screen and (min-width:480px) { } /* only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi), */