ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / centosnipponia / public_html / nipponiacom2 / caribe / templates / jm-car-dealer-ef4 / less

//--------------------------------------------------------------
// Copyright (C) joomla-monster.com
// License: http://www.joomla-monster.com/license.html Joomla-Monster Proprietary Use License
// Website: http://www.joomla-monster.com
// Support: info@joomla-monster.com
//---------------------------------------------------------------

// MODULES styles
//---------------------------------------------------------------

.span0 {
  float: none !important;
}

// default module
// --------------------------

.jm-module {
  margin-bottom: @JMbaseSpaceBig;
  .jm-title {
    line-height: 1;
    font-family: @JMmoduleTitleFontFamily;
    font-size: 20px;
    font-weight: 900;
    text-transform: uppercase;
    margin: 0 0 35px;
    color: @JMmoduleTitleFontColor;
  }
}

.moduletable {
  margin: 0 0 @JMbaseSpace;
  > h3 {
    margin: 0 0 20px;
    color: @JMmoduleTitleFontColor;
  }
}

#jm-top1-in,
#jm-footer-mod-in {
  .jm-module .jm-title {
    color: @JMtopfooterModuleTitleColor;
  }
  .moduletable {
    > h3 {
      color: @JMtopfooterModuleTitleColor;
    }
  }
}

// small-title-ms
// --------------------------

.jm-module.small-title-ms {
  .jm-title {
    font-size: 20px;
    line-height: 1.1;
    letter-spacing: normal;
  }
}

// logout topbar module
// --------------------------

#jm-topbar {
  div.login-greeting,
  .logout-button {
    display: inline-block;
  }
  .logout-button .btn {
    font-size: 10px;
    height: 24px;
    line-height: 1.1;
    padding: 0 15px;
    vertical-align: top;
    margin-left: 10px!important;
    margin-top: 8px;
  }
}

// jm-module-raw
// --------------------------

.jm-module-raw {
  float: right;
  margin-left: 20px;
}

// margin-ms
// --------------------------

#jm-allpage .jm-module.margin-ms {
  margin: 0!important;
}

// bottom-margin-ms
// --------------------------

#jm-allpage .jm-module.bottom-margin-ms {
  margin-bottom: 0!important;
}

// side-margin-ms
// --------------------------

#jm-allpage .jm-module.side-margin-ms {
  margin-left: -(@JMbaseSpace /2) !important;
	margin-right: -(@JMbaseSpace /2) !important;
}

// header modules
// --------------------------

#jm-header {
  .jm-module {
    margin-bottom: @JMbaseSpace;
  }
}

#jm-header .jm-module.header-ms,
#jm-header .jm-module.slider-ms {
  margin: 0 -@JMbaseSpaceBig;
  p {
    margin: 0;
  }
}

.notopmargin {
  margin-top: 0;
}

// hr
// --------------------------

hr.jm,
div.hr {
	margin: 0;
}

// top1 modules
// --------------------------

#jm-top1 {
  .jm-module {
    margin-bottom: @JMbaseSpace;
  }
}

// top1 and footer-mod section
// --------------------------

#jm-top1,
#jm-footer-mod {
  .jm-module .jm-title {
    color: @JMtopfooterModuleTitleColor;
  }
  .moduletable {
    > h3 {
      color: @JMtopfooterModuleTitleColor;
    }
  }
  .category-module {
    .mod-articles-category-title {
      color: @JMtopfooterModuleTitleColor;
    }
  }
  .newsflash {
    h1,h2,h3,h4,h5 {
      color: @JMtopfooterModuleTitleColor;
      a {
        color: @JMtopfooterModuleTitleColor;
      }
    }
  }
  .readmore {
    color: @JMtopfooterModuleTitleColor;
    border: 1px solid @JMborderTopFooter;
    &:hover {
      border: 1px solid transparent;
      background: @JMstyleReadmoreBackground;
    }
  }
  .btn,
  a.button,
  input.button,
  button.button {
    color: @JMtopfooterModuleTitleColor;
    border: 1px solid @JMborderTopFooter;
    &:hover {
      border: 1px solid transparent;
    }
  }
  .nav.menu {
    li {
      &:hover > a,
      &.active > a {
        color: @JMstyleMenuFontColorHover;
      }
    }
    > li > a,
    > li > span.separator {
      border-top: 1px solid darken(@JMborderTopFooter, 17.2% );
      color: @JMtopfooterTextColor;
    }
    > li:first-child {
      > a,
      > span.separator {
        border: none;
      }
    }
    > li.parent.deeper > a,
    > li.parent.deeper > span.separator {
      border-bottom: 1px solid darken(@JMborderTopFooter, 17.2% );
    }
    .nav-child li {
      a,
      span.separator {
        color: @JMtopfooterTextColor;
      }
      &:hover > a,
      &.active > a {
        color: @JMstyleMenuFontColorHover;
      }
    }
    &.dropdown-ms {
      li {
        &:hover > a {
          color: @JMtopfooterModuleTitleColor;
        }
      }
      > li {
        > a,
        > span.separator {
          color: @JMtopfooterModuleTitleColor;
          border: none;
        }
        &.parent.deeper > a,
        &.parent.deeper > span.separator {
          border: none;
        }
      }
      .nav-child li {
        a,
        span.separator {
          color: @JMtopfooterModuleTitleColor;
        }
        &:hover > a,
        &.active > a {
          color: @JMtopfooterModuleTitleColor;
        }
      }
    }
  }
}

// search module
// --------------------------

#jm-allpage .djc_mod_search,
#jm-allpage .search form {
  .btn {
    font-size: 0;
    background-color: @JMcustomButtonBackground;
    background-image: url('../images/search.png');
    background-repeat: no-repeat;
    background-position: center center;
    &:hover {
      background-color: @JMstyleButtonBackgroundHover;
    }
    .border-radius(@JMbuttonBorderRadius);
    padding: 0;
    margin: 0 0 0 6px;
    border: none;
    width: 50px;
    height: 50px;
    .icon-search {
      display: none;
    }
  }
  .inputbox {
    max-width: 345px;
    margin: 0;
  }
}

#jm-top1 .djc_mod_search,
#jm-top1 .search form {
	text-align: right;
}

#jm-right .djc_mod_search .inputbox {
  max-width: 250px;
}

// circle-menu
// --------------------------

#jm-allpage #jm-allpage-in .jm-module .nav.menu > li.parent {
  a.circle-menu-ms {
    position: relative;
    &:before {
      .border-radius(3px);
    }
    &:after {
      position: absolute;
      content: '';
      top: 0;
      bottom: auto;
      left: 0;
      right: auto;
      width: @JMcircleMenuButtonSize !important;
      height: @JMcircleMenuButtonSize !important;
      background-repeat: no-repeat;
      background-position: center center;
      background-image: url('../images/icon-x.png');
      background-color: @JMstyle;
      .border-radius(@JMbuttonBorderRadius);
      z-index: 300;
      cursor: pointer;
      padding: 0;
      margin: 0;
      display: none!important;
      z-index: 15;
    }
    &.active:after {
      display: block!important;
    }
  }

a.circle-menu-ms + ul {
    display: block;
    background: @JMcircleMenuBackground;
    border: 1px solid @JMcircleMenuBorder;
    position: absolute;
    width: @JMcircleMenuItemSize;
    height: @JMcircleMenuItemSize;
    top: -(@JMcircleMenuButtonSize/2);
    left: -(@JMcircleMenuButtonSize/2);
    right: auto;
    bottom: auto;
    padding: 0;
    margin: 0;
    .border-radius(50%)!important;
    .transition2(opacity 0.3s, visibility 0s 0.3s);
    pointer-events: none;
    visibility: none;
    .opacity(0);
    .animation(none);
    z-index: 10;
  }
  a.circle-menu-ms.active + ul {
    visibility: visible;
    .opacity(100);
    pointer-events: auto;
    padding: @JMcircleMenuSize;
    top: -@JMcirclePosition;
    left: -@JMcirclePosition;
    right: auto;
    bottom: auto;
  }
  a.circle-menu-ms.active + ul ul {
    display: none;
  }
  a.circle-menu-ms + ul li {
    display: block;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    position: absolute;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center center;
    background-color: @JMcircleMenuItemBackground;
    border: 1px solid @JMcircleMenuItemBorder;
    .transition2(transform 0.3s, box-shadow 0.3s);
    width: @JMcircleMenuItemSize;
    height: @JMcircleMenuItemSize;
    font-size: 0;
    padding: 0;
    margin: 0;
    .border-radius(50%);
    .box-shadow(inset 0 0 0 5px @JMcircleMenuItemBorder);
    img {
      margin: 0;
      width: @JMcircleMenuImageSize;
      height: @JMcircleMenuImageSize;
    }
    a {
      display: block;
      padding: (((@JMcircleMenuItemSize)-(@JMcircleMenuImageSize))/2);
      background: none;
    }
  }
  a.circle-menu-ms + ul li {
    padding: 0;
    margin: 0;
    border: none;
    &:hover {
      .box-shadow(inset 0 0 0 5px @JMstyle);
    }
  }
  a.circle-menu-ms.active + ul li {
    display: none;
    &:first-child {
      .translate3d(0, -160px, 0);
      display: block;
    }
    &:nth-child(2) {
      .translate3d(113.14px, -113.14px, 0);
      display: block;
    }
    &:nth-child(3) {
      .translate3d(160px, 0, 0);
      display: block;
    }
    &:nth-child(4) {
      .translate3d(113.14px, 113.14px, 0);
      display: block;
    }
    &:nth-child(5) {
      .translate3d(0, 160px, 0);
      display: block;
    }
    &:nth-child(6) {
      .translate3d(-113.14px, 113.14px, 0);
      display: block;
    }
    &:nth-child(7) {
      .translate3d(-160px, 0, 0);
      display: block;
    }
    &:nth-child(8) {
      .translate3d(-113.14px, -113.14px, 0);
      display: block;
    }
  }
}

// box
// --------------------------

.jm-box {
  margin-top: -@JMbaseSpace;
  margin-left: -(@JMbaseSpace /2);
	margin-right: -(@JMbaseSpace /2);
  &.col1 .jm-box-in {
    width: 100%;
  }
  &.col2 .jm-box-in {
    width: 50%;
  }
  &.col3 .jm-box-in {
    width: 33.3%;
  }
  &.col4 .jm-box-in {
    width: 25%;
  }
  .jm-box-in {
    float: left;
    .box-sizing(border-box);
    padding-left: (@JMbaseSpace /2);
		padding-right: (@JMbaseSpace /2);
    padding-top: @JMbaseSpace;
  }
}

.jm-our-services {
  display: table;
  .image {
    display: table-cell;
    vertical-align: top;
    float: left;
    text-decoration: none;
    display: block;
    span {
      display: block;
      padding: 30px;
      width: @JMourservicesIconSize;
      height: @JMourservicesIconSize;
      .border-radius(50%);
      background-position: center center;
      background-repeat: no-repeat;
      margin: 0 @JMbaseSpace @JMbaseSpace 0;
      .transition(all 0.3s ease-in-out);
      border: 2px solid @JMstyleOurservicesImageColor;
       &.icon1 {
        background-image: url('../images/@{JMimagesDir}/icon1.png');
      }
      &.icon2 {
        background-image: url('../images/@{JMimagesDir}/icon2.png');
      }
      &.icon3 {
        background-image: url('../images/@{JMimagesDir}/icon3.png');
      }
      &.icon4 {
        background-image: url('../images/@{JMimagesDir}/icon4.png');
      }
    }
    &:hover {
      span {
        border: 2px solid transparent;
        .box-shadow2(0 0 0 5px @JMstyleOurservicesImageColor, inset 0 0 0 2px @JMstyleOurservicesImageColor);
      }
    }
  }
  .description {
    padding-top: @JMbaseSpace;
    display: table-cell;
    vertical-align: top;
    .title {
      font-weight: 700;
      font-size: 24px;
      color: @JMheadingFontColor;
      line-height: 1.1;
      margin: 0 0 15px;
      a {
        color: @JMheadingFontColor;
        text-decoration: none;
        &:hover{
          color: @JMstyleOurservicesLinkColor;
        }
      }
    }
  }
}

.jm-brands {
  img {
    .opacity(80);
    &:hover {
      .opacity(100);
    }
  }
}

// social
// --------------------------

.jm-social {
  margin: 0;
  a {
    display: inline-block;
    text-decoration: none!important;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    .transition(all 0.3s ease-in-out);
    background-repeat: no-repeat;
    background-position: center center;
    background-color: @JMsocialIconsBackground;
    .border-radius(@JMbuttonBorderRadius);
    &:first-child {
      margin-left: 0;
    }
  }
  a.jm-facebook {
    background-image: url('../images/social/facebook.png');
    &:hover {
      background-color: #3C599F;
    }
  }
  a.jm-instagram {
    background-image: url('../images/social/instagram_icon.png');
    &:hover {
      background-color: #9b6954;
    }
  }
  a.jm-google {
    background-image: url('../images/social/google.png');
    &:hover {
      background-color: #db4a37;
    }
  }
  a.jm-twitter {
    background-image: url('../images/social/twitter.png');
    &:hover {
      background-color: #2DABE1;
    }
  }
  a.jm-skype {
    background-image: url('../images/social/skype.png');
    &:hover {
      background-color: #27A6C7;
    }
  }
  a.jm-rss {
    background-image: url('../images/social/rss.png');
    &:hover {
      background-color: #FE9B06;
    }
  }
}

// latest news module
// --------------------------

.category-module {
  margin: -@JMbaseSpace 0 0;
  li {
    background-image: none;
    padding: 0;
    margin: 0;
    padding-top: @JMbaseSpace;
  }
  li > a {
    display: block;
    font-weight: normal;
  }
  .mod-article-image {
    float: left;
    display: table;
    margin-right: @JMbaseSpace;
    margin-top: 5px;
    img {
      max-width: @JMlatestnewsImageSize;
    }
  }
  .mod-articles-category-title {
    font-size: 16px;
    font-weight: normal;
    text-decoration: none;
    color: @JMmenuFontColor;
  }
  .mod-articles-category-date {
    font-size: 12px;
    text-transform: uppercase;
  }
}

.col2 .category-module {
  margin-left: -@JMbaseSpace;
  li {
    float: left;
    width: 50%;
    padding-left: @JMbaseSpace;
    .box-sizing(border-box);
  }
}

.col3 .category-module {
  margin-left: -@JMbaseSpace;
  li {
    float: left;
    width: 33.3%;
    padding-left: @JMbaseSpace;
    .box-sizing(border-box);
  }
}

.col4 .category-module {
  margin-left: -@JMbaseSpace;
  li {
    float: left;
    width: 25%;
    padding-left: @JMbaseSpace;
    .box-sizing(border-box);
  }
}

#jm-djmenu {
  .mod-articles-category-title {
    font-size: 16px;
    line-height: 1;
  }
  .category-module {
    margin: -10px 0 0;
    li {
      padding: 10px 0 0;
    }
    .mod-articles-category-introtext {
      margin-top: 10px;
    }
  }
}

.category-module.nav.menu {
  padding: 0;
  .mod-articles-category-title {
    color: @JMmenuFontColor;
    &:hover{
      color: @JMstyleMenuFontColorHover;
    }
  }
}

// opening hours
// --------------------------

.nav.menu.opening-hours {
  span {
    display: block;
  }
  span.day {
    display: inline-block;
    width: 50%;
  }
  span.hour {
    display: inline-block;
  }
}

// contact page
// --------------------------

#jm-allpage .contact-ps {
  h3,
  form#contact-form > fieldset > legend,
  > .contact-address.dl-horizontal {
    display: none;
  }
  .controls {
    margin: 0 !important;
  }
  .control-group {
    margin: 0;
  }
  .contact-form > form > fieldset > legend + .control-group,
  .contact-form > form > fieldset > legend + .control-group + .control-group {
    float: left;
    width: 50%;
    margin: @JMbaseSpace 0 5px;
    .box-sizing(border-box);
  }
  .contact-form > form > fieldset > legend + .control-group {
    padding-right: (@JMbaseSpace/2);
  }
  .contact-form > form > fieldset > legend + .control-group + .control-group {
    padding-left: (@JMbaseSpace/2);
  }
  > h3:first-child {
    display: block;
    font-size: 34px;
    line-height: 1.1;
    font-weight: 900;
    color: @JMheadingFontColor;
    margin: 0;
    letter-spacing: 3px;
    text-transform: uppercase;
  }
  .form-horizontal .control-label {
    float: none !important;
    width: auto;
    text-align: inherit !important;
    padding: 0;
    label {
      margin: 5px 0;
    }
  }
  .form-horizontal .controls {
    margin: 0;
    input,
    textarea {
      max-width: none;
    }
  }
  .form-actions {
    background: none;
    border: none;
    padding: 0;
    text-align: right;
  }
}

// table pricing
// --------------------------

#jm-allpage table.pricing {
  float: left;
  margin: 0 0 @JMbaseSpace;
  th {
    background: @JMpricingTableHeadBackground;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 1;
    font-weight: 900;
    text-align: center;
    border-right: 1px solid @JMpricingTableHeadBorder;
    border-left: 1px solid @JMpricingTableHeadBorder;
    padding: 25px;
    color: @JMpricingTableHeadFontColor;
  }
  td {
    padding: 20px;
    background: @JMpricingTableBackground;
    font-size: 16px;
    border-bottom: 1px solid @JMpricingTableBorder;
    border-right: 1px solid @JMpricingTableBorder;
    &:first-child {
      border-left: 1px solid @JMpricingTableBorder;
    }
  }
  td.item {
    border-right: none;
  }
  td.price {
    width: 100px;
    text-align: center;
  }
}

[+] ..
[-] animated-buttons.less [edit]
[-] bootstrap.less [edit]
[-] bootstrap_responsive.less [edit]
[-] bootstrap_responsive_rtl.less [edit]
[-] bootstrap_rtl.less [edit]
[-] bootstrap_variables.less [edit]
[-] comingsoon.less [edit]
[-] custom.less [edit]
[-] djcatalog.less [edit]
[-] djcatalog_responsive.less [edit]
[-] djcatalog_rtl.less [edit]
[-] djmediatools.less [edit]
[-] djmediatools_responsive.less [edit]
[-] djmediatools_rtl.less [edit]
[-] djmegamenu.less [edit]
[-] djmegamenu_rtl.less [edit]
[-] editor.less [edit]
[-] index.html [edit]
[-] joomla.less [edit]
[-] layout.less [edit]
[-] menus.less [edit]
[-] modules.less [edit]
[-] offcanvas.less [edit]
[-] offline.less [edit]
[+] override
[-] template.less [edit]
[-] template_mixins.less [edit]
[-] template_responsive.less [edit]
[-] template_rtl.less [edit]
[-] template_variables.less [edit]
[-] .htaccess.disabled [edit]