File: /var/www/html/wpprm/wp-content/themes/ronneby/assets/less.lib/visual-composer/tta_tabs.less
/*Tab change animation*/
@-webkit-keyframes changeTabSlideNoActive {
from {-webkit-transform: translateY(0);}
50% {-webkit-transform: translateY(-30px);}
to {-webkit-transform: translateY(30px);}
}
@keyframes changeTabSlideNoActive {
from {transform: translateY(0);}
50% {transform: translateY(-30px);}
to {transform: translateY(30px);}
}
@-webkit-keyframes changeTabSlideActive {
from {-webkit-transform: translateY(30px);}
to {-webkit-transform: translateY(0);}
}
@keyframes changeTabSlideActive {
from {transform: translateY(30px);}
to {transform: translateY(0);}
}
.underline() {
&.underline:not(.vc_tta-accordion){
.vc_tta-tab:not(.vc_active),
.vc_tta-panel:not(.vc_active) {
span{
position: relative;
&:after{
content: "";
position: absolute;
display: block;
top: 100%;
left: 0%;
margin-top: -1px;
width: 100%;
border-bottom: 1px dotted @third-site-light-color;
.transition(all .3s ease);
}
&:hover{
&:after{
margin-top: 1px;
}
}
}
}
}
&.underline.vc_tta-accordion {
.vc_tta-tab:not(.vc_active),
.vc_tta-panel:not(.vc_active) {
.accordion_inner_text {
&:after{
content: "";
position: absolute;
display: block;
width: 100%;
border-bottom: 1px dotted @third-site-light-color;
.transition(all .3s ease);
}
&:hover {
&:after {
margin-top: 2px;
}
}
}
}
}
}
.boxhadow_acc_tab() {
.box-shadow(0px 3px 15px -3px rgba(0,0,0,0.25));
}
/*Tabs*/
.dfd_tabs_block {
.dfd_tta_tabs {
@border-radius:42px;
@padding: 20px;
@padding-tab: 9px;
@padding-side-tab: 25px;
.vc_tta-panels-container {
.vc_tta-panel-body {
display: block !important;
}
&:before {
content: ' ';
border-top:1px dotted fade(@box-name-color, 20%);
display: block;
position: absolute;
height: 1px;
bottom: 100%;
width: 100%;
}
&:after {
content: ' ';
border-top:1px dotted fade(@box-name-color, 20%);
display: block;
position: absolute;
height: 1px;
bottom: 0%;
width: 100%;
}
}
&.hide_separator {
.vc_tta-panels-container {
&:before,
&:after {
.hide();
}
.vc_tta-panels .vc_tta-panel .vc_tta-panel-body {
padding-top: 0;
}
}
}
&.vc_tta-tabs-position-bottom {
.vc_tta-panels-container {
margin-bottom: 8px;
&:before {
.hide();
}
}
}
&.vc_tta-tabs-position-top {
.vc_tta-panels-container {
&:after {
.hide();
}
}
}
.vc_tta-tabs-container {
overflow: visible;
.vc_tta-tabs-list {
padding: @padding-tab 0px;
padding-left: 1px;
overflow:visible;
line-height:0;
li {
margin-right:4px;
&:last-child {
margin-right:0px;
}
&.vc_tta-tab {
a {
display: table;
background: none;
padding-top: 9px;
padding-bottom: 9px;
border: 1px solid lighten(@forth-site-dark-color, 90%);
.link-style();
.rounded(@border-radius);
.box-shadow(0 2px 3px 1px transparent);
.transition(all .3s ease-in-out);
&:hover {
color: @main-site-light-color !important;
.boxhadow_acc_tab();
border-color: transparent;
}
.vc_tta-icon {
display: inline;
position: relative;
top: -2px;
}
.vc_tta-title-text:not(:empty):not(:first-child),
.vc_tta-title-text:not(:empty)~* {
margin-left: 8px;
}
}
}
&.vc_active {
a {
color: @main-site-dark-color;
background: @third-site-light-color;
border-color: transparent;
&:hover {
color: @main-site-dark-color !important;
.box-shadow(none);
}
&:before {
.hide();
}
&:after {
.hide();
}
}
}
}
}
}
/*Style classic*/
&.classic {
.vc_tta-tabs-container {
.vc_tta-tabs-list {
li {
&.vc_tta-tab {
a {
.rounded(@border-radius) !important;
&:hover {
border-color: transparent !important;
}
}
}
&.vc_active {
a {
border-color:transparent !important;
&:before,
&:after {
.hide();
}
}
}
}
}
}
}
.vc_tta-panels-container {
margin-top: 8px;
padding-top: 22px;
.vc_tta-panels {
background: none !important;
border: none !important;
.vc_tta-panel-heading {
border-width: 1px;
margin-bottom: 5px;
border-color: lighten(@forth-site-dark-color, 90%);
a {
.link-style();
}
}
.vc_tta-panel-body {
padding: 0;
}
.vc_active {
.vc_tta-panel-heading {
border-color:@third-site-light-color !important;
}
}
}
}
@media (max-width: 768px) {
.vc_tta-panels-container {
border-top: none;
}
}
/*Style classic_empty*/
&.classic_empty {
.vc_tta-tabs-container {
.vc_tta-tabs-list {
li {
&.vc_tta-tab {
margin-right:0px;
a {
.link-style();
border:none;
padding-right:@padding-side-tab;
padding-left:@padding-side-tab;
&:hover {
color: @main-site-light-color !important;
.box-shadow(none);
}
&:before {
content: "";
.block();
width: @padding+12;
height: 1px;
.abs();
top: 44%;
right: 100%;
margin-right: -@padding + 4px;
margin-top: @box-name-font-size / 2;
background: fade(@box-name-color, 20%);
}
}
}
&.vc_active {
a {
.rounded(@border-radius) !important;
background: none !important;
border:1px solid @third-site-light-color !important;
padding-top: @padding-tab - 1px;
padding-bottom: @padding-tab - 1px;
padding-left: @padding-side-tab - 1px;
padding-right: @padding-side-tab - 1px;
.link-style();
&:before,
&:after {
.hide();
}
}
+ li {
a {
&:before {
.hide();
}
}
}
}
&:first-child a:before {
.hide();
}
}
}
}
.underline();
}
/*Style collapse*/
&.collapse {
.vc_tta-tabs-container {
.vc_tta-tabs-list {
padding-left: 1px;
li {
margin-right: 0px;
margin-left: -1px;
a {
.rounded(initial) !important;
padding-right: 30px;
padding-left: 30px;
}
&.vc_tta-tab {
a {
&:hover {
.box-shadow(none);
border-color: lighten(@forth-site-dark-color, 90%);
}
}
}
&.vc_active {
a {
background-color:@third-site-dark-color !important;
&:hover {
.box-shadow(none);
border-color: transparent;
}
&:before,
&:after {
.hide() !important;
}
}
}
&:first-child {
a {
border-top-left-radius: 2px !important;
border-bottom-left-radius: 2px !important;
}
}
&:last-child {
a {
border-top-right-radius: 2px !important;
border-bottom-right-radius: 2px !important;
}
}
}
}
}
}
/*Style big_icon*/
&.big_icon {
.vc_tta-tabs-container {
.vc_tta-tabs-list {
li {
position:relative;
a {
height: 80px;
width: 80px;
overflow: hidden;
background-color: white;
span {
.hide();
}
&:before {
width: 0;
}
}
&.vc_tta-tab {
a {
padding: 0px;
display: table-cell;
vertical-align: middle;
.vc_tta-icon {
font-size: 2.35em;
line-height: 0;
top:5px;
left: 0px;
margin: 0 auto;
display: table;
position: relative;
}
}
}
&.vc_active {
&:after {
content: " ";
width: 80px;
border: 0px solid @third-site-light-color;
border-bottom-width: 3px;
bottom: 0px;
left: 0px;
top: 0px;
position: absolute;
}
a {
background-color: white;
border-color: lighten(@forth-site-dark-color, 90%);
border-bottom-color: transparent;
overflow:hidden;
color: @link-color;
&:hover {
color: @link-color !important;
}
&:after {
width: 0px;
}
}
}
}
}
}
&.vc_tta-tabs-position-top {
.vc_tta-panels-container {
&:before {
top: -28px;
}
}
}
&.vc_tta-tabs-position-bottom {
.vc_tta-panels-container {
&:after {
bottom: -28px;
}
}
}
}
&.empty_style {
.vc_tta-tabs-container .vc_tta-tabs-list li.vc_tta-tab {
a {
border-width: 0;
&:hover {
.box-shadow(none);
}
}
&:first-child {
a {
padding-left: 0;
}
}
&:last-child {
a {
padding-right: 0;
}
}
&.vc_active {
a {
background: transparent;
}
}
}
}
@media (max-width: 768px) {
.vc_tta-panels-container {
border-top: none;
}
}
}
}
.wpb-js-composer {
.dfd_tabs_block {
.dfd_tta_tabs {
&.vc_tta-tabs:not([class*=vc_tta-gap]):not(.vc_tta-o-no-fill).vc_tta-tabs-position-top .vc_tta-tab.vc_active > a:before,
&.vc_tta-tabs:not([class*=vc_tta-gap]):not(.vc_tta-o-no-fill).vc_tta-tabs-position-top .vc_tta-tab.vc_active > a:after {
.hide();
}
&.vc_tta.vc_general {
.vc_tta-tabs-list {
padding-bottom: 9px;
}
.vc_tta-panel-body{
border-width: 0;
}
}
}
}
}
@media (max-width: 768px) {
.dfd_tabs_block .dfd_tta_tabs.hide_separator .vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-body {
padding-top: 20px;
padding-bottom: 25px;
}
.dfd_tabs_block .dfd_tta_tabs.hide_separator .vc_tta-panels-container .vc_tta-panels .vc_tta-panel {
&:last-child {
.vc_tta-panel-body {padding-bottom: 0;}
}
}
}
/*Accordion*/
.dfd_tabs_block {
.vc_tta-accordion {
.vc_tta-panel {
margin-bottom:4px;
.vc_tta-panel-heading {
position: relative;
.transition(~'box-shadow .3s, color .3s, background-color .3s');
border-color: lighten(@forth-site-dark-color, 90%);
border-width: 1px;
&:hover {
.boxhadow_acc_tab();
}
h4 {
a {
color: @link-color;
.link-style();
&:hover {
color: @link-hover-color;
}
.vc_tta-icon {
border-left: 1px dotted fade(@forth-site-dark-color, 15%);
padding: 0px 15px 0px 15px;
text-align: center;
}
i {
width:10px;
height:10px;
&:before,
&:after {
border-color: @third-site-light-color; //brown
}
}
}
}
}
.vc_tta-panel-body {
background: none;
border-width: 0;
padding: 15px 0px 15px 0px;
p {
margin-bottom: 0px;
}
}
&.vc_active {
.vc_tta-panel-heading {
border-color: @third-site-light-color;
background-color: inherit;
&:hover {
.box-shadow(none);
}
h4 {
a {
i {
&:before,
&:after {
border-color: lighten(@forth-site-dark-color, 80%); //grey
}
}
}
}
}
}
&:not(:first-child) .vc_tta-panel-heading {
margin-top: 0px !important;
}
///icon
.vc_tta-panel-title a {
display: table;
width: 100%;
vertical-align: middle;
padding: 0px 50px;
padding-right: 0px;
min-height: 50px;
height: 50px;
.vc_tta-icon {
display: table-cell;
border-left: 1px solid black;
vertical-align: middle;
width: 56px;
}
.vc_tta-title-text {
display: table-cell;
vertical-align: middle;
padding-right: 20px;
width: 100%;
padding-top: 3px;
padding-bottom: 5px;
.accordion_inner_text {
color: @link-color !important;
.link-style();
line-height: 1;
&:hover {
color: @link-hover-color !important;
}
display: inline-block;
position: relative;
}
}
.vc_tta-controls-icon {
display: table-cell;
right: 0;
}
}
///////
}
.vc_tta-icon {
.abs();
top: 0;
height: 100% !important;
&:before {
top: 50%;
position: relative;
}
}
@padding : 20px;
@padding2: 68px;
///Icon Position
//////////////////////////////////////////////////////////////////////
&.icon-position-left {
.vc_tta-controls-icon-position-right,
[data-vc-tta-controls-icon-position="right"] {
span {
padding-left: @padding;
padding-right: 10px !important;
}
&.hasIcon {
span {
padding-left: @padding2;
}
}
a {
padding-left: 0px;
.vc_tta-icon {
left: 0px;
border-right: 1px dotted fade(@forth-site-dark-color, 15%);
border-left: transparent !important;
}
}
}
.vc_tta-controls-icon-position-left,
[data-vc-tta-controls-icon-position="left"] {
span {
/* padding-left: 56px !important;*/
}
&.hasIcon {
span {
padding-left: 56px;
}
}
a {
padding-left: 0px;
}
}
.vc_tta-icon {
left: 0px;
margin-left: 0px;
}
///Text align
&.vc_tta-controls-align-left,
&.vc_tta-controls-align-right,
&.vc_tta-controls-align-center {
.vc_tta-icon {
left: 50px;
}
}
}
///////////////////////////////////////////////////////////////////////
&.icon-position-right {
.vc_tta-controls-icon-position-right,
[data-vc-tta-controls-icon-position="right"] {
span {
padding-left: @padding;
padding-right: 0px;
}
&.hasIcon {
span {
padding-right: 56px;
}
}
a {
padding-left: 0px;
.vc_tta-icon {
border-right: 1px dotted fade(@forth-site-dark-color, 15%);
border-left: transparent !important;
right: 50px;
}
}
}
.vc_tta-controls-icon-position-left,
[data-vc-tta-controls-icon-position="left"] {
span {
padding-right: 56px;
}
&.hasIcon {
span {
padding-right: (@padding2)+4;
}
}
a {
padding-right: 0px;
}
}
///Text align
&.vc_tta-controls-align-left,
&.vc_tta-controls-align-right,
&.vc_tta-controls-align-center {
.vc_tta-icon {
right:0px;
}
}
.vc_tta-icon {
right: 0;
margin-left: 0px;
}
}
.vc_tta-controls-icon-position-right,
[data-vc-tta-controls-icon-position="right"] {
a {
.vc_tta-controls-icon{
display: table-cell;
padding: 0px 25px 0px 25px;
position: relative;
right: 0px;
transform: translateY(0%);
top: 0%;
&:before {
width: 10px;
left: 50%;
margin-left: -5px;
}
&:after {
height: 10px;
top: 50%;
margin-top: -5px;
}
}
}
}
.i_position_right {
.vc_tta-controls-icon-position-right,
[data-vc-tta-controls-icon-position="right"] {
.vc_tta-controls-icon {
right: 70px;
}
}
}
&.vc_tta-color-white.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-heading:hover {
background-color:initial;
}
&.vc_tta-controls-align-center {
.vc_tta-panel-heading .vc_tta-panel-title {
text-align: center;
.vc_tta-title-text {
.block();
}
}
}
&.vc_tta-controls-align-right {
.vc_tta-panel-heading .vc_tta-panel-title {
text-align: right;
.vc_tta-title-text {
.block();
}
}
}
&.show_two_px {
.vc_tta-panel {
.vc_tta-panel-heading {
.box-shadow(inset 0px 0px 0px 1px transparent);
}
&.vc_active {
.vc_tta-panel-heading {
.box-shadow(inset 0px 0px 0px 1px @third-site-light-color);
}
}
}
}
.underline();
.style-2 {
.vc_tta-panel {
&.vc_active {
.vc_tta-panel-heading {
background-color: @third-site-light-color;
.vc_tta-panel-title {
a {
color: @main-site-dark-color;
i {
&:before{
border-color: @main-site-dark-color;
}
}
}
}
}
}
}
}
.style-3 {
.vc_tta-panel {
.vc_tta-panel-heading {
.rounded(30px);
}
}
}
.style-4 {
.vc_tta-panel {
.vc_tta-panel-heading {
.rounded(30px);
}
&.vc_active {
.vc_tta-panel-heading {
background-color: @third-site-light-color;
.vc_tta-panel-title {
a {
color: @main-site-dark-color;
i {
&:before{
border-color: @main-site-dark-color;
}
}
}
}
}
}
}
}
.style-6 {
.vc_tta-panel {
&.vc_active {
.vc_tta-panel-heading {
border-color: lighten(@forth-site-dark-color, 90%);
border-bottom-color: @third-site-light-color;
}
}
}
}
}
}
.wpb-js-composer {
.dfd_tabs_block {
.vc_tta.vc_general.dfd_accordion {
.vc_tta-panel-heading {
border-width: 1px;
.transition(~'box-shadow .3s ease, color .3s ease, background-color .3s ease');
}
.vc_tta-panel-body {
border-width: 0;
padding: 19px 0px 19px 0px;
}
.vc_tta-title-text:not(:empty):not(:first-child),
.vc_tta-title-text:not(:empty)~* {
margin-left: 0;
}
.vc_tta-controls-icon-position-right.vc_tta-panel-title > a {
padding-right: 50px;
}
}
}
}
/*Tour*/
.dfd_tabs_block {
@arrow_border_width:1px;
.dfd_tta_tour {
.vc_tta-tabs-container {
overflow:initial;
margin-left: 0px;
margin-bottom: 0px;
.vc_tta-tabs-list {
width: 100%;
}
.vc_tta-tab {
a {
padding-left:50px;
padding-top: 12px;
padding-bottom: 12px;
border-color: lighten(@forth-site-dark-color, 90%);
border-width: 1px;
.transition(~'color .3s ease, box-shadow .3s ease, background-color .3s ease, border-color .3s ease') !important;
.link-style();
&:hover {
.boxhadow_acc_tab();
z-index: 1;
}
&:before,
&:after {
border-color: @third-site-light-color !important;
}
&:before {
content: '';
.block();
position: absolute;
.box-sizing(border-box);
left: 19px !important;
right: 0 !important;
top: 50%;
.transform(translateY(-50%));
border:@arrow_border_width solid;
height: 1px;
width: 10px !important;
}
&:after {
content: '';
.block();
position: absolute;
box-sizing: border-box;
left: 23px !important;
bottom: 0;
top: 50% !important;
height: 10px;
width: 1px !important;
margin-top: 0px;
border:@arrow_border_width solid;
.transform(translateY(-50%));
}
}
&.vc_active {
a {
background: @third-site-light-color;
color: @main-site-dark-color;
border-color: transparent;
&:before,
&:after {
border-right: inherit !important;
border-width: @arrow_border_width !important;
margin-left: 1px;
border-style: solid;
border-color: lighten(@forth-site-dark-color, 80%) !important;
}
&:before {
content: '';
display: block !important;
position: absolute;
.box-sizing(border-box);
left: 19px !important;
right: 0 !important;
top: 50%;
.transform(translateY(-50%));
border:@arrow_border_width solid;
height: 1px;
width: 10px !important;
}
&:after {
.hide();
}
&:hover {
.box-shadow(none);
}
}
}
}
}
&.hide_separator {
.vc_tta-panels-container {
&:after{
.hide();
}
}
}
.vc_tta-panels-container {
display: block;
height: 100%;
&:after {
content: ' ';
display: block;
border-bottom:1px dotted fade(@box-name-color, 20%);
position: absolute;
height: 1px;
bottom: -7%;
left: 0%;
width: 100%;
}
.vc_tta-panels {
background: none;
border-color: transparent;
.vc_tta-panel {
background: none;
border-color: transparent;
.vc_tta-panel-heading {
border-color: lighten(@forth-site-dark-color, 90%);
.vc_tta-panel-title {
a {
.link-style();
}
}
&:hover {
background-color: transparent;
}
}
.vc_active {
.vc_tta-panel-heading {
border-color:@third-site-light-color !important;
}
}
.vc_tta-panel-body {
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
background: transparent;
border-width: 0;
p {
margin-bottom: 0px;
}
}
}
}
}
.underline();
&.vc_tta-color-white.vc_tta-style-classic .vc_tta-tab > a:hover {
background-color:initial;
}
&.style-1 {
.vc_tta-tab {
&.vc_active {
a {
&:before,
&:after {
border-color: @main-site-dark-color !important; //whte
}
}
}
}
}
&.style-2 {
.vc_tta-tab {
&.vc_active {
a {
.link-style();
background: none;
border-color: @third-site-light-color;
&:hover {
color: inherit;
}
}
}
}
}
&.style-3 {
.vc_tta-tab {
a {
.rounded(25px);
}
&.vc_active {
a {
.link-style();
background: none;
border-color: @third-site-light-color;
&:hover {
color: inherit;
}
}
}
}
}
&.style-4 {
.vc_tta-tab {
a {
.rounded(25px);
}
&.vc_active {
a {
&:before,
&:after {
border-color: @main-site-dark-color !important; //whte
}
}
}
}
}
&.style-5 {
.vc_tta-tab {
&.vc_active {
a {
.link-style();
background: none;
border-color: lighten(@forth-site-dark-color, 90%);
border-bottom-color: @third-site-light-color;
border-bottom-width: 3px;
&:hover {
color: inherit;
}
}
}
}
}
}
}
.wpb-js-composer {
.dfd_tabs_block {
.vc_tta.vc_general.dfd_tta_tour {
.vc_tta-tab {
> a {
border-width: 1px;
padding-left: 50px;
padding-top: 12px;
padding-bottom: 12px;
&:hover {
.boxhadow_acc_tab();
}
}
&.vc_active {
> a {
&:before {
height: 1px;
width: 10px;
}
&:hover {
.box-shadow(none);
}
}
}
}
}
}
}
.dfd_pagination();
.dfd_pagination() {
.dfdrounded ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdrounded {
li {
span,
a {
border-radius: 40px;
}
&.slick-active,
&.vc_active {
span,
a {
&:before {
border-radius: 40px;
}
}
}
}
}
.dfdrounded ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdrounded,
.dfdsquare ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdsquare {
li {
span,
a {
border-color: @border-color;
border-style: solid;
border-width: 1px;
position: relative;
height: 12px;
width: 12px;
.transition(border-color .3s ease);
&:hover {
border-color: darken(@border-color, 20%);
}
}
&.slick-active,
&.vc_active {
span,
a {
&:before {
content: "";
background: @third-site-light-color;
display: block;
position: absolute;
width: 6px;
left: 50%;
top: 50%;
margin-left: -3px;
margin-top: -3px;
right: 0;
height: 6px;
}
}
}
}
}
.dfdfillrounded ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdfillrounded {
li {
span,
a {
border-radius: 40px;
}
}
}
.dfdfillrounded ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdfillrounded,
.dfdfillsquare ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdfillsquare {
li {
span,
a {
border-color: darken(@background-grey, 10%);
background-color: darken(@background-grey, 10%);
border-style: solid;
border-width: 1px;
position: relative;
height: 10px;
width: 10px;
.transition(~"background .3s ease, border-color .3s ease");
&:hover {
border-color: darken(@background-grey, 20%);
background-color: darken(@background-grey, 20%);
}
}
&.slick-active,
&.vc_active {
span,
a {
border-color: @third-site-light-color;
background: @third-site-light-color;
}
}
}
}
.dfdemptyrounded ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdemptyrounded {
li {
span,
a {
border-radius: 40px;
}
}
}
.dfdemptyrounded ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdemptyrounded,
.dfdemptysquare ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdemptysquare {
li {
span,
a {
border-color: @border-color;
border-style: solid;
border-width: 1px;
position: relative;
height: 10px;
width: 10px;
.transition(border-color .3s ease);
&:hover {
border-color: darken(@border-color, 20%);
}
}
&.slick-active,
&.vc_active {
span,
a {
border-color:@third-site-light-color;
}
}
}
}
.dfdline ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdline {
li {
span,
a {
position: relative;
height: 12px;
width: 33px;
margin-left: 7px;
margin-right: 7px;
&:before {
content: "";
display: block;
width: 100%;
position: absolute;
top: 50%;
border-bottom: 1px solid @border-color;
.transition(border-color .3s ease);
}
&:hover {
&:before {
border-color: darken(@border-color, 20%);
}
}
}
&.slick-active,
&.vc_active {
span,
a {
&:before {
border-color:@third-site-light-color;
}
}
}
}
}
.dfdadvancesquare ul.dfd-slick-dots,
ul.vc_general.vc_pagination.vc_pagination-style-dfdadvancesquare {
li {
span,
a {
border-radius: 0px;
background-color: darken(@background-grey, 10%);
border-color: transparent !important;
background-clip: padding-box !important;
border-style: solid;
border-width: 1px;
height: 12px;
width: 12px;
.transition(~"background .3s ease, border-color .3s ease");
&:before {
.opacity(0);
.transition(opacity .3s ease);
}
&:hover {
border-color: darken(@background-grey, 20%);
background-color: darken(@background-grey, 20%);
&:before {
border-bottom-color: darken(@background-grey, 20%);
}
}
}
&.slick-active,
&.vc_active {
span,
a {
background: @third-site-light-color;
border-color: transparent !important;
&:before {
.opacity(1);
display: block;
top: -10px;
background: none !important;
width: 10px;
height: 10px;
position: relative;
bottom: 100%;
margin-left: 0px;
z-index: 1;
content: "";
border-top: 5px solid rgba(255, 255, 255, 0);
border-bottom: 5px solid @third-site-light-color;
border-right: 5px solid rgba(255, 0, 0, 0);
border-left: 5px solid rgba(255, 0, 0, 0);
}
}
}
}
}
.dfdlineold {
.slick-list + .dfd-slick-dots li {
bottom: 25px;
}
ul.dfd-slick-dots {
li {
margin: 0 7px;
background: transparent;
span {
.rel();
.block();
width: 14px;
height: 5px;
&:before,
&:after {
content: "";
.block();
width: 14px;
height: 1px;
.abs();
top: 2px;
left: 0;
.transform(rotate(0deg));
}
&:before {
background: darken(@background-grey, 10%);
.transition(transform .3s ease);
}
&:after {
background: transparent;
-webkit-transition: -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease, background 0s linear .2s;
-moz-transition: -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease, background 0s linear .2s;
transition: -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease, background 0s linear .2s;
}
&:hover {
&:before {
.transform(rotate(-45deg));
}
&:after {
background: darken(@background-grey, 10%);
.transform(rotate(45deg));
-webkit-transition: -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease, background 0s linear .05s;
-moz-transition: -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease, background 0s linear .05s;
transition: -webkit-transform .3s ease, -moz-transform .3s ease, -o-transform .3s ease, transform .3s ease, background 0s linear .05s;
}
}
}
&.slick-active {
span {
&:before,
&:after {
background: @third-site-light-color;
}
}
}
}
}
}
&.dfdroundedold {
.slick-list + .dfd-slick-dots li {
bottom: 15px;
}
ul.dfd-slick-dots {
li {
margin: 0 7px;
span {
display: block;
position: relative;
border-radius: 50%;
width: 7px;
height: 7px;
background: transparent;
border: 1px solid @border-color;
.transition(~'background .2s ease-in-out, border-color .2s ease-in-out');
}
&.slick-active {
span {
background: @third-site-light-color;
border-color: @third-site-light-color;
}
}
}
}
}
&.dfdemptyroundedold {
.dfd-slick-dots {
li {
margin: 0 7px;
span {
.block();
.rel();
.rounded(50%);
width: 7px;
height: 7px;
background: darken(@background-grey, 10%);
.box-shadow(0 0 0 0 transparent);
.transition(~"background .2s ease-in-out, -webkit-box-shadow .2s ease-in-out, -moz-box-shadow .2s ease-in-out, -o-box-shadow .2s ease-in-out, box-shadow .2s ease-in-out");
}
&.slick-active {
span {
background: transparent;
.box-shadow(0 0 0 2px @third-site-light-color);
}
}
}
}
}
&.dfdfillsquareold {
.dfd-slick-dots {
li {
margin: 0 7px;
span {
.block();
.rel();
width: 4px;
height: 4px;
background: darken(@background-grey, 10%);
.box-shadow(0 0 0 2px transparent);
.transition(~"background .2s ease-in-out, -webkit-box-shadow .2s ease-in-out, -moz-box-shadow .2s ease-in-out, -o-box-shadow .2s ease-in-out, box-shadow .2s ease-in-out");
}
&.slick-active {
span {
background: @third-site-light-color;
.box-shadow(0 0 0 1px @third-site-light-color);
}
}
}
}
}
}
@media (min-width: 768px) {
.dfd_tabs_block {
.dfd_tta_tabs {
.vc_tta-panels-container {
.vc_tta-panels {
.vc_tta-panel {
.transition(~"opacity .4s ease, visibility .4s ease");
.abs();
top: 0;
left: 0;
opacity: 0;
visibility: hidden;
width: 100%;
&:first-child {
.rel();
}
&.vc_active {
.transform(translateY(0));
opacity: 1;
visibility: visible;
-webkit-animation-name: changeTabSlideActive;
animation-name: changeTabSlideActive;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-duration: .4s;
animation-duration: .4s;
}
&:not(.vc_active) {
.transform(translateY(0));
-webkit-animation-name: changeTabSlideNoActive;
animation-name: changeTabSlideNoActive;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-duration: 1s;
animation-duration: 1s;
}
}
}
}
}
}
}
@media (max-width: 767px) {
.dfd_tabs_block {
.dfd_tta_tabs {
.vc_tta-panels-container {
&:before,
&:after {
.hide() !important;
}
.vc_tta-panels {
.vc_tta-panel {
.vc_tta-panel-body {
opacity: 0;
visibility: hidden;
height: 0;
padding-top: 0;
.transition(~"opacity .4s ease, visibility .4s ease, padding .4s ease");
}
&.vc_active {
.vc_tta-panel-body {
height: auto;
opacity: 1;
visibility: visible;
padding-top: 22px;
padding-bottom: 22px;
}
}
&:last-child {
&.vc_active {
.vc_tta-panel-body {
padding-bottom: 0;
}
}
}
}
}
}
}
.dfd_tta_tour {
.vc_tta-panels-container .vc_tta-panels .vc_tta-panel .vc_tta-panel-heading {
border-width: 1px;
}
}
}
}