@font-face
{
	font-family: 'helvetica-neue';
	src: url('fonts/HelveticaNeue.woff');
	font-weight: normal;
	font-style: normal;
}

@font-face
{
	font-family: 'helvetica-neue';
	src: url('fonts/HelveticaNeue-Bold.woff');
	font-weight: bold;
}

@font-face
{
	font-family: 'helvetica-neue-light';
	src: url('fonts/helveticaneue-light-webfont.woff');
}

@font-face {
	font-family: 'Exo 2';
	font-style: normal;
	font-weight: 400;
	src:
	local('Exo 2'),
	local('Exo2-Regular'),
	url('fonts/Exo2.woff2') format('woff2'),
	url('fonts/Exo2.woff') format('woff');
}

html,body
{
	margin: 0px;
	padding: 0px;
	height: 100%;
	background-color: #DAE1EA;
}

*
{
	font-family: 'Exo 2', helvetica-neue, arial, sans-serif;
	font-size: 13px;
	color: #4E5A6C;
}


div.main
{
	position: relative;
	min-width: 1000px;
	max-width: 1980px;
	min-height: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #DAE1EA;

	background-attachment: fixed;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

div.header
{
	position: relative;
	background-color: #FFFFFF;
	height: 65px;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	max-width: 100vw;
}

img
{
	border: 0;
}

img.logo
{
	max-height: 90%;
	max-width: 200px;
	margin-left: 5px;
	margin-top: 5px;
	vertical-align: middle;
}

div.tab_menu_right
{
	max-width: 33%;
	height: 100%;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	margin-left: auto;
}

div.tab_menu_right *
{
	color: #F27935;
}

div.tab_menu_right > div
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	max-width: 100px;
	min-width: 75px;
	position: relative;
	cursor: pointer;
	transition: all 0.2s linear 0s;
}

div.tab_menu_right > div a
{
	position: absolute;
	text-decoration: none;
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: 12px;
	text-overflow: ellipsis;
	overflow: hidden;
}

div.tab_menu_right > div:last-child
{
	border-right: 0px solid #BBBBBB;
}

div.tab_menu_right > div:hover a {}

div.tab_menu_left
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	height: 100%;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin-left:20px;
}

div.tab_menu_left *
{
	color: #9EA7B3;
}

div.tab_menu_left > div
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	max-width: 100px;
	min-width: 75px;
	position: relative;
	cursor: pointer;
	transition: all 0.2s linear 0s;
}

div.tab_menu_left > div a
{
	position: absolute;
	text-decoration: none;
	width: 90%;
	height: 100%;
	text-align: center;
	line-height: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	left: 5%;
}

div.tab_menu_left span.icon, div.tab_menu_right span.icon
{
	display: block;
	width: 100%;
	text-align: center;
	margin-bottom: 5px;
	margin-top: 10px;
	font-size: 20px;
}

div.tab_menu_left > div:hover, div.tab_menu_right > div:hover, div.tab_menu_left > div.active
{
	background-color: #EAEDF1;
	transition: all 0.2s linear 0s;
	color:  #4E5A6C;
}

div.tab_menu_left div.active *
{
	color: #F27935;
}

div.infobar1
{
	background-color: #F27935;
	height: 5px;
}

div.infobar2
{
	background-color: #282828;
	height: 30px;
}

div.footer
{
	background-color: #FFFFFF;
	width: 100%;
	height: 40px;
	position: absolute;
	bottom: 0px;
}

div.footer img
{
	float: right;
}



ul.language_select
{
	list-style-type: none;
	position: absolute;
	width: 100%;
	padding: 0px;
	margin-left: -8px;
	margin-top: 27px;

}

ul.language_select li
{
	float: none;
	background-color: #DEDEDE;
	border-width: 0px;
}

ul.language_select li:hover
{
	background-color: #FFFFFF;
}




div.left_menu
{
	max-width: 250px;
	min-width: 200px;
	width: 20%;
	margin-right: 20px;
	margin-left: -10px;
	margin-top: -20px;
	z-index: 1;
}

ul.left_menu
{
	width: 100%;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	list-style-type: none;
	z-index: 1000;
}

ul.left_menu li
{
	background-color: #B3C2D7;
	width: 100%;
	padding: 0;
	margin: 0px 0px 0px 0px;
	border-bottom: 1px solid white;
	line-height: 40px;
}

ul.left_menu li:last-child, div.left_menu_container ul.left_menu li:last-child
{
	border-bottom-width: 0px;
}

div.left_menu_container { }

div.left_menu_container ul.left_menu li
{
	background-color: rgba(255, 255, 255, 0.4);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

div.left_menu_container ul.left_menu li a
{
	color: inherit;
}

div.left_menu_link:hover
{
	background-color: #F27935;
	cursor: pointer;
	transition: all 0.2s linear 0s;
}

ul.left_menu li a
{
	display: block;
	height: 100%;
	color: #FFFFFF;
	padding-top: 0px;
	padding-left: 20px;
	padding-right: 10px;
	margin: 0px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

ul.left_menu li a:hover
{
	text-decoration: none;
}

ul.left_menu li a span
{
	float: right;
	line-height: 40px;
	font-size: 25px;
}


div.breadcrumbs
{
	padding: 0px;
	height: 44px;
	position: relative;
	background-color: #EAEDF1;
}

ul.breadcrumbs
{
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	height: 100%;
}

ul.breadcrumbs li
{
	float: left;
	height: 100%;
	position: relative;
	cursor: pointer;
}

ul.breadcrumbs li a
{
	text-decoration: none;
	line-height: 44px;
	height: 100%;
	width: 100%;
	padding-left: 14px;
	padding-right: 4px;
	display: block;
	color: #434B4F;
}

ul.breadcrumbs li:first-child a
{
	padding-left: 10px;
}

ul.breadcrumbs li:after
{
	content: ">";
	color: white;
	position: absolute;
	top: 50%;
	width: 0;
	height: 0;

	right: -2px;

	margin-top: -8px;
	z-index: 10;
}

ul.breadcrumbs li:last-child:after
{
	display: none;
}

ul.breadcrumbs li:hover
{
}

ul.breadcrumbs li:hover a, ul.breadcrumbs li:last-child:hover a
{
	color: #FFFFFF;
}

ul.breadcrumbs li:last-child a
{
	color: #FFDD00;
}

div.background
{
	background-image: url('../img/cc/login_back.jpg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	position: fixed;
	z-index: 0;
	top: 110px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	opacity:0.3;
}

div.modal
{
	position: fixed;
	z-index: -1;
	top: 140px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	opacity:0.3;
}

.blurred
{
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-ms-filter: blur(5px);
	filter: blur(5px);
	transition: all 1s;
}



div.content_header
{
	height: 0px;
	position: relative;
	text-align: center;
	width: 100%;
	margin-left: 0px;
	margin-bottom: 10px;
}

div.content_header:after
{
	left: 50%;
	width: 0px;
	height: 0px;
	position: absolute;
	content: "";

	bottom: -5px;
	border-top: 15px solid #EAEDF1;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	margin-left: -20px;
	z-index: 10;
}

h1.content_title
{
	display: inline-block;
	position: relative;
	top: -52px;
}

h1.content_title span
{
	font-size: inherit;
	font-family: inherit;
	border-right: 1px solid #AAAAAA;
	padding-right: 6px;
}


#back_to_top
{
	position:fixed;
	bottom:6px;
	right:6px;
	z-index:99;
}



div.help_container
{
	right: 0px;
	top: 65px;
	position: fixed;
	border: 2px solid #9EA7B3;
	z-index: 99;
}

div.page_questions
{
	background-color: #FFFFFF;
	width: 300px;
	padding: 10px;
}

div.page_questions p
{
	margin-top: 0px;
}

div.page_questions_contact
{
	background-color: #DEDEDE;
	color: #000000;
	padding: 10px;
}

ul.page_questions_manual
{
	list-style-type: none;
	padding: 0px;
	height: 40px;
}

ul.page_questions_manual li
{
	float: left;
	padding-right: 8px;
	cursor: pointer;
}


div.send_notification
{
	position: absolute;
	right: 345px;
	top: 10px;
	height: 26px;
}

div.send_notification a
{
	padding-left: 10px;
	padding-right: 10px;
	line-height: 26px;
	height: 100%;
}

div.page_edit
{
	position: absolute;
	right: 218px;
	top: 10px;
	height: 26px;
}

div.page_edit a
{
	padding-left: 10px;
	padding-right: 10px;
	line-height: 26px;
	height: 100%;
}

div.page_edit img
{
	position: absolute;
	right: 0px;
}

div.search
{
	position: absolute;
	right: 10px;
	top: 74px;
	height: 26px;
	width: 200px;
}

div.search a.button2
{
	width: 26px;
	height: 26px;
}

div.search_result
{
	background-color: #FFFFFF;
	position: absolute;
	width: 300px;
	height: 300px;
	right: 0px;
	border: 1px solid #CCCCCC;
	margin-top: -1px;
	padding: 0px;
	overflow-y: scroll;
	z-index: 100;
}

div.search_result p
{
	margin: 0px;
	background-color: #EEEEEE;
	padding: 6px 10px 6px 10px;
}

div.search_result ul
{
	list-style-type: none;
	margin-bottom: 10px;
	padding-left: 10px;
	padding-right: 5px;
}

div.search_result a
{
	display: block;
}


div.contents
{
	padding: 10px;
	position: relative;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}



div.login_contents
{
	position: absolute;
	width: 410px;
	left: calc(50% - 205px);
	top: calc(50% - 125px);
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	transition: all 0.3s linear 0s;
}

div.frontcontent
{
	position: relative;
	padding: 25px;
	padding-bottom: 60px;
	background-color: rgba(255, 255, 255, 0.8);
}

img.login_logo
{
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 80px;
	margin-bottom: 80px;
}

div.login_text
{
	padding: 15px;
	margin-bottom: 30px;
}

div.login
{
	position: relative;
	background-color: #F27935;
	padding: 25px;
	padding-bottom: 60px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	width: 100%;
}

div.login div
{
	margin-top: 5px;
	margin-bottom: 0px;
}

div.login a.button2
{
	position: absolute;
	right: 15px;
	padding: 5px;
	height: auto;
	line-height: 20px;
	width: 60px;
	height: 50px;
	color: inherit;
	background-color: rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(0, 0, 0, 0.0);
}

div.login a.button2:hover
{
	background-color: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(2, 0, 0, 0.1);
}

div.login a.button2 span
{
	width: 100%;
	font-size: 20px;
	line-height: 20px;
}

div.login_background
{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;

	background-attachment: fixed;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}


/************************ MENU CONTENTS **********************/
div.menu_intro { }

div.menu_intro * { }

div.template_container
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

div.template_content
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-left: 5px;
	margin-top: 8px; /* for 'arrow' in header */
}

div.folders
{
	margin: -3px;
	padding-top: 20px;
}

div.folders.single_column
{
	-webkit-flex: 0.32;
	-ms-flex: 0.32;
	flex: 0.32;
}

div.folder
{
	width: 300px;
	height: 135px;
	background-color: #FFFFFF;
	background-repeat: no-repeat;
	background-position: 10px 10px;
	margin: 3px;
	padding: 15px;
	position: relative;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	float: left;
}

div.single_column > div
{
	width: calc(100% - 10px);
	width: -webkit-calc(100% - 10px);
}

div.double_column  > div
{
	width: calc(50% - 10px);
	width: -webkit-calc(50% - 10px);
}

div.triple_column  > div
{
	width: calc(33.333% - 10px);
	width: -webkit-calc(33.333% - 10px);
}

div.quad_column  > div
{
	width: calc(25% - 10px);
	width: -webkit-calc(25% - 10px);
}

div.folder div
{
	position: relative;
	height: 100%;
}

div.folder a.button, div.folder input[type="submit"]
{
	position: absolute;
	bottom: 15px;
	left: 15px;
	width: 180px;
}

div.folder h1
{
	position: absolute;
	height: 80px;
	top: 10px;
	left: 15px;
	right: 15px;
	margin-top: 0px;
	margin-bottom: 0px;
	z-index: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
}

div.folder img
{
	position: absolute;
	max-width: calc(100% - 30px);
	max-height: 75px;
	bottom: 15px;
	left: 15px;
	cursor: pointer;
}

div.publications
{
	clear: both;
	margin: -3px;
	padding-top: 20px;
}

div.publication
{
	min-width: 450px;
	max-width: 450px;
	height: 350px;
	background-color: #FFFFFF;
	margin: 3px;
	position: relative;
	border-width: 0px;
	border-style: solid;
	border-color: #F27935;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	float: left;
}

div.publication div.preview
{
	float: right;
	position: relative;
	margin-left: 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #F27935;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

div.publication img.preview
{
	max-width: 300px;
	max-height: 250px;
	display: block;
}

div.publication a.select, div.publication input[type="submit"]
{
	position: absolute;
	bottom: 15px;
	left: 15px;
	width: 180px;
}
div.publication a.batch {
    left: 210px;
}

div.publication a.button.static_remove {
	position: absolute;
	left: 15px;
	width: 180px;
	bottom: 45px;
}

div.publication div.text
{
	position: absolute;
	top: 45px;
	left: 15px;
	right: 15px;
	bottom: 50px;
	overflow: hidden;
}

div.publication_header
{
	margin-left: 15px;
	margin-top: 10px;
	margin-right: 15px;
	max-width:460px;
	white-space: nowrap;
	overflow: hidden;
}

div.publication div.text p
{
	margin: 0px;
}

div.publication a.details
{
	position: absolute;
	right: 0px;
	top: 0px;
	width: 25px;
	height: 25px;
	cursor: pointer;
	padding: 0px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

div.publication_details
{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 100;
}

div.publication_details_sub
{
	height: 70%;
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	top: 15%;
	background-color: #FFFFFF;
	position: relative;
}

div.publication_details div.preview
{
	position: absolute;
	width: 40%;
	left: 10px;
	top: 10px;
	bottom: 10px;
}

div.publication_details input
{
	position: absolute;
	bottom: 10px;
	left: 186px;
	width: 180px;
}

div.publication_details div.text
{
	position: absolute;
	top: 10px;
	left: 42%;
	right: 10px;
	bottom: 100px;
	overflow: hidden;
}

div.publication_details div.text:hover
{
	overflow-y: auto;
}

div.publication_details div.text p.header
{
	font-weight: bold;
	margin-bottom: 8px;
}

div.publication_details div.text p
{
	margin: 0px;
}

div.publication_details div.publication_jobs
{
	position: absolute;
	left: 42%;
	bottom: 10px;
	right: 10px;
}

div.dragover
{
	border: 2px dashed #282828;
}

div.dragelement
{
	background-color: inherit;
	opacity: 0.4;
}


/************************ INPUT FIELDS **********************/
input[type="button"], input[type="submit"], a.button
{
	background-color: #F27935;
	text-transform: uppercase;
	font-size: 11px;
	color: #FFFFFF;
	border: 0;
	height: 27px;
	cursor: pointer;
	transition: all 0.2s linear 0s;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	vertical-align: middle;
}

input[type="button"]:hover, input[type="submit"]:hover, a.button:hover
{
	background-color: #B3C2D7;
	transition: all 0.2s linear 0s;
	text-decoration: none;
}

a.button
{
	display: inline-block;
	text-decoration: none;
	text-align: center;
	line-height: 28px;
}

input.button2, a.button2
{
	background-color: #B3C2D7;
	color: #FFFFFF;
	text-transform: uppercase;
	font-size: 11px;
	height: 27px;
	cursor: pointer;
	transition: all 0.2s linear 0s;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	vertical-align: middle;
}

input[type="button"].button2:hover, input[type="submit"].button2:hover, a.button2:hover
{
	background-color: #F27935;
	text-decoration: none;
}

input[type="button"].button2[disabled], input[type="button"].button2[disabled]:hover 
{
    background-color: grey;
    cursor: default;
}

a.button2
{
	display: inline-block;
	text-decoration: none;
	text-align: center;
	line-height: 28px;
}

a.button[disabled], a.button2[disabled], input[type="button"][disabled], input[type="submit"][disabled]
{
	opacity: 0.6;
}

input[type="text"], input[type="file"], input[type="password"], select
{
	border: 1px solid #CCCCCC;
	padding: 4px;
	background-color: #FFFFFF;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	margin: 0px;
	min-height: 26px;
	vertical-align: middle;
}

input[type="text"]:disabled, input[type="file"]:disabled, input[type="password"]:disabled, select:disabled
{
	background-color: rgb(235, 235, 228);
}

select
{
	padding: 3px;
}

input[type="file"]
{
	padding: 2px;
}

input[readonly], textarea[readonly]
{
	background-color: #E5E5E5;
}

textarea
{
	border: 1px solid #CCCCCC;
	padding: 4px;
	background-color: #FFFFFF;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	margin: 0px;
}

input[type="text"]:focus, textarea:focus, input[type="password"]:focus
{
	border-color: #F27935;
}

input[type="checkbox"]
{
	margin: 0px;
	vertical-align: middle;
}

a
{
	text-decoration: none;
	cursor: pointer;
}

a:hover
{
	text-decoration: underline;
}

h1
{
	font-family: 'Exo 2', helvetica-neue-light, arial;
	font-size: 25px;
	color: #F27935;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 5px;
}

h2
{
	font-family: 'Exo 2', helvetica-neue-light, arial;
	font-size: 25px;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 5px;
}



/************************ TABLES **********************/
table.default
{
	border-collapse: collapse;
}

table.default tr
{
	height: 28px;
}

table.default tbody tr:hover
{
	background-color: #EEEEEE;
}

table.default tbody tr.selected
{
	background-color: #E5E5E5;
}

table.default tbody tr.nohover:hover
{
	background-color: transparent;
}

table.default thead th
{
	background-color: #F27935;
	padding: 5px;
	color: white;
	text-align: left;
}

table.default tbody td
{
	border: 1px solid #DEDEDE;
	padding: 5px;
}

table.default tfoot td
{
	background-color: #F27935;
}

table.default tfoot tr
{
	height: 5px;
}

td
{
	vertical-align: top;
}

th.sortable
{
	cursor: pointer;
}

th.sortable:hover
{
	opacity: 0.75;
}

th.sortable.desc:before
{
	content: '\e64c';
	font-family: 'icomoon';
	font-size: 22px;
	line-height: 14px;
	padding-right: 5px;
	text-align: right;
	height: 0px;
	display: block;
}

th.sortable.asc:before
{
	content: '\e64d';
	font-family: 'icomoon';
	font-size: 22px;
	line-height: 14px;
	padding-right: 5px;
	text-align: right;
	height: 0px;
	display: block;
}


div.pagination
{
	height: 23px;
	line-height: 23px;
	color: #FFFFFF;
}

div.pagination a
{
	color: #FFFFFF;
}

div.pagination img
{
	vertical-align: -2px;
}

div.pagination_dark div.pagination, div.pagination_dark a
{
	color: #404040;
}


ul
{
	margin: 0px;
	padding: 0px;
	padding-left: 15px;
}

p:first-child
{
	margin-top: 0px;
}

p:last-child
{
	margin-bottom: 0px;
}

form
{
	margin: 0px;
	padding: 0px;
}


/************************ JOB EDIT **********************/
div.job_header
{
	background-color: #EEEEEE;
	padding: 8px;
	margin-bottom: 10px;
	position: relative;
	height: 80px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

div.job_header h3
{
	font-size: 16px;
	margin-top: 0px;
	color: #606060;
}

div.job_container
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: flex-start;
	-ms-align-items: flex-start;
	align-items: flex-start;
	margin-left: auto;
	margin-right: auto;
	max-width: 1500px;
}

div.job_fields_container
{
	width: calc(50% - 5px);
	margin-right: 5px;
	min-width: 600px;
}

div.job_fields
{
	padding: 0px;
	margin-bottom: 10px;
}

div.job_field
{
	margin-bottom: 5px;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

div.job_field:last-child
{
	margin-bottom: 0px;
}

div.job_field label
{
	position: relative;
	min-width: 150px;
	width: 20%;
	padding-right: 10px;
	text-align: right;
}

div.job_field div
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

div.field_groups
{
	background-color: #FFFFFF;
	margin-top: 10px;
	margin-bottom: 10px;
}

div.field_groups > div.job_fields
{
	margin-bottom: 0px;
}

div.field_group_header
{
	margin-bottom: 10px;
	line-height: 1;
	height: 28px !important;
	margin-top: -15px;
	padding: 0px !important;
}

div.job_preview_container
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-left: 5px;
	position: relative;
	line-height: 0;
	text-align: center;
	margin-bottom: -10px;
	overflow-x: hidden;
	overflow-y: hidden;
}

div.edit_preview_image
{
	position: relative;
	display: inline-block;
	height: 100%;
	max-width: 100%;
}

img.edit_preview_image
{
	max-width: calc(100% - 2px);
	max-height: calc(100% - 2px);
	border-width: 1px;
	border-style: solid;
	border-color: #F27935;
	background-color: white;
}

img.small_preview_thumb
{
	max-width: 80px;
	max-height: 80px;
	text-align: center;
	border: 1px solid #AAAAAA;
	background-color: white;
}

div.preview_buttons_top
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 10px;
}

div.preview_buttons_top *:not(:last-child)
{
	margin-right: 10px;
}

div.preview_buttons_right
{
	width: 30%;
	min-width: 180px;
}

div.preview_buttons_right *
{
	width: 100%;
	margin-bottom: 10px;
}

img.edit_preview_loader
{
	width: 100px;
	height: 100px;
	position: absolute;
	top: 10px;
	left: 10px;
	opacity: 0.4;
}

img.edit_preview_loader:not(.spinning):hover
{
	cursor: pointer;
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	transition: all 0.3s linear 0s;
}

img.edit_preview_loader.spinning
{
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}

@-webkit-keyframes spin
{
	100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin
{
	100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); }
}

div.preview_pages
{
	position: absolute;
	top: 0px;
	right: 0px;
	background-color: #B3C2D7;
	opacity: 0.4;
	line-height: 1;
}

div.job_preview_container:hover  div.preview_pages, div.details_preview:hover  div.preview_pages, div.job_preview_container:hover img.edit_preview_loader
{
	opacity: 1;
}


div.preview_pages div
{
	display: inline-block;
	color: #FFFFFF;
	vertical-align: middle;
}

label
{
	display: block;
	margin-bottom: 1px;
	margin-top: 4px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

label:hover
{
	overflow: visible;
	z-index: 10;
}

div.DHTMLSuite_validationImage
{
	display: inline-block;
}

div.validation-advice
{
	color: red;
}

div.ib_container
{
	position: fixed;
	z-index: 20;
	width: 100%;
	margin: 0px;
	left: 0px;
	top: 0px;
	bottom: 0px;
	background-color: white;
	overflow: hidden;
}

div.ipim_container
{
	position: fixed;
	z-index: 20;
	width: 100%;
	margin: 0px;
	left: 0px;
	top: 0px;
	bottom: 0px;
	background-color: white;
	overflow: hidden;
}


/************************ JOB STEPS **********************/
div.job_steps
{
	position: absolute;
	right: 8px;
	top: 8px;
}

div.job_step
{
	width: 50px;
	display: inline-block;
	opacity: 0.4;
}

div.job_step div
{
	background-color: #A7ABBD;
	font-size: 15px;
	font-weight: bold;
	width: 36px;
	height: 36px;
	padding-top: 8px;
	text-align: center;
	margin-left: 7px;
	position: relative;
	color: #FFFFFF;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	border-radius: 18px;
}

div.job_step div:after
{
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	bottom: -10px;
	left: 8px;

	border-top: 15px solid #A7ABBD;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	z-index: 10;
}

div.job_step.active
{
	opacity: 1;
	width: 250px;
}

div.job_step.active div
{
	width: 236px;
}

div.job_step.active div span
{
	color: #FFFFFF;
}

div.job_step.active div span:last-child
{

	font-weight: normal;
	padding-left: 5px;
}

div.job_step.active div:after
{
	left: 108px;
}

div.job_step p
{
	margin-top: 15px;
	margin-bottom: 0px;
	text-align: center;
}




/************************ DETAILS **********************/
div.details_container
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: flex-start;
	-ms-align-items: flex-start;
	align-items: flex-start;
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto;
}

div.details_left
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-right: 5px;
}

div.details_preview
{
	-webkit-flex: 1.5;
	-ms-flex: 1.5;
	flex: 1.5;
	margin-left: 5px;
	margin-right: 5px;
	position: relative;
	border-width: 1px;
	border-style: solid;
	border-color: #F27935;

	box-shadow: -3px 3px 10px 0 rgba(0,0,0,.5);
	transition: all .2s;
	background-color: #fff;
}

div.details_right
{
	-webkit-flex: 0.6;
	-ms-flex: 0.6;
	flex: 0.6;
	margin-left: 5px;
}

div.details_preview > img
{
	width: 100%;
	display: block;
}

div.details_button a
{
	width: 100%;
	height: 40px;
	line-height: 40px;
	position: relative;
	margin-bottom: 5px;
	text-align: left;
	padding-left: 10px;
}

div.details_button a span
{
	color: inherit;
	font-size: inherit;
}

div.details_button a span.icon
{
	position: absolute;
	right: 10px;
	line-height: 40px;
}

div.details_option
{
	margin-bottom: 5px;
	position: relative;
	padding: 0px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

div.flash_preview
{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	right: 0px;
	z-index: 100;
}

span.overflow, div.error, span.error
{
	color: red;
}


/************************ ARCHIVE **********************/
div.archive_container
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-items: flex-start;
	-ms-align-items: flex-start;
	align-content: flex-start;
}

div.archive_jobs_container
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-left: 5px;
}

div.archive_filters
{
	-webkit-flex: 0.3;
	-ms-flex: 0.3;
	flex: 0.3;
	margin-right: 20px;
	max-width: 250px;
}

div.archive_jobs
{
	margin: -3px;
}

div.archive_job
{
	height: 300px;
	min-width: 500px;
	max-width: 750px;
	background-color: #FFFFFF;
	margin: 3px;
	float: left;
	position: relative;

	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

div.archive_job div.preview
{
	float: right;
	position: relative;
	margin-left: 5px;
	border-width: 1px;
	border-style: solid;
	border-color: #F27935;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

div.archive_job div.preview img
{
	max-width: 300px;
	max-height: 238px;
	display: block;
}

div.archive_job div.text
{
	position: absolute;
	top: 45px;
	left: 15px;
	right: 15px;
	bottom: 15px;
	overflow: hidden;
}

div.archive_job p
{
	margin-top: 0px;
	margin-bottom: 10px;
}

input.archive_check
{
	position: absolute;
	right: 15px;
	top: 15px;
}

ul.archive_options
{
	list-style-type: none;
	position: absolute;
	left: 15px;
	bottom: 15px;
	margin: 0px;
	padding: 0px;
	line-height: 1;
}

ul.archive_options li
{
	padding: 0px;
	width: 105px;
	margin-bottom: 5px;
	cursor: pointer;
	position: relative;
	height: 26px;
}

ul.archive_options li:last-child
{
	margin-bottom: 0px;
}

ul.archive_options li a
{
	width: 100%;
}

legend.foldable:hover
{
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.5);
	color: white;
}
div.archive_filter
{
	background-color: #FFFFFF;
	position: relative;
	border-radius: 2px 2px 2px 2px;
	margin-bottom: 10px;
	padding-bottom: 10px;
}

div.block_header
{
	height: 20px;
	font-weight: bold;
	background-color: #EAEDF1;
	padding: 8px 10px 6px 10px;
	position: relative;
}

div.block_header.foldable
{
	padding-left: 30px;
}

div.block_header.foldable:not(.open)
{
	margin-bottom: -10px;
}

div.block_header.foldable:hover
{
	cursor: pointer;
	background-color: rgba(0, 0, 0, 0.5);
	color: white;
}

div.block_header.foldable:before
{
	content: '\e651';
	font-family: 'icomoon';
	font-size: 24px;
	margin-top: -7px;
	left: 10px;
	position: absolute;
	font-weight: normal;
}

div.block_header.foldable.open:before
{
	content: '\e653';
}

div.block div.block_header
{
	margin: -10px -10px 10px -10px;
}

div.archive_filter p
{
	margin: 8px 10px 0px 10px;
}

div.archive_filter p a
{
	display: inline-block;
	width: 100%;
}

div.archive_filter p a.button2
{
	width: 26px;
	position: absolute;
	cursor: pointer;
	height: 100%;
	right: 0px;
	font-size: 10px;
}

div.archive_filter p a.selected
{
	background: url("../img/arrow_forward.png") no-repeat scroll left center rgba(0, 0, 0, 0);
	color: #000000;
	padding-left: 12px;
}

div.archive_jobs_header
{
	margin-bottom: 10px;
}


/************************ JOB SAVE **********************/
div.job_progress
{
	margin-left: -5px;
	margin-right: -5px;
	height: 75px;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

div.job_progress div
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	background-color: #FFFFFF;
	color: #606060;
	padding: 8px;
	font-weight: bold;
	margin-left: 5px;
	margin-right: 5px;
}

div.job_progress div.active
{
	animation: active 2s linear 0s infinite;
	-webkit-animation: active 2s linear 0s infinite;
	color: #FFFFFF;
	background-color: #F27935;
}

@keyframes active
{
	50% {background-color: #CCCCCC;}
}

@-webkit-keyframes active
{
	50% {background-color: #CCCCCC;}
}

div.job_progress div.done
{
	background-color: #F27935;
	color: #FFFFFF;
}


/************************ MAINTENANCE **********************/
div.maintenance_container
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-align-content: flex-start;
	-ms-align-content: flex-start;
	align-content: flex-start;
	margin-left: -5px;
	margin-right: -5px;
}

div.maintenance_menu
{
	-webkit-flex: 0.3;
	-ms-flex: 0.3;
	flex: 0.3;
	margin-left: 5px;
	margin-right: 5px;
}

div.maintenance_option
{
	height: 95px;
	background-color: #FFFFFF;
	padding: 8px;
	position: relative;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	margin-bottom: 10px;
}

div.maintenance_option.active
{
	animation: active2 2s linear 0s infinite;
	-webkit-animation: active2 2s linear 0s infinite;
	color: #FFFFFF;
}

@keyframes active2
{
	0% {background: #FFFFFF;}
	50% {background: #FFCCAA;}
	100% {background: #FFFFFF;}
}

@-webkit-keyframes active2
{
	0% {background: #FFFFFF;}
	50% {background: #FFCCAA;}
	100% {background: #FFFFFF;}
}

div.maintenance_option img
{
	position: absolute;
	left: 10px;
	top: 10px;
}

div.maintenance_option  h1
{
	position: absolute;
	height: 40px;
	right: 10px;
	left: 10px;
	margin-top: 0px;
	margin-bottom: 0px;
}

div.maintenance_option p span
{
	display: inline-block;
	vertical-align: middle;
	line-height: normal;
}

div.maintenance_option div
{
	position: relative;
	height: 100%;
}

div.maintenance_option a
{
	position: absolute;
	bottom: 0px;
	width: 100%;
}

div.maintenance_contents
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-left: 5px;
	margin-right: 5px;
}

div.maintenance_customer
{
	position: relative;
}

div.maintenance_customer div.maintenance_customer
{
	margin-bottom: 0px;
	padding-bottom: 0px;
	margin-left: 22px;
}

div.maintenance_customer:before
{
	content: "";
	position: absolute;
	top: 0px;
	width: 0px;
	height: 100%;
	border-left: 1px dotted #4E5A6C;
	z-index: 2;
}

div.maintenance_customer:after
{
	content: "";
	position: absolute;
	top: 14px;
	width: 16px;
	border-bottom: 1px dotted #4E5A6C;
	z-index: 2;
}

div.maintenance_customer:last-child:before
{
	content: "";
	position: absolute;
	top: 0px;
	width: 0px;
	height: 14px;
	border-left: 1px dotted #4E5A6C;
}

div.maintenance_customer_header
{
	text-decoration: none;
	margin: 0px;
	line-height: 28px;
	margin-bottom: 0px;
	padding-left: 18px;
	position: relative;
}

div.maintenance_customer_header:hover
{
	text-decoration: underline;
}

div.maintenance_customer_header.selected
{
	font-weight: bold;
}

div.maintenance_customer_header a
{
	text-decoration: none;
	width: 100%;
	display: block;
	line-height: 28px;
}

div.maintenance_customer_header > span
{
	position: absolute;
	left: -9px;
	top: 4px;
	cursor: pointer;
	font-size: 20px;
	background-color: #FFFFFF;
	z-index: 10;
}

tr.rule
{
	cursor: pointer;
}

tr.rule span.check
{
	display: none;
}

tr.rule_enabled td, tr.rule_enabled th
{
	background-color: rgba(0, 255, 0, 0.3) !important;
}

tr.rule_partially_enabled th
{
	background: repeating-linear-gradient(45deg, rgba(0, 255, 0, 0.2), rgba(0, 255, 0, 0.2) 5px, rgba(0,0,0,0) 5px, rgba(0,0,0,0) 10px) !important;
}

tr.rule_enabled  span.check
{
	display: block;
}

tr.rule_module.rule_enabled, tr.rule_module.rule_partially_enabled
{
	background-color: #444444;
}

tr.rule_category
{
	background-color: #DDDDDD;
}

table.default thead tr.rule_category th
{
	border: 1px solid #dedede;
	border-top: 0px;
	padding: 5px;
	background-color: white;
	color: inherit;
}

table.default tr.rule td
{
	border-top: 0px solid black;
	border-bottom: 0px solid black;
}

table.default tr.rule:last-child td
{
	border-bottom: 1px solid #dedede;
}

span.fold-button:hover
{
	background-color: rgba(0, 0, 0, 0.3);
	padding: 5px;
	margin: -5px;
}

div.flex_row
{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;

}

div.flex_row > *
{
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-right: 10px;
	margin-bottom: 5px;
	min-width:0;
}

div.flex_row > div.flex_row
{
	margin-bottom: 0px;
}

div.flex_row > label
{
	min-width: 100px;
	-webkit-flex: none;
	-ms-flex: none;
	flex: none;
	width: 25%;
	text-align: right;
}

div.flex_row > *:last-child
{
	margin-right: 0px;
}

div.flex_row:last-child > *
{
	margin-bottom: 0px;
}

div.flex_row > p
{
	margin-top: 4px;
}

div.block
{
	background-color: #FFFFFF;
	padding: 10px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	position: relative;
}

span.cart_indicator
{
	display: block;
	position: absolute;
	background-color: #FF0000;
	border-radius: 10px;
	color: #FFFFFF !important;
	font-size: 11px;
	height: 15px;
	width: 15px;
	padding-top: 2px;
	padding-right: 1px;
	padding-bottom: 0px;
	right: 20px;
	top: 12px;
	text-align: center;
	z-index: 2;
}

img.cart_preview
{
	max-width: 120px;
	max-height: 120px;
}

/* Diff */
.diff-addedline
{
	background-color:#DDFFDD;
}
.diff-addedline ins
{
	background-color:#99FF99;
	text-decoration:none;
}
.diff-deletedline
{
	background-color:#FFDDDD;
}
.diff-deletedline del
{
	background-color:#FF9999;
	text-decoration:none;
}

/* Stuff to show previous, current, and next status
----------------------------------------------------------------------------------------------------*/
div.arrow
{
	width: 50px;
	vertical-align: middle;
}

div.arrow_box
{
	position: relative;
	background: #41AD49;
	border: 4px solid #308136;
	padding: 4px;
	height: 23px;
}

div.arrow_box:after, div.arrow_box:before
{
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

div.arrow_box:after
{
	border-color: rgba(48, 129, 54, 0);
	border-left-color: #41AD49;
	border-width: 15px;
	margin-top: -15px;
}

div.arrow_box:before
{
	border-color: rgba(48, 129, 54, 0);
	border-left-color: #308136;
	border-width: 21px;
	margin-top: -21px;
}

div.pointright
{
	width: 0;
	height: 0;
	border: 25px solid transparent;
	border-bottom-color: red;
	border-left-color: red;
	position: relative;
	top: -25px;
}

div.pointright:after
{
	content: '';
	position: absolute;
	left: -25px;
	top: 25px;
	width: 0;
	height: 0;
	border: 25px solid transparent;
	border-top-color: red;
	border-left-color: red;
}

div.curvedarrow
{
	position: relative;
	width: 0;
	height: 0;
	border-top: 18px solid transparent;
	border-right: 18px solid green;
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-ms-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
}

div.curvedarrow:after
{
	content: "";
	position: absolute;
	border: 0 solid transparent;
	border-top: 6px solid green;
	border-radius: 20px 0 0 0;
	top: -24px;
	left: -18px;
	width: 24px;
	height: 24px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
}

div.curvedarrow-back
{
	position: relative;
	width: 0;
	height: 0;
	border-bottom: 18px solid transparent;
	border-left: 18px solid red;
	-webkit-transform: rotate(-20deg);
	-moz-transform: rotate(-20deg);
	-ms-transform: rotate(-20deg);
	-o-transform: rotate(-20deg);
}

div.curvedarrow-back:after
{
	content: "";
	position: absolute;
	border: 0 solid transparent;
	border-top: 6px solid red;
	border-radius: 0 20px 0 0;
	top: 8px;
	left: -22px;
	width: 24px;
	height: 24px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
}

/* Guideline shizzle
----------------------------------------------------------------------------------------------------*/
div.guideline
{
	width: 75%;
}

h3.guidelines
{
	font-size: 18px;
}

h4.guidelines
{
	font-size: 14px;
}

br.guidelineclear
{
	clear: both;
	margin-bottom: 10px;
}

img.guidelineimgleft
{
	max-width: 100%;
}

img.guidelineimgright
{
	max-width: 100%;
}

div.upload_select, div.upload_select_hover /* Drop div */
{
	cursor:pointer;
	border: 2px solid #F27935;
	height:250px;
	width:250px;
	overflow-y:none;
	font-size:8px;
	padding: 3px;
}
div.upload_select_hover  /* Drop div */
{
	background-color: #F27935;
}
#upload_select_bck
{
	opacity: 0.3;
	font-size: 220px;
	position:absolute;
}
progress
{
	width:210px;
	margin-left: 0px;    /* border + padding of upload area */
}
textarea.guidelinelineedit
{
	height: 230px;
}

a.retail_campaign_overview_button
{
	width: 80px;
	height: 80px !important;
	line-height: 40px !important;
	border-radius: 0px;
	background-color: red!important;
	padding: 18px;
}

a.retail_campaign_overview_button span
{
	font-size: 28px !important;
	vertical-align: -8px;
}

a.retail_button, input.retail_button
{
	height: 40px !important;
	line-height: 40px !important;
	border-radius: 3px;
    padding-left: 15px;
    padding-right: 15px;
}

a.retail_button span, input.retail_button span
{
    margin-right: 5px;
	vertical-align: inherit;
}

a.retail_button.red
{
	background-color: #e62532;
}

a.retail_button.green
{
	background-color: #5da845;
}

a.retail_button.active
{
	background-color: #434B4F;
}

div.retail_job
{
	height: 340px;
	width: 230px;
	float: left;
	margin-top: 3px;
	margin-left: 3px;
	background-color: #9CB2C0;
	padding: 20px;
	position: relative;
}

div.retail_item
{
    height: 380px;
	width: 270px;
	float: left;
	margin-top: 3px;
	margin-left: 3px;
	background-color: #9CB2C0;
	padding: 00px;
	position: relative;
}

div.retail_job_appliance_name
{
	height: 30px;
	background-color: #3683b3;
	color: white;
	font-size: 18px;
    padding: 10px;
    padding-top: 20px;
}

div.preset_item
{
    cursor: move;
}

p.pos_preset_item_description
{
    font-style: italic;
    padding-left: 5px;
}

p.pos_item_type
{
    padding-left: 5px;
}

p.pos_item_upload_assigned_to
{
    padding-left: 5px;
}

div.retail_job.red
{
	background-color: #e62532;
}

p.retail_job_name
{
	color: white;
	font-size: 18px;
	margin: 0px;
	font-family: helvetica-neue-light;
	text-overflow: ellipsis;
    white-space: nowrap;
	overflow: hidden;
}

p.retail_job_size
{
	color: white;
	margin: 0px;
	margin-top: -5px;
}

p.retail_job_status
{
	color: white;
	margin: 0px;
	margin-top: -5px;
}

p.retail_job_corrections
{
	margin: 0px;
	text-overflow: ellipsis;
    white-space: nowrap;
	overflow: hidden;
	/*color: #550000;*/
}

div.retail_job_preview
{
	text-align: center;
	height: 220px;
}

div.retail_item_upload
{
    text-align: center;
	height: 270px;
    padding-top: 10px;
    cursor: pointer;
    font-size: 100pt;
    color: #3683b3;
}

p.pdf_upload_instruction
{
    color: #FFFFFF;
    margin-left: 10px;
    text-align: left;
}

div.pdf_upload_progress
{
    margin-left: 10px;
    margin-right: 10px;
}

div.pdf_upload_progress > span
{
    color: #FFFFFF;
    float: right;
}

div.pdf_upload_progress_filename
{
    margin-left: 10px;
    width: 220px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    float: left;
    color: #FFFFFF;
    text-align: left;
}

div.retail_item_upload.hover, div.retail_item_upload:hover
{
    background-color: #F7AB23;
}

div.retail_item_preview
{
	text-align: center;
	height: 220px;
    padding-top: 10px;
    font-size: 100pt;
    color: #3683b3;
}

div.retail_job_preview.white
{
	background-color: #FFFFFF;
}

div.retail_job_preview img, div.retail_item_preview img
{
	max-width: 230px; max-height: 220px;
}

div.retail_job_select
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 60px;
	background-color: #3683b3;
	color: white;
	line-height: 60px;
	font-size: 18px;
	text-align: center;
	cursor: pointer;
}

div.retail_job_select:after
{
    border-left: 20px solid rgba(0, 0, 0, 0);
    border-right: 20px solid rgba(0, 0, 0, 0);
    border-bottom: 15px solid #3683b3;
    top: -15px;
    content: "";
    height: 0;
    left: 50%;
    margin-left: -20px;
    position: absolute;
    width: 0;
}

div.retail_job_select span
{
	font-size: 30px;
	vertical-align: -6px;
}

div.retail_job_approved
{
	background-color: #5da845;
}

div.retail_job_select.retail_job_approved:after
{
	border-bottom: 15px solid #5da845;
}

div.retail_item_icons
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 40px;
	background-color: #3683b3;
	color: white;
	text-align: center;
}

div.retail_item_icons:after
{
    border-left: 20px solid rgba(0, 0, 0, 0);
    border-right: 20px solid rgba(0, 0, 0, 0);
    border-bottom: 15px solid #3683b3;
    top: -15px;
    content: "";
    height: 0;
    left: 50%;
    margin-left: -20px;
    position: absolute;
    width: 0;
}

div.retail_item_icons.approved:after
{
    border-bottom: 15px solid #5da845;
}

div.retail_item_icons.approved
{
    background-color: #5da845;
}

div.retail_item_approved
{
	background-color: #5da845;
}

div.retail_item_icons div.pos_item_button
{
    height: 40px;
    width: 40px;
    top: 0px;
    background-color: transparent;
    float: left;
    position: absolute;
    cursor: pointer;
    color: #FFFFFF;
}

div.retail_item_icons div.pos_item_button.approve
{
    right: 0px;
}

div.retail_item_icons.approved div.pos_item_button.approve
{
    background-color: #5da845;
}

div.retail_item_icons div.pos_item_button:hover
{
    background-color: #F7AB23;
}

div.retail_item_icons.approved div.pos_item_button.approve:hover
{
    background-color: #3683b3;
}

div.retail_item_icons div.pos_item_button.approve span:before
{
    content: "\e647";
}

div.retail_item_icons.approved div.pos_item_button.approve span:before
{
    content: "\e646";
}

div.retail_item_icons div.pos_item_button.approve:hover
{
    background-color: #5da845;
}

div.retail_item_icons div.pos_item_button.approve:hover span:before
{
    content: "\e646";
}

div.retail_item_icons.approved div.pos_item_button.approve:hover span:before
{
    content: "\e647";
}

div.retail_item_icons div.pos_item_button span:first-child
{
    font-size: 12pt;
    line-height: 30pt;
}

div.retail_item_icons div.pos_item_button.approve.disabled
{
    background-color: #89bcdc;
    cursor: default;
}

div.retail_item_icons.approved div.pos_item_button.approve.disabled
{
    background-color: #9ecb8f;
}

div.retail_item_icons div.pos_item_button.approve.disabled:hover span:before
{
    content: "\e647";
}

div.retail_item_icons.approved div.pos_item_button.approve.disabled:hover span:before
{
    content: "\e646";
}

a.pos_item_list_button
{
    width: 30px;
    height: 30px;
    padding-top: 2px;
    text-align: center;
}

a.pos_item_list_button span
{
    font-size: 20pt;
    color: #FFFFFF;
}

td.pos_items_list_approval
{
    color: #000000;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
}

/* */
a.pos_campaign_approval.approved
{
    color: #FFFFFF;
    background-color: #5da845;
}

a.pos_campaign_approval:hover
{
    background-color: #5da845!important;
    color: #FFFFFF;
}

a.pos_campaign_approval span:before
{
    content: "\e647";
}

a.pos_campaign_approval:hover span:before
{
    content: "\e646";
}

a.pos_campaign_approval.approved span:before
{
    content: "\e646";
}

a.pos_campaign_approval.approved:hover
{
    background-color: #e62532!important;
}

a.pos_campaign_approval.approved:hover span:before
{
    content: "\e647";
}
/* */





td.pos_items_list_approval.approved
{
    color: #FFFFFF;
    background-color: #5da845;
}

td.pos_items_list_approval:hover
{
    background-color: #5da845;
    color: #FFFFFF;
}

td.pos_items_list_approval.disabled
{
    background-color: #89bcdc;
    color: initial;
    cursor: default;
}

td.pos_items_list_approval.disabled:hover
{
    background-color: #89bcdc;
    color: initial;
    cursor: default;
}

td.pos_items_list_approval.approved.disabled
{
    background-color: #9ecb8f;
    color: #FFFFFF;
    cursor: default;
}

td.pos_items_list_approval.approved.disabled:hover
{
    background-color: #9ecb8f;
    color: #FFFFFF;
    cursor: default;
}

td.pos_items_list_approval span:before
{
    content: "\e647";
}

td.pos_items_list_approval:hover span:before
{
    content: "\e646";
}

td.pos_items_list_approval.approved span:before
{
    content: "\e646";
}

td.pos_items_list_approval.approved:hover
{
    background-color: #e62532;
}

td.pos_items_list_approval.approved:hover span:before
{
    content: "\e647";
}

td.pos_items_list_approval.disabled:hover span:before
{
    content: "\e647";
}

td.pos_items_list_approval.approved.disabled:hover span:before
{
    content: "\e646";
}

td.pos_items_list_approval span:first-child
{
    font-size: 18pt;
    line-height: 30pt;
}

td.items_list_preview
{
    text-align: center;
    vertical-align: middle;
}

td.items_list_upload
{
    cursor: pointer;
}

td.items_list_upload:hover
{
    background-color: #F7AB23;
    color: #FFFFFF;
}

td.items_list_upload span
{
    font-size: 30pt;
}

td.items_list_preview img.preview_thumb
{
    background-color: #FFFFFF;
    max-width: 70px;
    max-height: 70px;
}

span.remarks_indicator
{
    display: block;
	background-color: #FF0000;
	border-radius: 10px;
	color: #FFFFFF !important;
	font-size: 11px;
	height: 15px;
	width: 15px;
	padding-top: 2px;
	padding-right: 1px;
	padding-bottom: 0px;
	right: 3px;
	top: 3px;
	text-align: center;
	z-index: 2;
    position: absolute;
}

div.retail_item_icons a.uploadWide
{
    width: 240px;
    margin: 10px;
    text-align: left;
    padding-left: 10px;
    font-size: 15pt;
    background-color: #519bcb;
    display: inline-block;
    height: 40px;
    color: white;
    text-decoration: none;
}

div.retail_item_icons a.uploadWide span
{
    color: #3680FF;
}

div.retail_job_select span.icon-checkmark
{
	display: none;
}

div.retail_job_select span.icon-minus2
{
	display: inline;
}

div.retail_job_select.retail_job_approved span.icon-checkmark
{
	display: inline;
}

div.retail_job_select.retail_job_approved span.icon-minus2
{
	display: none;
}

div.retail_new_job_popup
{
	position: absolute;
	padding: 20px;
	/*border: 1px solid gray;*/
	right: 10px;
	margin-top: 20px;
	background-color: white;
	z-index: 10;
	
}

div.retail_edit_buttons
{
	background-color: #9cb2c0;
	padding: 15px;
	width: 18%;
	margin-left: 20px;
	position: relative;
}

div.retail_edit_buttons:after
{
    border-top: 20px solid rgba(0, 0, 0, 0);
    border-bottom: 20px solid rgba(0, 0, 0, 0);
    border-right: 15px solid #9cb2c0;
    top: 50%;
    content: "";
    height: 0;
    left: -15px;
    margin-top: -20px;
    position: absolute;
    width: 0;
	z-index: 10;
}

div.job_fields_container
{
	background-color: #9cb2c0;
	padding: 15px;
    margin-right: 20px !important;
    min-width: 600px !important;
    width: calc(40% - 20px) !important;
	position: relative;
}

div.job_fields_container:after
{
    border-top: 20px solid rgba(0, 0, 0, 0);
    border-bottom: 20px solid rgba(0, 0, 0, 0);
    border-left: 15px solid #9cb2c0;
    top: 50%;
    content: "";
    height: 0;
    right: -15px;
    margin-top: -20px;
    position: absolute;
    width: 0;
}

div.job_fields_container.red
{
	background-color: #e62532;
}

a.retail_edit_button, input.retail_edit_button, button.dt-button.retailbutton
{
	height: 40px !important;
	line-height: 40px !important;
	margin-bottom: 8px;
	text-align: left !important;
	text-transform: none !important;
	font-size: 13px !important;
}

button.dt-button.retailbutton, button.dt-button.retailbuttonright
{
	background-image: none!important;
	border-radius: unset;
	background-color: #434B4F;
	text-align: center;
    vertical-align: middle;
	border: 0!important;
	box-shadow: unset!important;
	line-height: unset!important;
}

button.dt-button.retailbuttonright
{
	float: right;
}

button.dt-button.retailbutton:hover
{
	background-color: #F7AB23!important;
}

button.dt-button.retailbutton span
{
	color: #FFFFFF;
	text-transform: uppercase;
}

button.dt-button.retailbutton.disabled, button.dt-button.retailbutton.disabled:hover
{
	background-color: #D2D2D2!important;
}

button.dt-button.retailbutton.disabled span
{
	color: #FFFFFF;
}

button.dt-button.retailbutton.active
{
	background-color: #F7AB23!important;
}

a.retail_edit_button span, input.retail_edit_button span
{
	font-size: 24px !important;
	vertical-align: -5px;
	padding: 5px 0px 5px 10px;
	position: relative;
}

a.retail_edit_button span.retail_icon_end, input.retail_edit_button span.retail_icon_end
{
	padding: 5px 10px 5px 10px;
	border-right: 1px solid rgba(255, 255, 255, 0.2);
	margin-right: 10px;
}

a.retail_edit_button span.retail_icon_end:after, input.retail_edit_button span.retail_icon_end:after
{
	content: "";
	height: 40px;
	position: absolute;
	right: -2px;
	border-right: 1px solid rgba(0, 0, 0, 0.2);
	z-index: 10px;
}

#publication_select
{
	margin-left: 10px;
}

/*div.block
{
	padding: 15px !important;
}*/

div.retail_week_buttons
{
	position: absolute;
	width: 300px;
	padding: 15px;
	right: 0px;
	bottom: 75px;
}

div.retail_publication_select_container
{
	background-color: rgba(0, 0, 0, 0.6);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}

div.retail_publication_select
{
	/*position: absolute;
	background-color: white;
	padding: 10px;
	
	border-radius: 3px;*/
	
	width: 75%;
	height: 75%;
	margin-top: 100px;
	margin-left: auto;
	margin-right: auto;
	overflow-y: auto;
	background-color: white !important;
}

div.retail_publication_select_header
{
	
}

div.retail_publication_preview
{
	background-color: #FFFFFF;
    border-color: gray;
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    float: left;
    height: 225px;
    margin: 3px;
    max-width: 204px;
    min-width: 204px;
    position: relative;
	text-align: center;
	cursor: pointer;
}

div.retail_publication_preview:hover
{
	opacity: 0.75;
	border-color: black;
}

div.retail_publication_preview img
{
    max-height: 200px;
    max-width: 200px;
}

div.retail_publication_preview p
{
    margin: 0px;
}

table.retail
{
    width: 100%;
}

table.retail.default tr:nth-child(odd):not(.selected)
{
	background-color: #cad6dd;
}

table.retail.default tr:nth-child(even):not(.selected)
{
	background-color: #f5f5f5;
}

table.fixed
{
    white-space: nowrap;
    table-layout: fixed;
}

table.fixed tr td
{
    overflow: hidden;
    text-overflow: ellipsis;
}

/* datatables search text field: */
div.dataTables_filter {
   float: left !important;
   margin: 0px;
}

div.dataTables_filter input {
   height: 30px;
	width: 200px;
}

div.dataTables_length {
	float: right!important;
}

button.dt-button.retailbutton {
	padding: 3px;
	height: 30px!important;
	margin-top: 5px;
    padding-left: 5px;
    padding-right: 5px
}

div.datatablestemplatesize {
	float: left;
}

div.datatablestemplatesize label select {
	height: 30px;
}

div.pos_filter_categories {
    margin-top: 10px;
    background-color: white;
}

div.pos_filter_category {
    height: 600px;
    width: 400px;
    float: left;
    margin-top: 3px;
    margin-left: 3px;
    background-color: #FFFFFF;
    padding: 0px;
    position: relative;
    cursor: move;
}

div.pos_filter_category_header {
    height: 20px;
	background-color: #F7AB23;
	color: white;
	font-size: 18px;
    padding: 10px;
    padding-top: 10px;
    padding-right: 5px;
}

div.pos_filter_category_header span.title {
    color: #FFFFFF;
    font-size: 16px;
}

div.pos_filter_category_header a {
    float: right;
    text-decoration: none;
    margin-left: 20px;
    font-size: 16px;
    color: #FFFFFF;
}

div.pos_filter_category_header a:hover {
    color: #434b4f;
    
}

div.pos_filter_item {
    padding: 5px;
    font-size: 16px;
    cursor: move;
    border-bottom: 1px solid #dedede;
    height: 24px;
}

div.pos_filter_item a span {
    float:  left;
}

div.add_item {
    cursor: pointer;
}

div.add_item span.icon {
    float: right;
}

div.add_item:hover {
    background-color: #F7AB23;
}

div.pos_filter_item a, table.retail tbody tr td a {
    float: right;
    text-decoration: none;
    font-size: 16px;
    margin-left: 20px;
    color: #434b4f;
}

div.pos_filter_item a:hover, table.retail tbody tr td a:hover {
    color: #F7AB23;
}

div.filter_items_category div:nth-child(even){
    background-color: #FFFFFF;
}

div.filter_items_category div:nth-child(odd){
    background-color: #FFFFFF;
}

div.action_buttons
{
    height: 55px;
    margin-top: 20px;
}

div.popup_container
{
	background-color: rgba(0, 0, 0, 0.6);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}

div.popup
{
    width: 75%;
	max-height: 75%;
	margin-top: 100px;
	margin-left: auto;
	margin-right: auto;
	overflow-y: auto;
	background-color: white !important;
}

td.right {
    text-align: right;
}

td.pos_shop_places {
    vertical-align: middle;
    padding: 0px!important;
}

td.pos_shop_places > span {
    padding-right: 5px
}

div.pos_pdf_paginator {
    position: absolute;
    width: 280px;
    bottom: 90px;
    left: calc(50% - 140px);
}

div.pos_pdf_paginator > div.button_previous_page {
    position: absolute;
    left: 70px;
    width: 30px;
    height: 30px;
    background-color: rgba(0, 0, 0, 0.5);
    font-size: 16pt;
    line-height: 30px;
    border-radius: 8px 0px 0px 8px;
    color: white;
    cursor: pointer;
    text-align: center;
}

div.pos_pdf_paginator > div.button_previous_page:hover, div.pos_pdf_paginator > div.button_next_page:hover
{
    background-color: #f7ab23;
}

div.pos_pdf_paginator > div.pages {
    position: absolute;
    left: 101px;
    right: 101px;
    height: 30px;
    background-color: rgba(0, 0, 0, 0.5);
    font-size: 10pt;
    line-height: 30px;
    color: white;
    text-align: center;
}

div.pos_pdf_paginator > div.button_next_page {
    position: absolute;
    right: 70px;
    width: 30px;
    height: 30px;
    background-color: rgba(0, 0, 0, 0.5);
    font-size: 16pt;
    line-height: 30px;
    border-radius: 0px 8px 8px 0px;
    color: white;
    cursor: pointer;
    text-align: center;
}

input.places.error {
    border: 3px solid red;
}