/*! normalize.css v1.1.0 | MIT License | git.io/normalize */
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0;text-decoration:none}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_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:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}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-cancel-button,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}table{border-collapse:collapse;border-spacing:0}

html,button,input,select,textarea {color: #222;}body{font-size: 1em;line-height: 1.4;}::-moz-selection {background: #b3d4fc;text-shadow: none;}::selection{background: #b3d4fc;text-shadow: none;}hr{display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}img{vertical-align: middle;}fieldset{border: 0;margin: 0;padding: 0;}textarea {resize: vertical;}.clear {clear: both;}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

@font-face {
    font-family: 'OpenSans';
    src: url('../fonts/OpenSans-Regular-webfont.eot');
    src: url('../fonts/OpenSans-Regular-webfont.eot#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../images/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'OpenSans';
    src: url('../fonts/OpenSans-Italic-webfont.eot');
    src: url('../fonts/OpenSans-Italic-webfont.eot#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
         url('../images/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'OpenSans';
    src: url('../fonts/OpenSans-Bold-webfont.eot');
    src: url('../fonts/OpenSans-Bold-webfont.eot#iefix') format('embedded-opentype'),
         url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
         url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
         url('../images/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'DanielBlack';
    src: url('../fonts/danielbk-webfont.eot');
    src: url('../fonts/danielbk-webfont.eot#iefix') format('embedded-opentype'),
         url('../fonts/danielbk-webfont.woff') format('woff'),
         url('../fonts/danielbk-webfont.ttf') format('truetype'),
         url('../images/danielbk-webfont.svg#daniel_blackregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

html {background-color: #e9f5ff;}

body {
    margin: 8px auto 40px auto;
    max-width: 1142px;
    padding: 0 1.5%;
    font-family: 'OpenSans', Helvetica, Arial, sans-serif;
    color: #2e2e2e;
}

a, a:visited {color: #167D81; font-size: 0.95em;}

p { font-size: 0.95em; }

header div {float: left; width: 43%; display: inline;}

header h1 {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 2.5em;
    color: #232323;
    margin: 30px 0 0 1.2%;
    line-height: .65em;
    display: inline;
    float: left;
}

header h1 span {
    font-family: 'OpenSans', Helvetica, Arial, sans-serif;
    font-size: .395em;
    color: #5e5e5e;
}

header img {float: left; width: 135px;}

header nav {
    float: right;
    border-top: 1px solid #c5c5c5;
    margin-top: 66px;
    padding-top: 12px;
}

header nav a, nav a:visited {
    padding: 0px 14px;
    border-right: 1px solid #cfd2d4;
    text-decoration: none;
    color: #0e0f1d;
}

header nav a:last-of-type {border: none; padding-right: 3px;}

header nav a:hover {
    text-decoration: underline;
    color: #c03431;
}



.main {
    padding: 40px 4.3%;
    margin-top: -22px;
    border: 1px solid #d8d8d8;
    background-color: #fefefe;
}

#home p:first-of-type {font-size: 0.9em; line-height: 1.5em;}

#words {
    float: left;
    width: 38%;
}

ul {margin: 0 0 30px 0; padding: 0; list-style-type: none;}
ul li {
    margin: 5px 0;
    font-size: 0.9em;
}

ul li:before {
   content: "•";
   font-size: 100%; /* or whatever */
   padding-right: 6px;
}

a.downloadbtn, a.downloadbtn:visited {
    display: block;
    width: 285px;
    padding: 15px 5px;
    border-radius: 6px;
    margin: auto;

    text-align: center;
    text-decoration: none;
    color: #ffffff;
    font-size: 1.1em;
    line-height: .8em;

    background-color: #b82c28;
    background-image: -o-linear-gradient(top, rgb(193,54,49) 58%, rgb(170,30,27) 97%);
    background-image: -moz-linear-gradient(top, rgb(193,54,49) 58%, rgb(170,30,27) 97%);
    background-image: -webkit-linear-gradient(top, rgb(193,54,49) 58%, rgb(170,30,27) 97%);
    background-image: -ms-linear-gradient(top, rgb(193,54,49) 58%, rgb(170,30,27) 97%);
    background-image: linear-gradient(top, rgb(193,54,49) 58%, rgb(170,30,27) 97%);

    -webkit-box-shadow:  0px 1px 2px 0px rgba(0, 0, 0, .7);
    box-shadow:  0px 1px 2px 0px rgba(0, 0, 0, .7);
}

a.downloadbtn:hover {
    background-image: -o-linear-gradient(top, rgb(214,42,36) 58%, rgb(182,28,24) 97%);
    background-image: -moz-linear-gradient(top, rgb(214,42,36) 58%, rgb(182,28,24) 97%);
    background-image: -webkit-linear-gradient(top, rgb(214,42,36) 58%, rgb(182,28,24) 97%);
    background-image: -ms-linear-gradient(top, rgb(214,42,36) 58%, rgb(182,28,24) 97%);
    background-image: linear-gradient(top, rgb(214,42,36) 58%, rgb(182,28,24) 97%);    
}

a.downloadbtn:active {
    -webkit-box-shadow: inset 0px 2px 2px 1px rgba(0, 0, 0, .6);
    box-shadow: inset 0px 2px 2px 1px rgba(0, 0, 0, .6);
}

.downloadbtn span {font-size: .68em;}

.free {
    margin-top: 30px;
    text-align: center;
    font-family: 'DanielBlack', Helvetica, sans-serif;
    color: #5463ee;
    font-size: 1.31em;
}

.centered-link {
  text-align: center;
}

#sectionholder {
    float: left;
    margin: 15px 0 0 4.1%;
    width: 57.3%;
    height: 410px;
    position: relative;
}

#slideshow {position: relative;}

#slideshow img {
    width: 100%;
    display: block;
    display: none;
    position: absolute; top: 0; left: 0;
}

#slideshow img:first-of-type {display: block;}

#carouselNav {
    width: 70px;
    margin: auto;
    z-index: 100;
    position: absolute;
    bottom: -12px;
    left: 45%;
}

.bullet {
    display: inline-block;
    margin: 0 5px;
    width: 9px; height: 9px;
    text-indent: -999em;
    cursor: pointer;
    background-color: #fefefe;
    border: 1px solid #989898;
    border-radius: 8px;
}

.bullet.active, .bullet:hover {background-color: #4c5c69; border: 1px solid #4c5c69;}


footer {
    margin-top: 20px;
    color: #4e4e4e;
}

footer a {
    color: #4e4e4e;
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
    color: #c03431;
}

footer span {
    float: right;
}

.main h1 {
    text-align: center;
    margin: 0 0 10px 0;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 1.8em;
    color: #232323;
}

.main h2 {
    text-align: center;
    margin: 0;
    font-size: 1.10em;
    color: #5e5e5e;
}

.featuretxt {
    float: left;
    width: 46%;
    padding: 0px; 6% 0 0;
    margin-top: 30px;
    font-size: 0.9em;
}

.featuretxt:nth-of-type(even) {
    padding: 0px 0 0 6%;
}

.featureimg {
    float: left;
    width: 46%;
    margin-top: 30px;
}

.featureimg img {width: 100%;}

h3 {margin: 0; font-size: 1.4em;}

.newspost {
    padding: 20px 0;
    margin-bottom: 10px;
    border-bottom: 1px solid #d8d8d8;
}

.newspost:last-of-type {border: none;}

.navigation {font-weight: bold; color: #c71d1a; margin-top: 15px;}
.navigation a {color: #c71d1a; text-decoration: none;}
.navigation a:hover {text-decoration: underline;}

.opsys {
    float: left;
    width: 30%;
    padding: 10px 0 15px 3%;
    min-height: 120px;    
}

.opsys h4 {
    margin: 0 0 0 -5px; padding: 15px 0 5px 0;
    font-size: 1.12em;
    position: relative;
}

.opsys h4:before {
    width: 32px; height: 32px;
    position: absolute;
    top: 13px;
    left: -40px;
}

.opsys:nth-of-type(1) h4:before {content: url('../images/apple.png');}
.opsys:nth-of-type(2) h4:before {content: url('../images/windows.png');}
.opsys:nth-of-type(3) h4:before {content: url('../images/flatpak.png');}
.opsys:nth-of-type(4) h4:before {content: url('../images/tarball.png');}


/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 1104px) {
    body {font-size: 15px; padding: 0 1%;}

    header div {float: none; width: auto; display: block; margin: auto;}

    header h1 {margin: 50px 0 0 1%;}

    header nav {
        float: none;
        text-align: center;
        display: block;
        margin: auto;
        border: none;
    }
    
    .main {margin-top: 20px; padding: 10px 2%;}
    
    #words {width: 43%;}
    #sectionholder {width: 52.6%; max-height: 360px;}
    
    #carouselNav {display: none;}
    
    .featureimg img {max-height: 371px;}
    
    .opsys {width: 43%; padding: 10px 0 15px 7%;}
}

@media only screen and (max-width: 750px) {
    body {font-size: 14px; padding: 0;}
    
    header div {margin-bottom: 10px;}
    
    header, footer {padding: 0 1.5%;}

    .main {padding: 10px 1.6%;}

    #words {float: none; width: 100%;}    
    #sectionholder {display: none;}
    
    .featureimg {float: none; display: none;}
    .featuretxt {float: none; width: 100%; padding: 0;}
    .featuretxt:nth-of-type(even) {padding: 0;}

}

@media only screen and (max-width: 570px) {
    header img {width: 85px;}
    header h1 {font-size: 2.3em; margin-top: 25px;}
    header nav {line-height: 1.6em;}
    
    footer {padding: 0 1%; margin-top: 10px; text-align: center; font-size: .88em;}
    footer span {float: none; display: block; margin-top: 15px;}
    
    .opsys {width: 85%; padding: 10px 0 15px 15%;}

}


@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

}

/* ==========================================================================
   HandBrake Page Specific CSS
   ========================================================================== */
iframe {
    width:0;
    height:0;
    border:0; 
    border:none;
}    

.article {
    margin: 0 0 2.770em 0;
    padding-bottom: 1.385em;
    font-size: 0.9em;
}

.article div, #main .article p {
    margin: 1.385em 0;
}

.article ul, #main .article ol, #main .article blockquote {
    margin: 1.385em 1.385em;
}

.hash-cell {
  font-size: 0.75em;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}


/* ==========================================================================
   Report
   ========================================================================== */



input[type="text"], textarea {
    display: block;
    background: none;
    font: inherit;
    padding: 0 7px;
    position: relative;
    z-index: 10;
    overflow: auto; /* removes scrollbar from textarea in IE - trick from HTML5 boilerplate*/
}

label, input[type="text"], #singleParagraphInputs div{
    /* these two values must be the same */
    line-height: 1.5em;
    height: 1.5em;
}

#singleParagraphInputs div, #commentTxt, #recaptcha_widget_div{
    margin-bottom: 1.5em;
}

input, textarea, #recaptcha_table{
    border: 1px solid #ccc;
}

.formError {
    border: 1px solid red;
}

#contactForm, #recaptcha_table{
    width: 600px;
    margin: 10px auto;
    margin-top: 50px;
}

#singleParagraphInputs div, #commentTxt {
    position: relative;
}

#singleParagraphInputs input {
    width: 584px; 
}

#commentTxt textarea {
    min-height: 9em;
    min-width: 584px; 
}

#screenReader, #checking {
    float: left;
    display: none;
}

#randomblock {
    float: left;
    display: none;
}

#recaptcha_response_field {
    width: 286px !important; 
}

/* ==========================================================================
   Alert Boxes
   ========================================================================== */

.alert-box {
    color:#555;
    border-radius:10px;
    padding:10px 5px 10px 36px;
    margin:10px;
}

.alert-box span {
    font-weight:bold;
    text-transform:uppercase;
}

.error {
    background:#ffecec url('../images/error.png') no-repeat 10px 50%;
    border:1px solid #f5aca6;
}
.success {
    background:#e9ffd9 url('../images/success.png') no-repeat 10px 50%;
    border:1px solid #a6ca8a;
}
.warning {
    background:#fff8c4 url('../images/warning.png') no-repeat 10px 12%;
    border:1px solid #f2c779;
}
.notice {
    background:#e3f7fc url('../images/notice.png') no-repeat 10px 50%;
    border:1px solid #8ed9f6;
}



/* ==========================================================================
   Simple CSS table
   ========================================================================== */



.rTable { display: table; width: 100%; } 
.rTableRow { display: table-row; } 
.rTableHeading { display: table-header-group; } 
.rTableBody { display: table-row-group; }
.rTableFoot { display: table-footer-group; } 
.rTableCell, .rTableHead { display: table-cell; }



/* ==========================================================================
   Privacy Styling
   ========================================================================== */
ul.padded
{
    margin:0;
    text-align: left; /*set to left, center, or right to align the tabs as desired*/
    padding-left:20px; /* Offset of the first tab */
    list-style-position: outside;
}

/* ==========================================================================
   Simple CSS Tabs
   ========================================================================== */

/* Tab Content - menucool.com */
ul.tabs
{
    padding: 7px 0;
    margin:0;
    font-size: 0;
    list-style-type: none;
    text-align: left; /*set to left, center, or right to align the tabs as desired*/
    padding-left:20px; /* Offset of the first tab */
}
        
ul.tabs li
{
    display: inline;
    margin: 0;/*no distance between tabs*/
    background: White;
    margin-left: -4px;
}
        
ul.tabs li a
{
    font-family: 'OpenSans', Helvetica, Arial, sans-serif;
    font-size: 12px;
    text-decoration: none;
    position: relative;
    padding: 7px 22px;
    color: #000;
    outline:none;
    background: #F6F6F9;
    border:1px solid #CCC;
    border-right:0;
}

/*Note: IE8 and earlier doesn't support li:last-child. You have to add another class to the last tab (LI) and specify its border-right as below.*/
ul.tabs li:last-child a
{
    border-right:1px solid #CCC;
}
  
        
ul.tabs li a:hover
{
    color: #000;
    background: white;
}
        
ul.tabs li.selected a, ul.tabs li.selected a:hover
{
    top: 0px;
    font-weight:normal;
    background: #FFF;
    border-bottom: 1px solid #FFF;
    color: #000;
}
        
        
ul.tabs li.selected a:hover
{
    text-decoration: none;
}

div.tabcontents
{
    border-top: 1px solid #CCC; padding: 30px 10px;
}