/* 
    Document   : admin
    Created on : Jun 9, 2012, 4:50:46 PM
    Author     : Rajesh
    Description:
        Purpose of the stylesheet follows.
*/
/*
Icons*/
.ti-icon{
    font-family:'TwistItIconsRegular',sans-serif;
    font-size: 25px;
    line-height: 25px;
    color:#666666;
    text-decoration: none;
}
.ti-icon-il{
    float: left;
}
.sp-admin-link{
    float: left;
}
.sp-admin-link .ti-icon{
    line-height: 16px;
    font-size: 16px;
    font-weight: normal;
    margin-top: -2px;
}
.sp-ls-sliders div.ls-slider-area,
.sp-ls-slides div.ls-slide-area{
    margin: 0px auto;
    min-height: 250px;
}
.sp-ls-sliders,
.sp-ls-slides{
    width: 100%;
    margin: 0px auto;
}
.sp-ls-no-obj{
    padding-top: 75px;
    font-size: 25px;
    color: #ccc;
    text-align: center;
    font-style: italic;
}
#ls-sliders h3,
#ls-slides h3{
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
}
.sp-ls-slider{
    width:40%;
    font-size: 12px;
    color:#666;
    float: left;
    margin: 10px 10px 10px 0px;
    border: 1px solid #ddd;
}
#ls-slides{
    clear: both;
}
.sp-ls-slider-content{
    text-align: left;
    font-weight: normal;
    padding: 15px;
    color:#666;
    background: #f5f5f5;
    border-bottom: 1px  solid #ddd;
}
.sp-ls-slider-content em{
    font-weight: normal;
    font-size: 16px;
}
.sp-ls-slide-info{
    padding: 5px 15px;
}
.sp-ls-slide-info a{
    display: block;
    float: left;
    font-size: 12px;
    font-weight: bold;
    margin-right: 10px;
    color: #666;
}
.sp-ls-slide-count{
    color:#ccc;
    float: right;
    margin-top: 10px;
}
.sp-ls-slider-control{
    float:right;
}
.ls-admin-icon-bar{
    width: 200px;
    height: 45px;
    float: left;
}
.ti-title-icon{
    margin-right: 5px;
}
.ls-slide-info{
    display: block;
    margin-left: 300px;
    font-weight: bold;
}
#ls-slide-name{
    padding: 5px;
    margin-right: 25px;
    width: 220px;
    color: #666;
}
.ls-admin-icon-bar a,
.sp-admin-controls a{
    display: block;
    float: left;
    margin-left: 10px;
    cursor: pointer;
    color:#666;
}
.ls-admin-icon-bar a:hover,
.sp-admin-controls a:hover{
    color:#333;
}
.ls-admin-icon-bar #add-slider{
    background-image: url("../images/ls-slider-add_n.png");
}
.ls-slide-box{
    width:800px;
    clear: both;
    height: 400px;
    border: 1px solid #ddd;
    overflow: hidden;
    position: relative;
    background-image: url("../images/slide-bg.png");
}
.slide-item:hover{
    cursor:move;
}
.sp-ls-slide-img{
    position: absolute!important;
}
#sp-ls-topmenu{
    border-bottom: 1px solid #ddd;
}
#sp-ls-topmenu a{
    padding:5px 10px;
    font-size:16px;
    display: block;
    float: left;
    text-decoration: none;
    color:#464646;
    border: 1px solid #eee;
    margin-right:  5px;
    background: #f5f5f5;
}
#sp-ls-topmenu a.active{
    background: #fff;
}
.sp-ls-elem-img{
    max-width:100px;
    max-height:100px;
    display: block;
}
.sp-sc-text{
    display: block;
    font-weight: normal;
    margin-top: 10px;
}
/*form styling */
.sp-clear{
    display: block;
    clear: both;
}
.sp-admin-bg h3,.sp-admin-font h3{
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
.sp-form-row{
    clear: both;
}
.sp-form-row label{
    width: 180px;
    display: block;
    float: left;
    clear: left;
}
.sp-form-row .desc-icon{
    margin-left: 450px;
    cursor: pointer;
    display: block;
}
.sp-form-row .desc-icon span{
    margin-left: 15px;
}
.sp-form-row .sp-input,
.sp-form-row .bg-area{
    display: block;
    float: left;

}
input[type="text"].sp-input,
textarea.sp-input{
    width: 150px;
}
.sp-form-row .sp-input{
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border: 1px solid #ddd

}
.sp-form-row .bg-area{

}
.sp-img-preview{
    max-width: 100%;
    max-height: 100%;
    border-bottom: 10px;
}
.sp-form-row textarea{
    height: 75px;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border: 1px solid #ddd;
}
.sp-admin-font-preview{
    padding-top: 10px;
    border: 2px solid #ccc;
    font-size: 30px;
    line-height:35px;
    color: #888;
    overflow: hidden;
    display: block;
    padding-bottom: 10px;
    text-align: center;
    height: 100px;
}
.preview-abs{
    position: absolute;
    left: 50%;
    top:35px;
    width:400px;
}
#sp-ls-admin-form{
    padding: 10px;
}

.ls-slide-box-rows tr{
    cursor: move;
    background: #fff;
}
.sp-admin-area>form{
    padding-left: 15px;
    position: relative;
}
.sp-admin-area .admin-area{
    padding-left: 15px;
    padding-top: 10px;
}
.sp-hide{
    display: none;
}
.ti-logo{
    font-weight: bold;
    color: #369!important;
}
.wrap h2.sp-admin-title{
    border-bottom: 1px solid #ddd;
    font-family: 'Lobster13Regular',sans-serif;
    font-weight: normal;
    line-height: 40px;
    color: #369;
}
span.iframe-slide-title{
    font-weight: bold;
    font-size: 16px;

}
.ti-admin-icon{
    display: block;
    width: 40px;
    height: 40px;
    font-size: 30px;
    line-height: 30px;
    text-align: center;
    color:#369;
    border-right: 1px solid #ddd;
    margin-right: 5px;
    float: left;
    font-family: 'TwistItIconsRegular',sans-serif;
}
.ti-icon-box .ti-icon,
.ti-preview-icon .ti-icon,
.ti-icon-float{
    float: left;
    margin-top: -7px;
    font-weight: normal;
}
.ti-icon-box{
    display: block;
    font-weight: bold;
    color: #666;
    text-decoration: none;
    line-height: 25px;
}
/*form styling */
.sp-clear{
    display: block;
    clear: both;
}
.sp-admin-bg h3,.sp-admin-font h3{
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
    padding-bottom: 10px;
}
.sp-form-row{
    clear: both;
}
.sp-form-row label{
    width: 180px;
    display: block;
    float: left;
    clear: left;
}
.sp-form-row .desc-icon{
    margin-left: 450px;
    cursor: pointer;
    display: block;
}
.sp-form-row .desc-icon span{
    margin-left: 15px;
}
.sp-form-row .sp-input,
.sp-form-row .bg-area{
    display: block;
    float: left;

}
input[type="text"].sp-input,
textarea.sp-input{
    width: 150px;
}
.sp-form-row .sp-input{
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border: 1px solid #ddd

}
.sp-form-row .bg-area{

}
.sp-img-preview{
    max-width: 100%;
    max-height: 100%;
    border-bottom: 10px;
}
.sp-form-row textarea{
    height: 75px;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border: 1px solid #ddd;
}
.sp-admin-font-preview{
    padding-top: 10px;
    border: 2px solid #ccc;
    font-size: 30px;
    line-height:35px;
    color: #888;
    overflow: hidden;
    display: block;
    padding-bottom: 10px;
    text-align: center;
    height: 100px;
}
.preview-abs{
    position: absolute;
    left: 50%;
    top:35px;
    width:400px;
}
#sp-ls-admin-form{
    padding: 10px;
}

.ls-slide-box-rows tr{
    cursor: move;
    background: #fff;
}
.sp-admin-bg{
    position: relative;
}
.sp-admin-font{
    position: relative;
}

.sp-bg-preview{
    min-height: 150px;
    border: 2px solid #ccc;
}
/*slider*/
.sp-range{
    width: 30px;
}
.sp-slider-box{
    display: block;
    width: 130px;
    float: left;
    padding-top: 10px;
    margin-right: 15px;
}
.sp-range-slider{
    background: url("../images/slider-bg.png") no-repeat!important;
    -moz-border-radius:0px!important;
    -webkit-border-radius:0px!important;
    -khtml-border-radius:0px!important;
    border-radius:0px!important;
    border: none!important;
    outline: none!important;
    display: block;
}
.sp-range-slider .ui-slider-handle{
    background: url("../images/slider-handle.png") no-repeat!important;
    border: none!important;
    outline: none!important;
    width: 1.5em!important;
    height: 1.5em!important;
    top: -0.5em!important;
}
/* radio input */
.radio-box{
    width:150px;
    float: left;
}
.radio-box span{
    margin-left: 10px;
}
/*font form */
.sp-font-form-title{
    border-bottom: 1px solid #ddd;
    margin-bottom: 0px;
    padding-bottom: 10px;
    font-weight: normal;
}
/*Font Page*/
.sp-font-preview{
    font-size: 30px;
    line-height:35px;
    color: #888;
    width: 500px;
    overflow: hidden;
    display: block;
    padding-bottom: 10px;
    text-align: left;
    height: 30px;
}
.sp-add-new-h2{
    font-family: sans-serif;
    margin-left: 4px;
    padding: 3px 8px;
    position: relative;
    top: -3px;
    text-decoration: none;
    font-size: 12px;
    border: 0 none;
    background: #f1f1f1
}
.sp-admin-link{
    padding: 5px 5px 5px 0px;
}
.sp-tb-center{
    text-align: center!important;
}
.button i{
    font-family: 'TwistItIconsRegular',sans-serif;
    font-style: normal;
    font-size: 20px;
    width:25px;
    display: block;
    float: left;
    margin-top: -2px;
}
.button,
#bbp_topic_submit{
    cursor: pointer;
    display: inline-block;
    text-decoration: none;
    font: bold 12px/12px HelveticaNeue, Arial;
    padding: 8px 11px;
    color: #555;
    border: 1px solid #dedede;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.button.blue,
#bbp_topic_submit{
    background: #336699;
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#4477cc', endColorstr='#336699'); /*  IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#4477cc), to(#336699)); /*  WebKit */
    background: -moz-linear-gradient(top,  #4477cc, #336699);
    border-color: #34679c #34679c #336699;
    color: #fff;
    text-shadow: 0 1px 0 #225588;
    -webkit-box-shadow: 0 1px 1px #336699, inset 0 1px 0 #6699dd;
    -moz-box-shadow: 0 1px 1px #336699, inset 0 1px 0 #6699dd;
    box-shadow: 0 1px 1px #336699, inset 0 1px 0 #6699dd;    
}
.button.blue:hover,
bbp_topic_submit:hover{
    background: #4477cc;
    border-color: #336699 #34679C #4477CC;
    text-shadow: 0 1px 0 #225588;
    -webkit-box-shadow: 0 1px 1px #2277CC, inset 0 1px 0 #6699dd;
    -moz-box-shadow: 0 1px 1px #2277CC, inset 0 1px 0 #6699dd;
    box-shadow: 0 1px 1px #2277CC, inset 0 1px 0 #6699dd;    
}
/* paginations */
.pagination{
padding: 2px;
margin: 10px 0px;
}
.pagination em{
    float: left;
    font-size: 14px;
    margin-right: 10px;
}
.pagination ul{
margin: 0;
padding: 0;
text-align: left; /*Set to "right" to right align pagination interface*/
font-size: 16px;
}

.pagination li{
list-style-type: none;
display: inline;
padding-bottom: 1px;
}

.pagination a, .pagination a:visited{
padding: 0 5px;
border: 1px solid #9aafe5;
text-decoration: none; 
color: #2e6ab1;
margin-right: 5px;
}

.pagination a:hover, .pagination a:active{
border: 1px solid #2b66a5;
color: #000;
background-color: #FFFF80;
}

.pagination a.currentpage{
background-color: #2e6ab1;
color: #FFF !important;
border-color: #2b66a5;
font-weight: bold;
cursor: default;
}

.pagination a.disablelink, .pagination a.disablelink:hover{
background-color: white;
cursor: default;
color: #929292;
border-color: #929292;
font-weight: normal !important;
}

.pagination a.prevnext{
font-weight: bold;
}
/*
Style it
*/
.ti-preview-icon{
    top:0;
    font-family: sans-serif;
    position: absolute;
    background: #ccc;
    color:#666;
    font-size: 16px;
    padding-right: 20px;
    padding-top: 5px;
    line-height: 25px;
    font-weight: bold;
    border-bottom-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    z-index: 100;
}
.sp-admin-font-preview .ti-preview-icon{
    right: 0;
    border-bottom-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius-bottomright: 0px;
    border-bottom-left-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    padding-right: 10px;
    padding-left: 10px;
}
h3 .ti-icon{
    line-height: 20px;
}
.sp-bg-picker,
.sp-font-picker{
    display: block;
    margin-left: 180px;
}
.sp-bg-picker>div,
.sp-font-picker>div{
    border: 1px solid #ddd;
}
/* Apearance editor common */
.ti-bg-2c,
.ti-font-2c{
    width:48%;
}
.ti-font-2c{
    float: right;
}
.ti-bg-2c .sp-form-row,
.ti-bg-2c .sp-form-row label,
.ti-font-2c .sp-form-row,
.ti-font-2c .sp-form-row label{
    clear: none!important;
}
/*Confirmation CSS*/
.jqifade{
	position: absolute;
	background-color: #aaaaaa;
}
div.jqi{
	width: 400px;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	position: absolute;
	background-color: #ffffff;
	font-size: 11px;
	text-align: left;
	border: solid 1px #eeeeee;
	padding: 7px;
}
div.jqi .jqicontainer{
	font-weight: bold;
}
div.jqi .jqiclose{
	position: absolute;
	top: 4px; right: -2px;
	width: 18px;
	cursor: default;
	color: #bbbbbb;
	font-weight: bold;
}
div.jqi .jqimessage{
	padding: 10px;
	line-height: 20px;
	color: #444444;
}
div.jqi .jqibuttons{
	text-align: right;
	padding: 5px 0 5px 0;
	border: solid 1px #eeeeee;
	background-color: #f4f4f4;
}
div.jqi button{
	padding: 3px 10px;
	margin: 0 10px;
	background-color: #2F6073;
	border: solid 1px #f4f4f4;
	color: #ffffff;
	font-weight: bold;
	font-size: 12px;
}
div.jqi button:hover{
	background-color: #728A8C;
}
div.jqi button.jqidefaultbutton{
	background-color: #BF5E26;
}
.jqiwarning .jqi .jqibuttons{
	background-color: #BF5E26;
}

.jqi .jqiarrow{ position: absolute; height: 0; width:0; line-height: 0; font-size: 0; border: solid 10px transparent;}

.jqi .jqiarrowtl{ left: 10px; top: -20px; border-bottom-color: #ffffff; }
.jqi .jqiarrowtc{ left: 50%; top: -20px; border-bottom-color: #ffffff; margin-left: -10px; }
.jqi .jqiarrowtr{ right: 10px; top: -20px; border-bottom-color: #ffffff; }

.jqi .jqiarrowbl{ left: 10px; bottom: -20px; border-top-color: #ffffff; }
.jqi .jqiarrowbc{ left: 50%; bottom: -20px; border-top-color: #ffffff; margin-left: -10px; }
.jqi .jqiarrowbr{ right: 10px; bottom: -20px; border-top-color: #ffffff; }

.jqi .jqiarrowlt{ left: -20px; top: 10px; border-right-color: #ffffff; }
.jqi .jqiarrowlm{ left: -20px; top: 50%; border-right-color: #ffffff; margin-top: -10px; }
.jqi .jqiarrowlb{ left: -20px; bottom: 10px; border-right-color: #ffffff; }

.jqi .jqiarrowrt{ right: -20px; top: 10px; border-left-color: #ffffff; }
.jqi .jqiarrowrm{ right: -20px; top: 50%; border-left-color: #ffffff; margin-top: -10px; }
.jqi .jqiarrowrb{ right: -20px; bottom: 10px; border-left-color: #ffffff; }
