/*
 * SCREEN CSS
 *
 * ********************************************* */

/* ======================================================= */
/*                      Global Reset                       */
/* ======================================================= */
/*
html5doctor.com Reset Stylesheet
v1.6
Last Updated: 2010-08-18
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
nav ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}
a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
/* change colours to suit your needs */
ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none;
}
/* change colours to suit your needs */
mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold;
}
del {
    text-decoration: line-through;
}
abbr[title], dfn[title] {
    border-bottom: 1px dotted inherit;
    cursor: help;
}
/* tables still need cellspacing="0" in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}
/* change border colour to suit your needs */
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
}
input, select {
    vertical-align: middle;
}
/* ======================================================= */
/*                       Base Style                        */
/* ======================================================= */
/* Basic typography
---------------------------------------------------------- */
body {
    font-family: "Lucida Sans Unicode", "Lucida Sans", "Lucida Grande", Arial, sans-serif;
    font-size: 12px;
    line-height: 20px;
    color: #333;
}
strong, th, thead td {
    font-weight: bold;
}
cite, em, dfn {
    font-style: italic;
}
code, kbd, samp, pre, tt, var, input[type=text], input[type=password], input[type=email], textarea {
    font-family: "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace;
}
code, pre {
    display: block;
    white-space: pre;
}
del {
    text-decoration: line-through;
    color: #666;
}
ins, dfn {
    border-bottom: 1px solid #ccc;
}
small, sup, sub {
    font-size: 85%;
}
abbr, acronym {
    text-transform: uppercase;
    letter-spacing: .1em;
}
a abbr, a acronym {
    border: none;
}
abbr[title], acronym[title], dfn[title] {
    cursor: help;
    border-bottom: 1px dotted #ccc;
}
sup {
    vertical-align: super;
}
sub {
    vertical-align: sub;
}
p, ul, ol, dl, table, fieldset, blockquote, pre, code {
    margin-bottom: 20px;
}

/* Basic size
---------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0.6em;
    font-weight: normal;
    line-height: 1em;
}
h1 {
    font-size: 36px;
}
h2 {
    font-size: 30px;
}
h3 {
    font-size: 24px;
}
h4 {
    font-size: 18px;
}
h5 {
    font-size: 14px;
}
h6 {
    font-size: 12px;
}
/*
h1 .subTitle, h2 .subTitle, h3 .subTitle, h4 .subTitle, h5 .subTitle, h6 .subTitle {
    display: block;
    color: #999;
    font-size: 0.65em;
    margin: 0;
}
*/

/* Basic lists
---------------------------------------------------------- */
ul {
    margin-left: 1.5em;
    list-style-type: disc;
}
ul li {
    margin-left: .85em;
}
ul ul {
    list-style-type: square;
}
ul ul ul {
    list-style-type: circle;
}
ol {
    margin-left: 2.35em;
    list-style-position: outside;
    list-style-type: decimal;
}
dt {
    margin-top: .8em;
    margin-bottom: .4em;
    font-weight: bold;
}
ol ol, ul ol {
    margin-left: 2.5em;
}
ul ol, ol ul, ol ol, ul ul {
    margin-bottom: 0;
}

/* Link style
---------------------------------------------------------- */
a:link, a:visited, a:hover, a:active, a:focus {
    color:#666;
    outline: 0 none;
    text-decoration: none;
}

/* Non-semantic helper classes
---------------------------------------------------------- */
.center {
    text-align: center;
}
.hidden {
    display: none;
    visibility: hidden;
}
.invisible {
    visibility: hidden;
}
.alignright {
    float: right;
}
.alignleft {
    float: left;
}
.aligncenter {
    margin-left:auto;
    margin-right:auto;
}
.clearboth{
    clear: both;
    display: block;
    font-size: 0px;
    height: 0px;
    line-height: 0;
    width: 100%;
    overflow:hidden;
}
/* ======================================================= */
/*                          Form                           */
/* ======================================================= */
.form-item {
    margin: 0 0 10px;
}
.form-item label {
    cursor: pointer;
}
fieldset {
    padding: 1em;
    border: 1px solid #ccc;
}
legend {
    padding: 0 .8em;
    font-weight: bold;
    font-size: 1.2em;
}
textarea, input[type=text], input[type=password], input[type=email], select {
    border: 1px solid #ccc;
    background: #fff;
    font-size: inherit;
}
input, select {
    cursor: pointer;
}
input[type=text], input[type=password], input[type=email] {
    cursor: text;
}
textarea {
    overflow:auto;
}
textarea, input {
    padding: 5px;
    outline: none;
}
select {
    padding: 2px;
}
option {
    padding: 0 4px;
}
input[type=button], button {
    padding: 4px;
    cursor: pointer;
    vertical-align: middle;
}
input.text_input,textarea.textarea {
    border: 1px solid #ccc;
    background: url("images/input_bg.png") no-repeat scroll 0 0 transparent;
     -moz-border-radius: 1px;
  -webkit-border-radius: 1px;
          border-radius: 1px;
}
input.text_input:focus,textarea.textarea:focus {
    border: 1px solid #999;
}

/* ======================================================= */
/*                          Table                          */
/* ======================================================= */
table, td, th {
    vertical-align: middle;
}
caption {
    padding-bottom: 0.8em;
}



/* ======================================================= */
/*                         Divider                         */
/* ======================================================= */
/*
.divider {
    position:relative;
    clear:both;
    display:block;
    padding-top:20px;
    margin-bottom:40px;
    border-bottom:1px solid #EEEEEE;
}
.divider.top a {
    position:absolute;
    right:0;
    top:10px;
    width:20px;
    background:none repeat scroll 0 0 #FFFFFF;
    font-size:10px;
    padding:0 2px;
    text-align:right;
    text-decoration:none;
    color:#ccc;
}
.divider_padding {
    position:relative;
    clear:both;
    display:block;
    padding-top:30px;
}
.divider_line {
    position:relative;
    clear:both;
    display:block;
    border-bottom:1px solid #EEEEEE;
    margin-bottom:10px;
}
* */

/* ======================================================= */
/*                      Images Styles                      */
/* ======================================================= */
/* Basic image style
---------------------------------------------------------- */
.preloading {
    background:url("images/loading.gif") #f9f9f9 no-repeat 50% 50%;
}
img.alignleft, .wp-caption.alignleft{
    margin:2px 16px 2px 2px !important;
}
img.alignright, .wp-caption.alignright {
    margin:2px 2px 2px 16px !important;
}
img.aligncenter, .wp-caption.aligncenter {
    display: block;
    margin: 2px auto !important;
    text-align: center;
}

/* ======================================================= */
/*                   Extended Typography                   */
/* ======================================================= */
/* highlight
---------------------------------------------------------- */
.highlight {
    background: #FFFF99;
}
.highlight.dark {
    background: #333;
    color:#FFF;
}
/* code & pre
---------------------------------------------------------- */
.code,.pre{
    border: 1px solid #e0e0e0;
    padding: 10px;
    background:#ffffff;
    white-space: pre-wrap;                 /* CSS3 browsers  */
    white-space: -moz-pre-wrap !important; /* 1999+ Mozilla  */
    white-space: -pre-wrap;                /* Opera 4 thru 6 */
    white-space: -o-pre-wrap;              /* Opera 7 and up */
    overflow:auto;
}

/* blockquote
---------------------------------------------------------- */
blockquote {
    font-family: Georgia,"Times New Roman",Times,serif;
    font-size: 16px;
    color:#444;
    line-height: 24px;
    padding: 10px 20px 10px 45px;
    background:url("images/quote.gif") no-repeat scroll 0px 6px transparent;
}
blockquote p {
    margin-bottom:8px;
}
blockquote.alignleft {
    margin: 10px 20px 0 0;
    width: 220px;
}
blockquote.alignright {
    margin: 10px 0 0 20px;
    width: 220px;
}
blockquote cite {
    color: #666;
    font-size: 12px;
}

/* ======================================================= */
/*                      Boxes Styles                       */
/* ======================================================= */
/* Messages
---------------------------------------------------------- */
.info, .error, .notice, .success {
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    border: 1px solid #bbb;
    margin-bottom: 20px;
}
.message_box_content h3 {
    margin-bottom: 0px;
}
.message_box_content {
    border: 1px solid #fff;
    padding:10px;
}
.info {
    background: #D7E7F5;
    color: #5E6984;
    border-color: #AACEE6;
}
.error {
    background: #FDE9EA;
    color: #A14A40;
    border-color: #FDCED0;
}
.notice {
    background: #FFF9CC;
    color: #736B4C;
    border-color: #FFDB4F;
}
.success {
    background: #E2F2CE;
    color: #466840;
    border-color: #BFE098;
}
.info a {
    color: #5E6984 !important;
}
.error a {
    color: #A14A40 !important;
}
.notice a {
    color: #736B4C !important;
}
.success a {
    color: #466840 !important;
}
.error_msg {
    margin-top: -20px;
    margin-bottom: 20px;
    background: none repeat scroll 0 0 #fff3f3;
    border: 1px solid #fcbec0;
    border-top: 0 none;
    color: #684c4c;
}
.error_msg ul, .error_msg ol {
    margin-bottom: 0;
}


/* ======================================================= */
/*                        Structure                        */
/* ======================================================= */
/* Main Structure
---------------------------------------------------------- */
#page {
    position:relative;
}
#main, #sidebar{ position:relative; }
* html #page, * html #sidebar{ display:inline; }
.inner{ width:960px; margin:0 auto; position:relative; height:100%;}
#page .inner { padding: 20px 0 0; }


/* Right Sidebar
---------------------------------------------------------- */
.right_sidebar #main{ float:left; width:630px; }
.right_sidebar #main .content {
    width:630px;
    overflow: hidden;
}
.right_sidebar #sidebar {
    float:right;
    width:300px;
    margin: 0 0 0.5em 30px;
}
.right_sidebar #sidebar_content {
    background: url("images/sidebar_divider.png") no-repeat scroll left top transparent;
    padding-top:50px;
    padding-left:25px;
    min-height:100px;
    overflow: hidden;
}
.right_sidebar #sidebar_content.lessgap {
    padding-top:22px;
}
.right_sidebar #sidebar_bottom {
    clear:both;
    background: url("images/sidebar_divider_bottom.png") no-repeat scroll left top transparent;
    height:50px;
}
/* Left Sidebar
---------------------------------------------------------- */
.left_sidebar #main{ float:right; width:630px; }
.left_sidebar #main .content {
    width:630px;
    overflow: hidden;
}
.left_sidebar #sidebar {
    float:left;
    width:300px;
    margin: 0 30px 0.5em 0;
}
.left_sidebar #sidebar_content {
    background: url("images/Lsidebar_divider.png") no-repeat scroll right top transparent;
    padding-top:50px;
    padding-right:25px;
    min-height:100px;
    overflow: hidden;
}
.left_sidebar #sidebar_content.lessgap {
    padding-top:22px;
}
.left_sidebar #sidebar_bottom {
    clear:both;
    background: url("images/Lsidebar_divider_bottom.png") no-repeat scroll right top transparent;
    height:50px;
}
.home #sidebar_content {
    padding-top:30px;
}

/* ======================================================= */
/*                         Header                          */
/* ======================================================= */
#header {
    z-index: 200;
    position: relative;
    height: 90px;
}
#top_area {
    position: absolute;
    right:0px;
    top:10px;
}
/* Logo & Sitename
---------------------------------------------------------- */
#logo, #logo_text {
    position: absolute;
    left: 0px;
}
#site_name {
    font-size: 40px;
    line-height:40px;
    display:block;
}
#site_description {
    font-size: 11px;
    line-height:11px;
}

/* qTranslate
---------------------------------------------------------- */
#top_area .widget_qtranslate {
    margin-top:5px;
}
.widget_qtranslate ul.qtrans_language_chooser {
    list-style:none;
    padding:0;
    margin:0;
}
.widget_qtranslate ul.qtrans_language_chooser li {
    float:left;
    margin-left:8px;
    overflow:hidden;
}
.widget_qtranslate ul.qtrans_language_chooser li img {
    opacity:0.7;
    -moz-opacity:0.7;
    background:#fff;
}
.widget_qtranslate ul.qtrans_language_chooser li img:hover {
    opacity:1;
    -moz-opacity:1;
}
/* ======================================================= */
/*                       Navigation                        */
/* ======================================================= */
#navigation {
    right: -15px;
    bottom: 0;
    position: absolute;
    height: 60px;
}
.jqueryslidemenu {
    position: relative;
    z-index: 200;
}
.jqueryslidemenu ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    z-index: 200;
}
/*Top level list items*/
.jqueryslidemenu ul li {
    position: relative;
    display: inline;
    float: left;
    margin: 0px;
}
/*Top level menu link items style*/
.jqueryslidemenu ul li a {
    display: block;
    height: 60px;
    line-height: 56px;
    text-decoration: none;
    overflow:hidden;
    padding:0 15px;
}
* html .jqueryslidemenu ul li a {
    /*IE6 hack to get sub menu links to behave correctly*/
    display: inline-block;
}
/* 1st sub level menu
---------------------------------------------------------- */
.jqueryslidemenu ul li ul {
    position: absolute;
    left: 0;
    display: block;
    padding: 3px 0;
    visibility: hidden;
    border: 1px solid #BBBBBB;
    border-top: 0;
    z-index: 201;
}
/*Sub level menu list items (undo style from Top level List Items)*/
.jqueryslidemenu ul li ul li {
    display: list-item;
    float: none;
    margin: 0;
}
/*All subsequent sub menu levels vertical offset after 1st level sub menu */
.jqueryslidemenu ul li ul li ul {
    top: 0;
    border: 1px solid #ccc;
    padding: 2px 0;
    z-index: 202;
}
/* Sub level menu links style */
.jqueryslidemenu ul li ul li a {
    width: 200px;
    padding: 5px 15px 7px;
    margin: 0;
}
.jqueryslidemenu ul ul li a, .jqueryslidemenu ul ul li a:link, .jqueryslidemenu ul ul li a:visited {
    height: 100%;
    line-height: 20px;
}
.jqueryslidemenu ul li ul li a:hover, .jqueryslidemenu ul ul li a:hover {
    padding: 5px 15px 7px;
    border-left:0;
    border-right:0;
}
.jqueryslidemenu ul ul ul{
    margin-top:-5px;
}
.jqueryslidemenu ul li ul{
    -webkit-box-shadow: 1px 2px 3px #333;
    -moz-box-shadow: 1px 2px 3px #333;
    box-shadow: 1px 2px 3px #333;
}
/* ======================================================= */
/*                         Feature                         */
/* ======================================================= */
#feature {
    background:url("images/feature_bg.png") no-repeat scroll 50% 0 transparent;
}
#feature .inner {
    padding: 15px 0 15px;
}
#feature h1 {
    font-size:3.5em;
    margin-bottom: 0;
    padding: 5px 0;
}
#introduce {
    font-size:1.8em;
    line-height:1.3em;
    font-weight:200;
    letter-spacing:1px;
    padding:5px 0;
    overflow: hidden;
}
#feature .top_shadow {
    background:url("images/feature_t_shadow.png") repeat-x scroll 0 0 transparent;
    height: 10px;
    font-size:0px;
    overflow:hidden;
    line-height: 10px;
}
#feature .bottom_shadow {
    background:url("images/feature_b_shadow.png") repeat-x scroll 0 0 transparent;
    height: 9px;
    font-size:0px;
    line-height:9px;
}
/* ======================================================= */
/*                         Content                         */
/* ======================================================= */

/* Breadcrumbs
---------------------------------------------------------- */
div.filariadna {
    position:relative;
    float:left;
    margin:0 20px 0 120px;
    padding:40px 0 8px;
    font-size:14px;
}

/* ======================================================= */
/*                         Footer                          */
/* ======================================================= */
/* Footer Body
---------------------------------------------------------- */
#footer {

}
#footer .inner{
    padding:30px 0 40px;
    overflow:hidden;
}
#footer_shadow {

    height: 10px;
    font-size:0px;
    overflow:hidden;
    line-height: 10px;
}
/* Sub Footer
---------------------------------------------------------- */
#footer_bottom {
    letter-spacing:1px;
}
#footer_bottom .inner {
    padding:12px 0;
}
#copyright {
    /*
    float: left;
    */
    font-size:13px;
    line-height:1.5em;
}
#footer_menu {
    float: right;
    text-align:right;
}
#footer_menu a {
    padding:0 5px;
}
#footer_menu li, #footer_menu ul {
    display:inline;
    font-weight:normal;
    text-transform:uppercase;
}
#footer_right_area {
    position: absolute;
    right:0px;
}

/* ======================================================= */
/*                          Video                          */
/* ======================================================= */
.video_frame {line-height:100%;}
.video-js-box { text-align: left; position: relative; line-height: 0 !important; margin: 0; padding: 0 !important; border: none !important;  }

/* Video Element */
video.video-js { background-color: #000; position: relative; padding: 0; }

.vjs-flash-fallback { display: block; }

/* Poster Overlay Style */
.video-js-box img.vjs-poster { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; padding: 0; cursor: pointer; }
/* Subtiles Style */
.video-js-box .vjs-subtitles { color: #fff; font-size: 20px; text-align: center; position: absolute; bottom: 40px; left: 0; right: 0; }

/* Fullscreen styles for main elements */
.video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1000; }
.video-js-box.vjs-fullscreen video.video-js,
.video-js-box.vjs-fullscreen .vjs-flash-fallback { position: relative; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; }
.video-js-box.vjs-fullscreen img.vjs-poster { z-index: 1001; }
.video-js-box.vjs-fullscreen .vjs-spinner { z-index: 1001; }
.video-js-box.vjs-fullscreen .vjs-controls { z-index: 1003; }
.video-js-box.vjs-fullscreen .vjs-big-play-button { z-index: 1004; }
.video-js-box.vjs-fullscreen .vjs-subtitles { z-index: 1004; }

/* Styles Loaded Check */
.vjs-styles-check { height: 5px; position: absolute; }
/* Controls Below Video */
.video-js-box.vjs-controls-below .vjs-controls { position: relative; opacity: 1; background-color: #000; }
.video-js-box.vjs-controls-below .vjs-subtitles { bottom: 75px; } /* Account for height of controls below video */

/* DEFAULT SKIN (override in another file)
================================================================================
Using all CSS to draw the controls. Images could be used if desired.
Instead of editing this file, I recommend creating your own skin CSS file to be included after this file,
so you can upgrade to newer versions easier. */

/* Controls Layout
  Using absolute positioning to position controls */
.video-js-box .vjs-controls {
  position: absolute; margin: 0; opacity: 0.85; color: #fff;
  display: none; /* Start hidden */
  left: 0; right: 0; /* 100% width of video-js-box */
  width: 100%;
  bottom: 0px; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */
  height: 35px; /* Including any margin you want above or below control items */
  padding: 0; /* Controls are absolutely position, so no padding necessary */
}

.video-js-box .vjs-controls > div { /* Direct div children of control bar */
    position: absolute; /* Use top, bottom, left, and right to specifically position the control. */
    text-align: center; margin: 0; padding: 0;
    height: 25px; /* Default height of individual controls */
    top: 5px; /* Top margin to put space between video and controls when controls are below */

    background-color: #0B151A;
    background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 12px;
    background: #1F3744 -moz-linear-gradient(top, #0B151A, #1F3744) left 12px;

    /* CSS Curved Corners */
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;

    /* CSS Shadows */
    box-shadow: 1px 1px 2px #000; -webkit-box-shadow: 1px 1px 2px #000; -moz-box-shadow: 1px 1px 2px #000;
}

/* Placement of Control Items
   - Left side of pogress bar, use left & width
   - Rigth side of progress bar, use right & width
   - Expand with the video (like progress bar) use left & right */
.vjs-controls > div.vjs-play-control       { left: 5px;   width: 25px;  }
.vjs-controls > div.vjs-progress-control   { left: 35px;  right: 165px; } /* Using left & right so it expands with the width of the video */
.vjs-controls > div.vjs-time-control       { width: 75px; right: 90px;  } /* Time control and progress bar are combined to look like one */
.vjs-controls > div.vjs-volume-control     { width: 50px; right: 35px;  }
.vjs-controls > div.vjs-fullscreen-control { width: 25px; right: 5px;   }

/* Removing curved corners on progress control and time control to join them. */
.vjs-controls > div.vjs-progress-control {
    border-top-right-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0;
    border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0;
}
.vjs-controls > div.vjs-time-control {
    border-top-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0;
    border-bottom-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0;
}

/* Play/Pause
-------------------------------------------------------------------------------- */
.vjs-play-control { cursor: pointer !important; }
/* Play Icon */
.vjs-play-control span { display: block; font-size: 0; line-height: 0; }
.vjs-paused .vjs-play-control span {
    width: 0; height: 0; margin: 8px 0 0 8px;
    /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */
    border-left: 10px solid #fff; /* Width & Color of play icon */
    /* Height of play icon is total top & bottom border widths. Color is transparent. */
    border-top: 5px solid rgba(0,0,0,0); border-bottom: 5px solid rgba(0,0,0,0);
}
.vjs-playing .vjs-play-control span {
    width: 3px; height: 10px; margin: 8px auto 0;
    /* Drawing the pause bars with borders */
    border-top: 0px; border-left: 3px solid #fff; border-bottom: 0px; border-right: 3px solid #fff;
}

/* Progress
-------------------------------------------------------------------------------- */
.vjs-progress-holder { /* Box containing play and load progresses */
    position: relative; padding: 0; overflow:hidden; cursor: pointer !important;
    height: 9px; border: 1px solid #777;
    margin: 7px 1px 0 5px; /* Placement within the progress control item */
    border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.vjs-progress-holder div { /* Progress Bars */
  position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0;
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
}
.vjs-play-progress {
    background: #fff;
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#777));
    background: -moz-linear-gradient(top,   #fff,   #777);
}
.vjs-load-progress {
    opacity: 0.8;
    background-color: #555;
    background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#aaa));
    background: -moz-linear-gradient(top,   #555,   #aaa);
}

/* Time Display
-------------------------------------------------------------------------------- */
.vjs-controls .vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; }
.vjs-controls .vjs-time-control span { line-height: 25px; /* Centering vertically */ }

/* Volume
-------------------------------------------------------------------------------- */
.vjs-volume-control { cursor: pointer !important; }
.vjs-volume-control div { display: block; margin: 0 5px 0 5px; padding: 4px 0 0 0; }
/* Drawing the volume icon using 6 span elements */
.vjs-volume-control div span { /* Individual volume bars */
    float: left; padding: 0;
    margin: 0 2px 0 0; /* Space between */
    width: 5px; height: 0px; /* Total height is height + bottom border */
    border-bottom: 18px solid #555; /* Default (off) color and height of visible portion */
}
.vjs-volume-control div span.vjs-volume-level-on { border-color: #fff; /* Volume on bar color */ }
/* Creating differnt bar heights through height (transparent) and bottom border (visible). */
.vjs-volume-control div span:nth-child(1) { border-bottom-width: 2px; height: 16px; }
.vjs-volume-control div span:nth-child(2) { border-bottom-width: 4px; height: 14px; }
.vjs-volume-control div span:nth-child(3) { border-bottom-width: 7px; height: 11px; }
.vjs-volume-control div span:nth-child(4) { border-bottom-width: 10px; height: 8px; }
.vjs-volume-control div span:nth-child(5) { border-bottom-width: 14px; height: 4px; }
.vjs-volume-control div span:nth-child(6) { margin-right: 0; }

/* Fullscreen
-------------------------------------------------------------------------------- */
.vjs-fullscreen-control { cursor: pointer !important; }
.vjs-fullscreen-control div {
    padding: 0; text-align: left; vertical-align: top; cursor: pointer !important;
    margin: 5px 0 0 5px; /* Placement within the fullscreen control item */
    width: 20px; height: 20px;
}
/* Drawing the fullscreen icon using 4 span elements */
.vjs-fullscreen-control div span { float: left; margin: 0; padding: 0; font-size: 0; line-height: 0; width: 0; text-align: left; vertical-align: top; }
.vjs-fullscreen-control div span:nth-child(1) { /* Top-left triangle */
    margin-right: 3px; /* Space between top-left and top-right */
    margin-bottom: 3px; /* Space between top-left and bottom-left */
    border-top: 6px solid #fff; /* Height and color */
    border-right: 6px solid rgba(0,0,0,0);  /* Width */
}
.vjs-fullscreen-control div span:nth-child(2) { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen-control div span:nth-child(3) { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen-control div span:nth-child(4) { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
/* Icon when video is in fullscreen mode */
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); }
.vjs-fullscreen .vjs-fullscreen-control div span:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); }

/* Download Links - Used for browsers that don't support any video.
-------------------------------------------------------------------------------- */
.vjs-no-video { margin-top:10px; font-size: small; }

/* Big Play Button (at start)
---------------------------------------------------------*/
div.vjs-big-play-button {
    display: none;
    position: absolute; top: 50%; left: 50%; width: 76px; height: 70px; margin: -35px 0 0 -38px; z-index: 102; text-align: center; vertical-align: center; cursor: pointer !important;
    border: 1px solid #ccc; opacity: 0.8;

    background-color: #0B151A;
    background: rgba(50,50,50,0.8);
}
div.vjs-big-play-button:hover {
    box-shadow: 0px 0px 80px #fff; -webkit-box-shadow: 0px 0px 80px #fff; -moz-box-shadow: 0px 0px 80px #fff;
}

div.vjs-big-play-button span {
    display: block; font-size: 0; line-height: 0;
    width: 0; height: 0;margin: 16px 0 0 21px;
    border-left: 40px solid #fff;
    border-top: 20px solid rgba(0,0,0,0); border-bottom: 20px solid rgba(0,0,0,0);
}

/* Spinner Styles
---------------------------------------------------------*/
/* CSS Spinners by Kilian Valkhof - http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/ */
.vjs-spinner { display: none; position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; z-index: 1; margin: -50px 0 0 -50px;
  /* Scaling makes the circles look smoother. */
  transform: scale(0.5); -webkit-transform:scale(0.5); -moz-transform:scale(0.5);
}
/* Spinner circles */
.vjs-spinner div { position:absolute; left: 40px; top: 40px; width: 20px; height: 20px; background: #fff;
  border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px;
  border: 1px solid #ccc; /* Added border so can be visible on white backgrounds */
}
/* Each circle */
.vjs-spinner div:nth-child(1) { opacity: 0.12; transform: rotate(000deg) translate(0, -40px) scale(0.1); -webkit-transform: rotate(000deg) translate(0, -40px) scale(0.1); -moz-transform: rotate(000deg) translate(0, -40px) scale(0.1); }
.vjs-spinner div:nth-child(2) { opacity: 0.25; transform: rotate(045deg) translate(0, -40px) scale(0.2); -webkit-transform: rotate(045deg) translate(0, -40px) scale(0.2); -moz-transform: rotate(045deg) translate(0, -40px) scale(0.2); }
.vjs-spinner div:nth-child(3) { opacity: 0.37; transform: rotate(090deg) translate(0, -40px) scale(0.4); -webkit-transform: rotate(090deg) translate(0, -40px) scale(0.4); -moz-transform: rotate(090deg) translate(0, -40px) scale(0.4); }
.vjs-spinner div:nth-child(4) { opacity: 0.50; transform: rotate(135deg) translate(0, -40px) scale(0.6); -webkit-transform: rotate(135deg) translate(0, -40px) scale(0.6); -moz-transform: rotate(135deg) translate(0, -40px) scale(0.6); }
.vjs-spinner div:nth-child(5) { opacity: 0.62; transform: rotate(180deg) translate(0, -40px) scale(0.8); -webkit-transform: rotate(180deg) translate(0, -40px) scale(0.8); -moz-transform: rotate(180deg) translate(0, -40px) scale(0.8); }
.vjs-spinner div:nth-child(6) { opacity: 0.75; transform: rotate(225deg) translate(0, -40px) scale(1.0); -webkit-transform: rotate(225deg) translate(0, -40px) scale(1.0); -moz-transform: rotate(225deg) translate(0, -40px) scale(1.0); }
.vjs-spinner div:nth-child(7) { opacity: 0.87; transform: rotate(270deg) translate(0, -40px) scale(1.1); -webkit-transform: rotate(270deg) translate(0, -40px) scale(1.1); -moz-transform: rotate(270deg) translate(0, -40px) scale(1.1); }
.vjs-spinner div:nth-child(8) { opacity: 1.00; transform: rotate(315deg) translate(0, -40px) scale(1.3); -webkit-transform: rotate(315deg) translate(0, -40px) scale(1.3); -moz-transform: rotate(315deg) translate(0, -40px) scale(1.3); }


/* ======================================================= */
/*                     Enhance Styles                      */
/* ======================================================= */
pre,code,.wp-caption,.tabs_container .panes,ul.mini_tabs li,.accordion,.table_style,.framed_box_content,.gravatar,.widget_posts_list .thumbnail {
    -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1); /* FF3.5+ */
    -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1); /* Saf3.0+, Chrome */
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.1); /* Opera 10.5, IE 9.0 */
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}
