SickGear/gui/slick/css/default.less

// Config 
@import "config.less";

* { outline: 0;margin:0; }
*:focus { outline: none; }
img { border: 0; vertical-align: middle;}
html { margin:0; padding:0}
body {
text-rendering: optimizeLegibility;
background: none repeat scroll 0 0 #FFFFFF;
    color: #343434;
    font-family: @base-font-face;
    margin: 0;
    overflow-y: scroll;
    padding: 0;
    font-size: 12px;
}

form {
border:none;
display:inline;
margin:0;
padding:0;
}
a {color: @link-color;}

/* these are for inc_top.tmpl */
#upgrade-notification{position: fixed;line-height:0.5em;color:#000;font-size:1em; height:0px;text-align:center;width:100%;z-index:100;margin:0;padding:0;}
#upgrade-notification div{.gradient(#FDF0D5,#fff9ee);border-bottom:1px solid #af986b;padding:7px 0;}
#header-fix{*margin-bottom: -31px; /* IE fix */height:21px;padding:0;} 

#header {
	.gradient(#555555, #333333);
    border-bottom: 1px solid #CACACA;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    height: 58px;
    position: fixed;
    width: 100%;
    z-index: 999;
}
#header .wrapper {
	margin: 0 auto;
	   position: relative;
	   width: 960px;
}
#header a:hover {
background:none;
}

#logo {
float: left;
    position: relative;
    top: 0px;
    left: -5px;
}

#versiontext {
color: #FFFFFF;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 11px;
  position: relative;
  text-transform: lowercase;
  top: 7px;
}

.navShows { margin-top:-25px; margin-bottom: 40px;}

.tvshowImg {
	background: url("../images/loading.gif") no-repeat scroll center center #FFFFFF;
	   border: 5px solid #FFFFFF;
	   .shadow(1px 1px 2px 0 #555555);
	   float: left;
	   height: auto;
	   margin-bottom: 30px;
	   margin-right: 25px;
	   overflow: hidden;
	   text-indent: -3000px;
	   width: 175px;
	   img {
	   	float: left;
	   	    min-width: 100%;
	   	    position: relative;
	   }
}
/* --------------------------------------------- */

table {
margin:0;
	td a { 
		color: #555;
		&:hover { color: @text-color;}
	}
}

h1 {
text-align:left;
font-size:21px;
line-height:23px;
font-weight:400;
}
h1.title {
padding-bottom:4px;
margin-bottom:12px;
font-weight: bold;
font-family: @alt-font-face;
font-size: 38px;
}
h1.header {
padding-bottom:4px;
margin-bottom:12px;
font-size: 30px;
font-family: @alt-font-face;
font-weight: bold;
}
h1 a {
text-decoration:none;
}

h2 {
font-size:18px;
font-weight:700;
}

.h2footer {
margin: -33px 5px 6px 0px;
}
.h2footer select {
margin-top: -6px;
margin-bottom: -6px;
}

.separator {
font-size:90%;
color:#999;
}

div select {
font-size:10px;
border:1px solid #d4d0c8;
}

div select option {
line-height:1.4;
padding:0 10px;
border-bottom: 1px dotted #D7D7D7;
}

/* --------------- alignment ------------------- */
.float-left { float:left; }
.float-right { float:right; }
.align-left { text-align:left; }
.align-right { text-align:right; }
.nowrap { white-space: nowrap; }
/* --------------------------------------------- */

.footer {
clear:both;
width: 960px;
text-align:center;
padding-top: 5px;
padding-bottom: 5px;
margin: 20px auto;
border-top:1px solid #eee;
line-height: 1.4em;
font-size: 11px;
	a {
		color: @link-color;
		text-decoration: none;		
	}
	ul {
		li {
			list-style: none;
			float: left;
			margin-left: 10px;
			img { margin-right: 3px; position: relative; top: -2px;}
		}
	}
}

.sickbeardTable {
    width: 100%;
    margin-left:auto;
    margin-right:auto;
    text-align:left;
    color: #343434;
    background-color: #fff;
    border-spacing: 0;
}
.sickbeardTable th,
.sickbeardTable td {
    padding: 4px;
    border-top: #fff 1px solid;
    vertical-align: middle;
}
.sickbeardTable th:first-child,
.sickbeardTable td:first-child {
    border-left: none;
}
.sickbeardTable th{
    border-collapse: collapse;
    .gradient(#555555,#333333);
    color: #fff;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    text-align: left;
}
.sickbeardTable tfoot a {
    text-decoration: none;
    color: @swatch-green;
}
.sickbeardTable td {
	font-size: 12px;
	&.title { font-size: 14px; line-height: normal;}
	&.status_column{ line-height: normal;}
	small { font-size:11px; font-style: italic; line-height: normal;}
}
.row {
clear:left;
}

.plotInfo {
cursor:help;
font-weight: 700;
position: relative;
}

#actions {
	.selectAll { margin-right: 10px; border-right: 1px solid #eee; padding-right: 10px;}
	.clearAll {}
}
#tooltip {
display:none;
z-index:3343434;
border:1px solid #111;
background-color:#eee;
padding:5px;
margin-right:10px;
}

.progressbarText {
text-shadow: 0 0 0.1em #fff;
position:absolute;
top:0;
font-size: 9px;
width:100%;
height:100%;
overflow:visible;
text-align:center;
vertical-align: middle;
}
.ui-progressbar .ui-widget-header {
	.gradient(#A3E532, #90CC2A);
	.rounded(3px);
}
tr.seasonheader {
background-color: #FFFFFF;
   padding-bottom: 5px;
   padding-top: 10px;
   text-align: left;
   white-space: nowrap;
   td {
   	padding-top:  20px;
   	padding-bottom: 10px;
   }
}
tr.seasonheader h2 {
display:inline;
font-size:22px;
line-height:20px;
letter-spacing:1px;
margin:0;
color:#343434;
}
tr.seasonheader a {
text-decoration:none;
}
tr.seasonheader a:hover {
background-color: #fff;
color:#343434;
}


#checkboxControls label { white-space:nowrap; }
tr.unaired,span.unaired {
background-color:#F5F1E4;
padding:5px;
font-size: 13px;
color: #cec198;
font-weight: bold;
b { color:@text-color;}
.rounded(5px);
}

tr.skipped,span.skipped {
background-color:#E9F7FB;
color: #90D5EC;
font-weight: bold;
font-size: 13px;
padding:5px;
.rounded(5px);
b { color:@text-color;}
}

tr.good,span.good {
background-color:#E2FFD8;
color: #AAD450;
padding:5px;
font-size: 13px;
font-weight: bold;
.rounded(5px);
b { color:@text-color;}
}

tr.qual,span.qual {
background-color:#FDF0D5;
padding:5px;
font-size: 13px;
font-weight: bold;
color: #F7B42C;
.rounded(5px);
b { color:@text-color;}
}

tr.wanted,span.wanted {
background-color:#FDEBF3;
padding:5px;
font-size: 13px;
font-weight: bold;
color: #F49AC1;
.rounded(5px);
b { color:@text-color;}
}

tr.wanted,tr.qual,tr.good,tr.skipped,tr.unaired {
	font-size: 14px;
	font-weight: normal;
	color: @text-color;
}
.showInfo {
	width: 745px;
	float: right;
	padding-top: 10px;
}
div#summary {
background-color:#f9f9f9;
.rounded(10px);
padding:10px;
border:1px solid #ddd;
margin:10px 0;
	.infoTable {
		width: 85%;
	}
}
div#summary tr {
line-height: 17px;
	td { font-size: 14px; line-height: 25px;}
}

#MainMenu {
   float: right;
   height: 58px;
   margin: 0;
   padding: 0 0 0 10px;
}
#SubMenu {
	float: right;
    margin-top: -30px;
    position: relative;
    z-index: 99;
}

#SubMenu a {
    font-size: 12px;
    text-decoration: none;
}
#SubMenu span b { margin-left: 20px;}
#donate {
line-height:1em;
background: #57442B;
float: right;
display: none;
}
#donate a,#donate a:hover {
background-color:#57442B;
border:0;
padding:4px 15px 0px;
}
#contentWrapper {
	background: none;
}
#content {
   line-height: 24px;
       margin: 0 auto;
       padding: 105px 0 0;
       width: 960px;
}
.showLegend{
font-weight:700;
padding-right:10px;
padding-bottom:1px;
}

/* for the add new/existing show */
.alt { background-color: #efefef; }
#tabs div.field-pair, .stepDiv div.field-pair{padding:0.75em 0;}
#tabs div.field-pair input, .stepDiv div.field-pair input{float:left;}
#tabs label.nocheck,   #tabs div.providerDiv,  #tabs  div #customQuality, .stepDiv label.nocheck,.stepDiv div.providerDiv,.stepDiv div #customQuality{padding-left:23px;}
#tabs  label span.component-title, .stepDiv label span.component-title{font-size:1.1em;font-weight:700;float:left;width:165px; padding-left: 6px; margin-right:10px;}
#tabs label span.component-desc, .stepDiv label span.component-desc{font-size:.9em; float:left;}
#tabs div.field-pair select, .stepDiv div.field-pair select{font-size:1em;border:1px solid #d4d0c8;}
#tabs div.field-pair select option, .stepDiv div.field-pair select option{line-height:1.4;padding:0 10px; border-bottom: 1px dotted #D7D7D7;}

ul#rootDirStaticList { width: 90%; text-align: left; margin-left: auto; margin-right: auto; padding-left: 0; }
ul#rootDirStaticList li{ list-style: none outside none; margin: 2px; padding: 4px 5px 4px 5px; cursor: pointer; }

#displayText {
background-color:#efefef;
padding:8px;
border:1px solid #DFDEDE;
font-size:1.1em;
overflow: hidden;
}

div#addShowPortal {
margin: 50px auto;
   width: 100%;
}

div#addShowPortal  button { float: left;
  margin-left: 20px;
  padding: 10px;
  width: 47%;}
div#addShowPortal  button div.button img{ position: absolute; display: block; top: 35%; padding-left: 0.4em; text-align: center; }
div#addShowPortal  button .buttontext { position: relative; display: block; padding: 0.1em 0.4em 0.1em 4.4em; text-align: left; }

#rootDirs, #rootDirsControls { width: 50%; min-width: 400px; }

td.tvShow a {text-decoration: none; font-size:16px; }
.navShow { display: inline; cursor: pointer; vertical-align: top; position:relative;top:0px; .opacity(50);
	&:hover { .opacity(100);}
}

/* for manage_massEdit */
.optionWrapper { width: 450px; margin-left: auto; margin-right: auto; padding: 6px 12px; }
.optionWrapper span.selectTitle { float: left; font-weight: 700; font-size: 1.2em; text-align: left; width: 225px; }
.optionWrapper div.selectChoices { float: left; width: 175px; margin-left: 25px; }
.optionWrapper br { clear: both; }

a.whitelink { color: white; }

/* for displayShow notice */
#show_message {
    border: 1px solid @border-color;
    .gradient(#FDF0D5,#fff9ee);
    .rounded(7px);
    font-size: 14px;
    right: 10px;
    .shadow(0px 0px 2px #aaa);
    padding: 7px 10px;
    position: fixed;
    text-align: center;
    bottom: 10px;
    min-height: 22px;
    width: 250px;
    z-index: 9999;
    font-family: @alt-font-face;
    line-height: normal;
    .opacity(80);
    .msg {
        font-family: @alt-font-face;
        line-height: normal;
        padding-left: 20px;
    }
    .loader {
    	position: relative;
    	top: 2px;
    }
    &.success {
        .gradient(@msg-bg-success,#C2EDC6);
        padding: 15px 10px;
        text-align: left;
    }
    &.error {
         .gradient(@msg-bg-error,#EDC4C4);
        padding:15px 10px;
        text-align: left;
    }
    .ui-icon {
        display: inline-block;
        margin-left: -20px;
        top: 2px;
        position: relative;
        margin-right: 3px;
    }
}
div.ui-pnotify { min-width: 340px; max-width: 550px; width: auto !important;}

/* override for qtip2 */
.ui-tooltip-sb .ui-tooltip-titlebar a { color: #222222; text-decoration: none; }
.ui-tooltip, .qtip { max-width: 500px !important; }

option.flag {
  padding-left: 35px; 
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: 10px 50%; 
}

span.quality {
    font: bold 1em/1.2em verdana, sans-serif;
    background: none repeat scroll 0 0 #999999;
    color: #FFFFFF;
    display: inline-block;
    padding: 2px 4px;
    text-align: center;
    -webkit-border-radius: 4px;
    font-size:12px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
span.Custom {
    background: none repeat scroll 0 0 #444499; /* blue */
}
span.HD,span.WEB-DL,span.BluRay {
    background: none repeat scroll 0 0 #449944; /* green */
}
span.SD {
    background: none repeat scroll 0 0 #994444; /* red */
}
span.Any {
    background: none repeat scroll 0 0 #444444; /* black */
}

span.false {
    color: #993333; /* red */
}
span.true {
    color: #669966; /* green */
}
.ui-progressbar {
	height: 15px !important;
	line-height: 17px;
}