/* ==========================================================================
   Desktop
   ========================================================================== */
@media (min-width: 1000px) {
	div.mainsliderimgbox{position:relative;width:720px; height:540px; margin:0px 0px 50px 0px;}
	div.mainsliderimgmask{float:left;position:relative;width:100%;height:100%;}
	div.mainsliderimg{position:absolute;top:0px;left:0px;width:100%;height:100%;background-repeat:no-repeat;background-position:center center;background-size:cover;}
	
	/*With arrows*/
	a.mainsliderimgleftbtn{display:block;opacity:0.5;position:absolute; width:40px; height:40px; border-radius:40px; top:50%;left:10px; z-index:81; margin:-20px 0px 0px 0px; background-color:rgba(0,0,0,0.6); background-image:url(/images_svg/main_icon_left_arrow_white.svg); background-size:20px 20px; background-position:8px center; background-repeat:no-repeat;transition: opacity 0.5s ease-out;}
	a.mainsliderimgrightbtn{display:block;opacity:0.5;position:absolute;width:40px; height:40px; border-radius:40px; top:50%;right:10px;z-index:81;margin:-20px 0px 0px 0px; background-color:rgba(0,0,0,0.6); background-image:url(/images_svg/main_icon_right_arrow_white.svg); background-size:20px 20px; background-position:12px center; background-repeat:no-repeat;transition: opacity 0.5s ease-out;}
	div.mainsliderimgbox:hover .mainsliderimgleftbtn,div.mainsliderimgbox:hover .mainsliderimgrightbtn{opacity:1; transition: opacity 0.5s ease-out;}
	a.mainsliderimgleftbtn:focus ,a.mainsliderimgrightbtn:focus {opacity:1; transition: opacity 0.5s ease-out;}
	
	/*Without arrow
	div.mainsliderimgleftbtn{display:block;position:absolute; width:20%; height:100%;top:0px;left:0px; z-index:81;}
	div.mainsliderimgrightbtn{display:block;position:absolute;width:20%; height:100%;top:0px;right:0px;z-index:81;}
	div.mainsliderimgleftbtn:hover,div.mainsliderimgrightbtn:hover{ cursor:pointer; }
	*/

	/*Version 1 - Menu inside the picture*/
	div.mainsliderimgmenu{position:absolute;bottom:0px;left:0px; width:100%; color:#FFF; background-color: rgba(0,0,0,0.6); z-index:80;}
	div.mainsliderimgtitle{float:left;font-size:15px;font-weight:bold;width:70%; padding:15px 20px 15px 20px;}
	div.mainsliderimgdescription{float:left;font-size:14px;font-weight:normal; line-height:1.4em;width:100%;padding:0px 20px 20px 20px;}
	div.mainsliderimgmenunum{float:right;font-size:12px;text-align:right;width:20%;padding:15px 20px 15px 20px;}
	div.mainsliderimgdotmenu{position:absolute;width:100%; height:30px; left:0px;bottom:-40px; padding:5px 0px 5px 0px;text-align:center; z-index:80; }

	/*Version 2 - Menu outside the picture*/
	div.mainsliderimgmenuoutside{float:left;width:100%;}
	div.mainsliderimgtitleoutside{float:left;font-size:15px;font-weight:bold;width:70%; padding:15px 0px 15px 0px;}
	div.mainsliderimgdescriptionoutside{float:left;font-size:14px;font-weight:normal; line-height:1.4em;width:100%;padding:0px 0px 20px 0px;}
	div.mainsliderimgmenunumoutside{float:right;font-size:12px;text-align:right;width:20%;padding:15px 0px 15px 0px;}
	div.mainsliderimgdotmenuoutside{float:left;width:100%;height:30px; padding:5px 0px 5px 0px;text-align:center; }

	/*Dots*/
	a.mainsliderimgdot{width:10px; height:10px; display:inline-block; margin:0px 5px 0px 5px; background-color:#999999;border-radius: 10px;}
	a.mainsliderimgdot:hover{background-color:#333333;}
	a.mainsliderimgdoton{width:10px; height:10px; display:inline-block; margin:0px 5px 0px 5px; background-color:#333333;border-radius: 10px;}
}

/* ==========================================================================
   Mobile
   ========================================================================== */
@media (min-width: 0px) and (max-width: 999px){
	div.mainsliderimgbox{position:relative;width:100%;margin:0px 0px 30px 0px;}
	div.mainsliderimgmask{float:left;position:relative;width:100%; height:100%;}
	div.mainsliderimg{position:absolute;top:0px;left:0px;width:100%;height:100%;background-repeat:no-repeat;background-position:center center; background-size:cover; }
	
	/* With arrows*/
	a.mainsliderimgleftbtn{display:block;opacity:1;position:absolute; width:30px; height:30px; border-radius:30px;top:50%;left:10px; z-index:81; margin:-15px 0px 0px 0px; background-color:rgba(0,0,0,0.6);background-image:url(/images_svg/main_icon_left_arrow_white.svg); background-size:15px 15px; background-position:7px 8px; background-repeat:no-repeat;transition: opacity 0.5s ease-out;}
	a.mainsliderimgrightbtn{display:block;opacity:1;position:absolute;width:30px; height:30px; border-radius:30px;top:50%;right:10px;z-index:81;margin:-15px 0px 0px 0px;background-color:rgba(0,0,0,0.6); background-image:url(/images_svg/main_icon_right_arrow_white.svg); background-size:15px 15px; background-position:9px 8px; background-repeat:no-repeat;transition: opacity 0.5s ease-out;}
	
	/* Without arrow
	div.mainsliderimgleftbtn{display:block;position:absolute; width:20%; height:100%;top:0px;left:0px; z-index:80; }
	div.mainsliderimgrightbtn{display:block;position:absolute;width:20%; height:100%;top:0px;right:0px;z-index:80;}
	div.mainsliderimgleftbtn:hover,div.mainsliderimgrightbtn:hover{ cursor:pointer; }
	*/

	/*Version 1 - Menu inside the picture*/
	div.mainsliderimgmenu{position:absolute;bottom:0px;left:0px;width:100%;color:#FFF;z-index:80;background-color: rgba(0,0,0,0.6);}
	div.mainsliderimgtitle{float:left;font-size:15px;font-weight:bold;width:100%; padding:10px 20px 10px 20px;}
	div.mainsliderimgdescription{float:left;font-size:14px;line-height:1.2em;font-weight:normal;width:100%;padding:0px 20px 10px 20px;}
	div.mainsliderimgmenunum{display:none;}
	div.mainsliderimgdotmenu{position:absolute; width:100%; left:0px; bottom:-30px;text-align:center;}

	/*Version 2 - Menu outside the picture*/
	div.mainsliderimgmenuoutside{float:left;width:100%;}
	div.mainsliderimgtitleoutside{float:left;font-size:15px;font-weight:bold;width:70%; padding:15px 0px 15px 0px;}
	div.mainsliderimgdescriptionoutside{float:left;font-size:14px;font-weight:normal; line-height:1.4em;width:100%;padding:0px 0px 20px 0px;}
	div.mainsliderimgmenunumoutside{display:none;}
	div.mainsliderimgdotmenuoutside{float:left;width:100%; height:30px; padding:5px 0px 5px 0px;text-align:center; }

	/*Dots*/
	a.mainsliderimgdot{width:10px; height:10px; display:inline-block; margin:0px 5px 0px 5px; background-color:#999999;border-radius: 10px;}
	a.mainsliderimgdot:hover{background-color:#333333;}
	a.mainsliderimgdoton{width:10px; height:10px; display:inline-block; margin:0px 5px 0px 5px; background-color:#333333;border-radius: 10px;}
}

/* ==========================================================================
   Share CSS
   ========================================================================== */

/*Main slider animation*/
div.mainsliderimgfadein{opacity:1;transition: all 0.5s ease-out 0s;z-index:20;}
div.mainsliderimgfadeout{opacity:0;transition: all 0.5s ease-out 0s;z-index:1;}