html {
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	scroll-behavior: smooth;
	overflow-x: hidden;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Thin.ttf);
    font-weight: 100;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-ThinItalic.ttf);
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-ExtraLight.ttf);
    font-weight: 200;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-ExtraLightItalic.ttf);
    font-weight: 200;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Light.ttf);
    font-weight: 300}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-LightItalic.ttf);
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Regular.ttf);
    font-weight: 400;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Italic.ttf);
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Medium.ttf);
    font-weight: 500;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-MediumItalic.ttf);
    font-weight: 500;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-SemiBold.ttf);
    font-weight: 600;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-SemiBoldItalic.ttf);
    font-weight: 600;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Bold.ttf);
    font-weight: 700;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-BoldItalic.ttf);
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-ExtraBold.ttf);
    font-weight: 800;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-ExtraBoldItalic.ttf);
    font-weight: 800;
    font-style: italic;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-Black.ttf);
    font-weight: 900;
}
@font-face {
    font-family: fira;
    src: url(../font/FiraSans-BlackItalic.ttf);
    font-weight: 900;
    font-style: italic;
}
body{
	margin: 0;
	color: #626262;
	font-family: fira;
	font-size: 19px;
	font-weight: 300;
	display: flex;
}
.dcntooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
}

.dcntooltip .dcntooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #555;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
}

.dcntooltip .dcntooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

.dcntooltip:hover .dcntooltiptext {
  visibility: visible;
  opacity: 1;
}
.tableheadingsort {
    display: inline-block;
    margin-left: 5px;
    font-size: 14px;
}
.tableheadingsort:has(.fa-sort){
	color: #bbbbbb;
}
.tableheadingsort:has(.fa-spinner-third){
	color: inherit;
}
#dcnee{
	width: 0%;
	height: 0%;
	position: fixed;
	background-color: rgba(0, 0, 0, 0.98);
	opacity: 0;
	z-index: 8;
	display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0;
    text-align: center;
    flex-wrap:wrap;
}
#dcnee img{
	max-width: 200px;
	width: 0%;
	aspect-ratio: 1 / 1;
	margin-bottom: 10px;
}
#dcnee p{
	width: 100%;
	line-height: unset;
	color: #888888;

	padding: 40px;
}

#dcnee button, #dcnee .button{
	opacity: 0;
}

/* Form */

.dcnpopupinputpbox{
	margin-bottom: 12px;
}
textarea:focus, input:focus, select:focus{
    outline: none;
}
.inputlabel{
	font-size: 14px;
	margin-bottom: 0px;
	text-align: left;
}
.inputrequired{
	color: red;
}
.dcnpopupinputcheck{
	width: 36px;
	display: flex;
	justify-content: right;
	align-items: center;
}
.dcnpopupinputicon{
	width: 36px;
	display: flex;
	justify-content: left;
	align-items: center;
	font-size: 16px;
	color: #888888;
}
.dcnpopupinputpbox.valid .dcnpopupinputcheck{
	color: #35bb9a;
}
.dcnpopupinputpbox.error .dcnpopupinputcheck{
	color: #ff2525;
}
 .dcnpopupinputfield{
 	background-color: #f6f6f6;
 	padding: 7px 15px;
 	border-radius: 10px;
 	border: solid 2px #f6f6f6;
 	display: flex;
 }
 .dcnpopupinputfield:focus-within{
 	border-color: black;
 }
 .dcnpopupinputfield:focus-within .dcnpopupinputicon{
 	color: black;
 }
 .dcnpopupinputpbox.error .dcnpopupinputfield {
    border-color: #ff2525;
}
 .dcnpopupinput{
 	display: grid;
 	width: 100%;
 }

.inputerror{
	width: 100%;
	color: #ff2525;
	font-size: 13px;
	font-weight: 400;
	visibility: hidden;
}
.inputerror p{
	all:unset;
}
.inputerror ul li::before{
	color:inherit;
}
.inputerror ul{
	padding-left: 20px;
}
.inputerror ul li{
	margin: 5px 0px;
}

input[type="text"], input[type="number"], input[type="password"], input[type="email"], select{
	max-width: 400px;
	box-sizing: border-box;
	border:0;
	background-color: #f6f6f6;
	padding: 0;
	font-size: 18px;
	border-radius: 2px;
	background-position: center right 10px;
	background-repeat: no-repeat;
	background-size: 16px;
	float: left;
	margin-right: 10px;
}
input[type="range"]{
	-webkit-appearance: none;
	margin: 15px 0;
	width: 100%;
	height: 6px;
	background: #626262;
	outline: none;
	opacity: 1;
	-webkit-transition: .2s;
	transition: opacity .2s;
	float: left;
}
input[type="range"]:hover {
  opacity: 1;
}
#scrollup{
	width: 44px;
	height: 44px;
	position: fixed;
	bottom: 20px;
	right: -100px;
	z-index: 2;
	transition: 0.2s all;
	color: #ffffff;
	line-height: 44px;
	text-align: center;
	border-radius: 4px;
	cursor: pointer;
	box-shadow: 0 1px 4px rgba(0,0,0,0.2);
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  cursor: pointer;
  border-radius: 10px;
}
input[type="range"]::-moz-range-thumb {
  width: 20px;
  height: 20px;
  cursor: pointer;
  border-radius: 10px;
}
.rangevalue{
	height: 40px;
	width: 19%;
	box-sizing: border-box;
	border:0;
	background-color:  #f6f6f6;
	padding: 0px 10px;
	font-size: 16px;
	border-radius: 2px;
	background-position: center right 10px;
	background-repeat: no-repeat;
	background-size: 16px;
	float: left;
	margin-right: 1%;
	text-align: center;
	line-height: 40px;
	color: black;
	font-weight: 400;
}
table{
	font-size: inherit;
	border-collapse: collapse;
}
/*####*/
/*#### Header ####*/
/*####*/
.dcnuserheaderbutton{
	padding: 0;
	margin: 0;
	cursor: pointer;
}
[data-title] {  
  position: relative;
}
[data-title]:hover::before {
  content: attr(data-title);
  position: absolute;
  bottom: 30px;
  display: inline-block;
  max-width: 300px;
  padding: 5px 8px;
  border-radius: 2px;
  background: #000;
  color: #fff;
  font-size: 14px;
}
[data-title]:hover::after {
  content: '';
  position: absolute;
  top: -13px;
  left: 2px;
  display: inline-block;
  color: #fff;
  border: 8px solid transparent;	
  border-top: 8px solid #000;
}
#topper{
	width: 100%;
	height: 30px;
	border-bottom: solid 1px #ededed;
}
header{
	width: 100%;
	width: -moz-available;
	height: 111px
	border-top: solid 1px #ededed;
	position: fixed;
	top:0px;
	z-index: 5;
	-webkit-box-shadow: 0 1px 9px rgba(0,0,0,.1);
	box-shadow: 0 1px 9px rgba(0,0,0,.1);
	overflow: hidden;
	display: flex;
}
.header{
	float: right;
}
nav{
	float: left;
	overflow: hidden;
	height: 80px;
	width: 100%;
}
#logocontainer{
	font-size: 30px;
	color: #3b3b3b;
	line-height: 80px;
	background-size: 44px;
	background-repeat: no-repeat;
	background-position: left;
	height: 80px;
	float: left;
	padding-left: 20px;
	text-align: center;
}
#logocontainer #img{
	margin-top: 7px;
	height: 66px;
	width: 250px;
	background-image: url("../../images/logo_long.png");
	background-size: auto 66px;
	background-repeat: no-repeat;
	background-position: center;
	display: inline-block;
	image-rendering: -webkit-optimize-contrast;
}
#smartphonenav{
	display: none;
}
#smartphonenavigation{
	display: none;
}
#searchcontainer{
	float: right;
	height: 80px;
	padding: 0px 10px;
}
#searchcontainer input{
	height: 40px;
	width: 250px;
	border:0;
	background-color: #f6f6f6;
	padding: 0px 10px;
	margin-top: 20px;
}
#usercontainer{
	height: 80px;
	float: left;
	padding: 0px 10px;
	display: flex;
	align-items: center;
	gap: 12px;
}
#dcnshopcart{
	position:relative;
}
#dcnshopcartcount {
    width: 16px;
    height: 16px;
    background-color: red;
    border-radius: 100%;
    position: absolute;
    top: -4px;
    right: -8px;
    font-size: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-weight: 600;
}
.dcncartdeliverymethodtextbox {
    margin-bottom: 10px;
}
.dcncartdeliverymethodtitle {
    font-weight: 800;
    width: 100%;
    height: 20px;
    margin-bottom:10px;
}
.dcncartdeliverymethodtext {
    font-size: 16px;
    color: #888888;
    width: 100%;
}
.dcncartdeliverymethodbuttonsbox{
	display: flex;
    gap: 10px;

}
.dcncartdeliverymethodbutton{
	width:100%;
	border: solid 2px #eeeeee;
    padding: 10px;
    text-align: center;
    border-radius: 10px;
    position: relative;
    cursor:pointer;
    height: auto;
    line-height: inherit;
}
.dcncartdeliverymethodbutton.selected{
	border-color:var(--primary-background-color);
	color:var(--primary-background-color);
}
.dcncartdeliverymethodbuttontag {
    position: absolute;
    top: 6px;
    right: 6px;
    color: white;
    background-color: var(--primary-background-color);
    font-size: 16px;
    padding: 1px 5px;
    border-radius: 6px;
}
.dcncartdeliverymethoddetailsmapbox {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    background-color: #f0f0f0;
    border-radius: 10px;
    padding: 10px;
    width: max-content;
    align-items: center;
}
.dcncartdeliverymethoddetailsmap {
    width: 250px;
    border: solid 2px #dddddd;
    border-radius: 10px;
    height: 200px;
}


#cmsnavigationcustom .usercontainer{
	width: 100%;
	display: flex;
	float: initial;
	padding-top: 12px;
	align-items: center;
}
#cmsnavigationcustom .userlogo{
}
#cmsnavigationcustom .userlogo div{
	height: 40px;
	width: 40px;
	border-radius: 40px;
	text-align: center;
	line-height: 40px;
	font-size: 16px;
	font-weight: 500;
}
#cmsnavigationcustom .username{
	width: 100%;
	height: max-content;
	overflow: hidden;
	padding-left: 10px;
}
#cmsnavigationcustom .fullname{
	font-size: 14px;
	white-space: nowrap;
}
#cmsnavigationcustom .role{
	font-size: 12px;
	white-space: nowrap;
}
#usernavcontainer{
	position: fixed;
	width: 220px;
	margin:0;
	margin-top: 80px;
	z-index: 2;
	overflow: hidden;
	right: 0px;
	height: 0px;
}
#usernav{
	width: 200px;
	overflow: hidden;
	padding: 10px;
	padding-top: 0;
	position: absolute;
	bottom: 0px;
}
#usernavigation{
	width: 100%;
	background-color: #ffffff;
	box-shadow: 0px 0px 10px rgba(50,50,50,0.2);
}
.usernavigationbutton{
	font-size: 16px;
	width: 100%;
	box-sizing: border-box;
	height: 40px;
	font-weight: 300;
	color: #353E4A;
	text-align: center;
	line-height: 40px;
	border-bottom: solid 1px rgba(255,255,255,0.3);
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
	border-top: solid 1px rgba(0,0,0,0.1);
}
.usernavigationbutton:hover{
	background-color: rgba(0,0,0,0.05);
}
.languagelistbutton{
	padding: 8px;
}
#languagecontainer{
	cursor: pointer;
	padding: 0;
	display: flex;
	flex-direction: row;
	align-items: center;
	font-size: 16px;
	margin: 0 0px;
	font-weight: 500;
}
#userlogocontainer{
	width: 80px;
	height: 80px;
	float: left;
}
#userlogo{
	width: 50px;
	height: 50px;
	margin: 15px;
	border-radius: 50px;
	background-color: grey;
	font-family: fira;
	font-size: 22px;
	line-height: 50px;
	color: #ffffff;
	text-align: center;
	font-weight: 500;
}
#username{
	height: 35px;
	line-height: 35px;
	text-align: right;
}
#websitesettingscontainer{
	display: inline-block;
	height: 30px;
	font-size: 12px;
	line-height: 30px;
}
#websiteconditionscontainer{
	float: left;
	height: 30px;
	font-size: 12px;
	line-height: 30px;
}
#headermargin{
	height: 80px;
	width: 100%;
}
/*####*/
/*#### Notifications ####*/
/*####*/
.alertbox{
	padding:20px;
}
.alert{
	color: #FFFFFF;
	padding: 10px 20px;
	border-radius: 4px;
	font-size: 14px;
	display: flex;
	width: auto;
	align-items: center;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	box-sizing: border-box;
	padding-left: 0;
	border: dashed 3px rgba(0,0,0,0.15);
	box-shadow: 0px 2px 6px 0 rgba(0,0,0,0.1);
	max-width: max-content;
}
.alerticon{
	width: 100px;
	text-align: center;
	font-size: 20px;
}
.alerttext{
	width: 100%;
}
.alert p{
	margin: 4px 0px;
}
/*#### INFO ####*/
.info{
	background-color: #43A5EA;
}
#notification{
	position: fixed;
	bottom: 4%;
	left: -370px;
	width: 92%;
	max-width: 350px;
	border-radius: 6px;
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: center left 20px; 
	z-index: 100;
	font-size: 15px;
	display: flex;
	flex-wrap: wrap;
	overflow: hidden;
	animation: pulse-yellow 2s infinite;
}
#notificationbox{
	display: flex;
	flex-wrap: nowrap;
	width: 100%
}
#notificationprogressbar{
	width: 100%;
	height: 5px;
	background-color: rgba(255,255,255,0.4);
}
#notificationicon{
	width: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 26px;
	color: #ffffff;
}
#notificationmessagebox{
	width: 100%;
}
#notificationmessage{
	padding: 18px 8px 18px 0px;
}
#notificationmessage p{
	margin: 0px;
	line-height: 20px;
}
#notification ul{
	margin-left: 40px;
	margin-right: 20px;
}
#notification ul li::before {
  content: "•";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
  color : #FFFFFF;
}
.notification_success{
	background-color: #48CFAD;
	color: #ffffff;
	background-image: url(../../images/notification_yes.png);
}
.notification_info{
	background-color: #5E9CEB;
	color: #ffffff;
	background-image: url(../../images/notification_maybe.png);
}
.notification_warning{
	background-color: #FB6E50;
	color: #ffffff;
	background-image: url(../../images/notification_warning.png);
}
.notification_error{
	background-color: #333333;
	color: #ffffff;
	background-image: url(../../images/notification_no.png);
}
/*####*/
/*#### Inputs ####*/
/*####*/
.singleValue{
	text-align: center;
	font-weight: 800;
	font-family: arial;
}
p > span{
	line-height: inherit;
}
select{
	cursor: pointer;
}
.smallselect{
	height: 34px;
	background-color: #ededed;
	border:0;
	padding: 0px 10px;
	color: #626262;
	font-size: 15px;
}
#checkboxtable input[type="checkbox"], #checkboxtable td{
	height: 34px;
	background-color: #f6f6f6;
	border-bottom: solid 2px #ffffff;
	cursor: pointer;
}
#checkboxtable{
	width: 100%;
}
#checkboxtable label{
	height: 100%;
	width: 100%;
	display: inline-block;
	line-height: 34px;
	cursor: pointer;
}
/*####*/
/*#### Popup ####*/
/*####*/
.popupcontent{
	box-sizing: border-box;
	padding: 15px 22px;
	overflow: hidden;
}
.popupfooter{
	background-color: #ffffff;
	overflow: hidden;
	border-top: solid 1px #eaeaea;
}
.popupclosebutton{
	position: absolute;
	right: 0;
	top: 0;
	cursor: pointer;
	text-align: center;
	font-size: 26px;
	color: #999999;
	transition: all 0.2s;
	padding: 22px;
    line-height: initial;
    padding-bottom: 20px;
}
.popupclosebutton:hover{
	color: #F53B57;
	transition: all 0.2s;
}
.popupclosebutton:active{
	color: #333333;
	transition: all 0.2s;
}
.dcntextarea{
	box-sizing: border-box;
	border:dashed 1px transparent;
}
table .dcntextarea{
	display: inline-block;
}
.dcntextarea:hover .translationbutton{
	background-color: rgba(28,28,28,0.8);
}
.dcntextarea:hover .translationnavigation{
	opacity: 1;
	top:-10px;
	right: -10px;
	height: 20px;
	line-height: 20px;
	transition: all 0.1s;
}
.dcntextarea:hover .translationnavigationbox{
	background-color: #429DF8;
	transition: all 0.1s;
}
.dcntextarea:hover .translationnavigationflag{
	width: 20px;
	height: 20px;
	transition: all 0.1s;
}
.dcntextarea:hover .translationnavigationadd{
	width: 20px;
	height: 20px;
	font-size: 11px;
	transition: all 0.1s;
}
.dcntextarea:hover .translationnavigationdefaulttext{
	background-color: #429DF8;
	border-radius: 10px;
	line-height: 20px;
	width: 20px;
	height: 20px;
	transition: all 0.1s;
	font-size: 11px;
	margin-left: 3px;
}
.translationnavigation{
	background-position: center;
	background-size: 22px 34px;
	background-repeat: no-repeat;
	position: absolute;
	top:-7px;
	right: -7px;
	text-align: right;
	display: none;
	height: 14px;
	overflow: hidden;
	border-radius: 10px;
	opacity: 0.3;
	background-size: 110% 160%;
	line-height: 14px;
	transition: all 0.1s;
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Safari */
	-khtml-user-select: none; /* Konqueror HTML */
	-moz-user-select: none; /* Old versions of Firefox */
	-ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none; /* Non-prefixed version, currently*/
}
.translationnavigationbox{
	background-color: rgba(28,28,28,1);
	display: flex;
	border-radius: 10px;
	cursor: pointer;
}
.translationnavigationdefaulttext{
	background-color: rgba(28,28,28,1);
	border-radius: 10px;
	color: #FFFFFF;
	text-align: center;
	line-height: 14px;
	font-size: 8px;
	width: 14px;
	height: 14px;
	transition: all 0.1s;
	margin-left: 1px;
	cursor: pointer;
}
.translationnavigationflag img{
	width: 100%;
	height: 100%;
}
.translationnavigationflag{
	background-position: center;
	background-size: 112% 160%;
	background-repeat: no-repeat;
	width: 14px;
	height: 14px;
	overflow: hidden;
	border-radius: 50%;
	transition: all 0.1s;
}
.translationnavigationadd{
	width: 14px;
	height: 14px;
	font-size: 8px;
	text-align: center;
	color: #FFFFFF;
	transition: all 0.1s;
}
.translationbutton{
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 100%;
	background-color: rgba(28,28,28,0.2);
	cursor: pointer;
	text-align: center;
	line-height: 20px;
	color: #ffffff;
	font-size: 10px;
}
.translationnavigationbutton:hover{
	background-color: rgba(230,230,230,0.1);
}
.translationnavigationbutton{
	display: inline-block;
	width: 100%;
	padding:4px 5px;
	cursor: pointer;
	text-align: right;
	box-sizing: border-box;
	font-size: 13px;
	white-space: nowrap;
	border-top:solid 1px rgba(255,255,255,0.1);
}
.translationnavigationbutton:first-child{
	border-top:solid 0px rgba(255,255,255,0.1);
}
.translationnavigationarea{
	padding: 2px 0px;
	box-sizing: border-box;
	background-color: rgba(28,28,28,0.8);
	border-radius: 3px;
	color: #ffffff;
	margin-top: 8px;
	font-weight: 300;
	position: relative;
	z-index: 1;
	line-height: initial;
}
.dcntextarea:hover {
	border:dashed 1px rgba(28,28,28,0.8);
}
.translationbutton:hover{
	background-color: rgba(28,28,28,0.8);
}
#popup input[type="text"], #popup input[type="number"], #popup input[type="password"], #popup input[type="date"], #popup input[type="time"], #popup input[type="email"], #popup select{
	width: 100%;
	max-width: 400px;
	box-sizing: border-box;
	border:0;
	background-color:  #f6f6f6;
	padding: 0px;
	margin-right: auto;
	margin-left: auto;
	font-size: 18px;
	border-radius: 2px;
	background-position: center right 10px;
	background-repeat: no-repeat;
	background-size: 16px;
	font-family: inherit;
	color: #000000;
    font-weight: 500;
}
#popup input[type="file"]{
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}
.profilepicturepreview{
	width: 100%;
	min-height: 105px;
	font-size: 12px;
	color: #888888;
	border-radius: 4px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	max-height: 250px;
	overflow:auto;
}
#popup select{
	background-position: center right 20px;
}
.trumbowyg-editor{
	min-height: 200px;
}
.trumbowyg-box, .trumbowyg-editor {
	border: unset;
}
.trumbowyg-button-pane{
	padding: unset;
	background: unset;
	border-bottom: unset;
}
.trumbowyg-editor, .trumbowyg-textarea{
	padding: unset;
}
.trumbowyg-box .trumbowyg-editor{
	margin-top: 10px;
}
.trumbowyg-button-pane .trumbowyg-button-group {
    display: inline-block;
    border: unset; 
    border-radius: 10px;
    overflow: auto;
    margin-right: 3px;
    margin-bottom: 3px;
    min-height: unset;
}
.trumbowyg-button-pane::after{
	width: unset;
	margin: unset;
	height: unset;
}
.trumbowyg-button-pane .trumbowyg-button-group::after{
	width: unset;
	margin: unset;
	height: unset;
}
.trumbowyg-button-pane button {
    background-color: black;
    color: #FFFFFF;
    width: 34px;
    height: 34px;
}
.trumbowyg-box svg, .trumbowyg-modal svg {
    width: 20px;
    fill: #FFF;
}
.trumbowyg-button-pane button.trumbowyg-active, .trumbowyg-button-pane button:not(.trumbowyg-disable):focus, .trumbowyg-button-pane button:not(.trumbowyg-disable):hover {
    background-color: rgba(0,0,0,0.7);
}
.trumbowyg-box, .trumbowyg-editor {
    margin: 7px auto;
}
.trumbowyg-dropdown {
    max-height: 175px;
}
#popup .trumbowyg-editor-hidden textarea{
	margin-top: 10px;
}
#popup textarea{
	min-height: 100px;
	max-height: 500px;
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	border:0;
	background-color:  #f6f6f6;
	margin-right: auto;
	margin-left: auto;
	font-size: 16px;
	border-radius: 2px;
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: top 20px right 20px;
}
#popup input[type="checkbox"]{
	background: red;
}
/*
#popup label{
	font-size: 12px;
	text-transform: uppercase;
}
*/
#popupbackground{
	left: 0;
	top:0;
	background-color: rgba(190,190,190,0.8);
	width: 100%;
	height: 100vh;
	position: fixed;
	z-index: 10;
	background-image: url(../../images/cms/popup_loading.gif);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40px;
	display: none;
	padding: 20px;
	box-sizing: border-box;
	justify-content: center;
	align-items: center;
}
#fullscreenbackground{
	left: 0;
	top:0;
	background-color: rgba(11,11,11,0.95);
	width: 100%;
	height: 100%;
	z-index: 10;
	position: fixed;
	display: none;
}
.fullscreenbutton{
	width: 50px;
	height: 50px;
	background-color: transparent;
	margin-right: 10px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	cursor: pointer;
}
#fullscreenmangementbox{
	display: flex;
	justify-content: left;
	align-items: center;
	position: fixed;
	z-index: 1;
	padding: 20px;
}
#fullscreenbox{
	display: flex;
	height: 100vh;
	box-sizing: border-box;
	position: fixed;
	width: 100%;
	top: 0;
	justify-content: center;
	align-items: center;
	--bs-gutter-x: 0;
}
#dcnfullscreensliderbox{
	background-color: #000;
	position: relative;
}
#dcnfullscreendetail{
	background-color: #FFFFFF;
	padding: 25px;
	overflow: auto;
}
#dcnfullscreendetail th {
    font-size: 16px;
    text-align: right;
    font-weight: 300;
    width: 50%;
}
#dcnfullscreendetail td {
    font-size: 16px;
    text-align: left;
    font-weight: 300;
    margin-left: 10px;
}
#dcnfullscreendetailtitle {
    font-size: 34px;
    font-weight: 400;
    line-height: 1.1em;
    text-align: center;
}
#dcnfullscreendetaillens, #dcnfullscreendetailcamera{
    display: flex;
    justify-content: center;
    font-size:  16px;
}
.dcnfullscreendetailpcituredetails{
	font-weight: 400;
	margin: 30px 0px 10px 0px;
	text-align: center;
}
#dcnfullscreendetaillocation {
    font-size: 16px;
    text-align: center;
    margin-bottom: 30px;
    margin-top: 10px;
    display: flex;
    justify-content: center;
}
#dcnfullscreenleft {
  position: absolute;
  top: 45%;
  left:0;
  height: 10%;
  width: 10%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 29px;
  color: #FFF;
  text-shadow: 0 0 5px black;
  cursor: pointer;
  transition: all 0.1s;
}
#dcnfullscreenright{
	position: absolute;
  top: 45%;
  right: 0;
  height: 10%;
  width: 10%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 29px;
  color: #FFF;
  text-shadow: 0 0 5px black;
  cursor: pointer;
  transition: all 0.1s;
}
#dcnfullscreenright:hover, #dcnfullscreenleft:hover{
	font-size: 35;
	transition: all 0.1s;
}
#fullscreen{
	max-width: 100%;
  max-height: 100%;
  margin: auto;
}
#popup{	
	max-width: 400px;
	min-width: 400px;
	box-shadow: 0px 2px 6px 0 rgba(0,0,0,0.1);
	border-radius: 20px;
	box-sizing: border-box;
	position: relative;
	overflow: auto;
	font-weight: 300;
	max-height: 100%;
	overflow-x: hidden;
}
#popupprogressbar{
}
#popupprogressbar>div{
	height: 5px;
	width: 0%;
}
/*####*/
/*#### Container ####*/
/*####*/
.containerpattern{
	width: 100%;
	height: 100%;
	position: absolute;
}
.containerpattern p{
	all:unset;
	margin:10px 0px;
	text-align: center;
}
ul {
  list-style: none; /* Remove default bullets */
}
ul li::before {
  content: "•";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
  font-weight: bold; /* If you want it to be bold */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
  margin-left: -1em; /* Also needed for space (tweak if needed) */
}
li{
	margin: 10px 0px;
}
#dcnanologo{
	width: 44px;
	height: 44px;
	margin: 10px;
	background-image: url(../../images/cms/logo_white.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 30px;
	background-color: #4946ff;
	border-radius: 6px;
}
#cmsnavigation{
	width: 128px;
	height: calc(100vh - calc(var(--cms-navigation-margin) * 2));
	background-color: #ffffff;
	z-index: 7;
	box-sizing: border-box;
	-webkit-box-shadow: inset -2px 0px 4px -2px rgba(170,170,170,1);
	-moz-box-shadow: inset -2px 0px 4px -2px rgba(170,170,170,1);
	box-shadow: inset -2px 0px 4px -2px rgba(170,170,170,1);
	display: flex;
	position: fixed;
	margin: var(--cms-navigation-margin);
	border-radius: 14px;
}
.dcnunfixednavigation:hover #cmsnavigationcustom{
	width: 296px;
	transition: all 0.3s;
}
.dcnfixednavigation #cmsnavigationcustom{
	transition: all 0.3s;
	width: 232px;
	min-width: 232px;
}
#cmsnavigation a{
	color: inherit;
}
#cmsnavigationdefault{
	width: 64px;
	height: inherit;
	background-color: #32324e;
	float: left;
	color:#eaeaea;
	border-radius: 14px 0px 0px 14px;
}
#cmsnavigationcustom{
	height: inherit;
	color: #ffffff;
	box-sizing: border-box;
	padding: 0px 12px;
	background-color: #212133;
	transition: all 0.5s;
	width: 64px;
	border-radius: 0px 14px 14px 0px;
	
}
#cmsnavigationcustomscroll{
	height: inherit;
	overflow-x: hidden;
	-ms-overflow-style: none;  /* IE and Edge */
  	scrollbar-width: none;  /* Firefox */
}
#cmsnavigationcustomscroll::-webkit-scrollbar{
	display: none;
}
#cmsnavigationcustom hr{
	border-bottom: solid 1px rgba(255,255,255,0.1);
	border-top: solid 1px #111;
}
#cmsdefaultnavigation{
	width: 64px;
	position: absolute;
	bottom: 0px;
	cursor: pointer;
	color: inherit;
}
.defaultnavigation:hover{
	background-color: rgba(255,255,255,0.05);
}
.defaultnavigation{
	width: 64px;
	height: 50px;
	font-size: 20px;
	line-height: 50px;
	text-align: center;
	cursor: pointer;
}
#pagebody{
	box-sizing: border-box;
	width: 100%;
	transition: all 0.5s;
}
.dcnfixedpagebody{
	margin-left: 296px;
	transition: all 0.5s;
}
.dcnunfixedpagebody{
	/*margin-left: 128px;*/
	transition: all 0.5s;
}
#loadingpage{
	display: none;
}
.nodisplay{
	display: none;
}
.section{
	box-sizing: border-box;
	min-height: 80px;
	z-index: 1;
	position: relative;
	display: flex;
}
.widget{
	width: 100%;
}
.dcncustomsection{
	box-sizing: border-box;
	padding: 15px;
	height: max-content;
	width: 100%;
}
.nopadding .dcncustomsection{
	padding: 0;
}

#editormodepanel{
	width: var(--editor-mode-panel-width);
	background-color: #212133;
	position: fixed;
	height: calc(calc(100vh - calc(var(--cms-navigation-margin) * 3)) - var(--editor-mode-button-height));
	top: 0;
	z-index: 7;
	margin: var(--cms-navigation-margin);
	border-radius: 14px;
	padding:15px;
	overflow-x: auto;
	-ms-overflow-style: none;  /* IE and Edge */
  	scrollbar-width: none;  /* Firefox */
}
#editormodepanel::-webkit-scrollbar{
	display: none;
}
#editormodepanel.editormodepanelopen{
	right: 0;
	transition: all 0.3s;
}
#editormodepanel.editormodepanelclosed{
	right: calc(calc(var(--editor-mode-panel-width) + calc(var(--cms-navigation-margin) * 2)) * -1);
	transition: all 0.3s;

}


.editorpanelcontainerbox{
	border-left:solid 5px #32324e;
	margin-bottom: 5px;
	margin-right: 0px;
	border-radius: 5px;
}
.editorpanelsectionbox{
	border-left:solid 5px #32324e;
	margin-bottom: 5px;
	margin: 3px;
	margin-right: 0px;
	border-radius: 5px;
}
.editorpanelmodulebox{
	border-left:solid 5px #32324e;
	margin-bottom: 5px;
	margin: 3px;
	margin-right: 0px;
	border-radius: 5px;
}
.editormodeselectedcontainer{
	border-left:solid 5px #2196f3;
}
.editormodeselectedcontainer .editorpanelcontainerheading{
	background-color: #2196f3;
}
.editormodeselectedcontainer .editormodecaret {
    transform: rotate(90deg);
    transition: all 0.3s;
}

.editormodeselectedsection{
	border-left:solid 5px #967bdc;
}
.editormodeselectedsection .editorpanelsectionheading{
	background-color: #967bdc;
}
.editormodeselectedsection .editormodecaret {
    transform: rotate(90deg);
    transition: all 0.3s;
}

.editormodeselectedmodule{
	border-left:solid 5px #f36b4f;
}
.editormodeselectedmodule .editorpanelmoduleheading{
	background-color: #f36b4f;
}
.editormodeselectedmodule .editormodecaret {
    transform: rotate(90deg);
    transition: all 0.3s;
}

.editorpanelcontainerbox:hover{
	border-left:solid 5px #2196f3;
}
.editorpanelsectionbox:hover{
	border-left:solid 5px #967bdc;
}
.editorpanelmodulebox:hover{
	border-left:solid 5px #f36b4f;
}

.editorpanelcontainerpanelbox h4 {
    font-size: 14;
    font-weight: inherit;
    color: rgba(255,255,255,0.3);
    margin: 4px 0px;
}
.editorpanelsectionpanelbox h4 {
    font-size: 14;
    font-weight: inherit;
    color: rgba(255,255,255,0.3);
    margin: 4px 0px;
}
.editorpanelmodulepanelbox h4 {
    font-size: 14;
    font-weight: inherit;
    color: rgba(255,255,255,0.3);
    margin: 4px 0px;
}
.containerpanelbgmedia{
	border-radius: 5px;
	width: 100%;
	height: 90px;
	background-color: #212133;
	overflow: hidden;
	position: relative;
}
.containerpanelbgmedia img{
	width: 100%;
	height: inherit;
	object-fit: cover;
	opacity: 0.5;
}
.containerpanelbgmedia video{
	width: 100%;
	height: inherit;
	object-fit: cover;
	opacity: 0.5;
}
.editorpaneltoolboxbuttonrange{
	position: absolute;
	top: 0;
}



.editorpanelcontainerheading{
	background-color: #32324e;
	border-radius: 0px 5px 5px 0px;
	font-size: 16px;
	cursor:pointer;
	color: #eaeaea;
	padding: 5px 5px;
	display: flex;
	align-items: center;
}
.editorpanelsectionheading{
	background-color: #32324e;
	border-radius: 0px 5px 5px 0px;
	font-size: 16px;
	cursor:pointer;
	color: #eaeaea;
	padding: 5px 5px;
	display: flex;
	align-items: center;
}
.editorpanelmoduleheading{
	background-color: #32324e;
	border-radius: 0px 5px 5px 0px;
	font-size: 16px;
	cursor:pointer;
	color: #eaeaea;
	padding: 5px 5px;
	display: flex;
	align-items: center;
}
.editorpanelcontainerbox:hover .editorpanelcontainerheading{
	background-color: #2196f3;
}
.editorpanelsectionbox:hover .editorpanelsectionheading{
	background-color: #967bdc;
}
.editorpanelmodulebox:hover .editorpanelmoduleheading{
	background-color: #f36b4f;
}
.editormodecaret {
    margin-right: 6px;
    transition: all 0.3s;
    font-size: 14px;
}
.editorpanelcontainerbox .editormodecaret{
	transform: rotate(0deg);
}
.editormodeselectedcontainer .editormodecaret {
    transform: rotate(90deg);
}

.editorpanelsectionbox .editormodecaret{
	transform: rotate(0deg);
}
.editormodeselectedsection .editormodecaret {
    transform: rotate(90deg);
}

.editorpanelmodulebox .editormodecaret{
	transform: rotate(0deg);
}
.editormodeselectedmodule .editormodecaret {
    transform: rotate(90deg);
}

.editormodepanelelementid{
	color: rgba(255,255,255,0.2);
	font-size: 12px;
}
.editorpaneltoolbox{
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: flex-end;
	font-size: 14px;
}
.editorpaneltoolboxbutton{
	padding: 3px 6px;
	background-color: #32324e;
	border-radius: 5px;
	margin: 3px;
	transition: all 0.3s;
	font-size: 14px;
	display: flex;
    justify-content: center;
    align-items: center;
	width: 24px;
    height: 24px;
    cursor: pointer;
    color: #eaeaea;
}
.longtoolboxbutton{
	width: fit-content;
	display: inline-block;
	height: unset;
}
.longtoolboxbutton i{
	margin-right: 6px;
}
.toolboxbuttonrange{
	display: flex;
	flex-wrap: wrap;
}
.bigtoolboxbutton{
    width: fit-content;
    display: inline-block;
    height: 40px;
    width: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
}
.fullwidthtoolboxbutton{
	width: initial;
    display: inline-block;
    height: unset;
    justify-content: center;
    display: flex;
    align-items: center;
    height: 40px;
    margin: 0;
    margin-bottom: 5px;
}
.fullwidthtoolboxbutton i{
	margin-right: 6px;
}
.lighttoolboxbutton{
	background-color: #32324e;
}
.darktoolboxbutton{
	background-color: #212133;
}
.containercolor{
	background-color: #2196f3 !important; 

}
.sectioncolor{
	background-color: #967bdc !important;

}
.modulecolor{
	background-color: #f36b4f !important;

}

.editorpaneltoolboxbutton:hover{
	background-color: #212133;
	transition: all 0.3s;
}
.editorpaneltoolboxbutton.darktoolboxbutton:hover{
	background-color: #32324e;
}
.editorpaneltoolboxbuttonrange{
	width: 100%;
	height: inherit;
	display: flex;
	justify-content: center;
	align-items: center;
}
.editorpanelcontainerpanel{
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}
.editorpanelcontainerpanelbox{
	padding: 10px;
}

.editorpanelsectionpanel{
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}
.editorpanelsectionpanelbox{
	padding: 10px;
}

.editorpanelmodulepanel{
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
}
.editorpanelmodulepanelbox{
	padding: 10px;
}



#editormodepanelbutton{
	width: var(--editor-mode-button-height);	
	height: var(--editor-mode-button-height);
	border-radius: 14px;
	background-color: #4946ff;
	bottom: var(--editor-mode-button-margin);
	right: var(--editor-mode-button-margin);
	z-index: 7;
	position: fixed;
	transition: all 0.3s;
	    color: #FFFFFF;
    font-size: 24px;
    display: flex;
    justify-content: center;
    align-items: center;    
    cursor: pointer;
}
#editormodepanelbutton.editormodepanelclosed:hover{
	animation: pulse-purple-dcnano 2s infinite;
}
#editormodepanelbutton.editormodepanelopen:hover{
	animation: pulse-red-dcnano 2s infinite;
}
#editormodepanelbutton.editormodepanelopen{
	transition: all 0.3s;
	width: var(--editor-mode-panel-width);
	background-color:#ED5565;
}
#editormodepanelbutton.editormodepanelclosed{
	transition: all 0.3s;
	width: var(--editor-mode-button-height);
}
#editormodepanelbutton.editormodepanelclosed:hover{
	width: var(--editor-mode-panel-width);
	transition: all 0.3s;
}
#editormodepanelbutton .editormodepanelbuttontext{
	overflow: hidden;
    white-space: nowrap;
    /*text-overflow: ellipsis;*/
    margin-right: 0px;
    transition: all 0.3s;
}
#editormodepanelbutton:hover .editormodepanelbuttontext{
	margin-right: 20px;
    transition: all 0.3s;
}
#editormodepanelbutton.editormodepanelopen .editormodepanelbuttontext{
	margin-right: 20px;
    transition: all 0.3s;
}
#editormodepanelbutton.editormodepanelclosed .editormodepanelbuttontext{
	transition: all 0.3s;
}
#editormodepanelbutton.editormodepanelopen .editormodepanelbuttontext{

	transition: all 0.3s;
}
.editormodepanelbuttonicon{
	width: var(--editor-mode-button-height);
	height: var(--editor-mode-button-height);
	min-width: var(--editor-mode-button-height);
	display: flex;
	justify-content: center;
	align-items: center;
}


.dcneditormode:hover .toolboxcontainer .dcncontainer{}
.dcneditormode:hover .toolboxcontainer:hover .dcncontainer{
	/*padding-top: 30px;*/
	/*animation: pulse-blue 2s infinite;*/
}
.dcneditormode:hover .toolboxcontainer .dcncontainer .section{
	/*padding-top: 30px;*/
}
.dcneditormode:hover .toolboxcontainer .dcncontainer .section .widget{
	/*padding-top: 30px;*/
}
.dcneditormode:hover .toolboxcontainer:hover .dcncontainer .section .widget{
	/*padding-top: 30px;*/
}

.toolboxcontainer:hover .section{
	/*border: solid 3px rgba(200,200,200,0.6); /*#967BDC*/*/
}
.toolboxcontainer .section:hover{
	/*margin-top: 30px;*/
	/*border: solid 3px #967BDC;*/
	/*
	animation: pulse-purple 2s infinite;
	border-radius: 15px;
	*/
}
.toolboxcontainer .nopadding:hover{
	/*margin-top: 35px;*/
}
.toolboxcontainer:hover .widget{
	/*border: solid 3px rgba(200,200,200,0.6);*//*#F36B4F*/
}
.toolboxcontainer:hover .translationnavigation {
	display: flex;
}
.dcntextarea:hover .translationnavigation {
	display: flex;
}
.toolboxcontainer .widget:hover{
	/*margin-top: 30px;*/
	/*border: solid 3px #F36B4F;*/
	/*
	animation: pulse-red 2s infinite;
	border-radius: 15px;
	*/
}
.toolboxcontainer .widget{
	box-sizing:  border-box;
	border: dotted 5px transparent;
	position: relative;
}
.dcncontainer{
	box-shadow: inset 0 0 0 0px #2196F3;
	position: relative;
	display: flex;
	align-items: center;
	/*overflow: hidden;*/
}
.dcncontaineroffset {
    width: 100%;
    margin-left: calc(var(--cms-navigation-margin) * 2 + var(--cms-navigation-width));
    margin-right: calc(var(--cms-navigation-margin) * 2 + var(--editor-mode-button-height));
    transition: all 0.3s;
    position: relative;
}

.dcnwatermark {
    width: 100%;
    height: -webkit-fill-available;
    position: absolute;
    display: none;
    box-sizing: border-box;
    border-radius: 18px;
    pointer-events: none;
}
.dcneditormode:hover .toolboxcontainer:hover .dcncontaineroffset > .dcnwatermark{
    background-color: rgba(33,150,243,0.15);
    box-sizing: border-box;
    animation: pulse-blue 2s infinite;
    display: block;
}
.toolboxcontainer .section:hover > .dcnwatermark {
    background-color: rgba(150, 123, 220,0.15);
    box-sizing: border-box;
    animation: pulse-purple 2s infinite;
    display: block;
}
.toolboxcontainer .widget:hover > .dcnwatermark {
    background-color: rgba(243, 107, 79,0.15);
    box-sizing: border-box;
    animation: pulse-red 2s infinite;
    display: block;
}

.dcncontainer .dcncontaineroffset > .dcnwatermark.activewatermark{
	background-color: rgba(33,150,243,0.15);
    box-sizing: border-box;
    animation: pulse-blue 2s infinite;
    display: block;
}
.section > .dcnwatermark.activewatermark{
	background-color: rgba(150, 123, 220,0.15);
    box-sizing: border-box;
    animation: pulse-purple 2s infinite;
    display: block;
}

.widget > .dcnwatermark.activewatermark{
	background-color: rgba(243, 107, 79,0.15);
    box-sizing: border-box;
    animation: pulse-red 2s infinite;
    display: block;
}


#page.dcneditormode .dcncontaineroffset{
	margin-right: calc(var(--cms-navigation-margin) * 2 + var(--editor-mode-panel-width));;
	transition: all 0.3s;
	
}
.parallax{
	overflow: hidden;
}
.flexbox{
	display: flex;
	flex-wrap: wrap;
}
.dcnhashtaglink {
	position:absolute;
	z-index:-1;
	left:0;
	margin-top:-80px;/* height of nav*/
}
.toolboxcontainer{
	position: relative;
	/*overflow: hidden;*/
	padding-top: 0px; /* 45 default */
}
.toolbox, .toolboxwidget{
	top: 0px;
	left: 0px;
	position: absolute;
	float: left;
	border-radius: 8px 8px 0 0;
	visibility: hidden;
	overflow: hidden;
	opacity: 0;
	z-index: 3;
	color: #FFFFFF;
	margin-left: 150px;
	display: none;
}
.section .toolbox{
	top: -33px;
	left: -3px;
	width: auto;
}
.widget .toolboxwidget{
	top: -33px;
	left:-3px;
}
.nopadding .toolbox{
	top: -30px;
	left: 0px;
}
.toolboxcontainer .widget:hover .toolboxwidget{
	visibility: visible;
	opacity: 1;
}
.toolboxcontainer:hover > .toolbox{
	visibility: visible;
	opacity: 1;
}
.toolboxcontainer .section:hover .toolbox{
	visibility: visible;
	opacity: 1;
}
.toolboxcontainer:hover{
}
.toolboxname{
	/*background-color: #2196F3;*/
	font-size: 14px;
	color: #ffffff;
	height: 30px;
	line-height: 30px;
	float: left;
	padding: 0px 10px;
}
.toolboxname p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	margin: 0;
	padding: 0;
}
.toolboxbutton{
	font-size: 16px;
	text-align: center;
	line-height: 30px;
	width: 30px;
	height: 30px;
	float: left;
	cursor: pointer;
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: center;
	border-left: solid 1px rgba(30,30,30,0.1);
}



.toolboxbutton:hover{
	/*background-color: #dedede;*/
}
.whitecontainer{
	background-color: #ffffff;
}
.greycontainer{
	background-color: #F7F7F7;
}
.orangecontainer{
	background-color: orange;
	color: #ffffff;
}
.content{
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	/*overflow: hidden;*/
	flex-basis: 100%;
}
.fwcontent{
	width: 100%;
	flex-basis: 100%;
	max-width: 100%;
}
.paddingcontent{
	box-sizing: border-box;
	padding: 40px 20px;
	flex-basis: 100%;
}
/*####*/
/*#### Buttons ####*/
/*####*/
.button,a[title="button"],button{
	font-size: 16px;
	border:none;
	padding: 0px 20px;
	height: 40px;
	border-radius: 10px;
	margin: 10px 0px;
	line-height: 40px;
	font-weight: initial;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: 40px;
	background-position: center;
	display: inline-block;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	transition: all 0.2s;
}
button:disabled{
	background-color: #cccccc;
  	color: #666666;
  	cursor:	not-allowed;

}
.button p,.button h1, .button h2, .button h3, .button h4, .button h5, .button h6,button p,button h1, button h2, button h3, button h4, button h5, button h6{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	line-height: 40px;
	font-weight: 400;
}
.smallbutton p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	line-height: 36px;
	font-weight: inherit;
}
.translationnavigationarea p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
}
.navigationbutton p, .selectednavigationbutton p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
}
.inputlabel > p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
}
th > p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
}
td p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	text-align: left;
}
h2 p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
}
h3 p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
}
b, strong{
	font-weight: 500;
}
.popuptext > p, .popuptext{
	font-size: 16px;
	text-align: inherit;
	line-height: 22px;
	color: #777777;
	font-weight: 300;
}
.button:hover, .smallbutton:hover,a[title="button"]:hover,a[title="smallbutton"]:hover{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 5px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 5px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 5px rgba(0,0,0,0.20);
}
button:disabled:hover{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
}
.button:active, .smallbutton:active, .buttonstyle:hover,a[title="button"]:active,a[title="smallbutton"]:active{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
}
.buttonstyle:active{
 	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 40px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 40px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 40px rgba(0,0,0,0.20);
 }
.smallbutton,a[title="smallbutton"]{
	display: inline-block;
	padding: 0px 16px;
	height: 36px;
	border-radius: 4px;
	line-height: 36px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: center;
	font-size: 15px;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	transition: all 0.2s;
	margin: 10px 0px;
	white-space: nowrap;
	font-weight: 400;
}
.circlebutton{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 100%;
	cursor: pointer;
	font-size: 16px;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	transition: all 0.2s;
	font-weight: 400;
}
.circlebutton:hover{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
}
.circlebutton:active{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
}
.transparentbutton{
	display: inline-block;
	padding: 0px 8px;
	height: 36px;
	border-radius: 4px;
	margin-right: 5px;
	line-height: 36px;
	font-weight: 500;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: 16px;
	background-position: center;
	font-size: 15px;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	transition: all 0.1s;
	font-size:16px; 
}
.transparentbutton:hover{
	transition: all 0.1s;
	-webkit-box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,0.20);
}

.dcngallerypicture{
	width: 48%;
	display: inline-block;
	overflow: hidden;
	cursor: pointer;
	position: relative;
	margin: 2% 0;
}
.dcngallerypicture:nth-child(2n){
	margin-left:2%;
	margin-right: 0;
}
.dcngallerypicture:nth-child(2n+1){
	margin-left:0;
	margin-right: 2%;
}
.dcngallerypicture img{
	width: 100%;
	transition: transform .3s ease;
}
.dcngallery{
	display: flex;
	flex-wrap: wrap;
}
.dcngallerypicture:hover img{
	transform: scale(1.1);
}
.dcngalleryname{
	text-align: center;
	font-size: 36px;
	font-weight: 500;
}
.dcngallerytitle p, .dcngallerytitle p,.dcngallerytitle p,.dcngallerytitle p,.dcngallerytitle p,.dcngallerytitle p,.dcngallerytitle p{
	all: unset;
}
.dcngallerydescription{
	text-align: center;
}
.dcngallerypictureinfo {
  width: 36px;
  height: 36px;
  position: absolute;
  bottom: -50;
  right: 88px;
  text-align: center;
	margin: 10;
	background-color: rgba(20,20,20,1);
	opacity: 1;
	color: #FFF;
	font-size: 16px;
	line-height: 36px;
	border-radius: 20px;
	transition: all 0.2s ease;
	box-shadow: 0px 0px 6px rgba(220,220,220,0.1);
	transition-delay: 0.1s;
}
.dcngallerypictureinfo:hover{
 opacity: 1;
}
.dcngallerypicture:hover .dcngallerypictureinfo{
	bottom: 0;
	transition: all 0.2s ease;
	transition-delay: 0.1s;
}
.dcngallerypicturedelete{
	width: 36px;
  height: 36px;
  position: absolute;
  bottom: -50;
  right: 0;
  text-align: center;
	margin: 10;
	background-color: rgba(232,90,68,1);
	opacity: 1;
	color: #FFF;
	font-size: 16px;
	line-height: 36px;
	border-radius: 20px;
	transition: all 0.2s ease;
	box-shadow: 0px 0px 6px rgba(220,220,220,0.1);
}
.dcngallerypicture:hover .dcngallerypicturedelete{
	bottom: 0;
	transition: all 0.2s ease;
}
.dcngallerypicturedelete:hover{
 opacity: 1;
}
.dcngallerypicturetag {
  width: 36px;
  height: 36px;
  position: absolute;
  bottom: -50;
  right: 44px;
  text-align: center;
	margin: 10;
	background-color: rgba(20,20,20,1);
	opacity: 1;
	color: #FFF;
	font-size: 16px;
	line-height: 36px;
	border-radius: 20px;
	transition: all 0.2s ease;
	box-shadow: 0px 0px 6px rgba(220,220,220,0.1);
	transition-delay: 0.05s;
}
.dcngallerypicturetag:hover{
	opacity: 1;
 	transition: all 0.1s ease;
}
.dcngallerypicture:hover .dcngallerypicturetag{
	bottom: 0;
	transition: all 0.2s ease;
	transition-delay: 0.05s;
}
.dcngalleryfilterbox{
	display: flex;
	background-color: #EEF1F6;
	padding: 10px 0;
	margin: 0;
	margin-bottom: 12px;
	color: #333;
}
.dcngallerytagboxtagunselected{
	width: auto;
	padding: 6px 10px;
	background-color: #FFF;
	border-radius: 0px;
	color: #444444;
	font-size: 14px;
	margin: 5px;
	display: flex;
	align-items: center;
	transition: all 0.1s;
	padding-left: 10px;
	cursor: pointer;
	font-weight: 300;
}
.dcngallerytagboxtagunselected:hover{
	transition: all 0.1s;
}
.dcngallerytagboxtagselected{
	width: auto;
	padding: 6px 10px;
	border-radius: 0px;
	font-size: 14px;
	margin: 5px;
	display: flex;
	align-items: center;
	transition: all 0.1s;
	padding-left: 10px;
	cursor: pointer;
	font-weight: 300;
}
#dcnfullscreendetailtagsdata{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.dcngallerytagcounter, .dcngallerycameracounter, .dcngallerylenscounter{
	font-size: 10px;
}
.dcngallerytagcounter:after, .dcngallerycameracounter:after, .dcngallerylenscounter:after {
	content: ")"
}
.dcngallerytagcounter:before, .dcngallerycameracounter:before, .dcngallerylenscounter:before {
	content: "(";
	margin-left:5px;
}
.dcngallerytagboxtags{
	display: flex;
	flex-wrap: wrap;
	margin-left: -5px;
}
.dcngalleryfilterboxtitle {
    font-size: 16px;
    padding: 5px 0 5px 0;
    font-weight: 400;
}
.dcngallerycameraboxcameras, .dcngallerylensboxlenses{
	margin: 5px 0;
}
.dcngallerycameraboxcamera label, .dcngallerylensboxlens label {
  display: flex;
  align-items: center;
}
/* The container */
.dcngallerycameraboxcamera, .dcngallerylensboxlens {
  display: flex;
  position: relative;
  padding-left: 27px;
  margin-bottom: 6px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  align-items: center;
}

/* Hide the browser's default checkbox */
.dcngallerycameraboxcamera input, .dcngallerylensboxlens input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #fff;
  display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
}

.checkmark i{
	visibility: hidden;
}
.dcngallerycameraboxcamera input:checked ~ .checkmark i, .dcngallerylensboxlens input:checked ~ .checkmark i{
	visibility: visible;
}

/* Products */
.dcndisplayproductsbox{
	display:flex;
	min-height: 100px;
	align-items: flex-start;
}
.dcnproductsfilterbox{
	width:350px;
	padding:20px;
	background-color:#f0f0f0;
	border-radius:8px;
}
.dcnproductsbox{
	width:100%;
	min-height: 100px;
	display:flex;
	justify-content:space-evenly;
	flex-wrap:wrap;
	padding-left: 10px;
	gap:10px;    
}
.dcnproductsfiltertitle{
	font-weight:bold;
	 margin-bottom: 5px;
}
.dcnproductsfilteritems{
	margin-bottom: 10px;
}
.dcnfilterbuttons{
	display: flex;
	overflow: hidden;
}
.dcnfilterresetbuttonbox{
	width: 0%;
	margin-left: 0%;
}
.dcnfilterboxapplybutton{
	margin-top:20px;
	width:100%;
	color:#FFFFFF;
	--fa-secondary-color:#FFFFFF;
}
.dcnfilterboxresetbutton{
	width: 100%;
	margin-top:20px;
	color:#FFFFFF;
	--fa-secondary-color:#FFFFFF;
}
.dcnproductbox{
	min-height: 100px;
    width: calc(100% - 20px);
    min-width: 250px;
    max-width: 254px;
}
.dcnproductimage{
	position:relative;
	width: 100%;
    aspect-ratio: 4 / 4;
}
.dcnproductimage img{
	width: 100%;
    aspect-ratio: 4/4;
    object-fit: cover;
    position: absolute;
}
.dcnproductimage .dcnproductprimarypicture{
	opacity:1;
	transition: all 0.2s;
}
.dcnproductimage:hover .dcnproductprimarypicture{
	opacity:0;
	transition: all 0.2s;
}
.dcnproductname {
    font-weight: bold;
    color: #333333;
    margin-top: 10px;
}
.dcnproductlabels{
	position:absolute;
	top: 0;
	width:100%;
	display:flex;
	justify-content:right;
	gap: 5px;
	padding: 10px;
	flex-wrap:wrap;
}
.dcnproductlabel {
    padding: 1px 8px;
    font-size: 15px;
    font-weight: 400;
    color: #FFFFFF;
    border-radius: 4px;
    text-transform: uppercase;
}
.dcnproductdiscountlabel{
	background-color: #e44a4a;
}
.dcnproductnewlabel{
	background-color: #5a8ef5;
}
.dcnproductooslabel{
	background-color: #AAAAAA;
}
.dcnproductpreorderlabel{
	background-color: purple;
}
.dcnproductprice{
	font-weight: 500;
	color: #AAAAAA;
	margin-top: 0px;
	display: flex;
	gap:5px;
	margin-bottom: 10px;
}
.dcndiscounted{
	text-decoration: line-through;
	color: #e44a4a;
	font-size: 14px;
}
.dcnproductsfilteritem{
	display:flex;
	align-items:center;
	justify-content:left;
}
.dcnproductsfilteritemlabel{
	display: flex;
	align-items:center;
	position: relative;
	padding-left: 35px;
	margin-bottom:5px;
	cursor: pointer;
	font-size: 16px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.dcnproductsfilteritemlabel input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.dcnproductsfilteritemlabel .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #ffffff;
  border:solid 1px #dddddd;
  border-radius:4px;
}
.dcnproductsfilteritemlabel:hover input ~ .checkmark {
  background-color: #ccc;

}
.dcnproductsfilteritemlabel input:checked ~ .checkmark {
  background-color: var(--primary-background-color);
  border-color:var(--primary-background-color);
}
.dcnproductsfilteritemlabel .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.dcnproductsfilteritemlabel input:checked ~ .checkmark:after {
  display: block;
}
.dcnproductsfilteritemlabel .checkmark:after {
  left: 8px;
	top: 4px;
	width: 7px;
	height: 13px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.dcnproductsfilteritemcount {
	padding-left:5px;
    font-size: 12px;
    color: var(--primary-background-color);
}

/* Product item */
.dcnproductitembox{
	min-height:50px;
	display:flex;
}
.dcnproductitempicturearea{
	width: 40%;
	min-height:50px;
}
.dcnproductiteminfoarea{
	width: 60%;
	min-height:50px;
	padding-left:20px;
}
.dcnproductitemmainpicture{
	position:relative;
}
.dcnproductitemmainpicture img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit:contain;
	
}
.dcnproductitemotherpicturearea{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	margin-top: 10px;
	justify-content: center;
}
.dcnproductitemotherpicturearea .dcnproductitemotherpicture {
    width: calc(25% - 8px);
    aspect-ratio: 1 / 1;
    object-fit:cover;
    border-radius: 10px;
    overflow: hidden;
    border: solid 1px #DDDDDD;
    cursor:pointer;
    transition:all 0.1s;
    position:relative;
}
.dcnproductitemotherpicture img{
	width:100%;
	aspect-ratio: 1 / 1;
    object-fit:cover;
}
.dcnproductitemotherpicturearea .dcnproductitemotherpicture.dcnproductpictureselected{
	border: solid 5px var(--primary-background-color);
	transition:all 0.1s;
}
.dcnproductitembrand {
    color: var(--primary-background-color);
    font-weight: 600;
}
.dcnproductitemname {
    font-weight: 700;
    font-size: 40px;
}
.dcnproductitempricearea {
    font-weight: 700;
    font-size: 26px;
    color: #AAAAAA;
    display:flex;
    margin-bottom: 20px;
}
.dcnproductitemdescription {
    color: #666666;
}
.dcnproductitemdeliverymessage{
	font-size: 14px;
	color: red;

}
.dcnproductitempricediscounted{
	margin-right:10px;
}
.dcnproductitemcartarea {
    display: flex;
    align-items: center;
}
.dcnproductitemcartincarea{
	margin-right:10px;
	cursor:pointer;
}
.dcnproductitemcartinc {
    width: 24px;
    border: solid 1px #DDDDDD;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    border-left: unset;
    font-size: 16px;
    font-weight: 600;
    color: var(--primary-background-color);
}
.dcnproductitemcartinc:hover{
	background-color:#f6f6f6;
}
.dcnproductitemcountup{
	border-bottom:unset;
	border-radius: 0px 10px 0px 0px;
}
.dcnproductitemcountdown {
    border-radius: 0px 0px 10px 0px;
}
.dcnproductitemincart {
    font-size: 14px;
    color: #AAAAAA;
}
.dcnproductitemoos{
	font-size: 14px;
    color: red;
}
.dcnproductitempreorder{
	font-size: 14px;
    color: #800080;
}
input.dcnproductitemcount {
    height: 40px;
    width: 50;
    text-align: center;
    font-weight: 500;
    margin-right:0;
    border: solid 1px #DDDDDD;
    border-radius: 10px 0px 0px 10px;
}
.dcnproductitempicturemanagementbox{
	position:absolute;
	bottom:5px;
	width:100%;
	min-height:20px;
	display: flex;
	justify-content: space-evenly;
}
.dcnproductitempicturemanagementboxbutton{
	width: 26px;
    aspect-ratio: 1 / 1;
    border-radius: 4px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Order */
.dcnorderbox{
	display:flex;
	flex-wrap:wrap;
}
.dcnorderinfobox{
	min-height:50px;
	width:50%;
}
.dcnorderschippingbox{
	min-height:50px;
	width:50%;
}
.dcnorderproductsbox{
	min-height:50px;
	width:100%;
	margin-top: 10px;
}
.dcnordersumbox{
	min-height:50px;
	width:100%;
    display: flex;
    justify-content: right;
}
.dcnorderbox table th{
	vertical-align: top;
	padding-right: 10px;
}
.dcnbankwireinfo {
    border: dashed #fa8231 2px;
    margin-top:10px;
    padding: 10px;
    border-radius: 13px;
    font-size: 17px;
    background-color: #fffcfa;
}
.dcnordersumbox tr td:first-child{
	padding-right: 20px;
	text-align: right;
}
.dcnordersumbox tr td{
	text-align: right;
	font-size: 16px;
}

/* Cart */
.profilenaigation{
	display:flex;
	justify-content: center;
	margin-bottom: 20px;
}
.dcncartproduct {
    display: flex;
    margin-bottom: 10px;
    align-items: center;
    justify-content:space-between;
    border-bottom: solid 1px #eeeeee;
    padding: 10px 0;
}
.dcncartproduct img {
    width: 100px;
    aspect-ratio: 1 / 1;
    object-fit:cover;
}
.dcncartproductinfobox {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 0 20px;
    width:100%;
}

.dcncartproductbrand {
    color: var(--primary-background-color);
    font-weight: 600;
    width:100%;
}
.dcncartproductname {
    font-weight: 700;
    font-size: 26px;
    width:100%;
}
.dcncartproductcountbox {
    display: flex;
    padding-right:20px;
    flex-wrap: wrap;
    justify-content: center;
    min-width: 130px;
}
.dcncartproductcount {
    width: 40px;
    font-weight: 400;
    display: flex;
    justify-content: center;
    align-items: center;
}
.dcncartproductcountbutton {
    width: 30px;
    height: 30px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color:#eaeaea;
    border-radius:100%;
    font-size:20px;
    cursor:pointer;
    margin: 0;
    padding: 0;
}
.dcncartproductremove {
    text-align: center;
    color: red;
    font-size: 14px;
    margin-top: 5px;
    cursor: pointer;
}
.dcncartproductprice{
	font-weight: 500;
    font-size: 20px;
    color: #AAAAAA;
    width: 120px;
    text-align: right;
}
.dcncartckeckoutbox{
	display:flex;
	justify-content:right;
	gap:10px;
}
.dcncartempty {
    text-align: center;
}
.dcncartempty i{
	font-size:50px;
}
.dcncartproduct a{
    width: 100%;
    color: inherit;
}
.dcncarttotalpricebox {
    display: flex;
    justify-content: right;
       padding: 25px 0;
}
.dcncarttotalprice{
	color: var(--primary-background-color);
	font-size:35px;
	font-weight:800;
}
.dcncarttotalsubtotalbox {
    padding-right: 20px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    text-align:right;
}
.dcncartsubtotal {
    font-weight: 800;
    width:100%;
    height:20px;
}
.dcncartsubtotalitems {
    font-size: 16px;
    color: #888888;
    width:100%;
    height:20px;
}


header a{
	color:inherit;
}
header a:hover{
	color:inherit;
}

/* Chrome, Safari, Edge, Opera */
input.dcnproductitemcount::-webkit-outer-spin-button,
input.dcnproductitemcount::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input.dcnproductitemcount[type=number] {
  -moz-appearance: textfield;
}

/* Range sliders */
.range_container {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.sliders_control {
  position: relative;
  min-height: 30px;
}

.form_control {
  position: relative;
  display: flex;
  justify-content: space-between;
}

.range_container input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  pointer-events: all;
  width: 24px;
  height: 24px;
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #C6C6C6;
  cursor: pointer;
}

.range_container input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  pointer-events: all;
  width: 24px;
  height: 24px;
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 0 0 1px #C6C6C6;
  cursor: pointer;  
}

.range_container input[type=range]::-webkit-slider-thumb:hover {
  background: #f7f7f7;
}

.range_container input[type=range]::-webkit-slider-thumb:active {
  box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe;
  -webkit-box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe;
}

.range_container input[type="number"] {
  color: #8a8383;
  width: 70px;
  height: 26px;
  border: none;
  margin-right:0;
}

.range_container input[type=number]::-webkit-inner-spin-button, 
.range_container input[type=number]::-webkit-outer-spin-button {  
   opacity: 1;
}

.range_container input[type="range"] {
  -webkit-appearance: none; 
  appearance: none;
  height: 2px;
  width: 100%;
  position: absolute;
  background-color: #C6C6C6;
  pointer-events: none;
}

#fromSlider {
  height: 0;
  z-index: 1;
}
.form_control input[type="number"]{
	background-color: transparent;
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}


/* Brands display */
.dcnbrandbox{
	width: 100%;
	max-width: 250px;
	min-width: 200px;
	box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);
	background-color: white;
    border-radius: 8px;
    overflow: hidden;
    cursor:pointer;
    position: relative;
}
.dcnbrandboxpicture{
	position: relative;
}
.dcnbrandboxpicture img{
	width: 100%;
	aspect-ratio: 8 / 5;
	object-fit: cover;
	background-color: grey;
}
.dcnbrandinfo{
	text-align: center;
	position: absolute;
	bottom: 0;
    width: 100%;
    color: #FFFFFF;
    padding: 20px;
}
.dcnbrandoverlay{
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
	background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(255,255,255,0) 100%);
}
.dcnbrandname{
	font-weight: 600;
	text-shadow: 0px 0px 4px black;
}
.dcnbrandname *{
	all: unset;
}
.dcnbrandproductscount{
	font-size: 14px;
	color: #eaeaea;
	text-shadow: 0px 0px 4px black;
}

/* Galleries */
.dcngalleriesbox{
	width: 100%;
	max-width: 250px;
	min-width: 200px;
	box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);
	background-color: white;
    border-radius: 8px;
    overflow: hidden;
    cursor:pointer;
    position: relative;
}
.dcngalleriespicture{
	position: relative;
}
.dcngalleriespicture img{
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	background-color: grey;
}
.dcngalleriespicturecount{
	position: absolute;
	top:12px;
	right: 12px;
	color: white;
	text-shadow: 0px 0px 4px black;
}
.dcngalleriesinfo{
	text-align: center;
	position: absolute;
	bottom: 0;
    width: 100%;
    color: #FFFFFF;
    padding: 20px;
}
.dcngalleriesoverlay{
	width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
	background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(255,255,255,0) 100%);
}
.dcngalleriesname{
	font-weight: 600;
	text-shadow: 0px 0px 4px black;
}
.dcngalleriesname *{
	all: unset;
}

.dcngalleriestimestamp{
	font-size: 14px;
	color: #888888;
	display: flex;
}
.dcngalleriesdate{
	font-size: 14px;
	color: #eaeaea;
	text-shadow: 0px 0px 4px black;
}

/* Recent Articles */
.dcnarticlethumbbox{
	width: 100%;
	max-width: 350px;
	min-width: 200px;
	box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);
	background-color: white;
    border-radius: 8px;
    overflow: hidden;
    cursor:pointer;
}
.dcnarticlethumbimage{
	position: relative;
}
.dcnarticlethumbimage img{
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	background-color: grey;
}
.dcngalleriespicturecount{
	position: absolute;
	top:5px;
	right: 9px;
	color: white;
	text-shadow: 0px 0px 4px black;
}
.dcnarticlethumbinfo{
	margin: 12px;
}
.dcnarticlethumbtitle{
	font-weight: 600;
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.dcnarticlethumbtitle *{
	all: unset;
}
.dcnarticlethumbdescription{
	font-size: 14px;
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.dcnarticlethumbdata{
	font-size: 13px;
	color: #888888;
	display: flex;
	margin-top: 8px;
}
.dcnarticlethumbzone a, .dcngalleriesthumbzone a{
	color: inherit;
	display: flex;
}
.dcnarticlethumbzone, .dcngalleriesthumbzone{
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: 20px 0px;
}
.dcnarticlethumbdata i{
	margin-left: 10px;
	margin-right: 5px;
}
.dcnarticlethumbdata > *:nth-child(1) i{
	margin-left: 0px;
}



.albumselection{
	width:30.333333%;
	min-height: 50px;
	background-color: #ffffff;
	overflow: hidden;
	box-shadow: 0px 2px 6px 0 rgba(0,0,0,0.15);
	border-radius: 3px;
	margin: 1.5%;
	display: inline-block;
	box-sizing: border-box;	
	text-align: center;
	cursor: pointer;
}
.albumselection {
	box-sizing: border-box;
	padding: 7px 10px;
	margin: 14px 0px;
	font-size: 17px;
	text-transform: initial;
	color: inherit;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	display: inline-block;
	max-width: 92%;
	margin-left: 4%;
	margin-right: 4%;
	font-weight: initial;
	border-left: 4px dotted #ffffff;
	border-right: 4px dotted #ffffff;
}
.albumselection h3 *{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
}
.albumselectioncover{
	box-sizing: border-box;
	width:100%;
	height: 50px;
	background-color: rgba(255,255,255,0.3);
	background-image: url(../../images/StockSnap_HZZKGVVJ6I.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.albumselectioncoverhover{
	width: 100%;
	height: 100%;
	color: #ffffff;
	font-size: 50px;
	visibility: hidden;
	transition: all 0.2s;
	color: transparent;
}
.albumselection:hover .albumselectioncoverhover{
	background-color: rgba(30,30,30,0.4);
	visibility: visible; 
	transition: all 0.2s;
	color: #ffffff;
}
.albumpicture{
	width: 24%;
	min-height: 30px;
	margin: 0.5%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	float:left;
	cursor: pointer;
}
.albumpictureoptions{
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 0px 10px;
	border-radius: 5px;
	margin:10px;
	margin-right: 0;
}
.albumpicturetagslist{
	position: relative;
	width: 100%;
	height: 100%;
	background-color: rgba(20,20,20,0.0);
}
.albumpicturetagslistbox {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 10px;
    cursor: initial;
}
.albumpicturetag{
	float: left;
	line-height: 26px;
	background-color: #ffffff;
	padding: 0 10px;
	border-radius: 13px 4px 4px 13px;
	margin-bottom: 10px;
	font-size: 14px;
	margin-left: 5px;
	margin-right: 5px;
	padding-left:10px;
}
.albumpicturefullscreen{
	width: 100%;
	height: 100%;
	cursor: zoom-in;
}
div > .smallbutton:first-child, div > a[title="smallbutton"]{
	margin-left: 0;
}
div > .button:first-child, div > a[title="button"]{
	margin-left: 0;
}
.smallbutton i, .transparentbutton i{
	line-height: inherit;
}
.tertiarybutton{
	background-color: transparent;
	/*color: #545454;*/
	-webkit-box-shadow: unset;
	-moz-box-shadow: unset;
	box-shadow: unset;
}
.tertiarybutton:hover{
	background-color: transparent;
	color: #545454;
	-webkit-box-shadow: unset;
	-moz-box-shadow: unset;
	box-shadow: unset;
}
.ribbon {
  font-size: 16px;
  position: relative;
  background: #E14627;
  color: #fff;
  text-align: center;
  padding: 6px 10px;
  height: 20px;
  line-height: 20px;
  line-break: unset;
  display: flex;
  white-space: nowrap;
  margin: 0px 15px;
}
.ribbon:before, .ribbon:after {
 content: "";
 position: absolute;
 display: block;
 bottom: -0.5em;
 border: 1em solid #B93D25;
 z-index: -1;
}
.ribbon:before {
 left: -1em;
 border-right-width: 1em;
 border-left-color: transparent;
}
.ribbon:after {
 right: -1em;
 border-left-width: 1em;
 border-right-color: transparent;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
 content: "";
 position: absolute;
 display: block;
 border-style: solid;
 border-color: red transparent transparent transparent;
 bottom: 1em;
}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: 0.5em 0 0 1em;
 background-color: rgba(0,0,0,0.5);
}
.ribbon .ribbon-content:after {
 right: 0;
 border-width: 0.5em 1em 0 0;
 background-color: rgba(0,0,0,0.5);
}
.navigationbutton, .selectednavigationbutton{
	float: left;
	height: 80px;
	padding: 0px 10px;
	line-height: 80px;
	font-weight: 400;
	font-size: 16px;
	box-sizing: border-box;
	transition: all 0.1s;
	cursor: pointer;
	display: flex;
	align-items: center;
}
.permissiontrigger{
	text-align: center;
}
.permissiontrigger:hover{
	cursor: pointer;
}
.permissiontrigger:hover{
	background-color: rgba(150,150,150,0.2);
}
.permissionbutton{
	width: 20px;
	height: 20px;
	background-size: 16px;
	background-repeat: no-repeat;
	background-position: center;
	display: inline-block;
}
.languagebutton{
	float: left;
	height: 80px;
	margin-left: 20px;
	margin-right: 20px;
	padding: 0px 20px;
	padding-right: 0px;
	line-height: 76px;
	font-weight: bold;
	font-size: 16px;
	background-repeat: no-repeat;
	background-position: center left 0px;
	background-size: 16px;
	font-weight: bold;
}
.notificationbutton{
	float: left;
	padding: 0px 10px;
	height: 26px;
	background-color: grey;
	border-radius: 2px;
	margin: 10px;
	margin-left: 0px;
	margin-top: 0px;
	line-height: 26px;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: 40px;
	background-position: center;
	font-size: 14px;
	box-sizing: border-box;
	margin-bottom: 18px;
}
.notificationbutton p{
	all:unset;
}

.cmsnavigationbutton p, .cmsnavigationbuttonselected p{
	all:unset;
}
.cmsnavigationbutton{
	border-radius: 3px;
	width: 100%;
	height: 40px;
	background-size: 20px;
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
	text-align: left;
	line-height: 40px;
	box-sizing: border-box;
	font-size: 14px;
	overflow: hidden;
	margin: 5px 0px;
	color: #aaaaaa;
	border-radius: 40px;
	white-space: nowrap;
	padding-right: 15px;
}
.cmsnavigationbuttonselected{
	border-radius: 3px;
	width: 100%;
	height: 40px;
	background-size: 20px;
	background-position: center;
	background-repeat: no-repeat;
	cursor: pointer;
	text-align: left;
	line-height: 40px;
	box-sizing: border-box;
	font-size: 14px;
	overflow: hidden;
	margin: 5px 0px;
	border-radius: 40px;
	font-weight: 400;
}
.cmsnavigationbuttonicon{
	width: 40px;
	height: 40px;
	background-color: transparent;
	display: inline-block;
	height: 100%;
	font-size: 16px;
	text-align: center;
	margin-right: 5px;
	background-color: #32324e;
	border-radius: 100%;
	color: #aaaaaa;
}
.cmsnavigationbuttonselected .cmsnavigationbuttonicon{
	width: 40px;
	height: 40px;
	display: inline-block;
	height: 100%;
	font-size: 16px;
	text-align: center;
	margin-right: 5px;
	background-color: rgba(255,255,255,0.2);
	border-radius: 100%;
	color: inherit;
}
.cmsnavigationbutton:hover{
	background-color: rgba(100,100,100,0.1);
}
.buttoncombi{
	width: 34px;
	height: 34px;
	float: left;
	background-size: 16px;
	background-repeat: no-repeat;
	background-position: center;
	margin: 0px 0px;
	cursor: pointer;
	opacity: 1;
	transition: all 0.2s;
	line-height: 34px;
	font-weight: 900;
	font-size: 15px;
	text-align: center;
}
.colorbutton{
	width: 30px;
	height:30px;
	background-color: grey;
	margin-right: 10px;
	float: left;
	border-radius: 30px;
	cursor: pointer;
	border: solid 4px #ededed;
}
.offlinebutton{
	float: left;
	font-weight: bold;	
	font-size: 18px;
	padding: 0px 10px;
	height: 80px;
	line-height: 80px;
	cursor: pointer;
}
.inputbutton{
	float: right;
	padding: 0px 20px;
	height: 40px;
	background-color: grey;
	border-radius: 2px;
	margin-top: 20px;
	line-height: 40px;
	font-weight: bold;
	cursor: pointer;
	background-repeat: no-repeat;
	background-size: 40px;
	background-position: center;
}
.loginplaceholder{
	width: 0px;
}
.usernavbutton{
	width: 35px;
	height: 35px;
	float: right;
	background-size: 20px;
	background-repeat: no-repeat;
	background-position: center;
	margin: 0px 3px;
	cursor: pointer;
	opacity: 0.7;
	transition: all 0.2s;
}
.usernavbutton:hover{
	opacity: 1;
	transition: all 0.2s; 
}
.trwhitebutton{
	background-color: rgba(180,180,180,0.7);
	color: #FFFFFF;
}
.trredbutton{
	background-color: rgba(237,58,101,0.7);
	color: #ffffff;
}
.whitebutton{
	background-color: white;
	color: #333333;
}
.redbutton{
	background-color: #ED5565;
	color: #ffffff;
}
.bluebutton{
	background-color: #5D9CEC;
	color: #ffffff;
}
.greenbutton{
	background-color: #24C877;
	color: #ffffff;
}
.orangebutton{
	background-color: #FC6E51;
	color: #ffffff;
}
.blackbutton{
	background-color: #46515D;
	color: #ffffff;
}
.myaddressesbox{
	overflow: hidden;
	border-radius: 5px;
	margin-bottom: 20px;
	box-shadow: 0px 0px 6px rgba(70,70,70,0.1)
}
/*####*/
/*#### Article ####*/
/*####*/

.dcnarticlebanner{
	width: 100%;
	height: 30vh;
	background-color: grey;
	background-image: url("../../images/placeholder.jpg");
	background-position: center;
	background-size: cover;

}
.dcnchangepicture1 , .dcnchangepicture2{
	width: 100%;
	height: 100%;
	position: relative;
	background-color: rgba(50,50,50,0);
	color: rgba(255, 255, 255, 0);
	transition: all 0.1s;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
}
.dcnchangepicture1:hover{
	background-color: rgba(254, 26, 26,0.5);
	color: rgba(255, 255, 255, 1.0);
	transition: all 0.1s;
}
.dcnchangepicture2:hover{
	background-color: rgba(20,20,20,0.5);
	color: rgba(255, 255, 255, 1.0);
	transition: all 0.1s;
}
.dcnarticle{
	display: flex;
}
.dcnarticlecolumn{
	width: 100%;
	min-height: 50px;
}
.dcnarticlereferencescolumn{
	min-width: 35%;
	min-height: 50px;
	padding-left: 20px;
	padding-top: 20px;
}
.dcnarticletitle{
	font-size: 3.125rem;
	font-weight: 700;
	line-height: 4rem;
	margin: 20px 0px;
}
.dcnarticletitle p, .dcnarticletitle h1,.dcnarticletitle h2,.dcnarticletitle h3,.dcnarticletitle h4,.dcnarticletitle h5,.dcnarticletitle h6{
	all: unset;
}
.dcnarticleinfo{
	font-size: 16px;
	color: #999999;
	margin-bottom: 20px;
}
.dcnarticleinfo i{
	margin-left: 10px;
	margin-right: 5px;
}

.dcnarticleinfo i:nth-child(1){
	margin-left: 0px;
}


/*####*/
/*#### Products ####*/
/*####*/
.menucontainer{
	background-color: #ffffff;
	border-radius: 10px;
	overflow: hidden;
	margin: 15px 0px;
}
.menuicon{
	width: 20%;
	height: 100px;
	color: #ffffff;
	text-align: center;
	font-size: 40px;
	line-height: 100px;
	float: left;
}
.menutext{
	float: left;
	height: 50px;
	line-height: 50px;
	text-align: left;
	box-sizing: border-box;
	padding: 0px 20px;
	font-size: 15px;
}
.menuview{
	height: 50px;
}
.fas, .far, .fad, .fal{
	line-height: inherit;
}
hr{
	border-top: none;
	border-left: none;
	border-right: none;
	border-color: rgba(40,40,40,0.15);
}
.noresult{
	background-color: #ffffff;
	box-sizing: border-box;
	padding: 15px;
	text-align: center;
	margin: 15px 0px;
	font-family: inherit;
	border-radius: 10px;
	font-size: 16px;
}
/*####*/
/*#### Fonts ####*/
/*####*/
a{
	text-decoration: none;
	cursor: pointer;
}
.center{
	text-align: center;
}
h1, h2, h3, h4, h5, h6{
	margin-bottom: 1.5rem;
}
sup,sub{
	line-height: inherit;
	margin-bottom: 1.5rem;
}
h1{
	font-size: 38px;
}
h2{
	font-size: 32px;
}
.popupcontent > h2{
	text-align: center;
	font-size: 24px;
	/*text-transform: uppercase;*/
	font-weight: 400;
	margin-bottom: 25px;
	margin-top: 15px;
	color: black;
	font-weight: 500;
}
p{
	font-size: inherit;
	font-weight: 300;
	line-height: 40;
	line-height: 25px;
	margin-bottom: 1.5rem;
}
.clearformat p, .clearformat h1, .clearformat h2, .clearformat h3, .clearformat h4, .clearformat h5, .clearformat h6{
	all:unset;
}
table p{
	margin-top: 0;
}
.productbox h4{
	text-align: left;
	margin: 10px 0px;
	height: 22px;
}
.productbox p{
	margin: 10px 0px;
	text-align: left;
	height: 22px;
}
.fontberlin{
	font-family: berlin;
}
.orangefont{
	color: orange;
}
.link{
	color: inherit;
	text-decoration: underline;
	cursor: pointer;
}
.whitecontainer .link{
	color: orange;
}
/*####*/
/*#### Icons ####*/
/*####*/
.carticon{
	background-image: url(../../images/cart.png);
}
.gearicon{
	background-image: url(../../images/gear.png);
}
.usericon{
	background-image: url(../../images/user.png);
}
.gridicon{
	background-image: url(../../images/grid.png);
}
.listicon{
	background-image: url(../../images/list.png);
}
/*####*/
/*#### Table ####*/
/*####*/
.pagenumbersbox{
	width: 100%;
	display: flex;
	align-items: center;
	margin-top: 10px;
	color: #353E4A;
	justify-content: right;
	height: 32px;
}
.tableinfobox{
	width: 100%;
	display: flex;
	align-items: center;
	margin-top: 10px;
	color: inherit;
	justify-content: left;
	height: 32px;
	font-size: 14px;
	margin-left: 10px;
}
.tableinfobox p {
	all:unset;
	color: inherit;
	font-size: inherit;
}
.dcntableloader{
	margin-left: 5px;
}
.pagenumbersbutton{
	display: flex;
	border-radius: 4px;
	font-size: 16px;
	padding: 0px 10px;
	margin-right: 6px;
	cursor: pointer;
	height: 30px;
	align-items: center;
	background-color: rgba(20,20,20,0.05);
	box-shadow: 0px 0px 1px #FFFFFF;
}
.pagenumbersbutton:hover{
	background-color: rgba(20,20,20,0.1);
}
.pagenumbersbutton:active{
	background-color: rgba(20,20,20,0.05);
}
.pagenumbersbuttonselected{
	border:solid 1px transparent;
	font-weight: 500;
	color: inherit;
	background-color: rgba(20,20,20,0.1);
	text-decoration: underline;

}
.pagenumbersbuttonselected:hover{
	background-color: rgba(20,20,20,0.1);
}
.pagenumberdisabled{
	color:#CCCCCC;
	background-color: transparent;
}
.pagenumberdisabled:hover{
	background-color: transparent;
}
.colorpalette{
	width: 24px;
	height: 24px;
	border-radius: 12px;
	background-color: transparent;
	border: solid 2px #222222;
	display: inline-block;
	margin-right: 6px;
}
.systemlabel{
	display: inline-block;
	padding: 4px 10px;
	background-color: #BBBBBB;
	border-radius: 4px;
	color: #FFFFFF;
	margin: 5px 0px;
	font-size: 14px;
}
.defaulttable{
	width: 100%;
	box-sizing: border-box;
	border: solid 8px #ffffff;
	margin:0;
	background-color: #FFFFFF;
}
.defaulttable th{
	background-color: #ffffff;
	color: #353E4A;
	height: 40px;
	font-weight: bold;
	padding-bottom: 11px;
}
.defaulttable th:has(i){
		cursor: pointer;
}
.defaulttable th p {
    font-weight: inherit;
    margin: 0;
}
.defaulttable tr{
	background-color: #ffffff;
	border-bottom: solid 1px #efefef;
}
.defaulttable td{
	padding: 5px 10px;
	text-align: left;
	font-size: 16px;
	border-color: #cccccc;
	font-weight: 300;
	height:36px;
}
.defaulttable th{
	padding: 5px 10px;
	text-align: left;
	font-size: 16px;
	border-color: #cccccc;
	font-weight: 500;
}
.table{
	overflow: auto;
	border-radius: 15px;
	margin-bottom: 0px;
}
#footer table{
	width: 100%;
	color: #ffffff;
	text-align: center;
}
#footer table td{
	padding: 6px 0px;
}
#footer p{
	text-align: center;
	font-size: 15px;
}
.statustablefield{
	display: inline-block;
	padding: 4px 8px;
	font-size: 11px;
	color: #FFFFFF;
	border-radius: 4px;
	cursor: pointer;
	font-weight: 700;
}
.dcntablethumbnail{
	border-radius:3px;
	width:50px;
	height:50px;
	object-fit: cover;
}
/*########*/
/*#### Slider ####*/
/*########*/
.dcnsliderimagepositionbox{
	color: #FFF;
  font-size: 16px;
	background-color: rgba(20,20,20,0.6);
	padding: 3px 6px;
	border-radius: 5px;
	font-weight: 300;
}
.sliderbulletbox{
	width: 100%;
	display: flex;
	height: 50px;
	position: absolute;
	bottom: 10px;
	align-items: center;
	justify-content: center;
}
.slidermanagementbox{
	width: 100%;
	display: flex;
	height: 50px;
	position: absolute;
	bottom: 10px;
	align-items: center;
	justify-content: center;
}
.slidermanagementcontainer{
	display: flex;
	padding: 3px;
	background-color: rgba(20,20,20,0.7);
	border-radius: 100px;
}
.slidercontent{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding-bottom: 60px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
}
.slidercontenttext{
	width: 100%;
	flex:0 0 100%;
	display: none;
}
.slideroverlay{
	width: 100%;
	position: absolute;
	width: 100%;
	height: 100%;
	top:0;
}
.slidercontainer{
	width: 100%;
	overflow: hidden;
	position: relative;
	background-color: black;
}
.slidercontainer img, .slidercontainer video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sliderbutton{
	width: 100px;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFFFFF;
	font-size: 45px;
	transition: all 0.2s;
	cursor: pointer;
}
.sliderbuttonicon{
	width: 40px;
	height: 40px;
	background-color: rgba(20,20,20,0.2);
	border-radius: 100%;
	font-size: 20px;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.1s;
}
.sliderbutton:hover .sliderbuttonicon{
	transition: all 0.1s;
	background-color: rgba(20,20,20,0.6);
}
.sliderbutton:active{
	font-size: 45px;
	transition: all 0.05s;
}
.sliderinfopanel{
	width: 100%;
	height: 100%;
	position: relative;
}
.diaslidercontainer{
	height: 200px;
	width: 100%;
	overflow: hidden;
	position: relative;
	border-radius: 4px;
	background-color: black;
}
.sliderslides{
	width: 100%;
	height: inherit;
}
.slidercontrolpanel{
	top:0;
	height: inherit;
	width: 100%;
	background-color: transparent;
	position: absolute;
	/*background-color: rgba(70,70,70,0.05);
	background-image: url(../../images/cms/overlay.png);*/
	background-size: 16px;
}
.diaslidercontainer .slidercontrolpanel{
	top:0;
	height: inherit;
	width: 100%;
	background-color: transparent;
	position: absolute;
	background-color: rgba(70,70,70,0);
	background-image: none;
	background-size: 16px;
}
.sliderbullet{
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 100%;
	margin-right: 6px;
	border: solid 3px #ffffff;
	cursor: pointer;
	-webkit-box-shadow: 0px 0px 3px 0px rgba(20,20,20,0.5);
	-moz-box-shadow: 0px 0px 3px 0px rgba(20,20,20,0.5);
	box-shadow: 0px 0px 3px 0px rgba(20,20,20,0.5);
}
.diaslidercontainer .sliderbullet{
	display: inline-block;
	margin: 7px 0px;
	width: 8px;
	height: 8px;
	border-radius: 100%;
	margin-right: 6px;
	border: solid 3px #ffffff;
	cursor: pointer;
}
.slidercontrolpanel .content{
	height: inherit;
	width: 100%;
	max-width: 100%
}
.slidermoveslide{
	cursor: pointer;
	width: 12%;
	height: inherit;
	float: left;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 50px;
	transition: all 0.1s;
}
.slidermoveslide:hover{
	background-size: 56px;
	transition: all 0.1s;
}
.slidermoveslide:active{
	background-size: 50px;
	transition: all 0.1s;
}
.diaslidermoveslide{
	cursor: pointer;
	width: 12%;
	height: inherit;
	float: left;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 30px;
	transition: all 0.1s;
}
.diaslidermoveslide:hover{
	background-size: 36px;
	transition: all 0.1s;
}
.diaslidermoveslide:active{
	background-size: 30px;
	transition: all 0.1s;
}
.slidercontrol{
	width: 76%;
	height: inherit;;
	float: left;
}
.sliderslide{
	width: 100%;
	height: 100%;
	float: left;
	overflow: hidden;
}
.sliderslidecontent{
	height: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
.diasliderslidecontent{
	height: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
video{
	min-width: 100%;
	width: 100%;
	min-height: 100%;
}
/*########*/
/*#### AGE GROUP ####*/
/*########*/
.boxshadow{
	box-shadow: 0px 2px 6px 0 rgba(0,0,0,0.15);
}
.dcneventbox{
	display: flex;
    background-color: white;
    box-shadow: 1px 1px 4px 0 rgb(0 0 0 / 10%);
    overflow: hidden;
    border-radius: 8px;
    height: 90px;
    margin: 10px 0;
    color: #333333;
}
.dcneventdate{
	width: 90px;
	min-width: 90px;
    aspect-ratio: 1 / 1;
    border-right: solid 1px #eaeaea;
    overflow: hidden;
}
.dcneventmonth {
    width: 100%;
    height: 24px;
    background-color: tomato;
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 400;
    color: #FFFFFF;
    font-size: 16px;
}
.dcneventday {
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 39px;
    font-weight: 600;
    margin-top: 7px;
}
.dcneventyear {
   	height: 16px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
}
.dcneventtitle {
	width: 100%;
    font-size: 19px;
    font-weight: 500;
    margin: 0 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.dcneventtitle *{
	all: unset;
}
.dcneventlocation a{
	color: inherit;
	text-decoration: underline;
}
.dcneventlocation {
	width: 100%;
    font-size: 14px;
    /* font-weight: 500; */
    margin: 0 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.dcneventperiod {
	width: 100%;
    font-size: 14px;
    /* font-weight: 500; */
    margin: 0 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.dcneventinfo {
	display: flex;
    flex-wrap: wrap;
    align-content: center;
    overflow: hidden;
}
.dcneventinfo i {
    width: 16px;
    text-align: center;
    margin-right: 6px;
}
.dcneventempty {
    text-align: center;
    padding: 20px;
    color: rgba(125,125,125,0.7);
    font-size: 16px;
}




.eventmonth{
	text-align: center;
	color: tomato;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 26px;
}
.eventday{
	text-align: center;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 50px;
}
.eventyear{
	text-align: center;
	text-transform: uppercase;
	font-size: 14px;
}
.eventtitle{
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    font-size: 26px;
    font-weight: bold;
    text-align: left;
}
.eventtitle p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
}
.unset p{
	all:unset;
}
.eventdescription{
	font-size: 15px;
	line-height: 20px;
	text-align: left;
}
.eventdescription p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
	text-align: inherit;
}
.eventlocation{
	width: 100%;
	color: #888888;
	margin:7px 0px;
}
.eventlocation td{
	padding: 2px 0px;
}


.agegroupcontainer{
	width: 100%;
	background-color: #ffffff;
	border-radius: 8px;
	box-sizing: border-box;
	padding: 20px;
	color:#353E4A;
	margin-top: 90px;
}
.agegroupimage{
	width: 130px;
	height: 130px;
	margin-left: auto;
	margin-right: auto;
	background-color: #333333;
	border-radius: 100%;
	margin-top: -100px;
	border: solid 10px #ffffff;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.agegroupname{
	text-align: center;
	font-weight: bold;
	font-size: 28px;
	margin-bottom: 6px;
}
.agegroupname > p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
}
.agegroupage{
	text-align: center;
	font-size: 14px;
}
.agegroupdescription{
	margin: 20px 0px;
	margin-bottom: 10px;
	text-align: center;
	font-size: 16px;
	line-height: 22px;
}
.agegroupdescription p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
}
.readmore{
	margin-top: 20px;
	cursor: pointer;
}
.readmore > p{
	all:unset;
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: inherit;
	font-size: inherit;
}
.agegroupaddimage{
	width: 100%;
	height: 100%;
	background-image: url(../../images/cms/plus.png);
	background-repeat: no-repeat;
	background-size: 30px;
	background-position: center;
	border-radius: 100%;
}
.agegroupdeleteimage{
	width: 100%;
	height: 100%;
	background-image: url(../../images/cms/trash.png);
	background-repeat: no-repeat;
	background-size: 30px;
	background-position: center;
	border-radius: 100%;
	opacity: 0;
	transition: all 0.2s;
	cursor: pointer;
}
.agegroupdeleteimage:hover{
	opacity: 1;
	transition: all 0.2s;
}
.buttonstyle{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 0px rgba(0,0,0,0.20);
	cursor: pointer;
}
.dcnexamscore{
	background-color: rgba(50,50,50,0.2);
	color: rgba(50,50,50,1);
    padding: 3px 10px;
    display: inline-block;
    border-radius: 20px;
    font-weight: 500;
    font-size: 14px;
}
.dcnexamscore.sufficient{
	background-color: rgba(52,182,150,0.2);
	color: rgba(52,182,150,1);
}
.dcnexamscore.insufficient{
	background-color: rgba(236,85,100,0.2);
	color: rgba(236,85,100,1);
}

/*####*/
/*#### Profile ####*/
/*####*/
.dcnprofilecontainer{
	width: 100%;
	box-sizing: border-box;
	padding: 7px;
	padding-top: 80px;
}
.dcnprofilebox{
	width: 100%;
	min-height: 100px;
	background-color: #ffffff;
	box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.1);
	box-sizing: border-box;
	padding: 20px;
	border-top:solid 10px;
	border-radius: 2px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.dcnprofilepicture{
	margin-top: -90px;
	max-width: 90%;
	width: 130px;
	height: 130px;
	background-color: #e5e5e5;
	border-radius: 25%;
	box-sizing: border-box;
	border:solid 5px #e5e5e5;
	overflow: hidden;
	margin-bottom: 10px;
	position: relative;
}
.dcnprofilepictureedit{
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(89,152,230,0);
	transition: all 0.1s;
	display: flex;
	align-items: end;
	justify-content: right;
	color: #ffffff;
	font-size: 20px;
	cursor: pointer;
}
.dcnprofilepictureedit:hover{
	background-color: rgba(89,152,230,0.8);
	transition: all 0.1s;
	align-items: center;
	justify-content: center;
	font-size: 30px;
}
.dcnprofilepictureedit i{
	padding: 12px;
	opacity: 0.5;
}
.dcnprofilepictureedit:hover i{
	padding: 12px;
	opacity: 1;
}
.dcnprofilepicture img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
}
.dcnprofilename{
	width: 100%;
	padding: 10px;
	font-size:20px;
	text-align: center;
	box-sizing: border-box;
	font-weight: 500;
	color: #353E4A;
}
.dcnprofilerole{
	width: 100%;
	padding: 10px;
	font-size:16px;
	text-align: center;
	box-sizing: border-box;
	padding-top: 0px;
	color:#999999;
}
.dcnprofilerole p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	margin: 0;
}
.dcnprofilebio{
	width: 100%;
	padding: 10px;
	font-size:16px;
	text-align: center;
	box-sizing: border-box;
	padding-top: 10px;
	margin-bottom: 5px;
	color: #353E4A;
}
.dcnprofilemanagement{
	display: flex;
	justify-content: center;
}
.dcnprofilesocialmedia{
	display: flex;
	justify-content: center;
	align-items: center;
}
.dcnprofilesocialmediaicon{
	transition: all 0.1s;
	opacity: 0.8;
	font-size: 20px;
	margin: 5px 6px;
	width: 26px;
	height: 26px;
	color: #FFFFFF;
	font-size: 14px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
}
.dcnprofilesocialmediaicon:hover{
	transition: all 0.1s;
	opacity: 1;
}
.dcnprofilesocialmediacontainer{
	text-align: center;
}
/*####*/
/*#### AYRSHARE ####*/
/*####*/
.dcnayrapikeyzone{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.dcnayraccounttitle,.dcnayrapititle,.dcnayrsocialtitle{
	font-weight: 500;
}
.dcnayrapikey{
	margin-right: 20px;
}
.dcnayrsocialaccounts{
	display: flex;
	flex-wrap: wrap;
}
.dcnayrsocialaccount{
	margin: 10px 1%;
	max-width: 80px;
	width: 23%;
	background-color: #eaeaea;
	padding-bottom: 20px;
	border-radius: 5px;
	box-shadow: 1px 1px 3px 0 rgb(0 0 0 / 10%);
	opacity: 35%;
}
.dcnayrsocialaccount.linked{
	opacity: 100%;
}
.dcnayrsocialaccount:has(.dcnayrsocialaccountselect){
	cursor: pointer;
}
 .dcnayrsocialaccountstatus{
	background-color: #FF3F34;
	width: 40px;
	height: 20px;
	border-radius: 20px;
	margin-top: -10px;
	color: #FFFFFF;
	font-size: 12px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}
.dcnayrsocialaccount.linked .dcnayrsocialaccountstatus{
	background-color: #04C56B;
}
.dcnayrsocialaccountselect{
	width: 20px;
	height: 20px;
	border-radius: 5px;
	border: solid 2px black;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
}
.dcnayrsocialaccounticon{
	width: 60%;
	aspect-ratio: 1 / 1;
	display: flex;
	color: #FFFFFF;
	justify-content: center;
	align-items: center;
	margin: 10px auto;
	border-radius: 100px;
	margin-bottom: 0;
}
.dcnayrsocialaccountpicture{
	width: 30%;
	aspect-ratio: 1 / 1;
	border-radius: 100%;
	border: solid 2px #eaeaea;
	margin-top: -30%;
	margin-left: 10px;
	background-color: #FFFFFF;
}
.ayrsharepostpicture{
	max-width: 150px;
    margin: 5px;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    width: 100%;
}
.ayrsharepostpictureerror{
	border: solid 4px #e44a4a;
}
.ayrsharepostpicturegradient{
	background: linear-gradient(0deg, rgba(0,0,0,0.4) 0%, rgba(255,255,255,0) 100%);
	position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
}
.ayrsharepostpictures{
	display: flex;
	flex-wrap: wrap;
}
.ayrsharepostpicture img, .ayrsharepostpicture video{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	min-width: 100%;
	border-radius: 5px;
}
.ayrsharepostpreviewbox{
	padding: 15px;
	background-color: #eaeaea;
	width: 100%;
	max-width: 320px;
	 border-radius: 10px;
	 margin-bottom: 10px;
}

.ayrsharepostpreviewmedias{
	display: none;
}
.ayrsharepostpreviewmedias:has(img){
	display: flex;
	width: 100%;
	aspect-ratio: 1 / 1;
	margin-bottom: 10px;
	flex-wrap: wrap;
	overflow: hidden;
}
.ayrsharepostpreviewmedias:has(video){
	display: flex;
	width: 100%;
	aspect-ratio: 1 / 1;
	margin-bottom: 10px;
	flex-wrap: wrap;
	overflow: hidden;
}
.ayrsharepostpreviewmedias img, .ayrsharepostpreviewmedias video{
	width: 100%;
	object-fit: cover;
	border: solid 2px #eaeaea;
	aspect-ratio : 1 / 1;
}
.ayrsharepostpreviewmedias:has(img + img) img{
	width: 50%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img) img{
	width: 50%;
	height: 40%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img) img:nth-child(1){
	width: 100%;
	height: 60%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img + img) img{
	width: 50%;
	height: 50%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img + img) img:nth-child(1){
	width: 50%;
	height: 50%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img + img + img) img{
	width: 33.33%;
	height: 40%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img + img + img) img:nth-child(1){
	width: 50%;
	height: 60%;
	object-fit: cover;
}
.ayrsharepostpreviewmedias:has(img + img + img + img + img) img:nth-child(2){
	width: 50%;
	height: 60%;
	object-fit: cover;
}
.ayrsharepostpicturebuttons{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
    bottom: 0;
}
.ayrsharepostpicturebuttons button{
	margin: 5px;
	background-color: transparent;
	border: 0;
	--fa-primary-color: #FFFFFF;
    --fa-secondary-color: #FFFFFF;
    text-shadow: 0px 0px 4px black;
}
.ayrsharepostpreviewmessage{
	font-size: 15px;
	padding: 2px;
}
.ayrsharepostpreviewbuttons{
	margin-top: 8px;
	padding: 2px;
}
.ayrsharepostpreviewbuttons i{
	margin-right: 15px;
}
.dcnayrsocialaccount label{
	width: 100%;
}
.ayrsharepostpreviewplatforms{
	width: 100%;
	padding: 2px;
	display: flex;
	justify-content: left;
	align-items: center;
	margin-bottom: 10px;
}
.ayrsharepostpreviewplatforms img{
	width: 34px;
	height: 34px;
	border-radius: 34px;
}
.ayrshareplatformiconpreview{
	width: 24px;
	height: 24px;
	border-radius: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	color: #FFFFFF;
	margin-right: 3px;
}
.ayrsharepostpreviewplatformseparator{
	width: 6px;
	height: 6px;
	border-radius: 8px;
	background-color: #353E4A;
	margin: 0 8px;
}
.ayrshareposterror{
	max-width: 320px;
	color: #e44a4a;
}
.ayrsharepostwarning{
	color: #f58349;
}
.ayrshareposterror, .ayrsharepostwarning {
	display: flex;
	font-size: 14px;
	margin-bottom: 5px;
}
.ayrshareposterror i, .ayrsharepostwarning i{
	margin-right: 8px;
}
#ayrsharepostbutton{
	width: 100%;
	height: 60px;
}
.dcnayrsocialaccount a{
	color: inherit;
}
/*####*/
/*#### FAQ ####*/
/*####*/
.faqquestionboxselected{
	color: #F37E2F;
}
.faqarrowselected{
	color: #F37E2F;	
}
.faqquestionanswercontainer{
	width: 100%;
	display: flex;
	align-items: stretch;
	margin-bottom: 6px;
	color: #353E4A;
}
.faqquestionanswerbox{
	width: 100%;
	background-color: white;
	border-radius: 15px;
	overflow: hidden;
	box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.1);
	box-sizing: border-box;
	cursor: pointer;
}
.faqmanagementbox{
	width: 120px;
	margin-left: 5px;
	display: flex;
	align-items: center;
}
.faqquestionbox{
	width: 100%;
	min-height: 50px;
	display: flex;
	align-items: stretch;
	font-size: 20px;
}
.faqanswerbox{
	width: 100%;
	box-sizing: border-box;
	padding: 0px 93px 0px 20px;
	overflow: hidden;
	max-height: 0px;
	font-size: 18px;
}
.faqquestion{
	width: 100%;
	box-sizing: border-box;
	padding: 20px;
}
.faqquestion p{
	all:unset;
	font-size: inherit;
	font-family: inherit;
	color: inherit;
	line-height: inherit;
	font-weight: 400;
	margin: 0;
}
.faqarrow{
	width: 80px;
	align-items: center;
	display: flex;
	justify-content: center;
	font-size: 26px;
	color: #01C16C;
}
.dcnsubscriptioninfotitle{
	box-sizing: border-box;
	width: 100%;
	padding: 5px 0px;
	font-weight: 500;
}
.dcnsubscriptioninfotitle .dcntextarea, .dcnsubscriptioninfodetail .dcntextarea {
    display: inline-block;
}
.dcnsubscriptioninfotitle p, .dcnsubscriptioninfodetail p{
	all:unset;
	font-weight: inherit;
	font-size: inherit;
	color: inherit;
	text-align: inherit;
}
.dcnsubscriptioninfodetail{
	box-sizing: border-box;
	width: 100%;
	padding: 5px 0px;
}
#subscriptionzone{
	display: flex;
	justify-content: center;
}
.dcnsubscriptionbox{
	width: 100%;
	box-sizing: border-box;
	border-radius:10px;
	box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.1);
	padding: 20px;
	background-color: #FFFFFF;
	max-width: 450px;
	margin: 20px;
	color: #333333;
}
.dcnsubscriptionprice p, .dcnsubscriptionprice .dcntextarea{
	display: inline-block;
  text-transform: lowercase;
  margin: 0;
}
.dcnsubscriptionbox sub p {
    display: inline-block;
    text-transform: lowercase;
    margin: 0;
}
.dcnsubscriptionplan {
    width: 100%;
    text-align: center;
    font-size: 26px;
    font-weight: 500;
    padding: 10px 0;
}
.dcnsubscriptionplan p {
		all:unset;
		text-align: inherit;
		font-size: inherit;
		font-weight: inherit;
    margin: 0;
}
.dcnsubscriptionprice{
	text-align: center;
	padding: 30px 0;
}
.dcnsubscriptionbox table{
	width: 100%;
	font-size: 16px;
}
.dcnsubscriptionbox th{
	width: 50%;
	text-align: right;
	padding: 3px 10px;
	font-weight: 300;
}

.dcnsubscriptionbox td{
	width: 50%;
	text-align: left;
	padding: 3px 10px;
}
.dcnsubscriptionbox table p{
	margin: 0;
	line-height: 20px;
}

.dcnfilebox{
  box-shadow: 0px 0px 8px 0 rgb(0 0 0 / 10%);
  width:100%;
  background-color:#FFFFFF;
  border-radius:5px;
  overflow:hidden;
  display:flex;
  margin: 10px 0px;
}
.dcnfilesection1{
  width:80px;
}
.dcnfilesection2{
  width:100%;
}
.dcnfileicon{
  width:80px;
  height:80px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 50px;
}
.dcnfilenameare{
  width:100%;
  height:40px;
  padding:0px 10px;
  line-height:55px;
  font-weight:500;
  color: #444444;
  overflow: hidden;
}
.dcnfilename .dcntextarea {
    display: inline-block;
}
.dcnfiledetailarea{
  width:100%;
  height:40px;
  padding:0px 10px;
  line-height:25px;
  color: #666666;
  font-size:14px;
}
.dcnfileactions{
  height:80px;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0px 10px;
}
.dcnfiledownload{
  width:40px;
  height:40px;
  background-color:rgba(0,0,0,0.05);
  border-radius:100%;
  margin:4px;
  cursor:pointer;
  color: #333333;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
  --fa-primary-color: #333333;
  --fa-secondary-color: #333333;
}
.dcnfiledownload:hover{
	background-color:rgba(0,0,0,0.1);
}
.dcncalendarbox{
	display: flex;
	justify-content: center;
}
.dcncalendar{
	width: 100%;
	color: #333333;
	background-color: #FFFFFF;
	padding: 10px;
	border-radius: 20px;
	font-size: 16px;
}
.dcncalendarheader{ 
	display: flex;
	height: 50px;
	width: 100%;
	justify-content: center;
}
.dcncalendarprev{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	min-width: 50px;
}
.dcncalendarnext{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	min-width: 50px;
}
.dcncalendarname{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 50px;
	font-size: 19px;
}
.dcncalendarcontent{ 
	display: flex;
	width: 100%;
}
.dcncalendarcontent table{
	width: 100%;
}
.dcncalendarcontent table tr{
	height: 34px;
	max-height: 34px;
	border-bottom: solid 2px transparent;
	border-top: solid 2px transparent;
}
.dcncalendarcontent table tr th{
	width: 40px;
	height: 34px;
	max-height: 34px;
	text-align: center;
	font-weight: 500;
	color: #111111;
}
.dcncalendarcontent table tr td{
	width: 40px;
	height: 32px;
	max-height: 32px;
	background-color: white;
	text-align: center;
	padding: 0;
}
.dcncalendaroutsidemonth{
	color: #cccccc;
}
.dcncalendartoday{
	display: flex;
	height: 34px;
	justify-content: center;
	align-items: center;
	width: 100%;
	border-radius: 16px;
}
.dcncalendarevent{
	display: flex;
	height: 34px;
	justify-content: center;
	align-items: center;
	/*border-radius: 16px;*/
	color: #FFFFFF;
	background-color: grey;
}
.dcncalendar1devent{
	display: flex;
	height: 34px;
	justify-content: center;
	align-items: center;
	border-radius: 16px;
	color: #FFFFFF;
	background-color: grey;
	margin: 0px 1px;
}
.dcncalendareventstart{
	display: flex;
	height: 34px;
	justify-content: center;
	align-items: center;
	border-radius: 16px 0px 0px 16px;
	color: #FFFFFF;
	background-color: grey;
	margin-left: 1px;
}
.dcncalendareventend{
	display: flex;
	height: 34px;
	justify-content: center;
	align-items: center;
	border-radius: 0px 16px 16px 0px;
	color: #FFFFFF;
	background-color: grey;
	margin-right: 1px;
}

#gallerypasswordbox{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
#gallerypasswordbox input{
	max-width: 400px;
	box-sizing: border-box;
	border:0;
	background-color: #f6f6f6;
	padding: 0;
	font-size: 18px;
	border-radius: 2px;
	background-position: center right 10px;
	background-repeat: no-repeat;
	background-size: 16px;
	float: left;
	margin-right: 10px;
	background-color: #f6f6f6;
    padding: 7px 15px;
    border-radius: 10px;
    border: solid 2px #f6f6f6;
    display: flex;
}
.filethumbnailbox {
    height: 60px;
    width: inherit;
    display: flex;
    overflow: hidden;
    margin-bottom: 5px;
    flex-wrap: nowrap;
    max-width: 100%;
    align-items: center;
}
.filethumbnailpicture {
    aspect-ratio: 1;
    background-color: rgba(0,0,0,0.1);
    border-radius: 5px;
    height: inherit;
    font-size: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.filethumbnailpicture img {
    height: inherit;
    width: inherit;
    object-fit: cover;
    aspect-ratio: 1;
    border-radius: inherit; 
}
.filethumbnailname {
    font-size: 16px;
    padding-left: 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: break-spaces;
}
.filethumbnailextension{
	font-size: 16px;
	padding-right: 10px;
}

/*########*/
/*#### Filter ####*/
/*########*/
.dcntablefilterbox{
	display:flex;
	justify-content:left;
	align-items:flex-start;
	flex-wrap:wrap;
	gap: 10px;
	margin-bottom:10px;
}
.dcntablefilterbuttonbox{
	font-size:14px;
}
.dcntablefilterbutton{
	background-color:white;
	padding:10px;
	border-radius:8px;
	cursor:pointer;
}
.dcntablefilterbutton:hover{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 5px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 5px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 5px rgba(0,0,0,0.20);
}
.dcntablefilterbutton:active{
	transition: all 0.2s;
	-webkit-box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
	-moz-box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
	box-shadow: inset 0px 0px 0px 20px rgba(0,0,0,0.20);
}
.dcntablefilterbuttonbox{
	position:relative;
}
.dcntablefilterbuttonpopup{
	position:absolute;
	width: 250px;
	min-height:50px;
	z-index: 1;
	border-radius:8px;
	margin-top:10px;
	padding:16px;
	background-color:#ffffff;
	display:none;
	border:solid 1px #dddddd;
	box-shadow: 0px 0px 10px 0 rgba(0,0,0,0.15);

}
.dcnfiltercolumn{
	padding: 2px 6px;
	cursor:pointer;
	border-radius:4px;
}
.dcnfiltercolumn:hover{
	background-color:#f7f7f8;

}
.dcnfiltercolumnbuttonbox{
	display:flex;
	gap:6px;
	margin-top:10px;
}
.dcnfiltercolumnbutton{
	padding:7px 14px;
	border-radius:8px;
	font-weight: 500px;
	cursor:pointer;
}
.dcnfilterbuttonsecondary{
	background-color:#f7f7f8;
}
.dcnfilterbuttonprimary{
	color:#ffffff;
	background-color:var(--primary-background-color);
	width: 100%;
    text-align: center;
}
.dcntablefilterbuttonpopup label:has(input[type="radio"]:checked) {
	font-weight:500;
	color:var(--primary-background-color);
}
.dcntablefilterbuttonpopup input[type="radio"]:checked {
	accent-color: var(--primary-background-color);
}

.dcntablefilterbuttonpopup label.dcnfiltertype {
    display: flex;
    align-items: center;
}
.dcnfiltertypebox label.dcnfiltertype{
	padding: 2px 0px;
	cursor: pointer;
}
.dcnfiltertypevaluebox{
	display:none;
	padding: 2px 0px;
}
.dcnfiltertypebox:has(input[type="radio"]:checked) .dcnfiltertypevaluebox{
	display:flex;
}
.dcnfiltertypevaluebox input {
    width: 100%;
    padding: 6px 8px;
    border-radius: 8px;
    border: solid 2px var(--primary-background-color);
    margin:0;
    font-size:14px;
}
.dcnfiltertypevaluebox {
    justify-content: center;
    align-items: center;
}
.dcntablefilterbuttonpopup input[type="date"] {
    width: 106px;
    padding: 6px 0px;
}
.dcnfiltertypevaluebox input[type="date"]:only-child {
    /* Your styles here */
    width: 100%;
    padding: 6px 8px;
}
.dcnfilterboxcheckbox{
	width:100%;
	padding: 6px 8px;
    border-radius: 8px;
    border: solid 2px var(--primary-background-color);
}
.dcnfilterboxcheckboxitem{
	width:100%;
	display:flex;
	justify-content:left;
	align-items:center;
	padding:2px 0px;
}
.dcnfilterboxcheckboxitem input{
	width:fit-content;
	width:auto;
	margin-right:10px;
}
.dcnfilterboxcheckboxitem input:checked{
	accent-color: var(--primary-background-color);
}
.mainfilterbutton{
	background-color: var(--primary-background-color);
	color: var(--primary-font-color);
}
span.dcnfilterremovefitlerbutton {
    color: #999999;
    padding: 1px 4px;
    border-radius: 5px;
    font-weight: 400;
    margin-left: 5px;
    font-size: 14px;
}
span.dcnfilterremovefitlerbutton:hover{
	color: red;
	transition: all 0.2s;
	background-color: #eaeaea;
}
.dcnfiltercolumn i {
    color: var(--primary-background-color);
    width: 15px;
}
.dcnfiltertype i {
    width: 16px;
    margin-left: 6px;
}
.dcnfiltercolumn p, .dcntablefilterbutton p{
	all:unset;
}
.dcntablefilterbuttonpopup > div p{
	all:unset;
}
/*########*/
/*#### Responsive design ####*/
/*########*/
@media (max-width: 768px) {
	.dcnproductitembox{
		flex-wrap:wrap;
	}
	.dcnproductitempicturearea{
		width:100%;
	}
	.dcnproductiteminfoarea{
		width:100%;
		padding:0;
	}
	.dcndisplayproductsbox{
		flex-wrap:wrap;		
	}
	.dcnproductsfilterbox{
		width:100%;
		margin-bottom:20px;
	}
	.dcnproductsbox{
		padding:0;
		gap: 20px;
	}
	.dcnproductsbox a{
		width:calc(50% - 10px);

	}
	.dcnproductbox {
        min-width: 100%;
    }
    .dcnproductlabels{
    	font-size:12px;
    }

    .dcncartproduct{
    	flex-wrap:wrap;
    	align-items:flex-start;
    }
    .dcncartproduct img{
    	width:20%;
    }
    .dcncartproduct a{
    	width:80%;
    }
    .dcncartproductinfobox{
    	padding:0;
    	padding-left:20px;
    }
    .dcncartproductcountbox{
    	width:50%;
    	padding: 0;
    	padding-top:10px;
    }
	.dcncartproductpricebox{
		width:50%;
		padding-top:10px;
	}
	.dcncartproductremove{
		width:100%;
	}
	.dcncartckeckoutbox{
		flex-wrap:wrap;
	}
	.dcncartckeckoutbox button{
		margin: 0;
	}
	.dcncartdeliverymethoddetailsmapbox {	    
	    flex-wrap: wrap;
	    width: 100%;
	}
	.dcncartdeliverymethoddetailsmaplocationbox {
	    width: 100%;
	}
	.dcncartdeliverymethoddetailsmap {
	    width: 100%;
	    height: 150px;
	}
	.dcncartdeliverymethoddetailsmapbox button{
		width:100%;
	}
	.dcnorderinfobox{
		width:100%;
	}
	.dcnorderschippingbox{
		margin-top:10px;
		width:100%;
	}





	.dcnsubscriptionbox{
		margin: 20px 0px;
	}
	.dcnprofilecontainer{
		width: 100%;
		min-width: 100%;
	}
	.faqanswerbox{
		padding: 0px 20px 0px 20px;
	}
	.languagelistbutton{
		width: 100%;
		text-align: center;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.loginplaceholder{
		width: 80px;
	}
	.content{
		max-width: 100%;
	}
	.row{
		flex-wrap: wrap;
	}
	.albumpicture{
		min-height: 30px;
		width: 100%;
		margin: 10px 0%;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		display: inline-block;
	}
	.albumselection{
		width:90%;
		padding: 2.5%;
		margin: 2.5%
	}
	#popup{	
		width: 100%;
		max-width: 100%;
		min-width: 320px;
	}
	#popup .row{
		--bs-gutter-x:0;
	}
	.popupcontent{
		box-sizing: border-box;
		padding: 30px;
		overflow: hidden;
	}
	nav{
		display: none;
	}
	#languagecontainer{
		display: none;
	}
	#pagebody{
		margin-left: 0px;
	}
	#logocontainer #img{
		margin-top: 10px;
		height: 60px;
		width:100%;
		background-image: url("../../images/logo_short.png");
		background-size: auto 50px;
		background-repeat: no-repeat;
		background-position: center;
		display: inline-block;
	}
	#logocontainer{
		padding-left: 0px;
		width: 100%;
	}
	#cmsnavigation{
		margin-left: -80px;
		display: none;
	}
	:root {
		--cms-navigation-width:0px;
		--cms-navigation-margin:0px;
		--editorpanel-sm-height: 40vh;
	}
	#editormodepanel{
		width: calc(100% - calc(var(--cms-navigation-margin) * 2));
		height: var(--editorpanel-sm-height);
		top: unset;
		bottom:0;
	}
	#editormodepanelbutton.editormodepanelopen{
		width: calc(100% - calc(var(--editor-mode-button-margin) * 2));
	}
	#page.dcneditormode .dcncontaineroffset{
		margin-right:0;
	}
	#editormodepanel.editormodepanelopen{
		right: 0;
		transition: all 0.3s;
		bottom: calc(var(--editor-mode-button-height) + calc(var(--editor-mode-button-margin) * 1));
	}
	#editormodepanel.editormodepanelclosed{
		right:0;
		/*right: calc(calc(var(--editor-mode-panel-width) + calc(var(--cms-navigation-margin) * 2)) * -1);*/
		transition: all 0.3s;
		bottom: calc(calc(var(--editorpanel-sm-height) + var(--cms-navigation-margin)) * -1);
	}

	#smartphonenav{
		float: left;
		width: 80px;
		height: 80px;
		/*background-image: url(../../images/cms/menu.png);*/
		background-size: 30px;
		background-repeat: no-repeat;
		background-position: center;
		display: flex;
		cursor: pointer;
		justify-content: center;
		align-items: center;
		flex: 0 0 80px;
	}
	#smartphonenavigation{
		display: block;
		position: fixed;
		width: 0px;
		height: 100%;
		z-index: 2;
		margin-top: 80px;
		overflow: hidden;
		text-transform: uppercase;
		overflow: auto;
		background-color: #F0F3F7;
	}
	#smartphonenavigationcontent{
		padding-top: 10px;
		width: 250px;
		float: right;
		background-color: transparent;
	}
	.navigationbutton{
		font-size: 14px;
		width: 100%;
		box-sizing: border-box;
		padding: 0px 20px;
		height: 50px;
		font-weight: bold;
		text-align: left;
		line-height: 50px;
		border-bottom: solid 1px rgba(0,0,0,0.1);
		background-size: 20px;
		background-repeat: no-repeat;
		background-position: center;
		box-sizing: border-box;
	}
	.smartphonenavigationlanguagelistbox{
		font-weight: initial;
		background-color: transparent;
		width: 100%;
		overflow: hidden;
		padding: 15px;
		text-transform: initial;
		font-size: 14px;
		box-sizing: border-box;
	}
	.smartphonenavigationlanguagelistbox p{
		margin: 0;
		font-weight: 400;
	}
	.navigationbutton:hover{
		border-bottom: 0;
	}
	.languagebutton{
		font-size: 18px;
		width: 100%;
		box-sizing: border-box;
		padding: 0px 10px;
		height: 50px;
		font-weight: bold;
		color: #ffffff;
		text-align: center;
		line-height: 50px;
		border-bottom: solid 1px rgba(255,255,255,0.3);
		background-size: 20px;
		background-repeat: no-repeat;
		margin-left: 0;
	}
	#cmslogo{
		width: 100%;
		margin-top: 50px;
		height: 60px;
		background-image: url(../../images/cms/black_logo.png);
		background-size: 30px;
		background-repeat: no-repeat;
		background-position: center;
		float: left;
	}
	.eventcontainer{
		padding: 10px 20px;
	}
	.eventdescription{
		text-align: center;
	}
	.eventtitle{
	    text-align: center;
	}
	.eventmonth{
		margin-top: 10px;
	}
	.dcncustomsection{
		box-sizing: border-box;
		padding: 15px 10px;
	}
	.nopadding .dcncustomsection{
		box-sizing: border-box;
		padding: 0px;
	}
}
.dcnorder{
	order: var(--dcnde)
}
@media (min-width: 0px) {

	.dcnarticlethumbbox, .dcnarticlethumbzone a{
		width: 100%;
		max-width: 100%;
		min-width: 200px;
	}
	.dcnbrandbox{
		width: 100%;
		max-width: 100%;
		min-width: 200px;
	}
	.dcnbrandboxpicture img{
		aspect-ratio: 8 / 5;
	}
	.dcngalleriesbox{
		width: 100%;
		max-width: 100%;
		min-width: 200px;
	}
	.dcngalleriespicture img{
		aspect-ratio: 6 / 4;
	}
	.dcnarticle{
		flex-wrap: wrap;
	}
	.dcnarticlereferencescolumn{
		min-width: 100%;
		padding: 0;
	}
	.dcnfileicon{
		width: 60px;
		font-size: 40px;
	}
	.dcnfilenameare{
		line-height: 60px;
		font-size: 16px;
	}
	.dcnfiledetailarea{
		line-height: 20px;
	}
	.dcnfiledownload{
		width: 30px;
		height: 30px;
		font-size: 16px;
	}
	.dcnfullscreensliderboxsmall{
		height: 50%;
		width: 100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailopen{
		height: 50%;
		width: 100%;
		transition:all 0.2s;
		border-radius: 15px 15px 0 0;
	}
	.dcnfullscreensliderboxlarge{
		height:100%;
		width:100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailclosed{
		height:0%;
		width:100%;
		transition:all 0.2s;
		border-radius: 15px 15px 0 0;
	}

}
@media (min-width: 576px) {
	.dcngalleriespicture img{
		aspect-ratio: 3 / 4;
	}
	.dcnarticlethumbbox, .dcnarticlethumbzone a{
		width: 100%;
		max-width: 350px;
		min-width: 200px;
	}
	.dcngalleriesbox{
		width: 100%;
		max-width: 250px;
		min-width: 200px;
	}
	.dcnbrandbox{
		width: 100%;
		max-width: 250px;
		min-width: 200px;
	}
	.dcnfileicon{
		width: 80px;
		font-size: 40px;
	}
	.dcnfilenameare{
		line-height: 55px;
		font-size: 19px;
	}
	.dcnfiledetailarea{
		line-height: 25px;
	}
	.dcnfiledownload{
		width: 40px;
		height: 40px;
		font-size: 20px;
	}
  .dcnorder{
		order: var(--dcnsm)
	}
	.dcngallerypicture{
	}
	.dcnfullscreensliderboxsmall{
		height: 100%;
		width: 50%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailopen{
		height: 100%;
		width: 50%;
		transition:all 0.2s;
		border-radius: 15px 0 0 15px;
	}
	.dcnfullscreensliderboxlarge{
		height:100%;
		width:100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailclosed{
		height:100%;
		width:0%;
		transition:all 0.2s;
		border-radius: 15px 0 0 15px;
	}

}
@media (min-width: 768px) {
  .dcnorder{
		order: var(--dcnmd)
	}
	.dcngallerypicture{
		width: 48%;
		margin: 2% 0;
	}
	.dcngallerypicture:nth-child(2n){
		margin-left:2%;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(2n+1){
		margin-left:0;
		margin-right: 2%;
	}
	.dcnfullscreensliderboxsmall{
		height: 100%;
		width: 60%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailopen{
		height: 100%;
		width: 40%;
		transition:all 0.2s;
		border-radius: 15px 0 0 15px;
	}
	.dcnfullscreensliderboxlarge{
		height:100%;
		width:100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailclosed{
		height:100%;
		width:0%;
		transition:all 0.2s;
		border-radius: 15px 0 0 15px;
	}

}
@media (min-width: 992px) {
	.dcnarticle{
		flex-wrap: nowrap;
	}
	.dcnarticlereferencescolumn{
		min-width: 35%;
		padding: 20px 0px 0px 20px;
	}
  .dcnorder{
		order: var(--dcnlg)
	}
	.dcngallerypicture{
		width: 32%;
		margin: 1% 0;
	}
	.dcngallerypicture:nth-child(2n){
		margin-left:0;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(2n+1){
		margin-left:0;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(3n+2){
		margin-left:2%;
		margin-right:2%;
	}
	.dcnfullscreensliderboxsmall{
		height: 100%;
		width: 66%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailopen{
		border-radius: 15px 0 0 15px;
		height: 100%;
		width: 34%;
		transition:all 0.2s;
	}
	.dcnfullscreensliderboxlarge{
		height:100%;
		width:100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailclosed{
		border-radius: 15px 0 0 15px;
		height:100%;
		width:0%;
		transition:all 0.2s;
	}

}
@media (min-width: 1200px) {
  .dcnorder{
		order: var(--dcnxl)
	}
	.dcngallerypicture{
		width: 32%;
		margin: 1% 0;
	}
	.dcngallerypicture:nth-child(2n){
		margin-left:0;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(2n+1){
		margin-left:0;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(3n+2){
		margin-left:2%;
		margin-right:2%;
	}
	.dcnfullscreensliderboxsmall{
		height: 100%;
		width: 66%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailopen{
		border-radius: 15px 0 0 15px;
		height: 100%;
		width: 34%;
		transition:all 0.2s;
	}
	.dcnfullscreensliderboxlarge{
		height:100%;
		width:100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailclosed{
		border-radius: 15px 0 0 15px;
		height:100%;
		width:0%;
		transition:all 0.2s;
	}

}
@media (min-width: 1400px) {
  .dcnorder{
		order: var(--dcnxxl)
	}
	.dcngallerypicture{
		width: 32%;
		margin: 1% 0;
	}
	.dcngallerypicture:nth-child(2n){
		margin-left:0;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(2n+1){
		margin-left:0;
		margin-right: 0;
	}
	.dcngallerypicture:nth-child(3n+2){
		margin-left:2%;
		margin-right:2%;
	}
	.dcnfullscreensliderboxsmall{
		height: 100%;
		width: 75%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailopen{
		border-radius: 15px 0 0 15px;
		height: 100%;
		width: 25%;
		transition:all 0.2s;
	}
	.dcnfullscreensliderboxlarge{
		height:100%;
		width:100%;
		transition:all 0.2s;
	}
	.dcnfullscreendetailclosed{
		border-radius: 15px 0 0 15px;
		height:100%;
		width:0%;
		transition:all 0.2s;
	}

}

@keyframes pulse-blue {
	0% {
		box-shadow: inset 0 0 0 3px #2196f3;
	}
	
	70% {
		box-shadow: inset 0 0 0 6px #2196f3;
	}
	
	100% {
		box-shadow: inset 0 0 0 3px #2196f3;
	}
}

@keyframes pulse-purple {
	0% {
		box-shadow: 0 0 0 3px #967bdc;
	}
	
	70% {
		box-shadow: 0 0 0 6px #967bdc;
	}
	
	100% {
		box-shadow: 0 0 0 3px #967bdc;
	}
}

@keyframes pulse-red {
	0% {
		box-shadow: 0 0 0 3px #f36b4f;
	}
	
	70% {
		box-shadow: 0 0 0 6px #f36b4f;
	}
	
	100% {
		box-shadow: 0 0 0 3px #f36b4f;
	}
}
@keyframes pulse-purple-dcnano {
	0% {
		box-shadow: 0 0 0 0px rgba(73, 70, 255, 0.5);
	}
	
	70% {
		box-shadow: 0 0 0 6px rgba(73, 70, 255, 0.5);
	}
	
	100% {
		box-shadow: 0 0 0 0px rgba(73, 70, 255, 0.5);
	}
}
@keyframes pulse-red-dcnano {
	0% {
		box-shadow: 0 0 0 0px rgba(237, 85, 101, 0.5);
	}
	
	70% {
		box-shadow: 0 0 0 6px rgba(237, 85, 101, 0.5);
	}
	
	100% {
		box-shadow: 0 0 0 0px rgba(237, 85, 101, 0.5);
	}
}