@charset "utf-8";
@font-face {
	font-family: courier-new;
	src: url(/fonts/courierNewBold/courierNewBold.ttf);
}
/* CSS Document */

* {
	margin: 0;
	padding: 0;

}

.red {
	color: red !important;
}
html,body {
	color: #fff;

	min-height: 100vh;

}

.hidden {
  visibility: hidden;
}

.login-page {
	width: 360px;
	padding: 8% 0 0;
	margin: auto;
}
.login-page h3 {
	font-size: xx-large;
	margin: 0;
	padding-bottom: 10px;
	text-align: left;
	color: #7BBA58;
}
.login-page .logoImg {
	width: 100%;
	text-align: center;
}
.login-page .form {
	position: relative;
	z-index: 1;
	background: #FFFFFF;
	max-width: 360px;
	margin: 0 auto 100px;
	padding: 15px 45px 45px;
	text-align: center;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.login-page .form input {
	font-family: "Roboto", sans-serif;
	outline: 0;
	background: #f2f2f2;
	width: 100%;
	border: 0;
	margin: 0 0 15px;
	padding: 15px;
	box-sizing: border-box;
	font-size: 14px;
	color: #43A047;
}
.login-page .form button {
	font-family: "Roboto", sans-serif;
	text-transform: uppercase;
	outline: 0;
	background: #4CAF50;
	width: 100%;
	border: 0;
	padding: 15px;
	color: #FFFFFF;
	font-size: 14px;
	-webkit-transition: all 0.3 ease;
	transition: all 0.3 ease;
	cursor: pointer;
}
.login-page .form button:hover,.form button:active,.form button:focus {
	background: #43A047;
}
.login-page .form .message {
	margin: 15px 0 0;
	color: #b3b3b3;
	font-size: 12px;
}
.login-page .form .message a {
	color: #4CAF50;
	text-decoration: none;
}
.login-page .form .register-form {
	display: none;
}
.login-page .container {
	position: relative;
	z-index: 1;
	max-width: 300px;
	margin: 0 auto;
}
.login-page .container:before, .container:after {
	content: "";
	display: block;
	clear: both;
}
.login-page .container .info {
	margin: 50px auto;
	text-align: center;
}
.login-page .container .info h1 {
	margin: 0 0 15px;
	padding: 0;
	font-size: 36px;
	font-weight: 300;
	color: #1a1a1a;
}
.login-page .container .info span {
	color: #4d4d4d;
	font-size: 12px;
}
.login-page .container .info span a {
	color: #000000;
	text-decoration: none;
}
.login-page .container .info span .fa {
	color: #EF3B3A;
}
.login-page #poweredBy {
	position: absolute;
	bottom: 3px;
	right: 6px;
	margin: 0;
	padding: 0;

	color: rgb(136, 136, 136);
	font-family: Arial,Helvetica,sans-serif;
	font-size: 11px;
	font-weight: 400;
	line-height: 20px;
	text-align: right;
	vertical-align: baseline;
}
.login-page #poweredBy a {
	color: #aaa;
	font-size: 11px;
	text-decoration: none;
	transition: color 0.5s linear 0s;
}
:required {
  border-color: red;
}
body {
	width: 100%;
	background: #76b852;
	/* fallback for old browsers */
	background: -webkit-linear-gradient(right, #76b852, #8DC26F);
	background: -moz-linear-gradient(right, #76b852, #8DC26F);
	background: -o-linear-gradient(right, #76b852, #8DC26F);
	background: linear-gradient(to left, #76b852, #8DC26F);
	font-family: "Roboto", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	margin: 0;
	padding: 0;
}

.messageWrap {
	width: 100%;
	position: fixed;
	top: 50px;
	z-index: 110;

}
.message {
	width: 30%;
	margin: 6px auto;
	border: 3px solid #ffffff;
	background: #009f35;
	color: #fff;
	padding: 20px;
	text-align: center;
	font-weight: bold;
	border-radius: 20px;
	box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.message.E {
	background: #ff6c6c;
}
.message.I {
	background: #f1aa49;
}
.message.A {
	background: #009f35;
}
a {
	text-decoration: none;
}

nav {
	font-family: monospace;
}

ul {
	background: #43A047;
	list-style: none;
	margin: 0;
	padding-left: 0;
	height: 3rem;
}

li {
	color: #fff;
	background: #43A047;
	display: block;
	float: left;
	padding: 1rem;
	position: relative;
	text-decoration: none;
	transition-duration: 0.5s;
	height: 1rem;
	width: 7rem;
	text-align: center;
}

li a {
	color: #fff;
}
li a[target="_blank"] {
  color:#fdbbc1;
}

li:hover,
li:focus-within {
	background: #62a63d;
	cursor: pointer;
}

li:focus-within a {
	outline: none;
}

ul li ul {
	background: orange;
	visibility: hidden;
	opacity: 0;
	min-width: 5rem;
	position: absolute;
	transition: all 0.5s ease;
	margin-top: 1rem;
	left: 0;
	display: none;
	z-index: 20;
}

ul li:hover > ul,
ul li:focus-within > ul,
ul li ul:hover,
ul li ul:focus {
	visibility: visible;
	opacity: 1;
	display: block;
}

ul li ul li {
	clear: both;
	width: 100%;
}

main {
	padding: 20px 50px;
}

main input[readonly]
{
    background: #ddd;
    color: #999;
}
main h1 {
  display: inline-block;
}
main #addArticle {
  display: inline-block;
  background-image: url("/images/web_root/plus.png");
  width: 32px;
  height: 32px;
}
main #addArticle:hover {
  background-image: url("/images/web_root/plusOver.png");
}


main table {
	width: 100%;
}
main table tr:nth-child(1) {
	background: #43A047;
}
main table tr:nth-child(even) {
	background: #62a63d;
}
main table tr:hover {
	background: #43A047;
}
main table tr td {
	padding: 6px;
}
main table tr td.centered {
	text-align: center;
}
main table textarea {
	width: 100%;
	min-height: 600px;
}
main img.semafor {
	width: 17px;
	height: 50px;

	background-image: url("/images/web_root/semafor.png");
	background-position: 0px 0px;
	background-size: 55px;
	background-repeat: no-repeat;
}
main img.semafor.green {
	background-position: -37px 0;
}
main img.semafor:hover {
	background-image: url("/images/web_root/semaforOver.png");
}
main img.action {
	width: 32px;
	height: 32px;

	margin: 5px;
	background-image: url("/images/list_items/actionsSprite.png");
	background-position: -1px -1px;

}
main img.action.del {
	background-position: -33px -1px;
}
main img.action.add {
	background-position: -100px -1px;
}
main img.action.ok {
	background-position: -133px -1px;
}
main img.action:hover {
	background-position: -1px -33px;
}
main img.action.del:hover {
	background-position: -33px -33px;
}
main img.action.add:hover {
	background-position: -100px -33px;
}
main img.action.ok:hover {
	background-position: -133px -33px;
}
main img.action.addLess {
  	background-position: -197px -1px;
}
main img.action.addLess:hover {
  	background-position: -197px -35px;
}
main img.action.index {
	position: relative;
	top: 10px;
	left: 25px;
}
main table tr td.actions img {}
main table tr th.wrapped {
	word-wrap: break-word;
	width: 200px;
}
main table tr td .machinePhotoEditableWrapper{
	position: relative;
	display: inline-block;
}
main table tr td img {
	width: 100px;
}

main table tr td .imageRemoverButton,main table tr td .imageDisableButton {
	z-index: 10;
width: 25px;
height: 25px;
position: absolute;
top: 0;
left: 75px;
background-image: url("/images/list_items/actionsSprite.png");
background-position: -27px 0;
background-size: 130px;
display: none;
}
main table tr td .imageDisableButton {
	background-position: -52px 0;
	top: 30px;
}

main table tr td .radioSettings {
  display: inline-block;
  padding: 0 0 15px 25px;

}

main table select,main table input {

	color: #000;
	width: 350px;
	height: 50px;
	font-size: 18px;
	margin: 6px 0;
	padding: 0 10px;
}

main table input#upload_file{
  display: inline-block;
  width: 12%;
  font-size: 12px;

  height: 25px;
}
main table input[type=radio] {
  width: 40px;
  height: 40px;
  margin-left: 7px;
  position: relative;
  top: 10px;
}
main table textarea.temp {
  width: 600px;
}
button {
  font-family: "Roboto", sans-serif;
  margin: 10px;
text-transform: uppercase;
outline: 0;
background: #4CAF50;
width: 90%;
border: 0;
padding: 15px;
color: #FFFFFF;
font-size: 14px;
-webkit-transition: all 0.3 ease;
transition: all 0.3 ease;
cursor: pointer;
}
.dialog form div {
  text-align: right;
  margin-right: 20px;
}
.dialog #passwordHelper {
  margin-top: 20px;
}
.dialog #passwordHelper p {
  margin-left: 15px;
}
.valid,.bothSame {
  color: green;
}

.valid:before,.bothSame:before {
  position: relative;

  content: "✔";
}

/* Add a red text color and an "x" when the requirements are wrong */
.invalid,.notSame {
  color: red;
}

.invalid:before,.notSame:before {
  position: relative;

  content: "✖";
}
/*******************/
/* SECTION GALLERY */
/*******************/
main#gallery h1 {
  display: inline-block;
}
main#gallery h1 span {
  display: inline-block;

}
main h1#unfoldered input {

font-size: 32px;
padding: 5px 20px;
}
main#gallery .action.add.addImage,main#gallery .action.add.addFolder {

}
main#gallery #imageFoldersWrap {
  width: 100%;
  text-align: center;
}
main#gallery #imageFoldersWrap .systemFolder {
  width: 30px;
  height: 31px;
  background-image: url("/images/list_items/actionsSprite.png");
  position: relative;
  top: 33px;
  left: 167px;
  background-position: -166px 0;
}
main#gallery #imageFoldersWrap .removeEntireFolder {
  background-image: url("/images/list_items/actionsSprite.png");
  visibility: hidden;

  background-position: -33px -33px;
width: 35px;
height: 35px;
position: relative;
top: 35px;
margin: auto;
cursor: not-allowed;
}

main#gallery #imageFoldersWrap .imageFolder {
  display: inline-block;
width: 200px;
height: 200px;


top: 200px;
box-sizing: border-box;

}
main#gallery #imageFoldersWrap .imageFolder img {
  height: 100%;
    width: 100%;
    max-height: 100vh;
    max-width: 100vh;
    object-fit: cover;
}
main#gallery #imageFoldersWrap .imageFolder:hover > .systemFolder {
  background-position: -166px -34px;
}
main#gallery #imageFoldersWrap .imageFolder:hover > .removeEntireFolder {
  visibility: visible;
}

main#gallery .galleryPhoto.masterImage{
  border:3px solid red

}

textarea[name="videoDescYt"],textarea[name="videoDesc"] {
  height: 300px;
  min-height: 300px;
}

/*******************/
/* SECTION JQUERY  */
/*******************/
.ui-widget select,.ui-widget input {
	margin-top: 10px;
}
.ui-widget select {
	width: 204px;
}
.ui-widget input {
	width: 200px;
}
.ui-widget .imageCrop {
	text-align: center;
}
.ui-widget .imageCrop img {
	width: 650px;
}
.ui-datepicker {
  z-index: 4 !important;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
  border: 2px solid red !important;
}
/*IMAGE CROP SECTION*/
#image_preview {
  width: 80%;
  height: 100px;

  display: inline-block;
}
#image_preview img {
	display: inline-block;
  margin: 10px;
  max-height: 64px;
  width: unset;
}
@media screen and (max-width: 1300px) {
	#content .contentBox {
		width: 100%;
	}
	#content .contentBox.helpderBox {
		margin: 0;
		width: 100%;
	}
}