/* Mobile Medi Query : 480-less    - phone landscape & smaller

============================= */



@charset "UTF-8";

body {



    font-family: isans, sans-serif;

    font-size: 0.8rem;

    line-height: 2;



}



ul, ol {

    list-style: none;

    margin: 0;

    padding: 0;

}



a {

    color: inherit;

}



a:hover {

    color: inherit;

    text-decoration: none !important;

    text-underline: none;

}



button:focus {

    outline: none;

}



.srf-main-menu {

    float: right;

    z-index: 10001;



}



.srf-main-menu ul {



    z-index: 10002;

    padding: 0;

    margin: 0;

}



.srf-main-menu ul li {

    list-style: none;

    float: right;

}



.srf-main-menu > ul > li > a {

    color: #363636 !important;

}



.srf-main-menu > ul > li {

    position: relative;

}



.srf-main-menu > ul > li > a {

    line-height: 28px;

}



.srf-main-menu ul li a {

    padding: 0 10px;

    display: block;

    text-transform: uppercase;

    font-size: 12px;

    color: #fff;

    line-height: 2;

}



.srf-main-menu ul > li > a:hover,

.srf-main-menu > ul > li:hover > a {

    transition: all 0.3s ease-in-out;

    color: #fff !important;

    background-color: #000 !important;

}





.srf-main-menu ul li a:hover {



}



.srf-main-menu ul > li:hover > ul {

    visibility: visible;

    opacity: 1;

    /*display: block;*/

    transition: opacity 0.3s ease-in-out;

    opacity: 1;





}



/*Hiding Submenus*/

.srf-main-menu ul.sub-menu {

    /*display: none;*/

    visibility: hidden;

    opacity: 0;

    position: absolute;

    right: 0;

    padding: 0;

    margin: 0;

    white-space: nowrap;

    /*border: 1px solid rgba(128, 128, 128, 0.12);*/

    border-top: none;

    color: #fff;

    background-color: #000;

    transition: all 0.3s ease-in-out;

    min-width: 150px;





}



.srf-main-menu ul.sub-menu li {

    border-bottom: 1px solid rgba(128, 128, 128, 0.13);

    width: 100%;

    position: relative;

    line-height: 4;



}



.srf-main-menu ul.sub-menu ul.sub-menu {

    float: none;

    position: absolute;

    right: 100%;

    padding: 0;

    top: 0;

    height: inherit;



}



.page-header, .single-blog-header, .single-product-header, .term-header {

    height: 140px;

    background-color: #4c4c4c;

    margin-bottom: 10px;

    padding: 20px;

}







.products img {

    /*margin-bottom: 10px;*/

}



.search-wrapper {

    font-size: 12px;

    line-height: 4;

}



.search-wrapper input[type=text] {

    background: #fff url(../../../img/icon-magnify.svg) no-repeat right 10px center;

    background-size: 15px;

    margin: 0;

    font-size: 12px;

    border-radius: 15px;

    height: 30px;

    border: 1px solid #c5c0bd;

    padding-right: 10px;

    font-weight: 300;

    width: 95%;

    background-position: 10px;

    text-align: center;

}



.search-wrapper #search-submit {

    display: none;

}



[type=button], [type=submit] {

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none;

    border-radius: 0;

}



:focus {

    outline: none;

}



.article-header {



    background-color: #4c4c4c;

    margin-bottom: 10px;

    padding: 20px;

    position: relative;

    height: 150px;

}



.article-header .title-wrap {

    position: absolute;

    bottom: 15px;

    width: 100%;

}



.article-header .title-wrap .entry-title {

    color: #fff;

    margin-bottom: 0;

    font-size: 24px;

    letter-spacing: 0;

}





#menu-products-page-categories {

    margin-bottom: 5px;

    background: #f3f3f3;



}



#menu-products-page-categories li {

    text-align: center;

    font-size: 15px;

    border-top: 1px solid #4c4c4c;

    border-bottom: 1px solid #4c4c4c;

    padding: 5px 0;

    transition: background-color .2s ease-in;

}





#menu-products-page-categories li a {

    display: block;

    position: relative;

    border-left: 1px solid #4c4c4c;

    font-size: 12px;



}



#menu-products-page-categories li:last-child a {



    border-left: none;

}



#menu-products-page-categories li:hover,

#menu-products-page-categories li.current_page_item

{

    background: #4c4c4c;

    color: #fff;

    border: none;

}



.product-button {

    background-color: #d1d3d4;

    color: #363636;

    font-size: 13px;

    padding: 10px 12px !important;

    line-height: 1 !important;

    display: block;

    width: 100%;

    text-align: center;

}



.product-button img{

    margin:0 5px;

}





/*Slick Slider Product Page*/



.product-gallery-nav .slick-track {

    margin: 0;

}



.product-gallery-nav .slick-slide img {

    display: block;

    padding: 10px 5px 0 0;

    margin-right: 2px;

    text-align: center;

}



.product-gallery, .product-gallery-nav {

    overflow: hidden;

    visibility: hidden;

    opacity: 0

}



.product-gallery-nav.slick-initialized, .product-gallery.slick-initialized {

    transition: opacity 1s ease;

    visibility: visible;

    opacity: 1

}



.product-gallery .slick-loading, .product-gallery-nav .slick-loading {

    visibility: hidden

}



.product-gallery .slick-arrow, .product-gallery-nav .slick-arrow {

    position: absolute;

    top: 50%;

    margin-top: -15px;

    width: 30px;

    height: 30px;

    background-color: rgba(255, 255, 255, .4);

    cursor: pointer;

    transition: all .3s;

    z-index: 99

}



.collection-gallery-nav .slick-arrow:hover, .product-gallery .slick-arrow:hover, .product-gallery-nav .slick-arrow:hover {

    background-color: #fff

}



.product-gallery .slick-prev, .product-gallery-nav .slick-prev {

    right: 2px;

    border: none;

}



.product-gallery .slick-prev svg, .product-gallery-nav .slick-prev svg {

    margin-right: 3px;

    margin-top: 2px

}



.product-gallery .slick-next, .product-gallery-nav .slick-next {

    left: 0;

    border: none;

}



.product-gallery .slick-next svg, .product-gallery-nav .slick-next svg {

    margin-right: 3px;

    margin-top: 2px

}



.product-gallery-nav {

    /*border-bottom: 2px solid #f4f4f4*/

}



.product-gallery-nav .nav-thumbnail {

    padding: 5px;

    cursor: pointer

}







/* TABS

============================= */



.tabs {

    border-bottom: 1px solid #aeafb1;

}



.tabs:after, .tabs:before {

    display: table;

    content: ' ';

    -webkit-flex-basis: 0;

    -ms-flex-preferred-size: 0;

    flex-basis: 0;

    -webkit-order: 1;

    -ms-flex-order: 1;

    order: 1;

}



.tabs .tabs-title.active {

    border-bottom: 6px solid #4c4c4c;

}



product-tabs-wrapper .tabs .tabs-title {



    text-transform: uppercase;

}



.product-tabs-wrapper .motto{

    border: 1px solid grey;

    padding:  10px; height: 100px;

    background-color: #c7c8ca;

    margin-left: 10px;

}



.product-tabs-wrapper  .motto p{

    margin: 0;

}



.product-tabs-wrapper  .motto .order-sample a{

    text-transform: uppercase;

    font-weight: bold;

    font-size: 1.8em;

    margin-top: 10px;

}







.tabs-title {



    text-align: right;

}



.product-tabs-wrapper .tabs .tabs-title a {

    position: relative;

}



.product-tabs-wrapper .tabs .tabs-title a {



    text-transform: uppercase;



}





.tabs-title > a {

    display: block;

    padding: 0;

    font-size: 15px;

    color: #4c4c4c;

}



.tabs-title > a::after {

    content: "|";

    position: absolute;

    left: 0;

    color: rgb(217, 217, 217);

    font-size: 15px;

    top: 0;

}



.tabs-title:last-child > a::after {

    content: "";



}



/* Tab Tables

============================= */

.product-tabs-wrapper table.specifications {

    height: 235px;

}



.product-tabs-wrapper table {

    margin-bottom: 10px;

    line-height: 0;

}



.product-tabs-wrapper table.specifications th,

.product-tabs-wrapper table.specifications td

{

    width: 50%;

    text-transform: uppercase;

    padding: 0.75rem;

    vertical-align: middle;

    border-top: 1px solid #dee2e6;

    font-size: 12px;

}





.product-tabs-wrapper table.usage th{



    text-transform: uppercase;

    padding: 0.75rem;

    vertical-align: middle;

    border-top: 2px solid #e6e6e6;

    font-size: 12px;

}





.product-tabs-wrapper table.usage td {



    text-transform: uppercase;

    padding: 0.75rem;

    vertical-align: middle;

    border-top: 1px solid #dee2e6;

    font-size: 12px;

}



.product-tabs-wrapper table th,

.product-tabs-wrapper table td {

    border: none;

}



/* https://fabiofranchino.com/blog/vertical-text-with-css/

============================= */

.img-overlay-text {



    writing-mode: tb;

    display: flex;

    height: 100%;

    padding: 15px;

    background: #00000070;

}



.img-overlay-text p {

    margin: auto;

    transform: rotate(180deg);

    -ms-transform: rotate(360deg);

    font-size: 22px;

    color: white;

    text-transform: uppercase;

    word-spacing: 5px;

}



/* MAIN SIDEBAR

============================= */



.main-sidebar .logo-container {

    height: 150px;

    background-color: #4c4c4c;

}



.main-sidebar .logo-container img {

    padding: 10px 25px;

}



.main-sidebar .sidebar-inner {



    height: 100%;

    background: #0000009e;

}



.sidebar-widget-menu {

    padding: 25px;



}



.sidebar-menu-container {

    margin-bottom: 12px;

    padding-bottom: 12px;

    border-bottom: 1px solid rgba(255, 255, 255, .2);

}



.sidebar-menu-container ul li {

    display: block;

    width: 100%;

}



.sidebar-menu-container ul li a {

    color: #fff;

    font-size: 14px;

    padding: 5px 0;

    font-weight: 300;

    display: block;

}





/* Footer Home

============================= */



.home-footer {

    font-size: 12px;



}



.home-footer-menu li {

    display: inline-block;

    padding: 10px;

    text-align: center;

}





.home-footer .copyright-text {

    padding: 10px 0;

    text-align: center;

}



/* article header

============================= */



.margin-bottom-10 {

    margin-bottom: 10px;

}



.margin-bottom-20 {

    margin-bottom: 20px;

}



.margin-bottom-30 {

    margin-bottom: 30px;

}





.article-header {



    background-color: #4c4c4c;

    margin-bottom: 0;

    padding: 0;

    position: relative;

    height: inherit;



}



.article-header .title-wrap {

    position: static;

}



.article-header .title-wrap .entry-title {

    color: #fff;

    margin-bottom: 0;

    font-size: 18px;

    letter-spacing: 0;

    text-align: center;

    padding: 20px;

    text-transform: uppercase;

}



.product-slogan-small {

    text-align: center;

    padding: 10px 0;

    text-transform: uppercase;



}



.product-main-video-small {

    /*margin-bottom: 10px;*/

}





.slick-slide img {

    display: block;

    margin: auto;

}





.product-gallery {

    max-height: 800px;

    overflow: hidden;

}



.sidebar-box {

    max-height: 200px;

    position: relative;

    padding: 0;

    overflow: hidden;

    text-align: justify;

}



.sidebar-box-divider {

    margin: 1em 0;

    border: 1px solid #d1d3d4;

    width: 100%;

}



.tab-img {

    background-position: center center;

    background-size: cover !important;

    height: 235px;



}



/* MOBILE HEADER

============================= */



.mobile-header {

    background: black;

    height: 70px;

}



.mobile-logo-portrait{

    text-align: center;

}



.mobile-logo-portrait-menu-icon {

    padding: 20px;

    color: white;



}



.mobile-logo-portrait-menu-icon svg {

    width: 25px;





}



.mobile-logo-portrait-logo {

    text-align: right;

    padding-right: 20px;

}



.mobile-title {

    background-color: #4c4c4c;

    padding: 10px;

    height: 70px;

    text-align: center;



}



.mobile-title .entry-title {

    font-size: 18px;

    color: white;

    line-height: 3;





}



/* PRODUCT TABS

============================= */



.product-tabs-wrapper .tabs-title {



    text-align: center;

}



.product-tabs-wrapper .tabs .tabs-title a {

    font-size: 0.7em;

}



.product-tabs-wrapper .tabs-title span {

    display: block;

}



.product-tabs-wrapper .tabs-title img {

    width: 30px;

}





/* PRODUCT GALLERY SECTION

============================= */

.product-gallery {

    max-height: 500px;

    overflow: hidden;

}





/* SIDEBAR NAVE FOR MOBILE

============================= */



.sidenav {

    height: 100%;

    width: 0;

    position: fixed;

    z-index: 10000;

    top: 0;

    right: 0;

    background-color: #111;

    overflow-x: hidden;

    transition: 0.5s;

    padding-top: 60px;

}



.sidenav-open{



    width : 250px !important;



}



.sidenav a {

    padding: 8px 8px 8px 32px;

    text-decoration: none;

    font-size: 20px;

    color: #818181;

    display: block;

    transition: 0.1s;

    white-space: nowrap;

}



.sidenav a:hover {

    color: #f1f1f1;

}



.sidenav .closebtn {

    position: absolute;

    top: 0;

    left: 0;

    font-size: 43px;

    padding: 25px 17px;

    border: 1px solid #787878;

    font-weight: bold;

    line-height: 0;

    color: white;

}



/*#main {*/

    /*transition: margin-right .5s;*/

    /*padding: 16px;*/

/*}*/



@media screen and (max-height: 450px) {

    .sidenav {padding-top: 15px;}

    .sidenav a {font-size: 18px;}

}





/*END  SIDEBAR NAVE FOR MOBILE

============================= */





/* Site Styles

============================= */

.srf-main-menu {

    float: right;

    line-height: 3em;

    z-index: 10001;

    line-height: 6em;



}



.srf-main-menu ul{



    z-index: 10002;

}



.srf-main-menu ul li{

    list-style: none;

    float: right;

}



.srf-main-menu > ul> li > a{

    color: #363636 !important;

}



.srf-main-menu > ul > li{

    position: relative;

}



.srf-main-menu > ul > li > a{

    line-height: 28px;

}



.srf-main-menu ul li a{

    padding: 10px;

    display: block;

    text-transform: uppercase;

    font-size: 12px;

    color: #fff;

}



.srf-main-menu ul >  li > a:hover,

.srf-main-menu > ul > li:hover > a

{

    transition: all 0.3s ease-in-out;

    color: #fff !important;

    background-color: #000 !important;

}





.srf-main-menu ul li a:hover

{



}



.srf-main-menu ul > li:hover > ul{

    visibility: visible;

    opacity: 1;

    /*display: block;*/

    transition: opacity 0.3s ease-in-out;

    opacity: 1;





}

/*Hiding Submenus*/

.srf-main-menu ul.sub-menu{

    /*display: none;*/

    visibility: hidden;

    opacity: 0;

    position: absolute;

    right: 0;

    padding: 0;

    margin: 0;

    white-space: nowrap;

    /*border: 1px solid rgba(128, 128, 128, 0.12);*/

    border-top: none;

    color: #fff;

    background-color: #000;

    transition: all 0.3s ease-in-out;

    min-width: 150px;





}



.srf-main-menu ul.sub-menu li {

    border-bottom: 1px solid rgba(128, 128, 128, 0.13);

    width: 100%;

    position: relative;

    line-height: 4;



}



.srf-main-menu ul.sub-menu ul.sub-menu{

    float: none;

    position: absolute;

    right: 100%;

    padding: 0;

    top: 0;

    height: inherit;



}



/* Slider Revolution

============================= */



.desktop-slider p{

    padding: 0;

    margin: 0;

}





/*Slick Slider Product Page*/



.product-gallery-nav .slick-slide img {

    display: block;

    padding:10px 10px 5px 0;

    margin-right: 2px;

    text-align: center;

}



.article-header .title-wrap .entry-title,

.single-product-header .page-title h1 {

    font-size: 20px;

    text-transform: uppercase;

    letter-spacing: 0;

}



.product-actions .actions-wrap .button{

    width: 120px;

}



.product-actions .actions-wrap a{

    float: right;

}



.product-action-button{

    margin-right: 10px;

    /*     margin-right: 20px; */

    min-width: 22%;

}



.collection-gallery-nav, .product-gallery-nav, .slab-gallery-nav {

    border-bottom: none;

}





.tabs {

    border-bottom: 1px solid #aeafb1;



}







.tabs .tabs-title.active {

    border-bottom: 6px solid #4c4c4c;

}











.woocommerce-Tabs-panel{

    padding: 10px 0 0 0;

    padding: 10px 0 0 0;

}



/* .product-specs STYLES */



table.product-specs {

    margin-bottom: 0;

    text-align: right;

    line-height: 28px;

}



table.product-usage{

    line-height: 18px;

}



table.product-specs  th {

    width: 40%;

}



table.product-specs  td {

    /*     width: 60%; */

}



table.product-specs thead {

    background: 0 0

}



table.product-specs tbody {

    border-bottom: 2px solid #d9d9d9;

    border-top: 2px solid #d9d9d9

}



table.product-specs th {

    /*font-weight: 900*/

}







table.product-specs {

    border-top: 2px solid #d9d9d9;



}



table.product-specs tr{

    border-bottom: 2px solid #d9d9d9;



}



tbody tr:nth-child(2n){

    background-color: inherit !important;

}





.inspiration-img img{

    padding:2px;

}



/* Custom Modal

============================= */



/* The Modal (background) */

.modal {

    display: none; /* Hidden by default */

    position: fixed; /* Stay in place */

    z-index: 100000; /* Sit on top */

    right: 0;

    top: 0;

    width: 100%; /* Full width */

    height: 100%; /* Full height */

    overflow: auto; /* Enable scroll if needed */

    background-color: rgb(0,0,0); /* Fallback color */

    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

}



/* Modal Content/Box */

.modal-content {

    background-color: #fefefe;

    margin: 2% auto; /* 15% from the top and centered */

    padding: 0 20px 20px 20px;

    border: 1px solid #888;

    width: 80%; /* Could be more or less, depending on screen size */

    position: relative;

}



/* The Close Button */

.modal-content .close {

    padding: 5px;

    color: #aaa;

    text-align: right;

    font-size: 25px;

    font-weight: bold;

    /*position: fixed;*/

    /*right: 0px;*/

    /*top: 0px;*/

}



.close:hover,

.close:focus {

    color: black;

    text-decoration: none;

    cursor: pointer;

}







video {

    /* override other styles to make responsive */

    width: 100% ;

    height: auto   !important;

}



.videoWrapper {

    position: relative;

    padding-bottom: 56.25%; /* 16:9 */

    height: 0;

}

.videoWrapper iframe {

    position: absolute;

    top: 0;

    right: 0;

    width: 100%;

    height: 100%;

}





/*ALL PRODUCTS PAGE STYLES*/



.marjan-product-cell{

    position: relative;

    margin-bottom: 10px;



}





.marjan-product-cell img{



    /*border: 1px solid #f3f3f3;*/

    transition: all 200ms ease-in;

    /*padding:5px;*/





}

.marjan-product-cell img:hover{



    /*border: 1px solid #000;*/



}



.marjan-product-cell .woocommerce-loop-product__title{

    position: absolute;

    bottom: 0;

    text-align: center;

    left: 0;

    right: 0;

    color: white;

    /*-webkit-text-fill-color: white;*/

    /*-webkit-text-stroke-width: 0.9px;*/

    /*-webkit-text-stroke-color: #0c0c0c;*/

    font-weight: normal;

    font-family: isans, sans-serif;

    background: rgba(0, 0, 0, 0.4);

    padding: 10px 2px;

    margin-bottom: 0;

    opacity: 1;

    transition: opacity 200ms ease-in;

    word-spacing: 1px;

    margin:0 5px;

    font-size: 14px;

    text-transform: uppercase;



}



.marjan-product-cell:hover .woocommerce-loop-product__title{

    opacity: 1;

}



.marjan-products-page .woocommerce-LoopProduct-link:hover{





}









/*PRODUCT PAGE MENU*/







#menu-products-page-categories li a{

    display: block;

    position: relative;

    transition: background-color 200ms ease-in;

}

#menu-products-page-categories li a::before{

    /*content: '|';*/

    /*display: inline-block;*/

    /*font-size: 19px;*/

    /*position: absolute;*/

    /*right: -3px;*/

    /*line-height: 10px;*/



}



#menu-products-page-categories li:last-child a::before{

    content: '';

}



#menu-products-page-categories .current_page_item  a,

#menu-products-page-categories   a:hover

{

    /*background: #4c4c4c;*/

    /*color: white;*/

}



#menu-products-page-categories .current_page_item a::before



{

    content: '';



}



/* Read More hidden Styles

============================= */



/*

	 CSS-Tricks Example

	 by Chris Coyier

	 http://css-tricks.com

	 https://css-tricks.com/text-fade-read-more/

*/



.sidebar-box {

    max-height: 200px;

    position: relative;

    padding: 10px;

    overflow: hidden;

}

.sidebar-box .read-more {

    position: absolute;

    bottom: 0; right: 0;

    width: 100%;

    text-align: left;

    margin: 0;

    padding: 30px 5px;



    /*background: rgba(255, 255, 255, 0.7);*/

    /*background-image: -webkit-gradient(linear,left top,left bottom,color-stop(1, transparent),color-stop(1, black));*/

    /*background-image: -moz-linear-gradient(top, transparent, white);*/

    /*background: linear-gradient(rgba(255, 255, 255, 1) 0%, rgb(255, 255, 255) 100%) repeat scroll 0% 0%;*/

    background-image: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));



}



.sidebar-box .button {

    padding: 10px 10px;

    color: inherit;

    font-size: 12px;

    font-family: inherit;

    text-decoration: none;

    vertical-align: middle;

    border-radius: 40px;

    background-color: #d1d3d4;

}

.sidebar-box .button:hover {

    ackground: #b1b4b5;

}

.sidebar-box .button:active {

    ackground: #b1b4b5;

}



/*CONTACT PAGE TEMPLATE*/



#mjn-contact-page {



}



#mjn-contact-page .article-header {

    margin-bottom: 2em;

}



#mjn-contact-page article {

    min-height: 500px;

}



#mjn-contact-page .bordered-section {

    border: 1px solid black;

    text-align: center;

    position: relative;

    padding: 2em 1em 1em 1em;

    margin-bottom: 2em;

    font-family: inherit;

}



#mjn-contact-page .bordered-section .margin-top-setting {

    margin-top: -40px;

}



#mjn-contact-page .margin-bottom-setting {

    height: 2em;

}



#mjn-contact-page .bordered-section h2 {

    display: inline-block;

    background: white;

    padding: 0 1em;

    text-align: center;



}





#mjn-contact-page .contact-map iframe {

    padding: 0;

    border: 1px solid #000000;

    margin-bottom: 2em;

    height: 300px;

}



#mjn-contact-page .border-divider {

    border: 1px solid #cfcfcf;

    width: 1px;

    height: 85%;

    text-align: center;

    margin: auto;

}



#mjn-contact-page .cotact-form label{

    font-size: 12px;

}

#mjn-contact-page .cotact-form input {

    line-height: 2.5;

}





#mjn-contact-page .cotact-form input {

    width: 90%;

    border-radius: 10px;

    border: 1px solid #c5c5c5;

    padding: 0 1em;

}



#mjn-contact-page .cotact-form textarea {

    width: 95%;

    border-radius: 10px;

    border: 1px solid #c5c5c5;

    padding: 1em;

    font-size: 14px;

    height: 150px;

}



#mjn-contact-page .cotact-form input[type='submit']{

    transition: all ease-in 200ms;

}



#mjn-contact-page .cotact-form input[type='submit']:hover{

    background: #4c4c4c;

    color:white;

}



#mjn-contact-page .cotact-form .cf7emc-captcha-field{

    font-size: 14px;

}



#mjn-contact-page .cotact-form .cf7emc-captcha-field span{

    margin: 0 5px;

}

#mjn-contact-page .cotact-form .math-captcha{

    width: 90px;

    margin: 0 1em;

    line-height: 2;

}





/*REMOVE JSCROLL BUG*/



    .jscrollpane-wrap .jspHorizontalBar{

        display: none !important;

    }