@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700&display=swap');





/**

 * Tooltip Styles

 */



/* Bubliny s textovou nápovědou */

[data-tooltip] {position: relative;z-index: 2;cursor: pointer;padding:1px 6px;font-size: 11px;background-color: rgb(200,200,200);border-radius: 100%;border:none;display: inline-block;font-weight: 800;color: white;margin: 11px 0px 0px 10px;}

[data-tooltip]:before, [data-tooltip]:after {visibility: hidden;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);opacity: 0;pointer-events: none;}

#addable [data-tooltip]:before{position: absolute;bottom: 110%;left:50%;width: 150px;}

#addable [data-tooltip]:after {bottom: 110%;left: 50%;} [data-tooltip]:before {position: absolute;bottom: 150%;left: 50%;margin-bottom: 5px;margin-left: -80px;padding: 7px;width: 300px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;background-color: #000;background-color: hsla(0, 0%, 20%, 0.9);color: #fff;content: attr(data-tooltip);text-align: center;font-size: 13px;font-weight: normal;line-height: 1.2;}

[data-tooltip]:after {position: absolute;bottom: 150%;left: 50%;margin-left: -5px;width: 0;border-top: 5px solid #000;border-top: 5px solid hsla(0, 0%, 20%, 0.9);border-right: 5px solid transparent;border-left: 5px solid transparent;content: " ";font-size: 0;line-height: 0;}

[data-tooltip]:hover:before, [data-tooltip]:hover:after {visibility: visible;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);opacity: 1;}









/* Switch */

.switch {position: relative;display: inline-block;width: 40px;height: 23px;}

.switch input {opacity: 0;width: 0;height: 0;}

.slider {position: absolute;cursor: pointer;top: 0; left: 0; right: 0; bottom: 0;background-color: #ccc;-webkit-transition: .4s;transition: .4s;}

.slider:before {position: absolute;content: "";height: 72%;width: 45%;left: 4px;bottom: 3px;background-color: white;-webkit-transition: .4s;transition: .4s;}

input:checked + .slider {background-color: #2196F3;}

input:focus + .slider {box-shadow: 0 0 1px #2196F3;}

input:checked + .slider:before {-webkit-transform: translateX(26px);-ms-transform: translateX(26px);transform: translateX(80%);}

.slider.round {border-radius: 34px;}

.slider.round:before {border-radius: 50%;}

/* Switch */





.wysiwyg-buttons {width: 100%;height: auto;display: table;margin-top: 10px;}

.wysiwyg-buttons div {margin-right: 10px;float: left;}

.wysiwyg-buttons select {width: 60px;height: 30px;display: block;float: left;background-size: 40%;background-position: center center;background-repeat: no-repeat;border:none;border-radius: 2px;padding: 0px;margin: 1px;background-color: rgb(240,240,240);border:1px solid rgb(180,180,180);font-size: 10px;cursor: pointer;}

.wysiwyg-buttons button {width: 30px;height: 30px;display: block;float: left;background-size: 40%;background-position: center center;background-repeat: no-repeat;border:1px solid rgb(180,180,180);border-radius: 2px;margin: 1px;cursor: pointer;background-color: rgb(240,240,240);}

.wysiwyg-buttons button:hover {background-color: white;}



/* Tooltip */

.test + .tooltip > .tooltip-inner {background-color: #73AD21; color: #FFFFFF; border: 1px solid green; padding: 15px;font-size: 20px;}

.test + .tooltip.top > .tooltip-arrow {border-top: 5px solid green;}

.test + .tooltip.bottom > .tooltip-arrow {border-bottom: 5px solid blue;}

.test + .tooltip.left > .tooltip-arrow {border-left: 5px solid red;}

.test + .tooltip.right > .tooltip-arrow {border-right: 5px solid black;}



.wysiwyg-buttons .bold {background-image: url('../data/images/system-icons/wysiwyg/bold.png');}

.wysiwyg-buttons .italic {background-image: url('../data/images/system-icons/wysiwyg/italic.png');}

.wysiwyg-buttons .strike {background-image: url('../data/images/system-icons/wysiwyg/strike.png');}

.wysiwyg-buttons .underline {background-image: url('../data/images/system-icons/wysiwyg/underline.png');}

.wysiwyg-buttons .text-left {background-image: url('../data/images/system-icons/wysiwyg/text-left.png');}

.wysiwyg-buttons .text-right {background-image: url('../data/images/system-icons/wysiwyg/text-right.png');}

.wysiwyg-buttons .text-center {background-image: url('../data/images/system-icons/wysiwyg/text-center.png');}

.wysiwyg-buttons .text-justify {background-image: url('../data/images/system-icons/wysiwyg/text-justify.png');}

.wysiwyg-buttons .ordered-list {background-image: url('../data/images/system-icons/wysiwyg/ordered-list.png');}

.wysiwyg-buttons .unordered-list {background-image: url('../data/images/system-icons/wysiwyg/unordered-list.png');}

.wysiwyg-buttons .clean {background-image: url('../data/images/system-icons/wysiwyg/clean.png');}



.wysiwyg-editor, .wysiwyg-editor-simple {width: calc(100% - 30px);height: 300px;background-color: white;display: block;padding: 15px;color: black !important;font-family: 'Nunito', sans-serif;border: 1px solid #D8D8D8;border-radius: 5px;margin: 4px 0px;outline: none;overflow: auto;}

.wysiwyg-editor p, .wysiwyg-editor-simple p, .wysiwyg-editor b, .wysiwyg-editor-simple b, .wysiwyg-editor span, .wysiwyg-editor-simple span{color: black !important;}



.load-wrap{display: none;width: 100%;height: 100vh;position: fixed;z-index: 9999999;}

.load-wrap.black {background-color: rgba(0,0,0,0.4);}

.load-wrap.white{background-color: white;}

.load-wrap.active{display: flex;align-items: center;}

.loader {border: 8px solid rgba(0,0,0,0.3);border-top: 8px solid rgb(255,255,255);border-radius: 50%;width: 50px;height: 50px;margin: 0px auto;

	animation: spin 0.6s linear infinite;}



@keyframes spin {

  0% { transform: rotate(0deg); }

  100% { transform: rotate(360deg); }

}





.msg{

	position: fixed;

	bottom: 10px;

	right: 10px;

	font-size: 10px;

	padding: 20px;

	z-index: 9999;

	border-radius: 3px;

	box-shadow: 0px 0px 10px rgba(0,0,0,0.01); 

}

.msg p{font-weight: bold; margin: 0px;}

.msg.correct{background-color: #76d54f !important;}

.msg.error{background-color: #ff7171 !important;}

.msg.warning{background-color: #ffe071 !important;}



/*-------------OBECNÉ-------------*/



body {background-color: rgb(245,245,245); font-family: 'Nunito', sans-serif; color: #4A4A4A; margin: 0px; padding: 0px; overflow-x: hidden;}



.wrapper

{

	background-color: rgb(253,253,253);

	border-radius: 3px;

	padding: 20px 30px;

	margin: 15px;

	box-shadow: 0px 0px 10px rgba(0,0,0,0.03);

	border: 1px solid rgb(230,230,230);

}



.wrapper .header {padding-bottom: 10px; }

.wrapper .footer {border-top: 1px solid #F8F9FA; padding-top: 10px;}



.container h1 {font-size: 25px; font-weight: 400; margin: 5px 5px 5px 15px; color: #bababa;}

.container h2 {font-size: 24px; font-weight: 400; margin: 5px 5px 5px 15px; color: #bababa;}

.container h3 {font-size: 18px; font-weight: 600; margin: 5px 5px 5px 15px; color: #bababa;}

.container h4 {font-size: 14px; font-weight: 700; margin: 5px 5px 5px 15px; color: #bababa;}

.container a {text-decoration: none; margin: 0px 15px 0px 0px;}



.wrapper.dashboard-card {padding: 15px 30px;}

.wrapper.dashboard-card h3 {font-size: 40px; padding: 0px; font-weight: 800; margin: 20px 0px 10px 0px; color: black; opacity: 0.7; text-transform: uppercase;}

.wrapper.dashboard-card strong {display: table; width: 100%; font-size: 13px;}

.wrapper.dashboard-card span {display: table; width: 100%; font-size: 13px; opacity: 0.6;}

.wrapper.dashboard-card img {width: 20px; opacity: 0.5; margin: 7px 15px 0px 0px; height: auto; border-radius: 200px; border: 4px solid #aaaaaa; padding: 5px;}



.wrapper .header h1 {font-size: 28px; font-weight: 400; margin: 0px 0px 5px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .header h2 {font-size: 18px; font-weight: 500; margin: 0px 0px 5px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .header h3 {font-size: 14px; font-weight: 700; margin: 0px 0px 5px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .header h4 {font-size: 13px; font-weight: 800; margin: 0px 0px 5px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .footer h1 {font-size: 28px; font-weight: 400; margin: 0px 0px 0px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .footer h2 {font-size: 18px; font-weight: 500; margin: 0px 0px 0px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .footer h3 {font-size: 14px; font-weight: 700; margin: 0px 0px 0px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper .footer h4 {font-size: 13px; font-weight: 800; margin: 0px 0px 0px 0px; color: #a1a1a1; text-transform: uppercase;}

.wrapper p {font-size: 13px; font-weight: 400; color:#969696;}

.wrapper ul {padding: 0px 0px 0px 15px; list-style: disc;}

.wrapper ul li {font-size: 13px; font-weight: 400; color:#969696;}

a {text-decoration: none; margin: 0px;}







.w10 {width: 10%;}

.w15 {width: 15%;}

.w20 {width: 20%;}

.w30 {width: 30%;}

.w33 {width: 33.33%;}

.w40 {width: 40%;}

.w50 {width: 50%;}

.w60 {width: 60%;}

.w67 {width: 67%;}

.w70 {width: 70%;}

.w80 {width: 80%;}

.w90 {width: 90%;}

.w100 {width: 100%;}



.w20px {width: 20px;}

.w50px {width: 50px;}

.w100px {width: 100px;}

.w150px {width: 150px;}

.w200px {width: 200px;}

.w250px {width: 250px;}

.w300px {width: 300px;}

.w400px {width: 400px;}

.w500px {width: 500px;}

.w600px {width: 600px;}

.w700px {width: 700px;}

.w800px {width: 800px;}



.wrapper.w10 {width: calc(10% - 92px);}

.wrapper.w20 {width: calc(20% - 92px);}

.wrapper.w25 {width: calc(25% - 92px);}

.wrapper.w30 {width: calc(30% - 92px);}

.wrapper.w33 {width: calc(33.33% - 92px);}

.wrapper.w40 {width: calc(40% - 92px);}

.wrapper.w50 {width: calc(50% - 92px);}

.wrapper.w60 {width: calc(60% - 92px);}

.wrapper.w67 {width: calc(66.66% - 92px);}

.wrapper.w70 {width: calc(70% - 92px);}

.wrapper.w80 {width: calc(80% - 92px);}

.wrapper.w90 {width: calc(90% - 92px);}

.w100.wrapper {width: calc(100% - 92px);}



.wrapper .w10 {margin: 0px 15px; width: calc(10% - 30px);}

.wrapper .w20 {margin: 0px 15px; width: calc(20% - 30px);}

.wrapper .w30 {margin: 0px 15px; width: calc(30% - 30px);}

.wrapper .w33 {margin: 0px 15px; width: calc(33.33% - 30px);}

.wrapper .w40 {margin: 0px 15px; width: calc(40% - 30px);}

.wrapper .w50 {margin: 0px 15px; width: calc(50% - 30px);}

.wrapper .w60 {margin: 0px 15px; width: calc(60% - 30px);}

.wrapper .w67 {margin: 0px 15px; width: calc(66.66% - 30px);}

.wrapper .w70 {margin: 0px 15px; width: calc(70% - 30px);}

.wrapper .w80 {margin: 0px 15px; width: calc(80% - 30px);}

.wrapper .w90 {margin: 0px 15px; width: calc(90% - 30px);}

.wrapper .w100 {margin: 0px 15px; width: calc(100% - 30px);}



.w10c {width:10%;}

.w20c {width:20%;}

.w30c {width:30%;}

.w33c {width:33.33%;}

.w40c {width:40%;}

.w50c {width:50% !important;}

.w60c {width:60%;}

.w67c {width:66.66%;}

.w70c {width:70%;}

.w80c {width:80% !important;}

.w90c {width:90%;}

.w100c {width:100%;}



.h100vh {height: 100vh;}

.h90vh {height: 90vh;}



.h10px {min-height: 10px;}

.h100px {min-height: 100px;}

.h200px {min-height: 200px;}

.h300px {min-height: 300px;}

.h400px {min-height: 400px;}

.h500px {min-height: 500px;}

.h600px {min-height: 600px;}

.h700px {min-height: 700px;}

.h800px {min-height: 800px;}



.h100 {min-height: 100%;}



.opacity1 {opacity: 0.1;}

.opacity2 {opacity: 0.2;}

.opacity3 {opacity: 0.3;}

.opacity4 {opacity: 0.4;}

.opacity5 {opacity: 0.5;}

.opacity6 {opacity: 0.6;}

.opacity7 {opacity: 0.7;}

.opacity8 {opacity: 0.8;}

.opacity9 {opacity: 0.9;}



.font11 {font-size: 11px !important;}

.font12 {font-size: 12px !important;}

.font13 {font-size: 13px !important;}

.font14 {font-size: 14px !important;}

.font15 {font-size: 15px !important;}

.font16 {font-size: 16px !important;}



.cursice{font-style: oblique;}

.bold{font-weight: bold;}

.normal{font-weight: normal;}

.overline{text-decoration: overline;}

.straight{-webkit-text-decoration-line: line-through;text-decoration-line: line-through; }



.uppercase {text-transform: uppercase;}



.textCenter {text-align: center;}

.textLeft {text-align: left;}

.textRight {text-align: right;}



.marginAuto {margin-left: auto !important; margin-right: auto !important;}

.wrapper.login {width: 300px;}



.table {display: table;}

.flex {display: flex;}

.hidden {display: none;}

.itemsCenter {align-items: center;}



.floatLeft {float: left;}

.floatRight {float: right;}



.margin0 {margin: 1px !important;}

.padding0 {padding: 1px !important;}



.marginTop5 {margin-top: 5px !important;}

.marginTop10 {margin-top: 10px !important;}



.update-alert {height: 30px; min-height: 30px; padding: 10px; width: calc(100% - 50px) !important;}

.update-alert img{margin-right: 0px; width: 27px;}



.input-card

{

	width: calc(100% - 30px);

	padding: 7px 15px 9px 15px;

	box-shadow: 0px 0px 7px rgba(0,0,0,0.1);

	border-radius: 5px;

	margin: 10px 0px;

}



.input-card select

{

	width: 100px;

	height: 30px;

	font-size: 13px;

	padding: 0px 5px 0px 5px;

}



input, textarea, select

{

	width: calc(100% - 0px);

	padding: 7px 12px;

	font-family: 'Nunito', sans-serif; color: #4A4A4A;

	border: 1px solid rgb(200,200,200);

	border-radius: 2px;

	margin: 4px 0px;

	outline: none;

}



input[type="checkbox"]

{

	width: 20px;

	float: left;

}



textarea

{

	resize:vertical;

	min-height: 70px;

}



input[type="radio"]

{

	background-color: blue;

	width: 20px;

	display: table;

}





select {width: calc(100% + 2px);}



label

{

	font-family: 'Nunito', sans-serif; 

	color: #757575;

	font-size: 14px;

	font-weight: 600;

	margin: 10px 0px 2px 0px;

	display: inline-table;

	float: left;

}



.button

{

	width: auto;

	padding: 7px 30px;

	font-family: 'Nunito', sans-serif; color: #4A4A4A;

	border-radius: 3px;

	display: table;

	margin: 10px 0px;

	font-weight: 800;

	font-size: 12px;

	letter-spacing: 0.6px;

	transition: all 0.1s;

	cursor: pointer;

	text-align: center;

	border:none;

}



.button:hover

{

	filter: brightness(94%);

}



.button.default	{border: 1px solid rgb(200,200,200); background: linear-gradient(180deg, rgb(250,250,250), rgb(243,243,243)); color: black; padding: 7px 30px 8px 30px;}

.button.default.editor {border: 1px solid rgb(200,200,200); background: rgb(100,100,100); color: white; border:rgb(90,90,90);}

.button.primary	{border: 1px solid #4e92c1; background: linear-gradient(180deg, #54aef0, #45a0e3); color: white;}

.button.success	{border: 1px solid #4aae26; background: linear-gradient(180deg, #5cc628, #55b228); color: white;}

.button.warning {border: 1px solid #c10d0d; background: linear-gradient(180deg, #ee2828, #be1010); color: white;}

.disabled {opacity: 0.4; filter: grayscale(0%);}

.clickable {cursor: pointer; color: #2f84c1; font-weight: bold; padding-bottom: 3px; opacity: 0.6;}

.clickable:hover, .clickable.active {border-bottom: 2px solid #2f84c1; opacity: 1;}

/*.button:hover, .upload-btn-wrapper:hover {transform: scale(1.05);}

.dark{background: linear-gradient(217deg, #7bbbe1, #71b6df); color: white;}

.button.default{background: linear-gradient(180deg, rgb(240,240,240), rgb(235,235,235)); border:1px solid rgb(200,200,200); color: black;}

.gray{background: transparent; color: #B6B6B7;  box-shadow:inset 0px 0px 0px 1px #B6B6B7; letter-spacing: 0;}

.dark-gray{background-color: rgb(100,100,100); color: white;}

.filter{padding: 4px 0px; font-weight: 800; color: gray; border-radius: 0px; opacity: 0.7;}

.filter.active{border-bottom: 1.5px solid #4798d2; opacity: 1; color: #4798d2;}

.green{background: linear-gradient(217deg, #46ca55, #4fac44); color: white;}

.simplebutton:hover {text-decoration: underline; cursor: pointer;}

*/

input.disabled {background-color: rgb(230,230,230);}

.colorBlack {color: black !important;}

.colorRed {color: red !important;}

.colorGray {color: gray !important;}

.colorGreen {color: green !important;}

.colorOrange {color: orange !important;}



input.inputIcon

{

	width: calc(100% - 57px);

	padding-right: 45px;

	background-size: auto 35%;

	background-repeat: no-repeat;

	background-position: right 15px center;

}



::placeholder {opacity: 0.4; position: relative; z-index: 1;}

::-webkit-file-upload-button { cursor:pointer; }

input.inputIcon.user {background-image: url(images/system-icons/user.png);}

input.inputIcon.lock {background-image: url(images/system-icons/lock.png);}

input.inputIcon.percentage {background-image: url(images/system-icons/percentage.png);}

input.inputIcon.pixels {background-image: url(images/system-icons/pixels.png);}



.upload-btn-wrapper {

  position: relative;

  overflow: hidden;

  display: inline-block;

  float: right;

  margin-right: 15px;

  cursor: pointer;

}



.upload-btn-wrapper input[type=file] {

  font-size: 10px;

  position: absolute;

  left: 0;

  top: 5px;

  opacity: 0;

  cursor: pointer;

}

/*-------------OBECNÉ-------------*/







/*-------------PŘIHLÁŠENÍ-------------*/

.login img {width: 140px; margin-bottom: 15px;}

.login{padding: 40px 20px 30px 20px;}

/*-------------PŘIHLÁŠENÍ-------------*/





/*-------------HLAVIČKA-------------*/

header {margin-top:41px; width: 220px; background-color: #191f28; position: fixed; left: 0; z-index: 9; }

header .logo {width: 120px;margin: 30px 0px 10px 0px;}

header span {width: 100%;font-size: 12px;color: white;display: table;}

header ul {list-style: none; padding: 10px 0px; margin-top: 0px; height: calc(100% - 20px);}

header ul li {position: relative; display: inline-table; width: 100%;}

header ul li a {padding: 11px 16px; display: table; width: calc(100% - 31px); opacity: 0.4; color: white; font-weight: 600; transition: 0.1s all; font-size: 14px;}

header ul li .active, header ul li a:hover {opacity: 1; background: linear-gradient(to right, #47a7a85e, rgba(255,0,0,0) 50%);}

header ul li a:hover img {opacity: 1;}

header ul li a img {width: 17px; margin: 3px 10px -2px 0px;}



header ul li .dropdown-content {display: none;position: absolute;background-color: #191f28;min-width: 160px;box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);z-index: 1;left: 218px;top: 0px; padding: 5px 0px;}

header ul li:hover .dropdown-content {display: table;}

.dropdown-content a {padding: 13px 26px 13px 16px; color: white; font-weight: 600; color: white; display: table;}

.dropdown-content a:hover {background: rgba(255,255,255,0.1); color: white;}



.menu-ribbon

{

	width: calc(100% - 8px);

	height: auto;

	padding: 0px 4px;

	background-color: #191f28;

	display: table;

	color: white;

	position: fixed;

	left: 0px;

	top: 0px;

	z-index: 10;

}



.menu-ribbon .item

{

	display: inline-table;

	width: auto;

	padding: 13px;

	cursor: pointer;

	opacity: 0.45;

	transition: 0.2s all;

	float: right;

	font-weight: 600;

}



.menu-ribbon .item:hover

{

	opacity: 1;

}



.menu-ribbon .item img

{

	width: 15px;

	margin-right: 10px;

}



.menu-ribbon .item span

{

	color: white;

}



.menu-ribbon .logo

{

	filter: brightness(500%);

	padding: 13px;

	height: 17px;

}



.menu-ribbon .verze

{

	padding: 13px;

	opacity: 0.4;

}

/*-------------HLAVIČKA-------------*/



.footer-version

{

	position: fixed;

	bottom: 10px;

	left: 10px;

	font-size: 12px;

	z-index: 999999;

	display: none;

}





/*-------------ROZLOŽENÍ-------------*/

.container{width: calc(100% - 310px); margin-top:41px; min-width: 800px !important; padding: 45px; float: right;}



.list td {padding-left: 10px; padding-right: 10px; line-height: 18px !important;}

.list thead tr td {height: 50px; border-bottom: 1px solid #F8F9FA;}

.list tbody tr td {padding-top: 10px; padding-bottom: 10px; vertical-align: top; height: 35px;}

.list tbody tr td img{height: 40px;}

.list tbody tr:nth-child(odd) {background-color: rgb(245,245,245);}

.list .order-invoice img {width: 15px; height: auto; margin: 3px 7px 0px 0px;}

.list .order-invoice img:hover {opacity: 0.8;}

.product-thumbnail

{

	width: 40px;

	height: 40px;

	background-color: rgb(230,230,230);

	display: block;

	background-size: cover;

	background-repeat: no-repeat;

	background-position: center center;

}



.buttons {margin-top: 0px;}

.buttons a {color: #47a7b8; font-size: 13px; cursor: pointer;}

.buttons a:hover {text-decoration: underline;}

/*-------------ROZLOŽENÍ-------------*/





/*-------------NÁHLEDY SOC. SÍTÍ-------------*/

#facebook, #twitter {display: none;}



.google-view {font-family: "Arial";padding: 30px 0px;}

.google-view h4 {color: rgb(26, 13, 171); font-size: 19px; line-height: 1.3; font-weight: normal; margin: 0px 0px 2px 0px; word-break: break-word;}

.google-view span {color: #006621; font-size: 14px; word-break: break-word;}

.google-view p {line-height: 1.4; margin-top: 5px;}

.google-view {font-family: "Arial"; padding: 30px 0px;}



.google-view .gray_line {height: 7px; background-color: rgb(240,240,240); border-radius: 10px; margin: 10px 0px;}



.twitter-view{border-radius: 7px;border: 1px solid #E1E8ED;overflow: hidden;}

.twitter-view .img{width: 100%;height: 200px;background-color: rgb(200,200,200);display: block;margin: 0px;background-size: cover;background-repeat: no-repeat;background-position: center center;}

.twitter-view h4 {font-size: 13px;color: black;font-weight: bold;line-height: 1.2;word-break: break-word;padding: 10px 10px 0px 10px;margin: 0px;display: table;}

.twitter-view span{word-break: break-word;margin: 0px;padding: 3px 10px 7px 10px;display: table;}

.twitter-view p{line-height: 1.2;font-size: 13px;margin: 0px 0px 0px 0px;padding: 6px 10px 2px 10px;word-break: break-word;color: black;}



.facebook-view{border: 1px solid #E1E8ED;overflow: hidden;font-family: "arial";background-color: #f2f3f5;}

.facebook-view .img{width: 100%;height: 200px;background-color: rgb(200,200,200);display: block;margin: 0px;background-size: cover;background-repeat: no-repeat;background-position: center center;}

.facebook-view h4 {font-size: 16px;color: black;font-weight: bold;line-height: 1.2;word-break: break-word;padding: 0px 10px 0px 10px;margin: 0px;display: table;}

.facebook-view span{word-break: break-word;margin: 0px;padding: 10px 10px 7px 10px;display: table;text-transform: uppercase;}

.facebook-view p {line-height: 1.2;font-size: 14px;margin: 0px 0px 0px 0px;padding: 6px 10px 10px 10px;word-break: break-word;color: black;}

/*-------------NÁHLEDY SOC. SÍTÍ-------------*/





/*-------------MÉDIA-------------*/

.thumbnail {position: relative; width: calc(20% - 30px); overflow: hidden;float: left;margin: 10px;background-color: #E3E3E3;border: 5px solid white;box-shadow: 0px 0px 5px rgba(0,0,0,0.1);cursor: pointer;}

.thumbnail .delete {position: absolute;top: 5px;left: 5px;width: 25px;height: 25px;background-color: rgb(60,60,60);display: none;background-image: url("/admin/data/images/system-icons/trash.png");background-size: 50%;background-position: center center;background-repeat: no-repeat;border-radius: 5px;}

.thumbnail .view {position: absolute;top: 5px;left: 35px;width: 25px;height: 25px;background-color: rgb(60,60,60);display: none;background-image: url("/admin/data/images/system-icons/eye.png");background-size: 50%;background-position: center center;background-repeat: no-repeat;border-radius: 5px;}

.thumbnail .overlay {position: absolute;bottom: 0px;left: 5px;display: none;font-weight: bold;color: white;}

.thumbnail .view:hover, .thumbnail .delete:hover

{background-color:rgb(0,0,0);}

.thumbnail:hover .delete, .thumbnail:hover .view, .thumbnail:hover .overlay {display: block !important;}

.thumbnail:hover img {opacity: 0.8;}

.thumbnail img {position: absolute;left: 50%;top: 50%;height: 100%;width: auto;-webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);transform: translate(-50%,-50%);}

.thumbnail img.portrait {width: 100% !important;height: auto;}

.progress-bar {height: 11px; width: 300px; background-color: rgba(0,0,0,0.1); padding: 2px;  border-radius: 20px; overflow: hidden; margin-right: 10px; margin-left: 10px;}

.progress-bar .value {height: 100%; min-width: 10px; background: linear-gradient(17deg, #a3ddff, #47a7b8);border-radius: 20px;}

/*-------------MÉDIA-------------*/





/*-------------GALERIE POPUP-------------*/

#galerie{display: none;}

#galerieContent {overflow-y: auto;height: 500px;}

.popup{position: fixed; top: 0; left: 0; z-index: 99999; background-color: rgba(0,0,0,0.3);}

/*-------------GALERIE POPUP-------------*/





/*-------------ŠABLONY-------------*/

.template_item{border: 5px solid white;box-shadow: 0px 0px 5px rgba(0,0,0,0.1);width: calc(25% - 30px);margin: 10px;padding: 30px 0px;border: 5px solid white;display: block;background-position: top center;background-repeat: no-repeat;background-size: cover;position: relative;float: left;}

.template_item .overlay{width: 100%;height: 100%;display: table;background-color: rgba(255,255,255,0.8);display: flex; align-items: center;opacity: 0;transition: 0.2s all;position: absolute;top: 0;left: 0;}

.template_item .overlay .button {margin: 0px;}

.template_item .overlay .simpleButton{color: black; margin: 10px 0px 0px 0px;}

.template_item .overlay .simpleButton:hover{text-decoration: underline;}

.template_item:hover .overlay, .template_item .overlay.active{opacity: 1;}

.template_item .desc {width: 100%;height: auto;display: table;position: absolute;bottom: 0px;left: 0px;background-color: white;padding: 6px;}

/*-------------ŠABLONY-------------*/



































/*-------------EDITOR-------------*/

.editor-side-panel{position: relative; left: 0; top: 0;background-color: #2e333a; font-family: "Nunito"; box-shadow: 0px 0px 8px rgba(0,0,0,0.05);}

.editor-container{width: calc(100% - 300px);height: 100vh;position: fixed;right: 0px; top: 0px;margin: 0px;overflow-y: auto;overflow-x: hidden;padding: 0px; background-color: white;}

.editor-side-panel .header {background-color: #15161a;height: 45px; color: white;}

.editor-side-panel .bottom {background-color: #15161a;height: 45px; color: white; padding: 0px 5px;}

.editor-side-panel .content {height: calc(100vh - 90px) !important; overflow-x: hidden; overflow-y: auto;}



/*-------------VÝPIS DOSTUPNÝCH SEKCÍ-------------*/

#addable {background-color: rgb(240,240,240); width: 900px;}

#addable div, .float-icon {width: 127px;height: 100px !important;display: block; background-size: cover; background-position: center center; background-repeat: no-repeat; border-radius: 5px; filter: grayscale(100%); cursor: pointer; float: left; margin: 5px;}

#addable div:hover {box-shadow: 0px 0px 6px rgba(0,0,0,0.1);filter: grayscale(0%);}

#addable div.disabled {opacity: 0.5 !important; cursor: default !important; filter: grayscale(100%);}

/*-------------VÝPIS DOSTUPNÝCH SEKCÍ-------------*/



/*-------------PEKRYV SEKCÍ V EDITORU-------------*/

#sortable {width: 100% !important;list-style: none;margin: 0px; padding: 0px;}

#sortable .sortable-block {outline: 4px dashed transparent; outline-offset: -4px; cursor: pointer; display: flex; width: 100%; position: relative; overflow: hidden;}

#sortable .sortable-block:hover {outline: 5px dashed #b5b5b5;outline-offset: -5px;}

#sortable .sortable-block .sortable-block-buttons {background-color: #191F28;position: absolute;right: 10px;top: 10px;width: auto;display: none;margin: 0px;padding: 3px; z-index: 99;}

#sortable .sortable-block:hover .sortable-block-buttons {display: flex; align-items: center;}

#sortable .sortable-block .sortable-block-buttons button {width: 35px;height: 35px;background-color: transparent;border: none;background-size: 50%;background-position: center center;background-repeat: no-repeat;filter: grayscale(100%);filter: brightness(200%);cursor: pointer;outline: none;}

#sortable .sortable-block .sortable-block-buttons button:hover {filter: grayscale(0%); filter: brightness(100%);}

#sortable .sortable-block .sortable-block-buttons .move {background-image: url(images/system-icons/move.png);}

#sortable .sortable-block .sortable-block-buttons .edit {background-image: url(images/system-icons/edit.png);}

#sortable .sortable-block .sortable-block-buttons .delete {background-image: url(images/system-icons/delete.png);}

.ui-sortable-placeholder {background-color: #8ED1EF; margin: 0px; transition: all 0.25s; visibility: visible !important; outline: none !important;}

.ui-sortable-placeholder * {visibility: hidden; }

.float-icon {position: absolute; display: none; background-image: url(images/tmp-icons/2.jpg); box-shadow: 0px 0px 6px rgba(0,0,0,0.1);}

/*-------------PEKRYV SEKCÍ V EDITORU-------------*/



.form_div {display: none;}

.form_styl {display: none;}



.form_styl label, .form_div label

{

	width: 100%;

	color: #e8e6e6;

	font-size: 13px;

	margin-left: 2px;

}



.form_tlacitka {height: auto;display: table; margin-bottom: 10px;}

.form_tlacitka div {padding: 13px 0px;background-color: #27282d;border-bottom: 0px solid rgb(220,220,220);cursor: pointer;font-size: 14px;font-weight: 600; color: rgb(225,225,225);}

.form_tlacitka div:hover {color: white;}

.form_tlacitka div.active{padding: 13px 0px;background-color: #2e333a;border-bottom: 0px solid #2e333a;}



.form_div .form_obsah, .form_div .form_styl {padding: 0px 0px 0px 0px;}

.form_div h2 {font-size: 17px;margin: 5px 0px; color: white;}

.form_div p {font-size: 13px;line-height: 1.3;opacity: 0.5;font-style: italic;margin: 0px;padding: 0px; color: white;}

.form_div hr {opacity: 0.3;margin: 15px 0px 10px 0px; color: white;}



.editor-side-panel ::-webkit-scrollbar {width: 7px;}

.editor-side-panel ::-webkit-scrollbar-track {background: #1f2227;}

.editor-side-panel ::-webkit-scrollbar-thumb {background: #4e525d; border-radius: 10px;}

.editor-side-panel ::-webkit-scrollbar-thumb:hover {background: #3e414a;}



.editor-side-panel input, .editor-side-panel textarea, .editor-side-panel select

{

	background-color: #2e333a;

	border-color: #2e333a;

	color: #e8e6e6;

}



.editor-side-panel input[type=range] {-webkit-appearance: none; width: calc(100% - 85px) !important; min-width: 0px; border: none; background-color: transparent; margin: 10px 0px; padding: 0px;}

.editor-side-panel input[type=range]::-webkit-slider-runnable-track {width: 100%; height: 4.6px; cursor: pointer; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0); background: #2e333a; border-radius: 0px; border: 0px solid rgba(0, 0, 0, 0);}

.editor-side-panel input[type=range]::-webkit-slider-thumb {box-shadow: 0.7px 0.7px 3.1px rgba(0, 0, 0, 0.44), 0px 0px 0.7px rgba(13, 13, 13, 0.44); height: 12px; width: 12px; border-radius: 50px; background: #ffffff; cursor: pointer; -webkit-appearance: none; margin-top: -5.2px; display: table;}

.editor-side-panel input[type=range]::-moz-range-track {width: 100%; height: 4.6px; cursor: pointer; background: #2e333a; border-radius: 5px;}

.editor-side-panel input[type=range]::-moz-range-thumb {box-shadow: 0.7px 0.7px 3.1px rgba(0, 0, 0, 0.44), 0px 0px 0.7px rgba(13, 13, 13, 0.44); height: 15px; width: 15px; border-radius: 50px; background: #ffffff; cursor: pointer;}

.editor-side-panel input[type=range]::-ms-track {width: 100%; height: 4.6px; cursor: pointer; background: transparent; border-color: transparent; color: transparent;}

.editor-side-panel input[type=range]::-ms-fill-lower {background: #afafaf; border-radius: 0px; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);}

.editor-side-panel input[type=range]::-ms-fill-upper {background: #c8c8c8; border-radius: 0px; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0px 0px 1px rgba(13, 13, 13, 0);}

.editor-side-panel input[type=range]::-ms-thumb {box-shadow: 0.7px 0.7px 3.1px rgba(0, 0, 0, 0.44), 0px 0px 0.7px rgba(13, 13, 13, 0.44); border: 0px solid #000000; height: 13px; width: 13px; border-radius: 50px; background: #ffffff; cursor: pointer; margin: 0px; padding: 0px;}

.editor-side-panel input[type=range]:focus::-ms-fill-lower {background: #2e333a;}

.editor-side-panel input[type=range]:focus::-ms-fill-upper {background: #2e333a;}



.form_div .vypisRange {background-color: #2e333a; width: 50px; height: auto; padding: 4px 10px; border: 1px solid #2e333a;  border-top: 2px solid #2e333a; font-size: 13px; display: table; float: right; border-radius: 3px; margin-bottom: 10px; font-family: 'Roboto'; color: #e8e6e6;}



.tutorial-link {width: 70%; display:table; margin: 20px auto !important; text-align:center;}



/*-------------NÁHLED OBRÁZKU-------------*/

.editor-side-panel .img_preview{background-color: #262a2e; border: 1px solid #2e333a;border-radius: 3px;margin: 4px 0px;outline: none;height: 150px;display: table;overflow: hidden;cursor: pointer; position: relative;}

.editor-side-panel .img_preview .overlay{height: calc(100% - 30px);width: 100%;opacity: 1;background-size: cover;background-position: center center;background-repeat: no-repeat;}

.editor-side-panel .img_preview:hover .overlay {opacity: 0.9;}

.editor-side-panel .img_preview img {position: absolute; right: 10px; top: 10px; z-index: 2; width: 15px;}

.editor-side-panel .img_preview img:hover {filter: brightness(200%);}

.editor-side-panel .img_preview .footer {height: 10px !important; background-color: #2e333a !important; width: 100%; padding: 10px 0px !important;}

.editor-side-panel .img_preview .footer h4 {line-height: 10px; font-size: 12px;text-align: center;color: rgb(200,200,200);font-weight: 600;text-transform: none; padding: 0px; margin: 0px;}



.img_preview{background-color: #e0e0e0; border: 1px solid #D8D8D8;border-radius: 5px;margin: 4px 0px;outline: none;height: 150px;display: table;overflow: hidden;cursor: pointer; position: relative;}

.img_preview .overlay{height: calc(100% - 30px);width: 100%;opacity: 1;background-size: cover;background-position: center center;background-repeat: no-repeat;}

.img_preview:hover .overlay {opacity: 0.9;}

.img_preview img {position: absolute; right: 10px; top: 10px; z-index: 2; width: 15px;}

.img_preview img:hover {filter: brightness(200%);}

.img_preview .footer {height: 10px !important; background-color: rgba(255,255,255,1) !important; width: 100%; padding: 10px 0px !important;}

.img_preview .footer h4 {line-height: 10px; font-size: 12px;text-align: center;color: rgb(130,130,130);font-weight: 600;text-transform: none; padding: 0px; margin: 0px;}

.img_preview.small {width: calc(50% - 10px);margin: 4px;height: 100px !important;}

/*-------------NÁHLED OBRÁZKU-------------*/



.category-wrapper {width: calc(50% - 20px);padding: 10px;height: 120px;max-height: 150px;overflow: auto;}

.category-wrapper label {width: 100%;}



.accordion {background-color: #434751;cursor: pointer;padding: 13px 18px;border: none;width: calc(100% - 55px);display: table;transition: 0.2s;margin: 5px auto 0px auto;font-size: 14px;font-weight: bold;border-bottom: 1px solid #2e333a; color: white;}

.accordion span{width: 10px; height: 19px;display: block;filter: invert(1);float: left;background-image: url(images/system-icons/angle-right.png);background-size: 70%;background-position: center center;background-repeat: no-repeat;margin-right: 10px;}

.accordion:hover {background-color: #545965;}

.active span {background-image: url(images/system-icons/angle-down.png) !important;}

.panel {padding: 10px 15px 15px 15px;background-color: #3e414a;display: none; width:calc(100% - 51px); margin: 0px auto; overflow: hidden;}



#menu-sortable {border: 1px solid rgb(220,220,220); border-bottom: none; list-style: none; padding: 0px;}

#menu-sortable li {margin: 0px;}

.menu-item {background-color: white;cursor: pointer;padding: 13px 18px;width: 100%;width: calc(100% - 36px);display: table;margin: 5px 0px 0px 0px;font-size: 14px;font-weight: bold;border-bottom: 1px solid rgb(220,220,220);}

.menu-item span{width: 10px;height: 19px;display: block;float: left;background-image: url(images/system-icons/angle-right.png);background-size: 70%;background-position: center center;background-repeat: no-repeat;margin-right: 10px;}

.menu-item:hover {background-color: rgb(240,240,240);}

.menu-item img {width: 15px; float: right; opacity: 0.3;}

.menu-item img:hover {opacity: 0.8;}

#menu-sortable li .panel {padding: 10px 15px 15px 15px;background-color: rgb(245,245,245); width:calc(100% - 30px);display: none;overflow: hidden;}



.select-small {width: 50px; padding: 2px; float: right; margin: 0px 0px 10px 5px; border-radius: 3px;}



.html-preview {width: calc(100% - 120px);margin: 30px;background-color: rgb(230,230,230);color: rgb(190,190,190);display: table; padding: 30px;text-align: center;font-size: 40px;}



/*Tutorial*/

.tutorial-arrow {position: absolute; width: 30px; cursor: pointer; transition: 0.2s;}

.tutorial-arrow:hover {width: 35px;}

.tutorial-arrow.back {left: 20px;}

.tutorial-arrow.next {right: 20px;transform: rotate(180deg);}

.tutorial-wrap{width: 100%; height: auto; display: table; text-align: center; color: white; display: none;}

.tutorial-counter{position: absolute; bottom: 20px; right: 30px; color: white; font-size: 13px;}

.tutorial-wrap img{width: 65%;}

.tutorial-wrap h3 {font-size: 20px; color: white;}

.tutorial-wrap p{width: 63%; margin: 10px auto; font-size: 15px; color: white; height: 50px;}

.no-select {-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}

/*Tutorial*/



@media(max-width: 768px) {#sortable .sortable-block .hide-on-mobile {display: table !important; opacity: 0.3;}}

@media (min-width: 769px) AND (max-width: 1025px) {#sortable .sortable-block .hide-on-tablet {display: table !important; opacity: 0.3;}}

@media(min-width: 1026px) {#sortable .sortable-block .hide-on-desktop {display: table !important; opacity: 0.3;}}