/* HTML5 ✰ Boilerplate */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,abbr,address,cite,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%; font: inherit; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
html { overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
::-moz-selection { background: #ffa200; color: #fff; text-shadow: none; }
::selection { background: #ffa200; color: #fff; text-shadow: none; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid { }
input:invalid, textarea:invalid { background-color: #f0dddd; }
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
pre {
background: #eee;
padding: 20px;
}
/* End Boilerplate */
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
img { max-width: 100%; }
body, button, input, select, textarea {
color: #444;
}
h1,h2,h3,h4,h5,h6 {
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
}
blockquote {
border-left: solid 2px #e0e0e0;
border-left: solid 2px rgba(190,190,190,.2);
padding: 1em 2em;
margin: 1em 0;
background: rgba(190,190,190,.1);
}
a,a:active,a:visited {
color: #25353a;
text-decoration: none;
font-weight: 600;
}
a:hover {
color: #0c618b;
}
.block:after,.clearfix:after,.group:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.block {
margin: 0 auto;
width: 92%;
}
.container { width: 100%; }
html { background: url(../images/dk-bg-title.jpg) 50% 0; }
body {
font: 100%/1.5 "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
font-weight: 400;
color: #444;
}
input, textarea, button {
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
color: #444;
}
/* Type -------------------------------------------------------------------------------------------------------------------------------- */
h3 {
padding-top: .75em;
font-size: 1.125em;
color: #0c618b;
}
h4 {
color: #0091dc;
font-size: .875em;
}
h5 {
font-size: 1.125em;
}
h6 { font-size: 1.125em; }
p { padding: 0 0 1em 0; }
/* Container/Block ------------------------------------------------------------------------------------------------------------------------*/
#container {
background: #eee url(../images/white-texture.png) center bottom;
}
/* Header ------------------------------------------------------------------------------------------------------------------------*/
#header-container {
background: #fff;
border-bottom: solid 1px #eee;
}
/* Network header -------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------- */
#ums-network-header-wrapper {
width: 100%;
padding: .5em 0;
background: url(../images/dk-bg-title.jpg) 50% 0;
}
#ums-network-header h1 {
float: left;
height: 48px;
width: 170px;
}
#ums-network-header h1 a {
display: block;
height: 48px;
text-indent: -999em;
background: url(../images/ums-logo.svg) 0% 50% no-repeat;
-webkit-background-size: 100% auto;
-moz-background-size: 100% auto;
background-size: 100% auto;
}
.no-svg #ums-network-header h1 a { background: url(../images/ums-logo.png) no-repeat; }
#ums-network-header nav {
float: left;
width: 40%;
padding: 0 0 0 5%;
}
#ums-network-header nav li {
float: left;
padding: .5em 0 0 0;
width: 33%;
}
#ums-network-header nav li a {
display: block;
padding: .75em;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-weight: 600;
color: #fff;
font-size: .75em;
text-indent: -999em;
-webkit-border-radius: 1.25em;
-moz-border-radius: 1.25em;
border-radius: 1.25em;
background: url(../images/header-social.svg) no-repeat;
opacity: .5;
}
#ums-network-header nav li.twitter a { background-position: 0 7px; }
#ums-network-header nav li.facebook a { background-position: 0 -51px; }
#ums-network-header nav li.rss a { background-position: 0 -114px; }
#ums-network-header nav li a:hover { opacity: 1; }
/* Main Nav ------------------------------------------------------------------------------------------------------------------------*/
#navigation {
width: 100%;
overflow: auto;
}
#navigation li a {
display: block;
float: left;
padding: 1.5em 1.125em;
font-size: .75em;
text-transform: uppercase;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-weight: 600;
color: #485155;
text-align: center;
border-left: solid 1px #e0e0e0;
border-left: solid 1px rgba(190,190,190,.2);
background: rgba(190,190,190,0);
}
#navigation li a {
padding: 1.5em 1em;
border-bottom: solid 1px #e0e0e0;
border-bottom: solid 1px rgba(190,190,190,.2);
font-size: .6em;
text-transform: none;
}
#navigation li a:hover,
#navigation li.active a {
background: #e0e0e0;
background: rgba(190,190,190,.1);
}
#navigation li.active a { color: #485155; }
#navigation li:last-child a {
border-right: solid 1px #e0e0e0;
border-right: solid 1px rgba(190,190,190,.2);
}
/* Search Form/Social ------------------------------------------------------------------------------------------------------------------------*/
#page-header form {
padding: 1.125em 0;
width: 100%;
}
#page-header form button {
border: none;
float: left;
width: 26%;
display: block;
padding: .5em;
margin: 0 0 0 4%;
background: #a6e400;
color: #fff;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: 1em;
border-right: solid 1px #a6e400;
border-bottom: solid 1px #a6e400;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
#page-header form input {
float: left;
display: block;
width: 70%;
padding: .5em;
font-weight: 400;
font-size: 1em;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
line-height: 1;
border: solid 1px #eee;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: inset 1px 1px 2px rgba(0,0,0,.2);
box-shadow: inset 1px 1px 2px rgba(0,0,0,.2);
color: #ccc;
}
#page-header form input:focus {
color: #444;
-webkit-box-shadow: inset 1px 1px 2px -1px rgba(0,0,0,.4);
-moz-box-shadow: inset 1px 1px 2px -1px rgba(0,0,0,.4);
box-shadow: inset 1px 1px 2px -1px rgba(0,0,0,.4);
}
/* Teaser ------------------------------------------------------------------------------------------------------------------------*/
#site-teaser {
background: #0aa8ea;
padding: 1em 2em;
color: #fff;
margin: 0 0 1em;
position: relative;
}
#bizcraft-teaser {
background: #0aa8ea;
padding: 1em 0 0 1em;
color: #fff;
margin: 0 0 1em;
position: relative;
}
#site-teaser a#close-button {
position: absolute;
right: .5em;
top: .5em;
width: 1.5em;
height: 1.5em;
display: block;
opacity: .7;
background: rgba(0,0,0,.1);
font-weight: 400;
color: #fff;
text-align: center;
}
#site-teaser a#close-button: hover { opacity: 1; }
#site-showbox {
background: #666;
padding: 1em 2em;
color: #fff;
margin: 0 0 1em;
position: relative;
}
/* Main ------------------------------------------------------------------------------------------------------------------------*/
#main {
padding-top: 1em;
padding-bottom: 1.5em;
}
/* Content Header ------------------------------------------------------------------------------------------------------ */
#home-gallery .section-header {
padding: 0 0 .625em 0;
display: none;
}
#home-gallery .section-header h2 {
font-size: .875em;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
color: #0091dc;
line-height: 1em;
}
.sub header:first-of-type { padding: 0 0 .75em; }
.sub .section-header { padding: 0 0 1.5em 0; }
.section-header h2 {
font-size: 1.25em;
font-weight: 600;
text-transform: uppercase;
}
.single .section-header h2 {
padding: .6em 0;
text-align: center;
font-size: .875em;
line-height: 1.8em;
background: rgba(0,0,0,.05);
}
.section-header h2 span {
font-size: .5em;
font-weight: 400;
text-transform: none;
letter-spacing: normal;
vertical-align: middle;
color: #bbb;
}
/* Breadcrumb ------------------------------------------------------------------------------------------------------------------------*/
.section-header ul.breadcrumb {
margin: 0;
padding: .5em 0;
list-style: none;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
}
.section-header ul.breadcrumb li { display: inline; }
.section-header ul.breadcrumb li:after {
content: "\203A";
padding: 0 .75em;
font-size: 1em;
vertical-align: top;
padding: 0 .5em 5px .5em;
}
.section-header ul.breadcrumb li:last-child a { font-weight: 400; }
.section-header ul.breadcrumb li:last-child:after {
content: "";
padding: 0;
}
.section-header ul.breadcrumb li:first-child a {
opacity: 1;
font-weight: 600;
}
/* sectionnav ------------------------------------------------------------------------------------------------------------------------*/
nav[role="sectionnav"] ul {
}
nav[role="sectionnav"] li {
float: left;
margin: 0 8px 0 0;
font-size: 14px;
}
nav[role="sectionnav"] li a {
float: left;
padding: 8px 12px;
text-decoration: none;
color: #fff;
background: #bbb;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
nav[role="sectionnav"] li a:hover,
nav[role="sectionnav"] li a:focus {
background: #999;
}
nav[role="sectionnav"] li a:active {
background: #888;
}
nav[role="sectionnav"] li.active a {
color: #fff;
background: #666;
}
/* Paging ------------------------------------------------------------------------------------------------------------------------*/
.single ul.paging,
.single ul.paging li {
list-style: none;
margin: 0;
padding: 0;
}
.single ul.paging a {
top: 0;
position: absolute;
margin: 0 0 0 -1px;
padding: .6em 1em;
font-size: .875em;
line-height: 1.25em;
font-weight: 600;
background: rgba(0,0,0,.05);
-webkit-transition: background .2s linear;
-moz-transition: background .2s linear;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.single ul.paging a:hover {
background: rgba(0,0,0,.1);
}
.single ul.paging li.active a {
background: rgba(12,97,139,.5);
color: #fff;
}
.single ul.paging li:last-of-type a { right: 0; }
.single ul.paging li:last-of-type a,
.single ul.paging li:first-of-type a {
padding: .4em .6em;
font-weight: 600;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
font-size: 1.25em;
}
/* Gallery Feed ------------------------------------------------------------------------------------------------------------------------*/
#home-gallery.gallery article.featured {
width: 100%;
position: relative;
}
.featured-video h4 {
padding: .5em 1em;
background: #0c618b;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
text-transform: uppercase;
font-size: .75em;
color: #fff;
-webkit-border-radius: 4px 4px 0 0;
-moz-border-radius: 4px 4px 0 0;
border-radius: 4px 4px 0 0;
}
.gallery article {
margin: 0 0 1em 0;
}
.gallery article img {
border: solid 1px rgba(0,0,0,.1);
border-bottom: none;
}
.gallery article footer {
padding: 1em 1.5em 1.5em 1.5em;
position: relative;
background: #fff;
border: solid 1px rgba(0,0,0,.1);
-webkit-border-radius: 0 0 4px 4px;
-moz-border-radius: 0 0 4px 4px;
border-radius: 0 0 4px 4px;
}
.gallery article footer h3 { padding: 0; }
.gallery article footer h3 a {
display: block;
font-size: 1em;
color: #0c618b;
}
.gallery article footer ul,
.gallery article footer li {
padding: 0;
margin: 0;
list-style: none;
}
.gallery article footer li { display: inline; }
.gallery article footer li a {
margin: 0 .5em 0 0;
font-size: .75em;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
}
.gallery article footer li.visit a {
padding-left: 1em;
margin-left: .5em;
border-left: dotted 1px #ddd;
}
.gallery article p { padding: 0; }
.gallery article.screencast-review {
position: relative;
}
.gallery article.screencast-review .screencast-head {
position: absolute;
display: block;
left: -2px;
top: -2px;
padding: .5em 1em;
background: #0c618b;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
text-transform: uppercase;
font-size: .675em;
color: #fff;
}
/* Gallery Sidebar ------------------- */
.sub.posts-gallery aside[role=complementary] .aside-element {
border: none;
}
.sub.posts-gallery aside.column filter {
border: none;
}
.sub.posts-gallery aside.column ul {
-moz-column-count: 2;
-moz-column-gap: 1em;
-webkit-column-count: 2;
-webkit-column-gap : 1em;
column-count: 2;
column-gap : 1em;
}
.sub.posts-gallery aside.column .colors-filter ul {
-moz-column-count: 6;
-moz-column-gap: 0;
-webkit-column-count: 6;
-webkit-column-gap: 0;
column-count: 6;
column-gap: 0;
}
.sub.posts-gallery aside.column .filter h4 {
padding: 0 0 .5em .5em;
margin: 0 0 .25em 0;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
color: #9F111B;
border-bottom: solid 1px #eee;
}
.sub.posts-gallery aside.column .filter a {
display: block;
padding: .3em .5em;
font-style: italic;
border-bottom: dotted 1px #ddd;
border-top: none;
}
.sub.posts-gallery aside.column .filter a:hover { padding-left: .7em; }
.colors-filter li {
border: none;
}
.sub.posts-gallery aside.column .filter.colors-filter ul {
padding: .75em 0 0 0;
}
.sub.posts-gallery aside.column .filter.colors-filter a {
color: #fff;
border: none;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: .75em;
text-indent: -999em;
outline: none;
-webkit-transition:-webkit-transform .1s linear;
-moz-transition:-moz-transform .1s linear;
transition:-moz-transform .1s linear;
}
.sub.posts-gallery aside.column .filter.colors-filter a:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
transform: scale(1.1);
}
/* Post Detail ------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------*/
.post.detail header {
overflow: auto;
position: relative;
}
.post.detail header h2 {
font-size: 1.5em;
line-height: 1em;
padding: 0 0 .5em 0;
}
.post.detail header time {
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: .875em;
color: #0091dc;
float: left;
padding: .5em 0;
}
.post.detail header ul,
.post.detail header ul li {
list-style: none;
margin: 0;
padding: 0;
}
.post.detail header ul {
overflow: auto;
float: left;
}
.post.detail header ul li a {
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: .875em;
float: left;
padding: .5em 0 .5em 1em;
}
.post.detail header ul li {
float: left;
padding: 0;
}
.post.detail header ul li.visit a {
/*position: absolute;
right: 4em;
bottom: 2.5em;
*/
margin: 0 0 0 .5em;
padding: .5em 1em;
color: #fff;
font-size: .75em;
background: #0091dc;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.post.detail header ul li.visit a:hover {
background: #25353a;
}
.post.detail header ul li.visit a:after {
content: "\25B8";
margin: 0 0 0 .25em;
}
/* Sidebar ------------------------------------------------------------------------------------------------------------------------
-----------------------------------------------------------------------------------------------------------------------------------*/
aside[role=complementary] .aside-element {
padding: 0 0 0 0;
margin: 0 0 1em 0;
border-bottom: solid 1px #e0e0e0;
border-bottom: solid 1px rgba(190,190,190,.3);
}
aside[role=complementary] .aside-element h3 { padding: 0 0 .25em 0; }
aside[role=complementary] h3 a {
display: block;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
font-size: .9375em;
text-transform: uppercase;
color: #006ba2;
font-weight: 600;
color: #9f111b;
}
aside[role=complementary] article,
aside[role=complementary] .ad,
aside[role=complementary] .social {
padding: 0 0 0 0;
margin: 0 0 1.5em 0;
border-bottom:solid 1px #e0e0e0;
border-bottom:solid 1px rgba(190,190,190,.3);
}
aside[role=complementary] .ad,
aside[role=complementary] article {
padding-bottom: 1.5em;
}
aside[role="complementary"] article:last-of-type {
padding-bottom: 0;
border-bottom: none;
}
aside[role=complementary] article h4 {
font-size: 1.25em;
padding: 0;
margin: 0;
}
aside[role=complementary] article h4 a {
display: block;
font-weight: 600;
color: #292c37;
}
aside[role=complementary] h4 a:hover { color: #444; }
aside[role=complementary] article p {
/*font-size: .8125em;*/
font-weight: 400;
padding: 0;
}
aside[role=complementary] article p a {
color:#252a2b;
font-weight: 400;
}
aside[role=complementary] article time {
color:#aeb2b4;
font-size:.625em;
font-weight:600;
}
aside[role=complementary] article img {
max-width: 25%;
float: left;
padding: 0;
margin: .35em .75em .25em 0;
border: solid 1px #eee;
}
aside[role=complementary] article img.full {
max-width:100%;
float:none;
padding:0;
}
aside[role=complementary] article img.right {
max-width:25%;
float:right;
padding:0 0 0 5%;
}
aside[role=complementary] footer.aside-more {
border-bottom:solid 2px #e0e0e0;
border-bottom:solid 2px rgba(190,190,190,.3);
padding:0 0 .5em;
margin:0 0 1em;
text-align:right;
}
aside[role=complementary] .comments-link {
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: .675em;
color: #bbb;
text-transform: uppercase;
display: inline-block;
padding: 0 0 .5em 0;
}
aside[role=complementary] .comments-link:hover { color: #444; }
.aside-element.jobs {
margin: .5em 0;
border: none;
background: rgba(0,0,0,.05);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.aside-element.jobs p { padding: 0; }
.aside-element.jobs .job-info {
float: left;
width: 69%;
padding: 1em 3% 1em 1.5em;
border-right: solid 1px #fff;
}
.aside-element.jobs .job-info h4 {
font-size: 1.125em;
}
.aside-element.jobs .job-info p {
font-weight: 400;
}
.aside-element.jobs header {
float: right;
width: 30%;
padding: 1em 1.5em 1em 3%;
}
.aside-element.jobs header h3 {
padding: 0;
line-height: 1.1;
}
.aside-element.jobs header h3 a {
font-size: 1.75em;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
color: #787a81;
}
.aside-element.jobs header p { font-size: .75em; }
/* Subnav ------------------------------------------------------------------------------------------------------------------------*/
aside[role=complementary] nav h4 {
font-size: .9375em;
font-weight: 600;
text-transform: uppercase;
padding: 0 0 .25em 0;
}
aside[role=complementary] nav a {
font-size: .875em;
padding: .25em 0;
border-top: dotted 1px rgba(190,190,190,.3);
font-weight: 400;
display: block;
}
aside[role=complementary] nav ul li.tags-nav a {
float: left;
border: none;
padding: .75em 1em;
margin: 0 .25em .25em 0;
background: rgba(0,0,0,.05);
font-style: italic;
-webkit-transition:background .2s linear;
-moz-transition:background .2s linear;
transition:background .2s linear;
}
aside[role=complementary] nav ul li.tags-nav a:hover { background: rgba(0,0,0,.1); }
aside[role=complementary] nav ul li.tags-nav li:last-of-type a:after { content: ""; }
aside[role=complementary] nav ul { margin: 0 0 1em 0; }
aside[role=complementary] nav ul li.colors-nav a {
float: left;
width: 16.666666666666667%;
height: 2em;
text-indent: -999em;
display: block;
background: #ccc;
-webkit-transition:-webkit-transform .1s linear;
-moz-transition:-moz-transform .1s linear;
transition:-moz-transform .1s linear;
}
aside[role=complementary] nav ul li.colors-nav a:hover {
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
transform: scale(1.1);
}
/* Gallery Post ------------------------------------------------------------------------------------------------------------------------*/
.post .post-image img {
max-width: 100%;
}
.post-gallery #post-date-visit span {
font-size: .75em;
font-weight: 600;
display: block;
color: #bbb;
}
.post-gallery span.date time {
color: #252a2b;
font-style: normal;
font-weight: 500;
text-transform: none;
display: block;
font-size: 1.5em;
padding: 0 0 .5em 0;
}
#post-review .post-image {
margin: 0;
position: relative;
display: block;
}
.single .post-text {
padding: 0.888888888888889em;
background: #fff;
font-size: 1.125em;
}
.single .post-text a {
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
color: #0c618b;
}
.single .post-text a:hover { color: #25353a; }
.single .post-text.screencast-review p:first-of-type img { display: none; }
#post-review .post-image img { display: block; }
/*
#post-author {
padding: 0 0 1em 0;
border-bottom: solid 1px rgba(190,190,190,.2);
}
#post-author .author-avatar {
width: 50px;
float: left;
padding: 0 1em 0 0;
}
#post-author img {
max-width: 100%;
}
#post-author span {
display: block;
}
#post-author span.title {
padding: .25em 0 0 0;
font-size: .75em;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
color: #e4bb41;
text-transform: uppercase;
}
#post-author span.name {
font-weight: 600;
}
#post-author span.author-twitter a {
display: inline-block;
line-height: 1.7em;
vertical-align: middle;
padding: 0 .6em;
color: #fff;
background: #158a8a;
font-size: .875em;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
#post-author a[title] {
font-size: 1.125em;
}
*/
.post-gallery .post-text p { padding: 0 0 1em 0; }
.post-gallery .post-text img { max-width: 100%; }
.current-post-nav {
margin: 1px 0 1em 0;
background: rgba(0,0,0,.1);
}
.current-post-nav a {
display: block;
float: left;
width: 33.33%;
border-left: solid 1px #fff;
padding: .75em;
font-size: .75em;
text-transform: uppercase;
border-left: solid 1px #fff;
text-align: center;
}
.current-post-nav li:first-of-type a { border: none; }
#aside-comments-favorites { padding-bottom: 1em; }
#aside-comments-favorites p a {
text-align: center;
float: left;
margin: 0 0 0 -1px;
background: rgba(0,0,0,.05);
font-size: 1.5em;
letter-spacing: -.05em;
padding: .5em 1em;
font-weight: 500;
line-height: 1.2;
-webkit-transition:background .2s linear;
-moz-transition:background .2s linear;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#aside-comments-favorites p a { width: 50%; }
#aside-comments-favorites p a span {
font-size: .5em;
display: block;
letter-spacing: normal;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
font-weight: 600;
}
#aside-comments-favorites p a:before {
background: url(../images/sprites.png) 0px -327px;
width: 25px;
height: 23px;
content: "";
display: inline-block;
opacity: .3;
padding: 0 2px 4px 0;
line-height: 1.1;
margin: 2px 0 0 0;
vertical-align: text-top;
}
#aside-comments-favorites p.aside-favorites a:before {
background: url(../images/sprites.png) -1px -175px;
padding-right: 0;
}
#aside-comments-favorites p.aside-comments a:hover { background: rgba(0,0,0,.1); }
#aside-comments-favorites p.aside-favorites a:hover {
background: rgba(252,43,0,.9);
color: #fff;
}
#aside-comments-favorites p.aside-comments a:hover:before { opacity: .7; }
#aside-comments-favorites p.aside-favorites a:hover:before {
background-position: -1px -253px;
opacity: 1;
}
/* JObs Page ------------------------------------------------------------------------------------------------------------------------*/
.job-section {
padding: 1em;
background: rgba(0,0,0,.05);
margin: 0 0 1em 0;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.job-section time {
font-weight: 600;
font-style: italic;
}
.job-section a {
font-size: .9375em;
}
/* Podcasts Feed ------------------------------------------------------------------------------------------------------------------------*/
/*
.podcasts article {
padding: 0 0 1.5em 0;
margin: 0 0 1.5em 0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border-bottom: solid 1px #e0e0e0;
border-bottom: solid 1px rgba(190,190,190,.3);
}
.podcasts article:last-of-type {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 1em;
}
.podcasts article div,
.podcasts article a.podcast-screenshot {
display: block;
float: left;
}
.podcasts article a.podcast-screenshot {
width: 65%;
}
.podcasts article div {
width: 35%;
padding: 0 0 0 1.5em;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box
}
.podcasts article img {
max-width: 100%;
}
*/
#aside-podcasts ul,
#aside-podcasts li {
margin: 0;
list-style: none;
}
#aside-podcasts ul { padding: 1em 0 0 0; }
#aside-podcasts li a {
padding: 2.5em 1.5em;
background: rgba(0,0,0,.1);
font-size: 1.2em;
display: block;
margin: 0 0 1em 0;
}
/* Carbon Ads ------------------------------------------------------------------------------------------------------------------------*/
.ad-horizontal .carbonad {
width:100% !important;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif !important;
}
.ad .carbonad {
border: none !important;
color: #fff !important;
}
.ad .carbonad-text,
.ad .carbonad-tag,
.ad .carbonad-text a,
.ad .carbonad-tag a {
color: #fff !important;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif !important;
}
.ad-horizontal .carbonad-text {
font-size: .75em !important;
}
.ad-horizontal .carbonad a {
font-weight: 600 !important;
}
.ad-light .carbonad,
.ad-light .carbonad-image {
padding: 0 !important;
margin: 0 !important;
background: none !important;
}
.ad-light .carbonad-image,
.ad-light .carbonad-text,
.ad-light .carbonad-tag {
max-width: 50%;
font-size: 1em !important;
margin: 0 !important;
text-align: left;
padding: 0 0 0 1em !important;
}
.ad-light .carbonad-image {
padding: 0 !important;
}
.ad-light .carbonad-text,
.ad-light .carbonad-tag,
.ad-light .carbonad-text a,
.ad-light .carbonad-tag a {
color: #444 !important;
}
/* Form Styles ------------------------------------------------------------------------------------------------------------------------*/
.standard-form label {
display: block;
font-size: .75em;
font-weight: 600;
text-transform: uppercase;
padding: 1.5em 0 .125em 0;
}
.standard-form input[type="text"],
.standard-form textarea {
border: solid 1px #eee;
font-size: 1.25em;
padding: .5em;
display: block;
width: 100%;
-moz-box-shadow: inset 1px 1px 2px rgba(0,0,0,.3);
-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,.3);
box-shadow: inset 1px 1px 2px rgba(0,0,0,.3);
}
.standard-form textarea {
height: 250px;
font-size: 1em;
padding: .625em;
line-height: 1.7em;
}
.standard-form button {
max-width: 100%;
display: block;
text-align: center;
color: #fff;
border: none;
background: blue;
padding: .75em 2em;
background: #25353a;
font-weight: 600;
margin: .75em 0;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.standard-form button:hover { opacity: .9; }
/* Footer ------------------------------------------------------------------------------------------------------------------------*/
h3.comments-header {
padding: 1.5em 0;
font-size: 1.5em;
}
.comment-avatar-box {
float: left;
}
.comment-avatar-box img {
vertical-align: bottom;
display: inline-block;
padding: .5em .5em 0 0;
}
.commentlist,
.commentlist li {
margin: 0;
padding: 0;
list-style: none;
}
.commentlist li {
padding: 1.5em 1.25em;
}
.commentlist li:nth-child(2n+1) {
background: rgba(190,190,190,.1);
}
.comment-author a,
.comment-author time {
display: block;
}
/* Footer Teasers ------------------------------------------------------------------------------------------------------------------------*/
#ums-teaser-wrapper {
padding: 1em 0;
background: url(../images/footer-teaser-bg.jpg) 50% 0%;
}
/* Footer ------------------------------------------------------------------------------------------------------------------------*/
footer[role=contentinfo] {
color:#fff;
padding:2em 0;
}
footer[role=contentinfo] a {
color:#7fc7e6;
}
footer[role=contentinfo] a:hover {
opacity:.9;
}
footer[role=contentinfo] p {
font-size:.875em;
}
.footer-meta nav.social {
padding:1em 0;
margin:1em 0;
border-top:dotted 1px #394244;
border-bottom:dotted 1px #394244;
}
.footer-meta nav.social a {
float: left;
display: block;
width: 48px;
height: 48px;
margin:0 4px 8px 0;
text-align:center;
background: url(../images/footer-icons.svg) 50% 0% no-repeat;
text-indent: -999em;
opacity: 1;
}
.footer-meta nav.social a:hover {
opacity: .9;
}
.footer-meta nav.social .twitter a { background-position: 50% -121px; }
.footer-meta nav.social .facebook a { background-position: 50% -238px; }
.footer-meta nav.social .vimeo a { background-position: 50% -359px; }
.footer-meta nav.social .youtube a { background-position: 50% -477px; }
.footer-meta nav.social .tumblr a { background-position: 50% -596px; }
.footer-meta nav.social .flickr a { background-position: 50% -714px; }
.footer-meta nav.social .dribbble a { background-position: 50% -836px; }
.footer-meta nav.social .delicious a { background-position: 50% -957px; }
/* Temporary */
/* MailChimp Styles */
div.mce_inline_error {
color:#fff!important;
background:#d53200;
padding:.5em;
}
#mc_embed_signup form {
padding:0 0 .5em;
}
#mc_embed_signup label {
font-weight:600;
display:block;
padding:0 0 .5em;
}
#mc_embed_signup input {
padding:.5em;
display:block;
border:none;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
float:left;
font-size:.75em;
color:#ccc;
width:66%;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
box-sizing:border-box;
margin:0 2% 0 0;
height:2.5em;
}
#mc_embed_signup input:focus {
color:#444;
}
#mc_embed_signup button {
background:#7fc7e6;
padding:.5em .75em;
float:left;
display:block;
border:none;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
color:#fff;
font-family:"skolar-1", "skolar-2" , Georgia, Times, serif;
font-size:.75em;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
box-sizing:border-box;
height:2.5em;
}
.footer-meet nav {
padding:1em 0 0;
}
.footer-meet li a {
width:16%;
float:left;
display:block;
padding:0 3% 3% 0;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
position:relative;
}
/*
.footer-meet li a:hover:after {
content:attr(title);
display:block;
position:absolute;
width: 100%;
left:50%;
margin-left:-50%;
background: red;
top:-1em;
padding:.5em;
font-size:.625em;
}
*/
.footer-meet li a img {
max-width:100%;
}
.footer-newsletter {
padding:1em 0 0;
margin:1em 0 0;
border-top:dotted 1px #394244;
}
.footer-events article {
padding:.5em 0;
border-top:dotted 1px #394244;
}
.footer-events .events {
border-bottom:dotted 1px #394244;
}
.footer-events article time {
font-size:.75em;
}
.footer-events article .location { font-size:.75em; }
.footer-events header { padding: 0 0 1em; }
.footer-events footer { padding: 1em 0 0; }
.footer-events footer a:after {
content:"\00BB";
margin:0 0 0 .25em;
}
/* Articles - Text Posts ------------------------------------------------------------------------------------ */
.articles article {
padding: .75em 0 0 0;
margin: 0 0 .75em 0;
border-top: solid 1px #e0e0e0;
border-top: solid 1px rgba(190,190,190,.3);
}
.articles article img {
float: left;
margin: 0 1em .5em 0;
border: solid 1px #eee;
max-width: 25%;
}
.articles article h3 {
font-size: 1.5em;
padding: 0;
}
.articles article .post-meta {
padding: .25em 0 .889em 0;
font-weight: 600;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: .875em;
}
.articles article time {
margin: 0 .5em 0 0;
color: #0091dc;
}
/* Author ------------------------------------------------------------------------------------ */
.author {
margin: .75em 0 0 0;
padding: 1.5em 0;
border-top: solid 1px #e0e0e0;
border-top: solid 1px rgba(190,190,190,.2);
clear: both;
}
.author .author-social {
float: left;
width: 20%;
padding: 0 1em 0 0;
}
.author .author-info {
float: left;
width: 80%;
}
.author h4 { text-transform: uppercase; }
.author h4,
.author h5 {
display: inline;
font-size: 1em;
}
.author nav { padding: .25em 0 .5em 0; }
.author nav a {
display: block;
padding: .5em 1em;
margin: .5em 2px .5em 0;
float: left;
text-align: center;
font-size: .675em;
background: rgba(190,190,190,.2);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.author p { font-size: .875em; }
/* Page ------------------------------------------------------------------------------------ */
/* Pagination ------------------------------------------------------------------------------------ */
.navigation {
text-align: center;
padding: 0 0 1.5em 0;
}
.page-navigation-button {
}
.page-navigation-button a {
display: block;
margin: 0 0 .5em 0;
width: 100%;
padding: .75em 3em;
background: #0c618b;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
color: #fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.page-navigation-button.submit-site a {
background: #9f111b;
}
/*
* Socialite
*/
.socialite-button { display: none; opacity: 0; }
.socialite-loaded .socialite-button { display: block; opacity: 1; }
.socialite-button iframe { max-width: 100%; max-height: 100%; }
/*
* Socialite Look-a-like defaults
*/
.social-buttons { display: block; list-style: none; padding: 0; margin: 0; }
.social-buttons > li { display: block; margin: 0; padding: 0 1em 1em 0; float: left; }
.social-buttons .socialite,
.social-buttons .socialised
{ display: block; position: relative; background: url('../images/social-sprite.png') 0 0 no-repeat; }
/* visually hidden from HTML5 Boilerplate */
.social-buttons .socialite span { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
/* fallback for default and non-loaded instances */
.social-buttons .twitter { width: 55px; height: 65px; background-position: 0 0; }
.social-buttons .googleplus { width: 50px; height: 65px; background-position: -75px 0; }
.social-buttons .facebook { width: 50px; height: 65px; background-position: -145px 0; }
.social-buttons .linkedin { width: 60px; height: 65px; background-position: -215px 0; }
.social-buttons .stumbleupon { width: 50px; height: 65px; background-position: -295px 0; }
.social-buttons .socialite-loaded { background: none !important; }
.article-social {
border-top: solid 1px #eee;
padding: 1.5em 0 0 0;
}
/* Disqus ------------------------------------------------------------------------------------ */
#post-comments {
padding-top: 3em;
}
/* Media Queries ------------------------------------------------------------------------------------ */
/* iPhone, etc portrait ---- */
@media only screen and (min-width: 320px) {
}
/* iPhone, etc landscape ---- */
@media only screen and (min-width: 480px) {
/*-- Header ------------------------------------------------------------------------------------ */
/*#page-header .search-social ul li { display: table-cell; }
#page-header .search-social ul li a { width: 2.5em; }*/
#ums-network-header h1 {
width: 199px;
}
/*-- Main Nav ------------------------------------------------------------------------------------ */
#navigation li a {
padding: 2em 1.5em;
font-size: .75em;
}
#navigation li:last-child a {
border-right: solid 1px #e0e0e0;
border-right: solid 1px rgba(190,190,190,.2);
}
/*-- Gallery ------------------------------------------------------------------------------------ */
.gallery article {
/*width: 50%;
float: left;*/
padding: .75em 0 .75em 0;
}
#home-gallery.gallery article.featured {
padding: 0;
}
#home-gallery.gallery article.featured footer {
font-size: 1.125em;
padding-bottom: 1em;
margin-bottom: 1em;
}
.gallery article footer {
padding-bottom: 1em;
}
/* Header & Single Post Paging */
.single .section-header h2 {
text-align: left;
background: none;
float: left;
font-size: 1.2em;
line-height: 1.3em;
padding: .6em 0 0 0;
}
.single ul.paging li,
.single ul.paging a {
position: relative;
float: left;
}
.single ul.paging { float: right; }
.comment-avatar-box {
width: 11.7647058823529%;
float: left;
}
.standard-form label { padding-top: 0; }
.commentlist li {
margin: 0 0 1.5em 0;
padding: 0;
background: none;
}
.commentlist li:nth-child(2n+1) { background: none; }
.standard-form .form-element,
.commentlist li .comment-content {
width: 88.2352941176471%;
float: right;
padding: 0 0 .75em 2.5em;
border-left: solid 1px #eee;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.comment-author > a:after {
content: " on ";
font-weight: 400;
}
.comment-author a,
.comment-author time {
display: inline;
}
aside[role=complementary] nav ul li.colors-nav,
aside[role=complementary] nav ul li.tags-nav {
display: inline-block;
width: 50%;
margin: 0 0 0 -4px;
vertical-align: top;
padding: 0 3% 0 0;
}
aside[role=complementary] nav ul li.colors-nav a {
width: 33.3%;
}
#post-author {
}
.post-text {
padding: 2em;
font-size: 1em;
}
#ums-teaser li {
float: left;
width: 48%;
margin: .5em 1%;
text-align: center;
background: transparent;
border: solid 1px rgba(0,0,0,.1);
}
#news-aside {
-moz-column-count: 2;
-moz-column-gap: 2em;
-webkit-column-count: 2;
-webkit-column-gap: 2em;
column-count: 2;
column-gap: 2em;
}
#news-aside article {
-webkit-column-break-inside:avoid;
-moz-column-break-inside:avoid;
-o-column-break-inside:avoid;
-ms-column-break-inside:avoid;
column-break-inside:avoid;
}
}
@media only screen and (min-width: 600px) {
/*-- Main Nav ------------------------------------------------------------------------------------ */
#navigation li a {
font-size: .75em;
}
.navigation {
clear: both;
padding: 0;
}
.navigation .alignleft {
float: left;
}
.navigation .alignright {
float: right;
padding: 0 4% 0 0;
}
.page-navigation-button {
display: inline-block;
}
.page-navigation-button a {
display: inline-block;
margin: 0;
width: auto;
}
}
/* iPad, tablets etc portrait ---- */
@media only screen and (min-width: 768px) {
#main.home {
padding-top: 1.5em;
}
.column {
float: left;
}
/*-- Header ------------------------------------------------------------------------------------ */
#ums-network-header nav {
float: right;
width: auto;
padding: 0;
}
#ums-network-header nav a { width: 30px; }
#navigation {
overflow: inherit;
}
#page-header form {
width: 160px;
float: right;
}
#page-header form input { width: 80%; }
#page-header form button { width: 16%; }
/*-- Main Nav ------------------------------------------------------------------------------------ */
#navigation li a {
width: auto;
text-align: left;
padding: 2em;
font-size: .875em;
border-bottom: none;
}
#navigation li a:hover {
background: rgba(192,243,253,.3);
}
/*-- Main ------------------------------------------------------------------------------------ */
#home-intro {
width: 33.3333%;
float: right;
font-size: .875em;
padding: .625em 0 1em 0;
border: none;
margin: 0;
}
/*-- Home/Sub Gallery ------------------------------------------------------------------------------------ */
#main { }
.posts {
width: 66.6666666666667%;
padding: 0 3.7037037037037% 0 0;
}
.post-gallery #post-comments {
width: 66.6666666666667%;
padding: 3em 3.7037037037037% 0 0;
}
.posts {
float: left;
}
.sub .gallery {
width: 100%;
padding: 0;
}
.gallery article.featured footer {
font-size: 1.125em;
}
/*-- Sidebar ------------------------------------------------------------------------------------ */
aside[role=complementary] {
width: 33.3333%;
}
aside[role=complementary] article img {
max-width: 25%;
}
.sub.posts-gallery aside.column {
float: none;
width: auto;
padding: 1.5em 0;
}
.sub.posts-gallery aside.column ul {
-moz-column-count: 4;
-moz-column-gap: 1em;
-webkit-column-count: 4;
-webkit-column-gap : 1em;
column-count: 4;
column-gap : 1em;
}
/*-- Gallery Post -----*/
.single .sub aside[role=complementary] {
width: 33.3333%;
/*padding: 0 .5em 0 3%;*/
}
.single .post.detail {
width: 100%;
background: #fff;
/*padding: 0 .5em;*/
}
.post.detail header h2 {
font-size: 1.875em;
line-height: 1em;
padding: 0;
}
.post.detail header ul li.visit a {
position: absolute;
right: 4em;
bottom: 2.5em;
margin: 0;
}
aside[role=complementary] nav ul li.colors-nav,
aside[role=complementary] nav ul li.tags-nav {
display: block;
width: auto;
margin: 0;
}
aside[role=complementary] nav ul li.colors-nav a {
width: 16.6666666667%;
}
#news-aside {
-moz-column-count: 1;
-moz-column-gap: 0;
-webkit-column-count: 1;
-webkit-column-gap: 0;
column-count: 1;
column-gap: 0;
}
#post-review {
width: 62.962962962963%;
margin: 0 3.7037037037037% 0 0;
float: left;
}
#post-review header {
background: #fff;
padding: 2em 3em 1.5em 3em;
border: solid 1px rgba(0,0,0,.1);
border-bottom: none;
-webkit-border-radius: 4px 4px 0 0;
-moz-border-radius: 4px 4px 0 0;
border-radius: 4px 4px 0 0;
}
.post-text {
-webkit-border-radius: 0 0 4px 4px;
-moz-border-radius: 0 0 4px 4px;
border-radius: 0 0 4px 4px;
border: solid 1px rgba(0,0,0,.1);
border-top: none;
}
.post.detail aside.post-meta {
float: right;
width: 33.3333%;
padding: 0;
}
.post-gallery #post-comments {
float: left;
}
/*
.author a.avatar img.avatar {
width: 128px;
height: 128px;
}
*/
/* Single Header */
.section-header ul.breadcrumb {
display: block;
float: left;
}
.current-post-nav { display: none; }
.single .post-text { padding: 0em 2.666666666666667em 1.5em 2.666666666666667em; }
.single .post-gallery .post-text { padding: 1.5em 3em 1.5em 3em; }
.footer-meta {
width:20%;
}
.footer-meet-newsletter {
width:40%;
padding:0 0 0 4%;
}
.footer-events {
width: 40%;
padding: 0 0 0 4%;
}
footer[role=contentinfo] p {
padding-bottom: 0;
}
#ums-teaser li {
float: left;
width: 21%;
}
/* Articles */
.articles article img {
max-width: 15%;
}
}
/* Laptops, Desktops, etc ---- */
@media only screen and (min-width: 1024px) {
/* Gallery Posts -------------------------- */
#page-header form {
width: 300px;
}
.gallery article {
width: 50%;
float: left;
padding: .75em 0 .75em 0;
}
#home-gallery.gallery article {
padding: .75em 1em .75em 0;
}
.gallery article:nth-child(2n+1) {
padding: .75em 0 .75em .75em;
}
#home-gallery.gallery article:nth-child(2n+2) {
padding: .75em 0 .75em 1em;
}
#home-gallery.gallery article.featured {
padding: 0;
}
/* Gallery Posts -------------------------- */
.sub #gallery {
float: left;
width: 70%;
}
.sub #gallery article {
width: 50%;
padding: 0 3% 1.5em 0;
margin: 0;
}
.sub #gallery article footer {
font-size: .8em;
}
.sub.posts-gallery aside.column {
float: left;
width: 30%;
padding-left: 1%;
}
.sub.posts-gallery aside.column ul {
-moz-column-count: 2;
-moz-column-gap: 1em;
-webkit-column-count: 2;
-webkit-column-gap : 1em;
column-count: 2;
column-gap : 1em;
}
}
@media only screen and (min-width: 1200px) {
.block {
max-width: 1340px;
}
/*
.sub aside[role=complementary] {
width: 39%;
padding-left: 2%;
}
*/
.sub #gallery article { width: 33.3%; }
}
/* Full Width */
.sub.full {
width: 100%;
max-width: 100%;
float: none;
padding: 0;
background: url(../images/dark-graph-tile.png) 50% 0;
}
#main.sub.full .posts {
width: 92%;
max-width: 1340px;
margin: 0 auto;
float: none;
padding: 0;
}
#main.sub.full.posts-podcasts .posts {
width: 94%;
}
#main.sub.full.posts-podcasts .posts > .section-header {
padding-left: 1%;
padding-right: 1%;
}
#main.sub.full .posts .section-header h2 {
color: #fff;
font-weight: 400;
font-size: 2em;
}
.full-grid-columns {
position: relative;
width: 100%;
padding: 0;
}
.full-grid-columns ul,
.full-grid-columns li {
margin: 0;
padding: 0;
list-style: none;
}
.full-grid-columns li {
float: left;
width: 100%;
padding: 0 0 1.5em 0;
}
.full-grid-columns li article {
color: #fff;
background: rgba(255,255,255,.1);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
.full-grid-columns li figure,
.full-grid-columns li figure img {
-webkit-border-radius: 2px 2px 0 0;
-moz-border-radius: 2px 2px 0 0;
border-radius: 2px 2px 0 0;
padding: 0;
}
.full-grid-columns li article .article-content {
padding: 1.5em;
}
.full-grid-columns li article a { color: #fff; }
.full-grid-columns li article a h3 {
font-size: 1.5em;
margin: 0;
padding: 0 0 .125em 0;
color: #0095dc;
line-height: 1.25;
}
.full-grid-columns li article a address {
font-size: .875em;
font-style: italic;
}
.full-grid-columns li article a p { font-weight: 400; }
.full-grid-columns.category-overview li article .article-content a.latest {
display: block;
background: #212a2d;
padding: .75em;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
/*-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,.3);
-moz-box-shadow: 1px 1px 3px rgba(0,0,0,.3);
box-shadow: 1px 1px 3px rgba(0,0,0,.3);*/
}
.full-grid-columns.category-overview li article .article-content a.latest .time {
float: left;
width: 35%;
padding: 0 5% 0 0;
line-height: 1.6;
text-align: center;
}
.full-grid-columns.category-overview li article .article-content a.latest .time span {
display: block;
font-size: .675em;
font-weight: 700;
text-transform: uppercase;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
}
.full-grid-columns.category-overview li article .article-content a.latest .time time {
font-size: 1.125em;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-weight: 600;
color: #a2e015;
}
.full-grid-columns.category-overview li article .article-content a.latest h4 {
color: #fff;
font-weight: 400;
float: left;
width: 65%;
}
/* Podcast Specific Styles */
.sub.full.category-bizcraft {
background: #0f1417;
background: url(../images/noisy_net.png);
}
.sub.full.category-bizcraft a {
color: #910900;
}
.sub.full .podcast-post {
background: #fff;
}
.podcast-header {
padding: .25em 0 .25em 0;
}
.podcast-header header {
color: #fff;
}
.podcast-header header h2 {
font-size: 1.5em;
}
.podcast-header header a#podcast-download {
padding-top: 1.5em;
font-size: 12px;
display: inline-block;
color: #555;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-weight: 600;
}
.podcast-header a#podcast-download:hover {
color: #eee;
}
.podcast-header .podcast-player {
padding: .75em 3em 0 0;
}
.podcast-header .podcast-player audio {
}
.podcast-post .podcast-player { display: none; }
.sidebar-podcast,.podcast-text {
word-wrap: break-word;
padding: 1.5em 0;
}
.sidebar-more-podcasts h3 {
margin: 0;
padding: 0 0 .75em 0;
}
.sidebar-more-podcasts {
background: #efefef;
padding: 1.5em;
}
.sidebar-more-podcasts h3 a {
display: block;
font-family: "skolar-1", "skolar-2" , Helvetica, Arial, sans-serif;
font-size: .9375em;
text-transform: uppercase;
color: #006ba2;
font-weight: 600;
color: #9f111b;
}
.sidebar-more-podcasts article {
padding-bottom: 3em;
}
.sidebar-more-podcasts article figure {
width: 25%;
float: left;
padding: 0 5% 0 0;
}
.sidebar-more-podcasts article figure img {
border: solid 1px #efefef;
}
.sidebar-more-podcasts article .excerpt {
width: 75%;
float: left;
}
.sidebar-more-podcasts article .excerpt h4 {
font-size: 1em;
padding: 0;
margin: 0;
}
#sidebar-podcast .sidebar-more-podcasts article .excerpt h4 a {
display: block;
font-weight: 600;
color: #292c37;
}
#sidebar-podcast .sidebar-more-podcasts .excerpt h4 a:hover { color: #444; }
#sidebar-podcast .sidebar-more-podcasts .excerpt p {
font-size: .875em;
font-weight: 400;
padding: 0;
}
#sidebar-podcast .sidebar-more-podcasts article p a {
color:#252a2b;
font-weight: 400;
}
#sidebar-podcast .sidebar-more-podcasts .comments-link {
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
font-size: .675em;
color: #bbb;
text-transform: uppercase;
display: block;
padding: 0 0 .5em 0;
}
#sidebar-podcast .sidebar-more-podcasts .comments-link:hover { color: #444; }
.podcast-meta .podcast-subscribe,
.podcast-meta .podcast-about {
background: #efefef;
padding: 1.5em;
margin: 0 0 1.5em 0;
}
.podcast-meta div p:last-child {
padding-bottom: 0;
}
/* Full Grid MQ */
@media only screen and (min-width: 700px) {
.full-grid-columns li {
width: 50%;
padding: 0 1% 1.5em 1%;
}
.sidebar-podcast {
float: left;
width: 34%;
padding-left: 3%;
}
.podcast-text {
float: left;
width: 66%;
}
}
@media only screen and (min-width: 1000px) {
.full-grid-columns li {
width: 25%;
}
.podcast-header figure {
float: left;
width: 34%;
}
.sub.full.posts-podcasts .podcast-header header {
float: left;
width: 66%;
padding: 2.5em 0 2.5em 0;
}
.podcast-meta {
float: right;
max-width: 30%;
margin: 0 0 1.5em 3em;
}
.sidebar-podcast {
float: left;
padding-left: 0;
padding-right: 3%;
}
.podcast-text {
float: right;
}
}
#main.sub.full .posts header.radar-header.section-header {
background: rgba(255,255,255,.05);
padding: .75em 1.5em;
margin: 0 1% 1.5em 1%;
}
#main.sub.full .posts header.radar-header.section-header p {
padding: 0;
color: #fff;
font-size: .875em;
}
#main.sub.full .posts header.radar-header.section-header p a {
color: #A2E015;
}
.single #main .posts header.radar-header.section-header h2 {
text-align: left;
background: none;
padding-bottom: 0;
float: none;
text-transform: none;
font-size: 1.75em;
font-weight: 700;
padding: 0;
}
.single header.radar-header time {
color: #fff;
font-size: .75em;
text-transform: uppercase;
font-weight: 700;
color: #A2E015;
font-family: "etica-1", "etica-2", Helvetica, Arial, sans-serif;
}
/* Radar MQ */
/*
@media only screen and (min-width: 600px) {
.single header.radar-header time {
float: right;
}
}
*/
.single .single-radar-post header h2 {
text-transform: none;
float: none;
padding: 0;
}
.single .single-radar-post header.radar-header time {
float: none;
padding: 0;
}
.single-radar-content {
padding: 1.5em;
background: #fff;
}
.single-radar-content h2 {
font-size: 1.25em;
}
.single .single-radar-content time {
padding-bottom: .75em;
display: block;
}
.single-radar-img {
margin: 0 0 .75em 0;
}
a.radar-more {
background: #a8e400;
padding: .875em;
color: #fff;
margin: .75em 0 0 0;
text-align: center;
text-transform: uppercase;
color: #fff;
font-weight: bold;
display: block;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
a.radar-more:hover {
background: #333;
}
.radar-via {
padding: 0;
font-size: .875em;
font-style: italic;
}
.single-radar-sidebar article {
border-top: dotted 1px #eee;
padding: .75em 0 0 0;
margin: .75em 0 0 0;
}
.single-radar-sidebar article figure {
float: left;
margin: 0 1em .75em 0;
max-width: 100px;
padding: 4px;
border: solid 1px #eee;
}
.single-radar-sidebar article h4 { font-size: 1.125em; }
.single-radar-sidebar {
background: #fff;
padding: 1.5em;
}
.single-radar-sidebar h3 {
margin: 0;
padding: 0;
}
.radar-signup {
padding: .75em 0;
}
.radar-signup h3 {
padding: 0 0 .5em 0;
color: #fff;
font-size: 1.25em;
}
.radar-signup input {
background: #fff;
}
@media only screen and (min-width: 605px) {
.single-radar-content {
float: left;
width: 50%;
margin: 0 3% 0 1%;
}
.single-radar-sidebar {
float: left;
width: 46%;
}
.radar-signup {
float: right;
width: 40%;
padding: 0 0 0 5%;
}
.header-title {
float: left;
width: 60%;
}
}
@media only screen and (min-width: 1000px) {
.single-radar-content {
float: left;
width: 45%;
margin: 0 3% 0 1%;
}
.single-radar-sidebar {
float: left;
width: 51%;
}
.single-radar-sidebar article {
/*
display: inline-block;
width: 45%;
vertical-align: top;
padding: 1.5em 1.5em 0 0;
*/
}
.radar-signup form { float: right; }
}
@media print {
* {
background:transparent!important;
color:#444!important;
text-shadow:none!important;
}
a,a:visited {
color:#444!important;
text-decoration:underline;
}
a:after {
content:" (" attr(href) ")";
}
abbr:after {
content:" (" attr(title) ")";
}
.ir a:after {
content:"";
}
pre,blockquote {
border:1px solid #999;
page-break-inside:avoid;
}
thead {
display:table-header-group;
}
tr,img {
page-break-inside:avoid;
}
@page {
margin:.5cm;
}
p,h2,h3 {
orphans:3;
widows:3;
}
h2,h3 {
page-break-after:avoid;
}
}
/* Media Element Player */
.mejs-container {
position: relative;
/*background: #000;*/
font-family: Helvetica, Arial;
text-align: left;
vertical-align: top;
text-indent: 0;
}
.me-plugin {
position: absolute;
}
.mejs-embed, .mejs-embed body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
/*background: #000;*/
overflow: hidden;
}
.mejs-container-fullscreen {
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
overflow: hidden;
z-index: 1000;
}
.mejs-container-fullscreen .mejs-mediaelement,
.mejs-container-fullscreen video {
width: 100%;
height: 100%;
}
/* Start: LAYERS */
.mejs-background {
position: absolute;
top: 0;
left: 0;
}
.mejs-mediaelement {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.mejs-poster {
position: absolute;
top: 0;
left: 0;
}
.mejs-poster img {
border: 0;
padding: 0;
border: 0;
display: block;
}
.mejs-overlay {
position: absolute;
top: 0;
left: 0;
}
.mejs-overlay-play {
cursor: pointer;
}
.mejs-overlay-button {
position: absolute;
top: 50%;
left: 50%;
width: 100px;
height: 100px;
margin: -50px 0 0 -50px;
background: url(libs/bigplay.png) no-repeat;
}
.mejs-overlay:hover .mejs-overlay-button {
background-position: 0 -100px;
}
.mejs-overlay-loading {
position: absolute;
top: 50%;
left: 50%;
width: 80px;
height: 80px;
margin: -40px 0 0 -40px;
background: #333;
background: url(libs/background.png);
background: rgba(0, 0, 0, 0.9);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50,50,50,0.9)), to(rgba(0,0,0,0.9)));
background: -webkit-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
background: -moz-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
background: -o-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
background: -ms-linear-gradient(top, rgba(50,50,50,0.9), rgba(0,0,0,0.9));
background: linear-gradient(rgba(50,50,50,0.9), rgba(0,0,0,0.9));
}
.mejs-overlay-loading span {
display: block;
width: 80px;
height: 80px;
background: transparent url(libs/loading.gif) 50% 50% no-repeat;
}
/* End: LAYERS */
/* Start: CONTROL BAR */
.mejs-container .mejs-controls {
position: absolute;
background: none;
list-style-type: none;
margin: 0;
padding: 0;
bottom: 0;
left: 0;
background: #1d2629;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
/*border: dotted 1px rgba(255,255,255,.05);*/
/*background: url(libs/background.png);
background: rgba(0, 0, 0, 0.7);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50,50,50,0.7)), to(rgba(0,0,0,0.7)));
background: -webkit-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: -moz-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: -o-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: -ms-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: linear-gradient(rgba(50,50,50,0.7), rgba(0,0,0,0.7));*/
height: 30px;
width: 99%;
}
.mejs-container .mejs-controls div {
list-style-type: none;
background-image: none;
display: block;
float: left;
margin: 0;
padding: 0;
width: 26px;
height: 26px;
font-size: 11px;
line-height: 11px;
background: 0;
font-family: Helvetica, Arial;
border: 0;
}
.mejs-controls .mejs-button button {
cursor: pointer;
display: block;
font-size: 0;
line-height: 0;
text-decoration: none;
margin: 7px 5px;
padding: 0;
position: absolute;
height: 16px;
width: 16px;
border: 0;
background: transparent url(libs/controls.png) no-repeat;
}
/* :focus for accessibility */
.mejs-controls .mejs-button button:focus {
outline: solid 1px yellow;
}
/* End: CONTROL BAR */
/* Start: Time (current / duration) */
.mejs-container .mejs-controls .mejs-time {
color: #fff;
display: block;
height: 17px;
width: auto;
padding: 8px 3px 0 3px;
overflow: hidden;
text-align: center;
padding: auto 4px;
box-sizing: content-box;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
}
.mejs-container .mejs-controls .mejs-time span {
font-size: 11px;
color: #fff;
line-height: 12px;
display: block;
float: left;
margin: 1px 2px 0 0;
width: auto;
}
/* End: Time (current / duration) */
/* Start: Play/pause */
.mejs-controls .mejs-play button {
background-position: 0 0;
}
.mejs-controls .mejs-pause button {
background-position: 0 -16px;
}
/* End: Play/pause */
/* Stop */
.mejs-controls .mejs-stop button {
background-position: -112px 0;
}
/* End: Play/pause */
/* Start: Progress bar */
.mejs-controls div.mejs-time-rail {
width: 200px;
padding-top: 5px;
}
.mejs-controls .mejs-time-rail span {
display: block;
position: absolute;
width: 180px;
height: 10px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
cursor: pointer;
}
.mejs-controls .mejs-time-rail .mejs-time-total {
margin: 5px;
background: #333;
background: rgba(50,50,50,0.8);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(30,30,30,0.8)), to(rgba(60,60,60,0.8)));
background: -webkit-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: -moz-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: -o-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: -ms-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: linear-gradient(rgba(30,30,30,0.8), rgba(60,60,60,0.8));
}
.mejs-controls .mejs-time-rail .mejs-time-buffering {
width: 100%;
background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
-webkit-background-size: 15px 15px;
-moz-background-size: 15px 15px;
-o-background-size: 15px 15px;
background-size: 15px 15px;
-webkit-animation: buffering-stripes 2s linear infinite;
-moz-animation: buffering-stripes 2s linear infinite;
-ms-animation: buffering-stripes 2s linear infinite;
-o-animation: buffering-stripes 2s linear infinite;
animation: buffering-stripes 2s linear infinite;
}
@-webkit-keyframes buffering-stripes {
from {
background-position: 0 0;
}
to {
background-position: 30px 0;
}
}
@-moz-keyframes buffering-stripes {
from {
background-position: 0 0;
}
to {
background-position: 30px 0;
}
}
@-ms-keyframes buffering-stripes {
from {
background-position: 0 0;
}
to {
background-position: 30px 0;
}
}
@-o-keyframes buffering-stripes {
from {
background-position: 0 0;
}
to {
background-position: 30px 0;
}
}
@keyframes buffering-stripes {
from {
background-position: 0 0;
}
to {
background-position: 30px 0;
}
}
.mejs-controls .mejs-time-rail .mejs-time-loaded {
/* background: #3caac8;
background: rgba(60,170,200,0.8);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(44,124,145,0.8)), to(rgba(78,183,212,0.8)));
background: -webkit-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
background: -moz-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
background: -o-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
background: -ms-linear-gradient(top, rgba(44,124,145,0.8), rgba(78,183,212,0.8));
background: linear-gradient(rgba(44,124,145,0.8), rgba(78,183,212,0.8));*/
background: #a2e015;
width: 0;
}
.mejs-controls .mejs-time-rail .mejs-time-current {
width: 0;
background: #fff;
background: rgba(255,255,255,0.8);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.9)), to(rgba(200,200,200,0.8)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: -moz-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: -o-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: -ms-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: linear-gradient(rgba(255,255,255,0.9), rgba(200,200,200,0.8));
}
.mejs-controls .mejs-time-rail .mejs-time-handle {
display: none;
position: absolute;
margin: 0;
width: 10px;
background: #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
cursor: pointer;
border: solid 2px #333;
top: -2px;
text-align: center;
}
.mejs-controls .mejs-time-rail .mejs-time-float {
position: absolute;
display: none;
background: #eee;
width: 36px;
height: 17px;
border: solid 1px #333;
top: -26px;
margin-left: -18px;
text-align: center;
color: #111;
}
.mejs-controls .mejs-time-rail .mejs-time-float-current {
margin: 2px;
width: 30px;
display: block;
text-align: center;
left: 0;
}
.mejs-controls .mejs-time-rail .mejs-time-float-corner {
position: absolute;
display: block;
width: 0;
height: 0;
line-height: 0;
border: solid 5px #eee;
border-color: #eee transparent transparent transparent;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
top: 15px;
left: 13px;
}
/*
.mejs-controls .mejs-time-rail:hover .mejs-time-handle {
visibility:visible;
}
*/
/* End: Progress bar */
/* Start: Fullscreen */
.mejs-controls .mejs-fullscreen-button button {
background-position: -32px 0;
}
.mejs-controls .mejs-unfullscreen button {
background-position: -32px -16px;
}
/* End: Fullscreen */
/* Start: Mute/Volume */
.mejs-controls .mejs-volume-button {
}
.mejs-controls .mejs-mute button {
background-position: -16px -16px;
}
.mejs-controls .mejs-unmute button {
background-position: -16px 0;
}
.mejs-controls .mejs-volume-button {
position: relative;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider {
display: none;
height: 115px;
width: 25px;
background: url(libs/background.png);
background: rgba(50, 50, 50, 0.7);
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
top: -115px;
left: 0;
z-index: 1;
position: absolute;
margin: 0;
}
.mejs-controls .mejs-volume-button:hover {
-webkit-border-radius: 0 0 4px 4px;
-moz-border-radius: 0 0 4px 4px;
border-radius: 0 0 4px 4px;
}
/*
.mejs-controls .mejs-volume-button:hover .mejs-volume-slider {
display: block;
}
*/
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-total {
position: absolute;
left: 11px;
top: 8px;
width: 2px;
height: 100px;
background: #ddd;
background: rgba(255, 255, 255, 0.5);
margin: 0;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-current {
position: absolute;
left: 11px;
top: 8px;
width: 2px;
height: 100px;
background: #ddd;
background: rgba(255, 255, 255, 0.9);
margin: 0;
}
.mejs-controls .mejs-volume-button .mejs-volume-slider .mejs-volume-handle {
position: absolute;
left: 4px;
top: -3px;
width: 16px;
height: 6px;
background: #ddd;
background: rgba(255, 255, 255, 0.9);
cursor: N-resize;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
margin: 0;
}
/* horizontal version */
.mejs-controls div.mejs-horizontal-volume-slider {
height: 26px;
width: 60px;
position: relative;
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
position: absolute;
left: 0;
top: 11px;
width: 50px;
height: 8px;
margin: 0;
padding: 0;
font-size: 1px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background: #333;
background: rgba(50,50,50,0.8);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(30,30,30,0.8)), to(rgba(60,60,60,0.8)));
background: -webkit-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: -moz-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: -o-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: -ms-linear-gradient(top, rgba(30,30,30,0.8), rgba(60,60,60,0.8));
background: linear-gradient(rgba(30,30,30,0.8), rgba(60,60,60,0.8));
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
position: absolute;
left: 0;
top: 11px;
width: 50px;
height: 8px;
margin: 0;
padding: 0;
font-size: 1px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background: #fff;
background: rgba(255,255,255,0.8);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255,255,255,0.9)), to(rgba(200,200,200,0.8)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: -moz-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: -o-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: -ms-linear-gradient(top, rgba(255,255,255,0.9), rgba(200,200,200,0.8));
background: linear-gradient(rgba(255,255,255,0.9), rgba(200,200,200,0.8));
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle {
display: none;
}
/* End: Mute/Volume */
/* Start: TRACK (Captions and Chapters) */
.mejs-controls .mejs-captions-button {
position: relative;
}
.mejs-controls .mejs-captions-button button {
background-position: -48px 0;
}
.mejs-controls .mejs-captions-button .mejs-captions-selector {
visibility: hidden;
position: absolute;
bottom: 26px;
right: -10px;
width: 130px;
height: 100px;
background: url(libs/background.png);
background: rgba(50,50,50,0.7);
border: solid 1px transparent;
padding: 10px;
overflow: hidden;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
/*
.mejs-controls .mejs-captions-button:hover .mejs-captions-selector {
visibility: visible;
}
*/
.mejs-controls .mejs-captions-button .mejs-captions-selector ul {
margin: 0;
padding: 0;
display: block;
list-style-type: none !important;
overflow: hidden;
}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul li {
margin: 0 0 6px 0;
padding: 0;
list-style-type: none !important;
display: block;
color: #fff;
overflow: hidden;
}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul li input {
clear: both;
float: left;
margin: 3px 3px 0 5px;
}
.mejs-controls .mejs-captions-button .mejs-captions-selector ul li label {
width: 100px;
float: left;
padding: 4px 0 0 0;
line-height: 15px;
font-family: helvetica, arial;
font-size: 10px;
}
.mejs-controls .mejs-captions-button .mejs-captions-translations {
font-size: 10px;
margin: 0 0 5px 0;
}
.mejs-chapters {
position: absolute;
top: 0;
left: 0;
-xborder-right: solid 1px #fff;
width: 10000px;
z-index: 1;
}
.mejs-chapters .mejs-chapter {
position: absolute;
float: left;
background: #222;
background: rgba(0, 0, 0, 0.7);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(50,50,50,0.7)), to(rgba(0,0,0,0.7)));
background: -webkit-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: -moz-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: -o-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: -ms-linear-gradient(top, rgba(50,50,50,0.7), rgba(0,0,0,0.7));
background: linear-gradient(rgba(50,50,50,0.7), rgba(0,0,0,0.7));
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr=#323232,endColorstr=#000000);
overflow: hidden;
border: 0;
}
.mejs-chapters .mejs-chapter .mejs-chapter-block {
font-size: 11px;
color: #fff;
padding: 5px;
display: block;
border-right: solid 1px #333;
border-bottom: solid 1px #333;
cursor: pointer;
}
.mejs-chapters .mejs-chapter .mejs-chapter-block-last {
border-right: none;
}
.mejs-chapters .mejs-chapter .mejs-chapter-block:hover {
/*background: #333;*/
background: #666;
background: rgba(102,102,102, 0.7);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(102,102,102,0.7)), to(rgba(50,50,50,0.6)));
background: -webkit-linear-gradient(top, rgba(102,102,102,0.7), rgba(50,50,50,0.6));
background: -moz-linear-gradient(top, rgba(102,102,102,0.7), rgba(50,50,50,0.6));
background: -o-linear-gradient(top, rgba(102,102,102,0.7), rgba(50,50,50,0.6));
background: -ms-linear-gradient(top, rgba(102,102,102,0.7), rgba(50,50,50,0.6));
background: linear-gradient(rgba(102,102,102,0.7), rgba(50,50,50,0.6));
filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, startColorstr=#666666,endColorstr=#323232);
}
.mejs-chapters .mejs-chapter .mejs-chapter-block .ch-title {
font-size: 12px;
font-weight: bold;
display: block;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0 0 3px 0;
line-height: 12px;
}
.mejs-chapters .mejs-chapter .mejs-chapter-block .ch-timespan {
font-size: 12px;
line-height: 12px;
margin: 3px 0 4px 0;
display: block;
white-space: nowrap;
text-overflow: ellipsis;
}
.mejs-captions-layer {
position: absolute;
bottom: 0;
left: 0;
text-align: center;
/*font-weight: bold;*/
line-height: 22px;
font-size: 12px;
color: #fff;
}
.mejs-captions-layer a {
color: #fff;
text-decoration: underline;
}
.mejs-captions-layer[lang=ar] {
font-size: 20px;
font-weight: normal;
}
.mejs-captions-position {
position: absolute;
width: 100%;
bottom: 15px;
left: 0;
}
.mejs-captions-position-hover {
bottom: 45px;
}
.mejs-captions-text {
padding: 3px 5px;
background: url(libs/background.png);
background: rgba(20, 20, 20, 0.8);
}
/* End: TRACK (Captions and Chapters) */
.mejs-clear {
clear: both;
}
/* Start: ERROR */
.me-cannotplay {
}
.me-cannotplay a {
color: #fff;
font-weight: bold;
}
.me-cannotplay span {
padding: 15px;
display: block;
}
/* End: ERROR */
/* Start: Loop */
.mejs-controls .mejs-loop-off button {
background-position: -64px -16px;
}
.mejs-controls .mejs-loop-on button {
background-position: -64px 0;
}
/* End: Loop */
/* Start: backlight */
.mejs-controls .mejs-backlight-off button {
background-position: -80px -16px;
}
.mejs-controls .mejs-backlight-on button {
background-position: -80px 0;
}
/* End: backlight */
/* Start: picture controls */
.mejs-controls .mejs-picturecontrols-button {
background-position: -96px 0;
}
/* End: picture controls */
/* context menu */
.mejs-contextmenu {
position: absolute;
width: 150px;
padding: 10px;
border-radius: 4px;
top: 0;
left: 0;
background: #fff;
border: solid 1px #999;
z-index: 1001;
/* make sure it shows on fullscreen */
}
.mejs-contextmenu .mejs-contextmenu-separator {
height: 1px;
font-size: 0;
margin: 5px 6px;
background: #333;
}
.mejs-contextmenu .mejs-contextmenu-item {
font-family: Helvetica, Arial;
font-size: 12px;
padding: 4px 6px;
cursor: pointer;
color: #333;
}
.mejs-contextmenu .mejs-contextmenu-item:hover {
background: #2C7C91;
color: #fff;
}
/* Start: SourceChooser */
.mejs-controls .mejs-sourcechooser-button {
position: relative;
}
.mejs-controls .mejs-sourcechooser-button button {
background-position: -128px 0;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector {
visibility: hidden;
position: absolute;
bottom: 26px;
right: -10px;
width: 130px;
height: 100px;
background: url(libs/background.png);
background: rgba(50,50,50,0.7);
border: solid 1px transparent;
padding: 10px;
overflow: hidden;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul {
margin: 0;
padding: 0;
display: block;
list-style-type: none !important;
overflow: hidden;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li {
margin: 0 0 6px 0;
padding: 0;
list-style-type: none !important;
display: block;
color: #fff;
overflow: hidden;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li input {
clear: both;
float: left;
margin: 3px 3px 0 5px;
}
.mejs-controls .mejs-sourcechooser-button .mejs-sourcechooser-selector ul li label {
width: 100px;
float: left;
padding: 4px 0 0 0;
line-height: 15px;
font-family: helvetica, arial;
font-size: 10px;
}
/* End: SourceChooser */
/* Table */
.data-table {
width: 100%;
margin: 0 0 16px 0;
background: #eee;
}
.data-table th {
text-align: left;
background: #ddd;
padding: 8px;
border-bottom: solid 1px #fff;
font-size: .75em;
}
.data-table td {
padding: 8px;
background: #eee;
border-bottom: solid 1px #fff;
font-size: .75em;
}