Your IP : 216.73.216.231
/*******************************************
*** YT Framework: less ***
*******************************************/
// --* Component Joomla *----------------------
// ---------------------------------------------
/* 1.List All Categories
* 1.Category Blog
* 2.Featured Articles
* 3.Single Article
* 4.Tags Component
* 5.Archived Articles
* 6.Pagination
* 7.Page Break
* 2.Search
* 3.Newsfeed
* 4.Weblinkitems
* 5.User Component
* 6.Contact Component
*/
// 1.List All Categories
// ---------------------------------------------------------
div.categories-list{
> div{margin-bottom: 15px;
h3.item-title {
a {
color: #222;
&:hover {color: @linkColor;}
}
.badge {position: relative; top: -3px;}
}
}
}
// 1.1 Category Blog
// ---------------------------------------------------------
.componentheading {font-size: 28px; font-weight: 700; margin: 0 0 15px; color: #252525;}
.blog-featured{
.item{
.item-image{
margin: 0 0 20px;
}
h2.item-title a{
color: #222;
font-size: 16px;
&:hover{
color: @linkColor;
}
}
}
}
.blog {
.heading-category {
margin-bottom: 25px;
.subheading-category {
font-size: 28px; font-weight: 700; color: #252525;
}
}
&.blog-featured{
.item{
margin: 0 0 20px;
.article-img{
margin: 0 0 20px;
}
.item-image{
margin: 0 0 20px;
}
}
}
.items-row, .items-leading {
.item .catItemView {
border: none; padding: 0; margin-bottom: 30px;
.catItemImageBlock {
margin: 0; padding: 0;
.catItemImage {
margin: 0; overflow: hidden;
&.item-img{
overflow: hidden;
background: @background2;
position: relative;
}
}
}
.catItemCategory {
margin: 30px 0 0;
padding: 0;
color: @background2;
a{
color: @background2;
&:hover{}
}
i {margin-right: 10px;}
}
.catItemHeader {
.catItemTitle a {
font-size: 14px; font-weight: 700; color: #222;
&:hover {
color: @linkColor;
}
}
.catToolbar {
margin: 5px 0; padding: 0; list-style: none;
li {
display: inline-block; margin-right: 20px; position: relative;font-size: 10px;color: #999;
a, span {
text-transform: uppercase; font-size: 10px; color: #999;
i {margin-right: 10px;}
}
a:hover {color: @linkColor;}
&:after {
height: 10px; width: 1px; background: #e5e5e5; content: "";
display: inline-block; position: relative; top: 1px; left: 9px;
}
&:last-child {
&:after {display: none;}
}
}
}
}
.catItemBody {
padding: 0;
.catItemIntroText {padding: 0;font-size: 13px;}
}
.catItemReadMore a {
text-transform: uppercase; font-size: 16px; font-weight: 700; color: #252525;
&:hover {color: @linkColor;} margin: 10px 0 40px; display: inline-block;
}
&.grid{
display: block;
overflow: hidden;
position: relative;
.item-image{
margin: 0 0 30px;
}
.catItemTitle a {
font-size: 18px;
color: #222;
}
.readmore{
font-size: 13px;
color: @linkColor;
}
.catItemBody{
padding: 0 0 10px;
margin: 0 0 10px;
border-bottom: 1px solid #ebebeb;
.catToolbar{
margin: 0 -15px;
>li{
display: inline-block;
padding: 0 15px;
font-size: 13px;
color: #909090;
}
}
}
&:before{
background: #fff;
content: "";
height: 100px;
left: -110px;
position: absolute;
top: -20px;
transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
width: 200px;
z-index: 2;
}
.date{
position: absolute;
top: 0;
left: 0;
padding: 0 3px;
overflow: hidden;
display: block;
z-index: 3;
span{
display: block;
color: #909090;
&.day{
font-size: 24px;
font-weight: bold;
transition: all 0.3s ease-in-out
}
&.month{
font-size: 14px;
transition: all 0.3s ease-in-out
}
&.year{
transform: translateY(100%);
-moz-transform: translateY(100%);
-webkit-transform: translateY(100%);
}
}
}
&:hover{
.date {
span.year{
transform: translateY(-100%);
-moz-transform: translateY(-100%);
-webkit-transform: translateY(-100%);
transition-delay: 0.3s
}
span.day, span.month{
transform: translateY(-100%);
-moz-transform: translateY(-100%);
-webkit-transform: translateY(-100%);
transition: all 0.3s ease-in-out
}
}
}
}
&.tag{
h3.title{
display: inline-block;
width: 100%;
margin: 20px 0 0;
a{
color: #222;
&:hover{color: @linkColor;}
}
}
}
}
}
}
// Tag category
&.tag-category {
.article-info {
dd {
i {margin-right: 5px;}
}
}
.item {
.item-image {float: left;}
.article-img{
display: inline-block;
float: left;
padding: 0 20px;
}
}
}
// 1.2 Featured Articles
// ---------------------------------------------------------
// 1.3 Single Article
// ---------------------------------------------------------
.item-page{
// Page sevices
.catToolbar{
li{
display: inline-block;
border-right: 1px solid #ccc;
padding-right: 20px;
line-height: 12px;
margin-right: 20px;
color: #999;
&:last-child{border: none;}
}
}
.itemSocialBlock{
margin: 10px 0 -12px;
padding: 15px 0;
border-width: 1px 0;
border-style: solid;
border-color: #ebebeb;
strong{
display: inline-block;
text-transform: uppercase;
color: #444;
}
.post_social{
display: inline-block;
a{
font-size: 18px;
padding: 0 15px;
color: #898989;
&:hover{
color: @linkColor;
}
}
}
}
.itemViewservices{
h3.title{
text-transform: uppercase;
color: #222;
margin: 0 0 20px;
}
.module{
margin: 40px 0 0;
h3.modtitle{
margin: 0 0 30px;
}
}
.itemIntroText{
font-size: 12px;
font-weight: normal;
color: #666;
}
.yt-accordion{
.yt-accordion-group{
margin: 0 0 15px;
.accordion-heading{
font-size: 12px !important;
text-transform: uppercase;
border: 1px solid #ebebeb;
padding: 15px 15px;
color: #666 !important;
i{
margin: 0 10px;
color: #222 !important;
}
&.active{
color: #222 !important;
background: #f6f6f6 !important;
}
}
.yt-accordion-inner{
}
}
}
}
.tags{margin-bottom: 30px;}
.img-fulltext{
position: relative;
margin: 0 0 20px;
padding-right: 20px;
&.pull-left {margin-right: 20px;}
&.pull-right {margin-left: 20px;}
img { max-width: none;}
a.modal {position: relative; display: block; z-index: 0;}
}
.article-text {
.cat_title {
color: @linkColor; margin-bottom: 10px;
i {margin-right: 10px;}
a {color: @linkColor;}
&:hover {
color: @linkColor;
a,i {color: @linkColor !important;}
}
}
.page-header {
border: none; margin: 0; padding-bottom: 3px;
h2 {
font-size: 18px; color: #252525; font-weight: 700;
}
}
.article-info {
margin-bottom: 15px;
dd {
display: inline-block; font-size: 12px; text-transform: uppercase; color: #666666;
margin-right: 20px; padding-right: 20px; position: relative;
&:after {
display: block; width: 1px; height: 12px; content: ""; background: #e5e5e5;
position: absolute; top: 2px; right: 0;
}
i {margin-right: 10px;}
&:last-child {
&:after {display: none;}
}
}
}
.articleBody {
p {
}
}
}
.related-title {
font-size: 26px;
font-weight: 700;
color: #252525;
margin: 50px 0 45px;
text-transform: uppercase;
}
.related-items {
width: auto;
li {margin-bottom: 30px;}
.img-fulltext {margin: 0 0 20px;padding: 0;
.img-time {
.blog .items-row .item .item-image .img-time();
}
&:hover {
img {opacity: 0.5;}
}
}
.content {
background: none; position: relative;
z-index: 1; padding: 20px 0;
.related-item-title {
a {
color: #252525;
font-size: 18px;
font-weight: 700;
line-height: normal;
&:hover {
color: @linkColor;
}
}
}
.cat_title {margin: 0 0 10px !important;}
.related-item-info {
white-space: nowrap;
div {
display: inline-block; color: #898989;
margin-right: 20px; padding-right: 20px; position: relative;
&:after {
display: block; width: 1px; height: 12px; content: ""; background: #e5e5e5;
position: absolute; top: 6px; right: 0;
}
i {margin-right: 10px;}
&:last-child {
&:after {display: none;}
}
&.related-item-date {
}
&.related-item-author {
font-weight: 700; color: #252525;
span {font-weight: normal; color: #898989;}
}
}
}
p {margin-left: 0 !important;}
}
.owl-controls {
position: absolute; top: -80px; right: 5px;
.owl-prev, .owl-next {
width: 30px; height: 40px; display: inline-block; background: #999999; color: #fff;
text-align: center; line-height: 40px; margin-right: 10px; .fa {font-size: 16px;}
&:hover {background: @background1;}
}
}
}
&.item-page-with-img {
.article-text {
.cat_title {margin: 30px 0 10px;}
}
}
.related-title{
font-size: 16px;
text-transform: uppercase;
color: #222;
padding-bottom: 15px;
margin-bottom: 25px;
border-bottom: 1px solid #e8e8e8;
position: relative;
&:before{
content: "";
height: 2px;
width: 100px;
background: @linkColor;
position: absolute;
left: 0;
bottom: 0;
}
}
.related-items{
.content{
padding: 0;
.related-item-title a{
font-size: 14px;
}
}
}
}
// 1.4 Category List Tags
// ---------------------------------------------------------
.blog.tag-category ul.blank.items-row {
}
// 1.5 Archived Articles
// ---------------------------------------------------------
div.archive{
.filter-search{background: @grayLighter;border-color: @paginationBorder;border-radius: 0;
#limit{width: auto;margin-right: 5px;}
}
.form-inline .filters .button{padding: 4px 20px 3px 20px;}
#archive-items{
> div{border-top: 1px dotted @inputBorder;padding: 15px 0;
&:first-child{border-top: none;}
h2.item-title{margin: 0;font-size: 115%;}
dl.article-info{ color: @grayLight;margin: 0;
dd{ display: inline-block;font-size: 91.7%;line-height: 24px;margin: 0 10px 0 0;padding: 0;}
}
.intro > p{display: inline;}
}
}
}
// 1.6 Pagination
// ----------------------------
/*.pagination{height: auto;margin: 5px auto 8px;display: table;
li{margin: 0 2px;overflow: hidden;
a, span{float: none;display: inline-block;padding: 5px 12px;border: 1px solid #ccc;color: @gray;background: #fff;border-radius: 0 !important;margin: 0;
height: 32px;vertical-align: top;
}
&.active,&:hover {
span,a{color: #fff;background: @background1 !important;border: 1px solid @background1!important;}
}
}
}*/
/*.pagination {
display: table; margin: 20px auto;
ul.pagination {
border: none; border-radius: 0;
li {
a, span {
min-width: 48px; height: 48px; text-align: center; background: #ebebeb; border-radius: 0 !important; font-size: 16px;
color: #b7b7b7; line-height: 34px; margin: 6px; border: none !important;
.r-hiden {display: none;}
}
a:hover {
position: relative; background: @background1; color: #fff;
&:after {
width: 100%; height: 2px; display: block; background: darken(@background1, 10%); content: '';
position: absolute; left: 0; bottom: -2px;
}
}
&.active {
span {
position: relative; background: @background1; color: #fff;
&:after {
width: 100%; height: 2px; display: block; background: darken(@background1, 10%); content: '';
position: absolute; left: 0; bottom: -2px;
}
}
}
}
}
}*/
.pagination {
display: block; margin: inherit; margin-top: 30px;
border-top: #ebebeb 1px solid; padding: 20px 0;
> div {padding: 0;}
.counter {padding-top: 10px;}
.r-hiden{display: none}
ul.pagination {
margin: 0 -5px; padding: 0; border: none; float: right;
li {
display: inline-block; margin: 5px;
a, span {
border-radius: 5px; border: #ebebeb 1px solid; margin: 0; color: #222;
.fa.fa-angle-right.r-hiden, .fa.fa-angle-left.r-hiden {display: none;}
}
&.active {
span {
background: @background2; border-color: @linkColor2; color: #fff;
}
}
}
}
}
// 1.7 Page Break
// ---------------------------------------------------------
.pagenavcounter{font-size: 18px;font-weight: bold;margin-bottom: 1em;}
.article-index {margin: 0px 0px 0px 20px;
.nav-stacked {border: solid 1px #ccc;border-radius: 0px;overflow: hidden;
li {border-bottom: solid 1px #ccc;float: none;
a {border: none;margin: 0px;border-radius: 0px;}
}
}
}
.pager li > a, .pager li > span{border-radius: 0; background: #eee;}
// ---------------------------------------------------------
// GENERIC JOOMLA PAGE
// ---------------------------------------------------------
// 2.Search
// ---------------------------------------------------------
// Search Component
.search{
#searchForm{
.searchintro{margin: 15px 0;}
.phrases-box .controls .radio{margin: 10px 20px;}
.ordering-box {
select.inputbox {min-width: 120px;}
}
button.btn{padding: 8px 10px; height: 36px; margin: 0; background: @background1; border-radius: 0;
span {margin: 0;}
&:hover {background: @background2;}
}
}
.search-results{clear: both;
.result-category{display: none;}
.result-category,.result-text{padding: 0;margin: 0;}
.result-text{padding-bottom: 1em;margin-bottom: 1em; border-bottom: 1px solid @paginationBorder;}
}
}
// Smart Search Component
.finder{
#search-form{background: #ECF0E8;border-bottom: 1px solid @paginationBorder;padding: 20px;margin-bottom: 30px;
#finder-search{margin: 0;
#advanced-search{padding: 10px 0 0;
#finder-filter-window{
ul{list-style: none;margin: 0;
li {margin-bottom: 10px;
label{width:150px;}
}
}
}
}
button.btn {height: 36px; background: @background1; border-radius: 0; border: none;
&:hover {background: @background2 !important;}
}
input.inputbox{
height: 36px;
}
}
}
#search-results{
#search-query-explained{margin: 1em 0;border-bottom: 3px solid @grayLighter;font-weight: bold;.box-shadow(inset 0 -1px 0 @inputBorder)}
ul.list-striped {margin: 0;list-style: none; padding: 0;
li{margin-bottom: 1em;padding-bottom: 1em;border-bottom: 1px solid #eee;
.result-url{color: @grayLight;}
}
}
}
}
// 3.Newsfeed
// ---------------------------------------------------------
.newsfeed-category,
.contact-category{
select[multiple], select[size]{width: auto;}
}
.newsfeed {
ol{margin: 0;list-style: none;padding: 0;
li{ border-bottom: 1px dotted @inputBorder;padding: 20px 0;
a{color: @navbarText;font-weight: normal;}
.feed-item-description{ margin-top: 10px;overflow: hidden;
> img:first-child{ background: none repeat scroll 0 0 @white;border: 1px solid @grayLighter;margin: 0 0 10px 15px;padding: 5px;}
}
}
}
}
// 5.User Component
// ---------------------------------------------------------
h1.title{font-size: 180%;}
h2.subtitle{font-size: 130%;}
.profile .dl-horizontal dt {display: inline-block;}
.profile{
.btn-toolbar{
float: none !important;
.btn-group{
.btn{
padding: 0;
margin: 0 0 20px;
}
}
}
}
// Login Form
.view-login{
#system-message{width: 550px;margin: 0 auto;}
#content #yt_component{border: none;.box-shadow(none);}
.wrap-login{width: 550px;margin: 0 auto;padding: 1em 2em 2em;background: @white;border: 1px solid @inputBorder;box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
.page-header{margin: -14px -28px 15px;padding: 10px 25px;background: @tableBackgroundHover;border-bottom: 1px solid @paginationBorder;
h1{margin: 0;}
}
.box-sizing(border-box);
.form-horizontal .control-group{float: left;width:50%;margin: 1em 0;}
.form-horizontal .control-label{float: none;}
.form-horizontal .controls input{width:180px;}
.other-link{overflow: hidden;
ul.yt-list{margin: 0 0 0 15px;
li{float: left;margin-right: 30px;
a{font-size: 12px;color: @gray;
&:hover{color: @linkColor;}
}
}
}
}
}
}
.login{
.form-horizontal{margin-bottom: 0;}
.well{background: none;border: none;border-radius: 0;box-shadow: none;padding: 10px 0 0;margin: 0;
.control-label{
label{font-weight: bold;}
}
.controls{margin: 0;
.btn {
border-radius: 0;
&:hover {color: #fff;}
}
}
}
}
//Register
.registration{
.page-header{margin: 0 0 15px;
h2{margin: 0;}
}
.form-horizontal .control-label{text-align: left;
label{font-weight: bold;}
}
}
.reset,.remind{
.control-label{.registration .form-horizontal .control-label();}
}
//edit
.profile-edit {
.control-group {
.controls {
.chzn-done { margin-bottom: 10px; display: none !important;}
button.btn {
background: @background1;
&:hover {
background: @background2;
}
}
}
}
.chzn-container {
margin-bottom: 0;
.chzn-single {
height: 32px; border-radius: 0;
background: #fff; box-shadow: none;
border: #ddd 1px solid;
}
}
}
// 6.Contact Component
// ---------------------------------------------------------
div.contact{
h3.jicons-text{font-size: 120%;}
ul.blank li,.contact-misc,form.box legend{color: @grayLight;}
.contact-image{width:50%;float: right;
img{padding: 5px;border: 1px solid @inputBorder;margin-top: 1em;.box-sizing(border-box);}
}
textarea, input{width:300px;}
textarea{height: 100px;}
.contact-address,.contact-contactinfo,.contact-miscinfo{margin-bottom: 2em;}
form.box {
fieldset{border: none;padding: 0;}
legend{padding: 0;font-size: 12px;}
}
}
.contact-ajax{
.el-control{margin-bottom: 10px; margin-top: 10px;
label{width: 100px;}
input{width: 200px;}
}
}
.related-items li{margin-bottom: 10px;}