.csstransforms {
       bottom: 47%;
    position: absolute;
    display: table;
    width: 40px;
    height: 40px;
    right: 47%;
    z-index: 999;
    opacity:0
}
.InfoExt:hover .csstransforms{
     opacity:1
}
.DATAVIEW:hover .containereditor{
     opacity:1
}
.csstransforms.containereditor{bottom: 52%;}
.rcsstransforms .cn-wrapper{transform: rotate(180deg) skew(0deg)!important;}
.csstransforms * {
	position: relative;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	list-style: none;
        font: unset!important;
}
 
.cn-button {
	position: absolute;
	top: 100%;
	left: 50%;
	z-index: 11;
	margin-top: -2.25em;
	margin-left: -2.25em;
	padding-top: 0em;
	width: 4.5em;
	height: 4.5em;
	border: none;
	border-radius: 50%;
	background: none;
	background-color: #272323;
	color: #52be7f;
	text-align: center;
	font-weight: 700!important;
	font-size: 1.5em!important;
	text-transform: uppercase;
	cursor: pointer;
	-webkit-backface-visibility: hidden;
}


.csstransforms .cn-wrapper {
	position: absolute;
	top: 100%;
	left: 50%;
	z-index: 10;
	margin-top: -13em;
	margin-left: -13.5em;
	width: 27em;
	height: 27em;
	border-radius: 50%;
	background: transparent;
	opacity: 0;
	-webkit-transition: all .3s ease 0.3s;
	-moz-transition: all .3s ease 0.3s;
	transition: all .3s ease 0.3s;
	-webkit-transform: scale(0.1);
	-ms-transform: scale(0.1);
	-moz-transform: scale(0.1);
	transform: scale(0.1);
	pointer-events: none;
	overflow: hidden;
}

/*cover to prevent extra space of anchors from being clickable*/
.csstransforms .cn-wrapper:after{
  content:".";
  display:block;
  font-size:2em;
  width:6.2em;
  height:6.2em;
  position: absolute;
  left: 50%;
  margin-left: -3.1em;
  top:50%;
  margin-top: -3.1em;
  border-radius: 50%;
  z-index:10;
  color: transparent;
}



.csstransforms .cn-wrapper li {
	position: absolute;
	top: 50%!important;
	left: 50%!important;
	overflow: hidden;
	margin-top: -1.3em!important;
	margin-left: -10em!important;
	width: 10em!important;
	height: 10em!important;
	font-size: 1.5em!important;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	transition: all .3s ease;
	-webkit-transform: rotate(76deg) skew(60deg);
	-moz-transform: rotate(76deg) skew(60deg);
	-ms-transform: rotate(76deg) skew(60deg);
	transform: rotate(76deg) skew(60deg);
	-webkit-transform-origin: 100% 100%;
	-moz-transform-origin: 100% 100%;
	transform-origin: 100% 100%;
	pointer-events: none;
}

.csstransforms .cn-wrapper li a {
	position: absolute;
	right: -7.25em!important;
	bottom: -7.25em!important;
	display: block;
	width: 14.5em!important;
	height: 14.5em!important;
	border-radius: 50%;
	background: #ececec;
	background: -webkit-radial-gradient(transparent 35%, #ececec 35%);
	background: -moz-radial-gradient(transparent 35%, #ececec 35%);
	background: radial-gradient(transparent 35%, #ececec 35%);
	color: #020000;
	text-align: center;
	text-decoration: none;
	font-size: 1.2em!important;
	line-height: 2!important;
	-webkit-transform: skew(-60deg) rotate(-75deg) scale(1);
	-moz-transform: skew(-60deg) rotate(-75deg) scale(1);
	-ms-transform: skew(-60deg) rotate(-75deg) scale(1);
	transform: skew(-60deg) rotate(-75deg) scale(1);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	pointer-events: auto;
        border: 3px solid #339951;
}
.csstransforms .cn-wrapper li a img{
    width:40px!important;
    height:auto!important;
}
.csstransforms .cn-wrapper li a span {
	position: relative;
    top: 0.3em!important;
    display: block;
    font-size: .5em!important;
    font-weight: 300!important;
    text-transform: uppercase;
    font-family: sans-serif;
    color: #F44336;
}

.csstransforms .cn-wrapper li a:hover,
.csstransforms .cn-wrapper li a:active,
.csstransforms .cn-wrapper li a:focus {
	background: -webkit-radial-gradient(transparent 35%, #a2a2a2 35%);
	background: -moz-radial-gradient(transparent 35%, #a2a2a2 35%);
	background: radial-gradient(transparent 35%, #a2a2a2 35%);
}
.csstransforms .cn-wrapper li a:focus {
    position: fixed; /* fix the displacement bug in webkit browsers when using tab key */
}

.csstransforms:hover .cn-wrapper {
	border-radius: 50%;
	opacity: 1;
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	transition: all .3s ease;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	pointer-events: auto;
}
.csstransforms:hover .cn-wrapper li {
	-webkit-transition: all .3s ease .3s;
	-moz-transition: all .3s ease .3s;
	transition: all .3s ease .3s;
}

.csstransforms:hover .cn-wrapper li:first-child {
	-webkit-transform: rotate(-20deg) skew(60deg);
	-moz-transform: rotate(-20deg) skew(60deg);
	-ms-transform: rotate(-20deg) skew(60deg);
	transform: rotate(-20deg) skew(60deg);
}

.csstransforms:hover .cn-wrapper li:nth-child(2) {
	-webkit-transform: rotate(12deg) skew(60deg);
	-moz-transform: rotate(12deg) skew(60deg);
	-ms-transform: rotate(12deg) skew(60deg);
	transform: rotate(12deg) skew(60deg);
}

.csstransforms:hover .cn-wrapper  li:nth-child(3) {
	-webkit-transform: rotate(44deg) skew(60deg);
	-moz-transform: rotate(44deg) skew(60deg);
	-ms-transform: rotate(44deg) skew(60deg);
	transform: rotate(44deg) skew(60deg);
}

.csstransforms:hover .cn-wrapper li:nth-child(4) {
	-webkit-transform: rotate(76deg) skew(60deg);
	-moz-transform: rotate(76deg) skew(60deg);
	-ms-transform: rotate(76deg) skew(60deg);
	transform: rotate(76deg) skew(60deg);
}

.csstransforms:hover .cn-wrapper li:nth-child(5) {
	-webkit-transform: rotate(108deg) skew(60deg);
	-moz-transform: rotate(108deg) skew(60deg);
	-ms-transform: rotate(108deg) skew(60deg);
	transform: rotate(108deg) skew(60deg);
}

.csstransforms:hover .cn-wrapper li:nth-child(6) {
	-webkit-transform: rotate(140deg) skew(60deg);
	-moz-transform: rotate(140deg) skew(60deg);
	-ms-transform: rotate(140deg) skew(60deg);
	transform: rotate(140deg) skew(60deg);
}

.csstransforms:hover .cn-wrapper li:nth-child(7) {
	-webkit-transform: rotate(172deg) skew(60deg);
	-moz-transform: rotate(172deg) skew(60deg);
	-ms-transform: rotate(172deg) skew(60deg);
	transform: rotate(172deg) skew(60deg);
}

.no-csstransforms .cn-wrapper {
	overflow: hidden;
	margin: 10em auto;
	padding: .5em;
	text-align: center;
}

.no-csstransforms .cn-wrapper ul {
	display: inline-block;
}

.no-csstransforms .cn-wrapper li {
	float: left;
	width: 5em!important;
	height: 5em!important;
	background-color: #fff;
	text-align: center;
	font-size: 1em!important;
	line-height: 5em!important;
}

.no-csstransforms .cn-wrapper li a {
	display: block;
	width: 100%;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.no-csstransforms .cn-wrapper li a:hover,
.no-csstransforms .cn-wrapper li a:active,
.no-csstransforms .cn-wrapper li a:focus {
	background-color: #f8f8f8;
}

.no-csstransforms .cn-wrapper li.active a{
	background-color: #6F325C;
	color: #fff;
}

.no-csstransforms .cn-button {
	display: none;
}
.csstransforms .cn-wrapper {
		font-size: 10px!important;
	}

	.cn-button {
		font-size: 10px!important;
            border: 4px solid #53ff66!important;
	}
    .csstransforms.containereditor .cn-button{background-color: #6f2f3e; border: 4px solid #ff8153!important;}
@media only screen and (max-width: 620px) {
	.no-csstransforms li {
		width: 4em;
		height: 4em;
		line-height: 4em;
	}
}

@media only screen and (max-width: 500px) {
	.no-ccstransforms .cn-wrapper {
		padding: .5em;
	}

	.no-csstransforms .cn-wrapper li {
		width: 4em;
		height: 4em;
		font-size: .9em;
		line-height: 4em;
	}
}

@media only screen and (max-width: 480px) {
	.csstransforms .cn-wrapper {
		font-size: 10px;
	}

	.cn-button {
		font-size: 10px;
	}
}

@media only screen and (max-width:420px) {
	.no-csstransforms .cn-wrapper li {
		width: 100%;
		height: 3em;
		line-height: 3em;
	}
}

.showbodymain{
    overflow-y: auto!important;
}
    .showbodymain .RContent {
        /*display: table;*/
    }
.hiddenbodymain {
    overflow-y: hidden !important;
}
    .hiddenbodymain .RContent {
        /*display: none;*/
    }

.hiddenmaximg{display:none!important}
.showmaximg{display:block!important}
.maximg {    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    z-index: 1000;
    
    display: flex;
    align-items: center;
    justify-content: center;}
.maximg .pndt{    width: 96%;
    margin: auto;
    display: table;
    /*background: #ffffff;*/
    padding: 1%;
    padding-bottom: 0px;
    border-radius: 20px;
    /*border: 1px solid #757575;*/}
.maximg .ctdt .slider-galery{
    width: 100%;
    display: table;
    background: white;
    min-height: 86px;
}
    .maximg .Slide {
        /*background: #9E9E9E;*/
        border-radius: 16px;
        overflow:hidden
    }
        .maximg .Slide .itemslide .img {
            overflow: hidden;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .maximg .Slide .itemslide .boundimg {
            position: relative;
            display: table;
            z-index: 1;
            border: 1px solid #3f3f3f;
        }
        .maximg .Slide .btnnext, .maximg .Slide .BtnSlide {
            z-index: 1
        }
        .maximg .Slide .itemslide .img .chitiet {
            position: absolute;
            bottom: 10px;
            right: 10px;
            color: white;
            font-size: 18px;
            border-bottom: 1px dashed;
            height: 20px;
            cursor: pointer;
            bottom: 10px;
            right: 10px;
            text-shadow: 1px 1px 1px black;
        }
        .maximg .Slide .itemslide .img img {
            max-width: 100%;
            margin-top: 3px;
            margin: auto;
            display: table;
            width: auto;
            height: auto;
            max-height: 74vh;
        }
.maximg .slidesmall .slidelist .itemslide img{ }
    .maximg .bg {
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.16);
    }
    .maximg .closeimg {
        position: absolute;
        color: #777;
        z-index: 2;
        top: 10px;
        font-size: 15px;
        font-weight: bold;
        padding: 3px;
        border-radius: 50%;
        width: 50px;
        height: 50px;
        right: 10px; /*position: fixed;
    right: 28px;
    color: white;
    z-index: 2;
    top: 22px;
    font-size: 15px;
    font-weight: bold;
    background: #4a281e;
    padding: 7px 10px;
    padding-top: 2px;
    border-radius: 7px;*/
    }
        .maximg .closeimg i {
            display: none;
        }
        .maximg .closeimg:hover:before {
            color: white;
            border: 1px solid white;
        }
        .maximg .closeimg:before {
            content: '\f00d';
            font: normal normal normal 18px/1 FontAwesome;
            color: #777;
            position: relative;
            border: 1px solid #777;
            border-radius: 50%;
            width: 25px;
            height: 25px;
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
            float: right;
            /*content: '\f00d';
    font: normal normal normal 22px/1 FontAwesome;
    color: white;
    margin-right: 5px;
    top: 3px;
    position: relative;*/
        }
.maximg .ritem{    width: 8%!important;}
    .maximg .zoom {
        position: absolute;
        top: 0px;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        right: 80px;
    }
        .maximg .zoom i {
            width: 20px;
            height: 20px;
            display: table;
            margin: 1px;
            text-align: center;
            cursor:pointer
        }
            .maximg .zoom i:before {
                font: normal normal normal 15px/1 FontAwesome;
                color: #e59700;
                background: #ccc;
                border-radius: 5px;
                border: 1px solid #999;
                width: 20px;
                height: 20px;
                display: flex;
                align-items: center;
                justify-content: center;
            }
    .maximg .zoomin:before {
        content: '\f010'
    }
    .maximg .zoomout:before {
        content: '\f00e'
    }
    .maximg .zoomnormal:before {
        content: '\f0b2'
    }
    .maximg .move {
        display: none !important
    }
        .maximg .move.left:before {
            content: '\f104'
        }
        .maximg .move.right:before {
            content: '\f105'
        }
        .maximg .move.top:before {
            content: '\f106'
        }
        .maximg .move.bottom:before {
            content: '\f107'
        }
    .maximg .pndtzoom {
        padding-bottom: 1% !important;
    }
    .maximg .pndtzoom .slidesmall {display:none
    }
    .maximg .pndtzoom .itemslide .img img {
        max-height: 90vh;
    }
        .maximg .pndtzoom .move {
            display: none !important;
        }
    .maximg .Slide .btnnext::before {
        background: #252525;
        border-radius: 3px;
        border: 1px solid #333;
    }
    .maximg .Slide .itemslide {
        vertical-align: middle;
    }
    @media only screen and (max-width: 767px) {
        .maximg .pndtzoom .itemslide .img img {
        transform: scale(1) translate(0px, 0px) !important;
    }

    .maximg .zoomnormal, .maximg .zoomin, .maximg .zoomout {
        display: none !important
    }

    .maximg {
        padding-bottom: 1% !important;
    }

        .maximg .slidesmall {
            display: none
        }

        .maximg .itemslide .img img {
            max-height: 90vh !important;
        }

        .maximg .move {
            display: none !important;
        }
        .maximg .closeimg {
            right:10px
        }
        }
.Slide .itemslide .img img{z-index:2;cursor:pointer;}