/*
## -----------------------------------------------------------------------------
##
##
##  STYLE SHEET
##                                             
##        Style-Sheet-Definitionen | GLOBAL APX LAYOUT THEME
##                                                                          
##        SCHEME:      __apx__scheme__                                                
##        AUTHOR:      Carsten Zandecki, mediaMinds internet services            
*/


*          { margin:0; padding:0; }



/* FOR FULL SCREEN BACKGROUNDS */

*, ::before, ::after {
	box-sizing: inherit;
}

html       { height: 100%; width: 100%; box-sizing: border-box;  }

body       { text-align: center; /** font-family: 'AllerLight'; font-size: 18px; color: #777777;**/ margin: auto; /*background: #fff;*/ 
             background-repeat: no-repeat; background-position: center center; 
             background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover;
             background-size: cover;
           }

img        { border:0px; max-width:100%; }


/*
## -----------------------------------------------------------------------------
##
##  GLOBAL ELEMENT/FORM CLASSES
##                                             
*/

.buttoncon { display:block; width:100%; }  /** GLOBAL BUTTONCONTAINER FOR ALIGNMENT **/


/*
## -----------------------------------------------------------------------------
##
##  SITE SEARCH
##
##
*/

input.searchfield, input.searchfieldTablet  { float:left; width:210px; border:0px; border-radius:0; box-shadow:none; padding:6px 12px; font-size:15px; }
input.searchfield:focus, input.searchfieldTablet:focus { border:0; box-shadow:none;  }
input.qtyfield,input.qtyfieldTablet { float:left; width:80px; border:0px; border-radius:0; box-shadow:none; font-size:15px; border-left: 1px solid #ccc; padding:6px 12px; }
input.qtyfield:focus,input.qtyfieldTablet:focus { border:0; box-shadow:none;  }
.vmfield  { }
input.budgetfield,input.budgetfieldTablet { float:left; width:80px; border:0px; border-radius:0; box-shadow:none; font-size:15px; border-left: 1px solid #ccc; padding:6px 12px; }
input.budgetfield:focus, input.budgetfieldTablet:focus { border:0; box-shadow:none;  }

.vmethodselect,.vmethodselectTablet { float:left; position:relative; width:130px; margin:6px 0 0 0; cursor:pointer; padding:5px 0 0 12px; border-left: 1px solid #ccc; color: #666; background: url('../images/small_arrow_down.png') no-repeat; background-size:12px 12px; background-position: 108px 10px; }
.vmethodchoice,.vmethodchoiceTablet { display:none; top:38px; position:absolute;width:162px; z-index:104; left: 0; background:#fff; box-shadow:0 0 2px rgba(0,0,0,0.3); padding:10px;  }
.vrow { padding:3px; text-align:left; }
.vrow:hover { background:#f5f5f5; border-radius:3px;}

#vmethodselectMobile { width:100%; margin:6px 0 6px 0; cursor:pointer; padding:10px 12px; border:1px solid #888; border-radius:3px; color: #666; background: url('../images/small_arrow_down.png') no-repeat; background-size:12px 12px; /*background-position: 300px 15px;*/ background-position: right 15px center; }
#vmethodchoiceMobile { display:none; position:relative; width:100%; background:#fff; border-top:1px solid #888; top:10px; padding:10px 0;  }


/*
## -----------------------------------------------------------------------------
##
##  SITE MAIN NAVIGATION STYLES
##
##
*/

/**

.stdblue   { color:#3f6db5; }
.stdgreen  { color:#b9d800; }

**/

.navButton
{
    padding: 12px 0 8px;
    /*top: -68px;*/
    position: relative;
    float: left;
    width: 20%; border-right:1px solid #fff;
    text-align:center; user-select: none;

}

.navButtonTablet
{
    padding: 6px 38px 8px 4px;
    /*top: -68px;*/
    position: relative;
    float: left;
    /*width: 20%;*/
    border-right:0px solid #fff;
    text-align:left; 
    user-select: none;
    color:#fff; 
}


/** .navButton { margin: 0 auto; cursor:pointer; padding:10px 0; text-align:center; user-select: none; }
.navButton img { width:36px; height:36px; display:block; margin:0 auto 10px auto; } 
.navButton.active  { background: #555; }
.navButton:hover { cursor:pointer; background-color: #555; /*#202f6c;*/ /*background:rgba(0,0,0,0.6); */

.resNavImg { width:38px; height:38px; } 
.resNavImgTablet { width:32px; height:32px; } 

.menuDescTablet { position:relative; font-weight:bold; left:5px; top:-9px; }

/** #searchCatFilterButton { display:none; font-family:SegoeUI; padding:11px 17px; outline:none; font-size:16px; font-weight:normal;  background: var(--stdgreen); border: 1px solid var(--stdgreen); color:#333; border-radius:3px; margin-bottom:25px; text-align:center; } **/
#customerMenuButton { display:none; font-family:SegoeUI; padding:11px 17px; outline:none; font-size:16px; font-weight:normal;  background: var(--stdgreen); border: 1px solid var(--stdgreen); color:#333; border-radius:3px; margin-bottom:25px; text-align:center; }

/** --------------------------------------------------------------------------- **/
/**										**/
/** CLICKABLE SHOP CATEGORY CONTAINER 									**/	
/**										**/


.categorymenucontent { display:none; position:absolute; width:100%; min-height:500px; font-size:14px; background:#fff; color:#555; box-shadow:0 3px 5px rgba(0,0,0,0.4); top:50px; border-radius:0 0 5px 5px; border: 5px solid #fff; }

.categorynav { float:left; height:100%; background: #f8f8f8; border-radius: 8px 0 0 8px; }
.categorynav a { text-decoration:none; color: #888; font-weight:normal; }

.catNavButton        { padding:8px 12px; cursor:pointer; background: #f8f8f8 url('../images/small_nav_arrow_gray.png') no-repeat; background-position: 210px center; cursor:pointer; }
/** .catNavButton:hover  { color: #3f6db5; background: #fff url('../images/small_nav_arrow_green.png') no-repeat; background-position: 210px center; font-weight:bold; cursor:pointer; } **/
/** .catNavButtonActive  { color: #3f6db5; background: #fff url('../images/small_nav_arrow_green.png') no-repeat; background-position: 210px center; font-weight:bold; cursor:pointer; } **/

.catNavButtonActive  { color: #3f6db5; background: #fff url('../images/small_nav_arrow.svg') no-repeat; background-position: 210px center; font-weight:bold; cursor:pointer; }


/** --------------------------------------------------------------------------- **/
/**										**/
/** LEVEL 1 									**/	
/**										**/


#menuNav { /*letter-spacing: 0.025em;*/ }
#menuNav > ul { width: 100%; margin:0 auto; }
#menuNav > ul > li{  position:relative; list-style: none; display: inline-block; line-height: 1.0em; padding: 16px 0; font-size: 15px; font-family: SegoeUI; font-weight:normal; color: #fff;  user-select:none; cursor:pointer; }

#menuNav > ul > li:hover  { /*z-index:104;*/ background: #32558d; padding: 13px 0 13px 0; color: #fff; }
#menuNav > ul > li:before { /*content: "";*/ /* or whatever color you prefer */ }

#menuNav > ul > li > a { text-decoration:none !important; font-size:15px; font-family: SegoeUI; font-weight:normal; color: #fff; padding: 13px 13px 13px 13px; }
#menuNav > ul > li > a:hover { position: relative; top: 0; color: #fff; font-size: 15px; font-weight: normal; }
#menuNav > ul > li > a:after {position: relative; top: 14px; left: 4px; color: #e5e5e5; font-size: 26px; line-height: 10px; font-weight: normal; }

#menuNav > ul > li.sub { padding: 16px 13px 16px 13px;  } 
   #menuNav > ul > li.sub:hover  { opacity: 1; animation-name: fadeInOpacity; animation-iteration-count: 1; animation-timing-function: ease-in; animation-duration: 0.3s; } 



   #menuNav > ul > li:hover > ul{  min-height:1000px; } 


 /* Increase when adding more dropdown items */

@keyframes fadeInOpacity { 0% {	opacity: 0; } 100% { opacity: 1; }} 


/** --------------------------------------------------------------------------- **/
/**										**/
/** LEVEL 2 - DIV CONTAINER MENU						**/	
/**										**/

#menuNav > ul > li >  ul { position:absolute; list-style:none; text-align:left; display:block; color: #ccc;
           
                                      /* This is important for the show/hide CSS animation */

                                         max-height:0px; overflow:hidden; 

                           left:0px; top:47px; background-color: transparent;

width:520px; z-index:103; /*max-height:520px; */

                         }


#menuNav > ul > li > ul > li   { position:relative; font-size:14px; padding:14px 13px 0 13px; color: #555; border-bottom:1px solid #ccc; 

border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
  /** background: #fff url(../images/small_nav_arrow_green.png) no-repeat; **/
  background: #fff url(../images/small_nav_arrow.svg) no-repeat; 
  background-position: 230px 16px; 
  background-size:13px;
  height: 45px; max-width:260px;  cursor: initial; 
}


#menuNav > ul > li > ul > li > a {

        margin:0;
       
	padding-top:1px; 

        font-family: SegoeUI;
        font-size:14px;
        font-weight:normal;
        
        color:#555;

	text-decoration:none !important;
        
	display:block;

        
        text-shadow:none;
        

        /*background: url(../images/hop_nav.png) 0 10px no-repeat; */
}


/* This will trigger the CSS */
/* transition animation on hover */

#menuNav > ul > li > ul > li.sub:hover { background-color: #f5f5f5;  }
#menuNav > ul > li > ul > li.sub:hover > ul { display:inline-block; /* position:relative; display: inline-block;*/ background-color:#333; /*max-height:420px; */}  /* Increase when adding more dropdown items */




/** --------------------------------------------------------------------------- **/
/**										**/
/** LEVEL 3 - DIV CONTAINER MENU						**/	
/**										**/

#menuNav > ul > li > ul > li > ul { position:relative; /* max-height:4200px; */ overflow:hidden; display:none; top:-30px; left:246px; border:1px solid #ccc; margin:0; padding:0; }
#menuNav > ul > li > ul > li > ul:before { /*content: "";*/ }
#menuNav > ul > li > ul > li > ul > li { background: #fff; display:block; width:248px; margin:0; padding:0; }


#menuNav > ul > li > ul > li > ul > li > a {

	padding:15px 13px 14px 16px;

        font-family: SegoeUI;

        font-size:14px;
        font-weight:normal;
        color:#555;

	text-decoration:none !important;
        
	display:block;

        text-shadow:none;
        border-bottom:1px solid #ccc;
        background: url(../images/point_nav.png) 0 12px no-repeat; 
}

#menuNav > ul > li > ul > li > ul > li > a:hover { background-color: #f5f5f5; }



/*
## -----------------------------------------------------------------------------
##
##  MOBILEMENU/TABLEMENU STYLES
##
##
*/

#mobilebox { position:absolute; z-index:99; top:-50px; right:0px; width:100%; text-align:right; }

/** .mobilebutton { background: #0e4323 url('../images/menu.png') 13px 9px no-repeat; padding:17px 17px 17px 42px; border-radius:50%; color:#fff; box-shadow: 0 0 10px 0 #423a02; border: 2px solid #d9d0a4; } **/

#mobilemenu      { display:none; font-size:16px; position:relative; width:100%; height:auto; background:#fff; left:0px; color:#555; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); }
#mobilemenu a    { font-family: SegoeUI; font-weight:normal; width:100%; padding:4%; display:block; color: #555; text-align:center; border-bottom:1px solid #ccc; text-decoration:none; }
#mobilemenu a:hover { color: #555; background: #f5f5f5; }
#mobilemenu .sep { font-family:SegoeUI; font-weight:bold; display:block; background:#f5f5f5; color:#555; padding:4%; text-align:center; }
#mobilemenu > ul > li > div.sep { background:var(--stdgreen); }

/** #mobileprodmenu      { display:none; font-size:16px; position:relative; width:100%; height:auto; background:#fff; left:0px; color:#555; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); } **/

/* EB SPECIFIC */

#mobileprodmenu a    { font-family: SegoeUI; font-weight:normal; width:100%; padding:4%; display:block; color: #555; text-align:left; border-bottom:1px solid #ccc; text-decoration:none; }
#mobileprodmenu a:hover { color: #555; background: #f5f5f5; }
#mobileprodmenu .sep { font-family:SegoeUI; font-weight:bold; display:block; background:#f5f5f5; color:#555; padding:4%; text-align:left; }
#mobileprodmenu > ul > li > div.sep { background:var(--stdgreen); }

.mobilecategorymenu { display:none; font-size:16px; position:absolute; top:170px; padding:0; width:100%; height:auto; background:#fff; left:0px; color:#555; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); }
.mobilesearchmenu { display:none; font-size:16px; position:absolute; top:170px; padding:5%; width:100%; height:auto; background:#fff; left:0px; color:#555; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); }

.tabletcategorymenu { display:none; font-size:16px; position:absolute; top:195px; padding:0; width:100%; height:auto; background:#fff; left:0px; color:#555; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); }
#tabletmenu   { display:none; box-sizing: border-box; font-size:16px; position:absolute; z-index:998; width:100%; height:auto; background: #fff; padding:0; top:50px; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); }
.tabletsearchmenu { display:none; font-size:16px; position:absolute; top:195px; padding:5%; width:100%; height:auto; background:#fff; left:0px; color:#555; border-bottom:3px solid var(--stdgreen); box-shadow: 0 0 10px rgba(0,0,0,0.3); }

.tbSubCatNav     { text-align:left; padding:25px; flex: 0; flex-basis:245px; background:var(--stdblue); }
.tbSubCatNavItem { padding: 6px 6px 8px 6px; color: var(--stdblue); /* font-weight: bold; */ color:#fff; }
.tbSubCatNavItemSelected { color: #000; background: var(--stdgreen); border-radius:3px; }
.tbSubCatLink    { color:#777; font-weight:normal; text-align:left; padding: 6px 0 12px; text-decoration: none; border-bottom: 1px solid #ccc; display: block; }
.tbSubCategory   { font-weight:bold; margin: 15px 0; text-align:left; }
.tbSubCategory:first { font-weight:bold; text-align:left; margin-top:15px; }

/**
#tabletbutton { position:absolute; width:100px; height:46px; top:23px; right:20px; z-index:999; display:block; border-radius:6px; border: 2px solid #d9d0a4; box-shadow: 0 0 10px 0 #423a02; margin:0px auto; padding:5px; background: #0e4323 url('../images/menu_tablet.png') 5px 3px no-repeat; text-align:center; }
#tabletbutton img { margin:0 auto; } 
**/



/** #tabletmenu a { font-family: OpenSans; font-weight:normal; box-sizing: border-box; width:100%; padding:5%; display:block; color: #fffbc1; text-align:left; text-decoration:none; }
#tabletmenu a:hover { background: #adcc28; color:#fff; border-radius:6px;  } 
**/

.tabletcategory { display:block; font-family: OpenSans; font-size:16px; font-weight:bold; width:100%; height:auto; text-align:left; padding-top:20px; border-radius:6px; background: #04200f; color:#d9d0a4;  }
.tbcol50   { float:left; width:45%; display:block; padding:0 40px 40px; }
.tbcol50:nth-of-type(2) { margin-top:18px; } 

.tbspace50 { margin-right:10%; }



/*
## -----------------------------------------------------------------------------
##
##  MAIN SITE STYLES
##                                             
*/


article  { }
section  { }

.full    { clear:both; width:100%; display:block; }
.content { clear:both; width:100%; display:block; margin:0 auto; text-align:left; }



th, td {
    padding:3px;
    border-spacing: 0;
    vertical-align:middle;
}



hr { border:none; height:1px; margin-bottom:40px; }


.actionbutton { margin-top:40px; }

/* STD STYLE / FROM PAGE EDITOR */

.left     { text-align:left;   }
.center   { text-align:center; }
.right    { text-align:right; }
.justify  { text-align:justify; }


/*
## -----------------------------------------------------------------------------
##
##  IMAGE HOVER FX
##                                             
*/

/* RESIZE FX */

.imghover { position: relative; padding: 0; width:100%; display:block; cursor:pointer; /*border-radius:5px; border:5px solid #fff; box-shadow:0 0 10px rgba(0,0,0,0.3);*/ vertical-align:middle; }
.imgtext  { position: absolute; 
            display:table-cell; 
            width: 100%;
            /*height: 94.8%; */
            height:100%;

            color:#fff; 
            background-color:rgba(77,77,77,0.9);
            text-align: center; 

            z-index: 10;
	    opacity: 0;
            -webkit-transition: all 0.5s ease;
            -moz-transition: all 0.5s ease;
            -o-transition: all 0.5s ease;
            transition: all 0.5s ease;
          }

.imgtext:hover { opacity:1; }
.hovertext     { display:flex; align-items: center; justify-content: center; width:100%; height:100%; line-height:1.4em; vertical-align:middle; font-family: AllerLight; }
/*img { z-index:1; }*/

.imgContent      { vertical-align:middle; }

.stdimg { position: relative; padding: 0; width:100%; display:block; height:244px; background-size:cover; background-position: center center; cursor:pointer; border-radius:0; border:6px solid #fff; box-shadow:0 0 10px rgba(0,0,0,0.3); vertical-align:middle; }


/* TRANSITION FX */

.imgparent { /*width:250px; height:250px; border-radius: 50%;*/ display: inline-block; cursor: pointer; overflow: hidden; position: relative; /*border: 8px solid #fff; box-shadow:0 0 10px 2px rgba(0,0,0,0.1); margin:20px 0 20px 0; */  }
.imgchild  { display:block; /*width: 100%; height: 242px;*/ background-size: cover;  /*background-repeat: no-repeat;*/
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.imgparent:hover .imgchild, .imgparent:focus .imgchild {
    -ms-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}

.imgparent:hover .imgchild:before, .imgparent:focus .imgchild:before {
    display: block;
		/*opacity: 0.7;*/
}

.imgparent:hover a, .imgparent:focus a {
    display: block;
}

.imgchild:before {
    content: "";
    display: block;
	opacity: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(52,73,94,0.75);
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

/** INLINE TEXT IMAGE **/

.textImageSpace { margin-top:25px; }
.rightPosImage  { float:right; width:31.72%; margin: 0 0 25px 25px; }
.leftPosImage   { float:left; width:31.72%; margin: 0 25px 25px 0px; }


/** IMAGE CAPTION / COPYRIGHTS **/

.imgCapBox    { margin-bottom:25px; }
.imageCaption { margin-top:10px; display:block; font-size: 16px; }
.imageCopyright { font-size:12px; text-transform:uppercase; }


/*
## -----------------------------------------------------------------------------
##
##  GLOBAL COLS
##                                             
*/

.colMax          { max-width:1200px; }
.colPadTopBottom { padding: 20px 0; }
.colPadAround    { padding: 20px; }

.col100ns { float:left; margin:0; width:100%; }
.col80ns  { float:left; margin:0; display:block; width:80%; }
.col75ns  { float:left; margin:0; display:block; width:75%; }
.col50ns  { float:left; margin:0; display:block; width:50%; }
.col66ns  { float:left; margin:0; display:block; width:66%;  }
.col33ns  { float:left; margin:0; display:block; width:33.333333333%; }
.gold12ns { float:left; margin:0; display:block; width:38.196666666%; }
.gold21ns { float:left; margin:0; display:block; width:61.803333333%; }
.col25ns  { float:left; margin:0; display:block; width:25%; }
.col20ns  { float:left; margin:0; display:block; width:20%; }
.col16ns  { float:left; margin:0; display:block; width:16.666666666%; }


/*
.col100 { float:left; margin:0; width:100%; }
.col75  { float:left; margin:0; display:block; width:72.5%; }
.col50  { float:left; margin:0; display:block; width:46.5%; }
.col66  { float:left; margin:0; display:block; width:65%; }
.col33  { float:left; margin:0; display:block; width:30%; }
.col25  { float:left; margin:0; display:block; width:23%; }
*/

/* space 2 = 50px = 2 x 25 

.col100 { float:left; margin:0; width:100%; }
.col75  { float:left; margin:0; display:block; width:72.916666666%; }
.col50  { float:left; margin:0; display:block; width:47.916666666%; }
.col66  { float:left; margin:0; display:block; width:64.5833333333326666%; }
.col33  { float:left; margin:0; display:block; width:31.2499999999966666%; }
.gold12 { float:left; margin:0; display:block; width:36.113267791%; }
.gold21 { float:left; margin:0; display:block; width:59.720065541%; }
.col25  { float:left; margin:0; display:block; width:22.916666666%; }
.col20  { float:left; margin:0; display:block; width:17.916666666%; }
.col16  { float:left; margin:0; display:block; width:14.583333326666%; }

.space2 { float:left; display:block; margin-right: 4.166666666%; }
.space3 { float:left; display:block; margin-right: 3.125%; }
.space4 { float:left; display:block; margin-right: 2.7777777777%; }
.space5 { float:left; display:block; margin-right: 2.6041666666%; }
.space6 { float:left; display:block; margin-right: 2.5%; }

*/

/* space 2 = 70px = 2 x 35  */


.col100 { float:left; margin:0; width:100%; }
.col80  { float: left; margin: 0; display: block;  width: 76.25000000%; } /* only with space2 */
.col75  { float:left; margin:0; display:block; width:72.083333333%; }
.col50  { float:left; margin:0; display:block; width:47.083333333%; }
.col66  { float:left; margin:0; display:block; width:63.7499999934%; }
.col33  { float:left; margin:0; display:block; width:30.41666666634%; }
.gold12 { float:left; margin:0; display:block; width:35.2799344590105125%; }
.gold21 { float:left; margin:0; display:block; width:58.8867322089894833%; }
.col25  { float:left; margin:0; display:block; width:22.0833333335%; }
.col20  { float:left; margin:0; display:block; width:17.916666666%; }
.col16  { float:left; margin:0; display:block; width:14.583333326666%; }

.space2 { float:left; display:block; margin-right: 5.833333333333%; }
.space3 { float:left; display:block; margin-right: 4.37500000049%; }
.space4 { float:left; display:block; margin-right: 3.88888888866%; }
.space5 { float:left; display:block; margin-right: 2.6041666666%; }
.space6 { float:left; display:block; margin-right: 2.5%; }




/** ----------------------------------------------------------------------------
/** 
/**  GLOBALSPACE SYSTEM:
/**  Hat gleiche horizontale Abstandsbeite bei den Spacern
/**  Berechnet dafuer die Breite der Bloecke
/**  

:root { --globalspacer:4%; }
.gspace   { float:left; display:block; margin-right: var(--globalspacer); }
.col100 { float:left; margin:0; width:100%; }
.col75  { float:left; display:block; width: calc(75% - (var(--globalspacer)/2)) }
.col50  { float:left; display:block; width: calc(50% - (var(--globalspacer)/2)) }
.col66  { float:left; display:block; width: calc(66.666666666% - (var(--globalspacer)/2)) }
.col33  { float:left; display:block; width: calc(33.333333333% - (var(--globalspacer)/2)) }
.col25  { float:left; display:block; width: calc(25% - (var(--globalspacer)/2)) }
.gold12 { float:left; display:block; width: calc(38.196666666% - (var(--globalspacer)/2)) }
.gold21 { float:left; display:block; width: calc(61.803333333% - (var(--globalspacer)/2)) }
.col50_2  { float:left; display:block; width: calc(50% - (var(--globalspacer)*2/3)) }
.col33_2  { float:left; display:block; width: calc(33.3333333% - (var(--globalspacer)*2/3)) }
.col25_2  { float:left; display:block; width: calc(25% - (var(--globalspacer)*2/3)) }
.col25_3  { float:left; display:block; width: calc(25% - (var(--globalspacer)*3/4)) }
.col20_4  { float:left; display:block; width: calc(20% - (var(--globalspacer)*4/5)) }
.col16_5  { float:left; display:block; width: calc(16.666666666% - (var(--globalspacer)*5/6)) }


-----------------------------------------------------------------------------**/


/*
## -----------------------------------------------------------------------------
##
##  GLOBAL RESPONSIVE SLIDERS / SLICK LIST INIT
##                                             
*/

.mainslider { display:block; width:100%; }
.sliderow   { display:block; width:100%; background:transparent; }
.innerrow   { display:block; width:100%; margin:0 auto; }

/* Arrows */

.slick-prev,.slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 25px; height: 25px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; /*background: transparent;*/ }
.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus { color: transparent; outline: none; }
.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before { opacity: 1; }
.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before { opacity: .25; }
.slick-prev:before, .slick-next:before { /*font-family: 'slick'; font-size: 20px;*/ line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-prev { left: -40px; z-index:98; background: url('../images/arr-left.png') center center no-repeat; background-color:#888; background-size:14px; border-radius:3px; }
[dir='rtl'] .slick-prev { right: -100px; left: auto; }
.slick-prev:before{ content: ''; }
[dir='rtl'] .slick-prev:before { content: '>'; }
.slick-next { right: -40px; z-index:98; background: url('../images/arr-right.png') center center no-repeat; background-color:#888; background-size:14px; border-radius:3px; }
[dir='rtl'] .slick-next { right: auto; left: -100px; }
.slick-next:before { content: ''; }
[dir='rtl'] .slick-next:before { content: '<'; }

/* Dots */
.slick-dotted.slick-slider { margin-bottom: 30px; }
.slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }
.slick-dots li button:hover,.slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before { font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '�'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { opacity: .75; color: black; }


/* LOADER */

#mmkLoad     { position:relative; width:210px; height:25px; margin:auto; }
.mmkLoadInfo { width:100%; color: #ccc; font-size:12px; margin-top:25px; text-align:left; }
.mmkLoad     { position:absolute; top:0; background-color: #0093db; width:20px;	height:20px; 
               animation-name:bounce_mmkLoad; -o-animation-name:bounce_mmkLoad;	-ms-animation-name:bounce_mmkLoad; -webkit-animation-name:bounce_mmkLoad; -moz-animation-name:bounce_mmkLoad;
  	       animation-duration:1.5s;	-o-animation-duration:1.5s; -ms-animation-duration:1.5s; -webkit-animation-duration:1.5s; -moz-animation-duration:1.5s; 
               animation-iteration-count:infinite; -o-animation-iteration-count:infinite; -ms-animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite;		-moz-animation-iteration-count:infinite;
	       animation-direction:normal; -o-animation-direction:normal; -ms-animation-direction:normal; -webkit-animation-direction:normal; -moz-animation-direction:normal;
	       transform:scale(.3); -o-transform:scale(.3); -ms-transform:scale(.3); -webkit-transform:scale(.3); -moz-transform:scale(.3); 
               border-radius:13px; -o-border-radius:13px; -ms-border-radius:13px; -webkit-border-radius:13px;-moz-border-radius:13px;
}

#mmkLoad_1 { left:0; animation-delay:0.6s; -o-animation-delay:0.6s; -ms-animation-delay:0.6s; -webkit-animation-delay:0.6s; -moz-animation-delay:0.6s; }
#mmkLoad_2 { left:26px;	animation-delay:0.75s; -o-animation-delay:0.75s; -ms-animation-delay:0.75s; -webkit-animation-delay:0.75s; -moz-animation-delay:0.75s; }
#mmkLoad_3 { left:52px;	animation-delay:0.9s; -o-animation-delay:0.9s; -ms-animation-delay:0.9s; -webkit-animation-delay:0.9s; -moz-animation-delay:0.9s; }
#mmkLoad_4 { left:79px;	animation-delay:1.05s; -o-animation-delay:1.05s; -ms-animation-delay:1.05s; -webkit-animation-delay:1.05s; -moz-animation-delay:1.05s; }
#mmkLoad_5 { left:105px; animation-delay:1.2s; -o-animation-delay:1.2s;	-ms-animation-delay:1.2s; -webkit-animation-delay:1.2s; -moz-animation-delay:1.2s; }
#mmkLoad_6 { left:131px; animation-delay:1.35s; -o-animation-delay:1.35s; -ms-animation-delay:1.35s; -webkit-animation-delay:1.35s; -moz-animation-delay:1.35s; }
#mmkLoad_7 { left:157px; animation-delay:1.5s; -o-animation-delay:1.5s;	-ms-animation-delay:1.5s; -webkit-animation-delay:1.5s;	-moz-animation-delay:1.5s; }
#mmkLoad_8 { left:184px; animation-delay:1.64s;	-o-animation-delay:1.64s; -ms-animation-delay:1.64s; -webkit-animation-delay:1.64s; -moz-animation-delay:1.64s; }

@keyframes bounce_mmkLoad{
	0%{
	transform:scale(1);
		background-color: #0093db;
	}

	100%{
	transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-o-keyframes bounce_mmkLoad{
	0%{
	-o-transform:scale(1);
		background-color: #0093db;
	}

	100%{
	-o-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-ms-keyframes bounce_mmkLoad{
	0%{
	-ms-transform:scale(1);
		background-color: #0093db;
	}

	100%{
	-ms-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-webkit-keyframes bounce_mmkLoad{
	0%{
	-webkit-transform:scale(1);
		background-color: #0093db;
	}

	100%{
	-webkit-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}

@-moz-keyframes bounce_mmkLoad{
	0%{
	-moz-transform:scale(1);
		background-color: #0093db;
	}

	100%{
	-moz-transform:scale(.3);
		background-color:rgb(255,255,255);
	}
}



/*
############################################################################
###                                                                         
###  SPINNER2
###                                                                           
*/


.loader2 {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;
}
.loader2 div {
  position: absolute;
  top: 14px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #423a02;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.loader2 div:nth-child(1) {
  left: 6px;
  animation: lds-ellipsis1 0.6s infinite;
}
.loader2 div:nth-child(2) {
  left: 6px;
  animation: lds-ellipsis2 0.6s infinite;
}
.loader2 div:nth-child(3) {
  left: 26px;
  animation: lds-ellipsis2 0.6s infinite;
}
.loader2 div:nth-child(4) {
  left: 45px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(19px, 0);
  }
}

/** INLINE BUTTON LOADER **/

.loader3 {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 0px;
}
.loader3 div {
  position: absolute;
  top: -10px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.loader3 div:nth-child(1) {
  left: 6px;
  animation: lds-ellipsis1 0.6s infinite;
}
.loader3 div:nth-child(2) {
  left: 6px;
  animation: lds-ellipsis2 0.6s infinite;
}
.loader3 div:nth-child(3) {
  left: 26px;
  animation: lds-ellipsis2 0.6s infinite;
}
.loader3 div:nth-child(4) {
  left: 45px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(19px, 0);
  }
}



/*
## -----------------------------------------------------------------------------
##
##  CLEAR STYLES
##                                             
*/
 
    .clear        { clear:both; }
    .group:after  { content: ""; display: table; clear: both; }