/* Minification failed. Returning unminified contents.
(3380,7): run-time error CSS1062: Expected semicolon or closing curly-brace, found '!important'
 */
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Content
==================================================
	#Reset & Basics
	#Basic Styles
	#Site Styles
	#Typography
	#Links
	#Lists
	#Images
	#Forms
	#Misc */


/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block; }
	body {
		line-height: 1; }
	ol, ul {
		list-style: none; }
	blockquote, q {
		quotes: none; }
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
	table {
		border-collapse: collapse;
		border-spacing: 0;
        width: 100%;
	}

	code {
		padding: 3px 6px;
		font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
		background: #fcfcfc;
		border: 1px solid #e4e4e4;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		color: #3f8faf;
	}

/* #Basic Styles
================================================== */
	body {
		background: #fff;
		font: 14px/21px Helvetica,Arial,sans-serif;
		color: #606060;
		-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
		-webkit-text-size-adjust: 100%;
		overflow-x: hidden;
 }


/* Basic Alginment
================================================== */
.columns img, .column img{max-width: 100%; height: auto;}
.content img{border: 1px solid #dfdfdf; margin-bottom: 15px;}

.item-img img {width: 100%; height: auto;}

.align-left{float: left;}
.align-center{text-align: center;}
.align-right{float: right}

img.align-left{float: left; margin: 0 15px 12px 0;}
img.align-center{text-align: center; clear: both; margin: 15px auto; display: block;}
img.align-right{float: right; margin: 0 0 12px 15px;}

img, object, video {max-width: 100%; height: auto;display:block;}
img {width: auto;max-width: 100%; border: 0;-ms-interpolation-mode: bicubic;}

/* Flexible Embeds */
.embed {
    position: relative;
    padding: 0px;
    padding-bottom: 56.25%; /* 16/9 ratio */
    height: 0;
    overflow: hidden;
}

.embed iframe,
.embed object,
.embed embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.clearfix {content: "."; display: block; height: 0px; clear: both; visibility: hidden;}

.image-left {float: left; margin: 0 15px 8px 0; padding: 3px; border: 1px solid #dedede; }
.image-right {float:right; margin: 0 0 8px 15px; padding: 3px; border: 1px solid #dedede; }

/* #Typography
================================================== */
	h1, h2, h3, h4, h5, h6 {
		color: #444;
		font-family: Helvetica,Arial,sans-serif;
		font-weight: bold;

	}
		
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
	h1 { font-size: 46px; line-height: 50px; }
	h2 { font-size: 35px; line-height: 40px; }
	h3 { font-size: 28px; line-height: 34px; }
	h4 { font-size: 21px; line-height: 30px; }
	h5 { font-size: 17px; line-height: 24px; }
	h6 { font-size: 14px; line-height: 21px; }
	.subheader { color: #777; }

	p { margin: 0 0 15px 0; line-height: 20px;}
	p img { margin: 0; }
	p.lead { font-size: 21px; line-height: 27px; color: #777;  }

	em { font-style: italic; }
	strong { font-weight: bold; color: #333; }
	small { font-size: 80%; }

	hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; }


/* #Links
================================================== */
	a, a:visited { color: #3f8faf; text-decoration: none; outline: 0; -webkit-transition: color 0.1s ease-in-out; -moz-transition: color 0.1s ease-in-out; -o-transition: color 0.1s ease-in-out; -transition: color 0.1s ease-in-out;}
	a:hover
     { color: #888; }
	p a, p a:visited { line-height: inherit; }


/* #Lists
================================================== */
	ul, ol { margin: 0; }
	ul { list-style: disc outside; }
	ol { list-style: decimal; }
	ol, ul, ul.square, ul.circle, ul.disc { margin-left: 30px; }
	ul.square { list-style: square outside; }
	ul.circle { list-style: circle outside; }
	ul.disc { list-style: disc outside; }
	ul ul, ul ol,
	ol ol, ol ul {}
	ul ul li, ul ol li,
	ol ol li, ol ul li {}
	li { line-height: 18px; }
	ul.large li { line-height: 21px; }
	li p { line-height: 21px; }

/* #Images
================================================== */
	img.scale-with-grid {
		max-width: 100%;
		height: auto; }

/* #Forms
================================================== */
	form {
		margin-bottom: 20px; }
	fieldset {
		margin-bottom: 20px; }
	fieldset input[type="date"],
    fieldset input[type="time"],
    fieldset input[type="datetime"],
    fieldset input[type="number"],
    fieldset input[type="tel"],
    fieldset input[type="email"],
    fieldset input[type="text"],
    fieldset input[type="password"],
    td input,
	textarea,
	select {
		border: 1px solid #d8d8d8;
		padding: 9px;
		outline: none;
		font: 13px Helvetica,Arial,sans-serif;
		color: #888;
		margin: 0;
		max-width: 100%;
		display: block;
		margin-bottom: 20px;
		background: #fff;
		-webkit-box-shadow:  0px 1px 1px 0px rgba(180, 180, 180, 0.1);
        box-shadow:  0px 1px 1px 0px rgba(180, 180, 180, 0.1);
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
		}
	select {
		padding: 0; }
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
		border: 1px solid #c8c8c8;
 		color: #606060; 
		}
	textarea {
		min-height: 60px; }
	label,
	legend {
		display: block;
		font-weight: bold;
		font-size: 12px; 
		font-weight: normal;
		margin-bottom: 5px;}
	select {
		 }
	input[type="checkbox"] {
		display: inline; }
    label span,
    legend span {
        /*font-weight: normal;*/
        font-size: 13px;
        /*color: #444;*/
    }

/* #Misc
================================================== */
	.remove-bottom { margin-bottom: 0 !important; }
	.half-bottom { margin-bottom: 10px !important; }
	.add-bottom { margin-bottom: 20px !important; }



/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

    .container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
    .container .column,
    .container .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
    .row                                        { margin-bottom: 20px; }

    /* Nested Column Classes */
    .column.alpha, .columns.alpha               { margin-left: 0; }
    .column.omega, .columns.omega               { margin-right: 0; }

    /* Base Grid */
    .container .one.column,
    .container .one.columns                     { width: 40px;  }
    .container .two.columns                     { width: 100px; }
    .container .three.columns                   { width: 160px; }
    .container .four.columns                    { width: 220px; }
    .container .five.columns                    { width: 280px; }
    .container .six.columns                     { width: 340px; }
    .container .seven.columns                   { width: 400px; }
    .container .eight.columns                   { width: 460px; }
    .container .nine.columns                    { width: 520px; }
    .container .ten.columns                     { width: 580px; }
    .container .eleven.columns                  { width: 640px; }
    .container .twelve.columns                  { width: 700px; }
    .container .thirteen.columns                { width: 760px; }
    .container .fourteen.columns                { width: 820px; }
    .container .fifteen.columns                 { width: 880px; }
    .container .sixteen.columns                 { width: 940px; }

    .container .one-third.column                { width: 300px; }
    .container .two-thirds.column               { width: 620px; }

    /* Offsets */
    .container .offset-by-one                   { padding-left: 60px;  }
    .container .offset-by-two                   { padding-left: 120px; }
    .container .offset-by-three                 { padding-left: 180px; }
    .container .offset-by-four                  { padding-left: 240px; }
    .container .offset-by-five                  { padding-left: 300px; }
    .container .offset-by-six                   { padding-left: 360px; }
    .container .offset-by-seven                 { padding-left: 420px; }
    .container .offset-by-eight                 { padding-left: 480px; }
    .container .offset-by-nine                  { padding-left: 540px; }
    .container .offset-by-ten                   { padding-left: 600px; }
    .container .offset-by-eleven                { padding-left: 660px; }
    .container .offset-by-twelve                { padding-left: 720px; }
    .container .offset-by-thirteen              { padding-left: 780px; }
    .container .offset-by-fourteen              { padding-left: 840px; }
    .container .offset-by-fifteen               { padding-left: 900px; }



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .container                                  { width: 768px; }
        .container .column,
        .container .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }
        .alpha.omega                                { margin-left: 0; margin-right: 0; }

        .container .one.column,
        .container .one.columns                     { width: 28px; }
        .container .two.columns                     { width: 76px; }
        .container .three.columns                   { width: 124px; }
        .container .four.columns                    { width: 172px; }
        .container .five.columns                    { width: 220px; }
        .container .six.columns                     { width: 268px; }
        .container .seven.columns                   { width: 316px; }
        .container .eight.columns                   { width: 364px; }
        .container .nine.columns                    { width: 412px; }
        .container .ten.columns                     { width: 460px; }
        .container .eleven.columns                  { width: 508px; }
        .container .twelve.columns                  { width: 556px; }
        .container .thirteen.columns                { width: 604px; }
        .container .fourteen.columns                { width: 652px; }
        .container .fifteen.columns                 { width: 700px; }
        .container .sixteen.columns                 { width: 748px; }

        .container .one-third.column                { width: 236px; }
        .container .two-thirds.column               { width: 492px; }

        /* Offsets */
        .container .offset-by-one                   { padding-left: 48px; }
        .container .offset-by-two                   { padding-left: 96px; }
        .container .offset-by-three                 { padding-left: 144px; }
        .container .offset-by-four                  { padding-left: 192px; }
        .container .offset-by-five                  { padding-left: 240px; }
        .container .offset-by-six                   { padding-left: 288px; }
        .container .offset-by-seven                 { padding-left: 336px; }
        .container .offset-by-eight                 { padding-left: 384px; }
        .container .offset-by-nine                  { padding-left: 432px; }
        .container .offset-by-ten                   { padding-left: 480px; }
        .container .offset-by-eleven                { padding-left: 528px; }
        .container .offset-by-twelve                { padding-left: 576px; }
        .container .offset-by-thirteen              { padding-left: 624px; }
        .container .offset-by-fourteen              { padding-left: 672px; }
        .container .offset-by-fifteen               { padding-left: 720px; }
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        /*.container { width: 300px; }*/
        .container { width: 315px; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column  { width: 300px; }

        /* Offsets */
        .container .offset-by-one,
        .container .offset-by-two,
        .container .offset-by-three,
        .container .offset-by-four,
        .container .offset-by-five,
        .container .offset-by-six,
        .container .offset-by-seven,
        .container .offset-by-eight,
        .container .offset-by-nine,
        .container .offset-by-ten,
        .container .offset-by-eleven,
        .container .offset-by-twelve,
        .container .offset-by-thirteen,
        .container .offset-by-fourteen,
        .container .offset-by-fifteen { padding-left: 0; }

    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .container { width: 420px; }
        .container .columns,
        .container .column { margin: 0; }

        .container .one.column,
        .container .one.columns,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column { width: 420px; }
    }

/* #Additional - Large Screens beyond 1280px
==================================================  
���� 
     Note: Design for a width of 1280px */

    @media only screen and (min-width:1280px) {
        .container                                  { width: 1280px; }
        .container .column,
        .container .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }
        .alpha.omega                                { margin-left: 0; margin-right: 0; }
        .container .one.column,
        .container .one.columns                     { width: 60px; }
        .container .two.columns                     { width: 140px; }
        .container .three.columns                   { width: 220px; }
        .container .four.columns                    { width: 300px; }
        .container .five.columns                    { width: 380px; }
        .container .six.columns                     { width: 460px; }
        .container .seven.columns                   { width: 540px; }
        .container .eight.columns                   { width: 620px; }
        .container .nine.columns                    { width: 700px; }
        .container .ten.columns                     { width: 780px; }
        .container .eleven.columns                  { width: 860px; }
        .container .twelve.columns                  { width: 940px; }
        .container .thirteen.columns                { width: 1020px; }
        .container .fourteen.columns                { width: 1100px; }
        .container .fifteen.columns                 { width: 1180px; }
        .container .sixteen.columns                 { width: 1260px; }
        .container .one-third.column                { width: 406px; }
        .container .two-thirds.column               { width: 822px; }
        /* Offsets */
        .container .offset-by-one                   { padding-left: 80px; }
        .container .offset-by-two                   { padding-left: 160px; }
        .container .offset-by-three                 { padding-left: 240px; }
        .container .offset-by-four                  { padding-left: 320px; }
        .container .offset-by-five                  { padding-left: 400px; }
        .container .offset-by-six                   { padding-left: 480px; }
        .container .offset-by-seven                 { padding-left: 560px; }
        .container .offset-by-eight                 { padding-left: 640px; }
        .container .offset-by-nine                  { padding-left: 720px; }
        .container .offset-by-ten                   { padding-left: 800px; }
        .container .offset-by-eleven                { padding-left: 880px; }
        .container .offset-by-twelve                { padding-left: 960px; }
        .container .offset-by-thirteen              { padding-left: 1040px; }
        .container .offset-by-fourteen              { padding-left: 1120px; }
        .container .offset-by-fifteen               { padding-left: 1200px; }
}

/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }

/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/
body {
    margin-bottom: 32px;
}

#MainBody {
    margin-top:10px
}

/* Generic
==========================*/
.float-left {
    float: left;
}

.float-right {
    float: right;
}

.no-wrap {
    white-space: nowrap;
}

/* Headlines
==========================*/
.headline {
	display: block;
	border-bottom: 1px solid #e7e7e7;
	padding: 0 0 10px 0;
	margin: 20px 0 20px 0;
}

.headline span {
	color: #888;
	font-weight: normal;
	font-size: 12px;
	float: right;
}

h5.headline {
	padding: 0 0 8px 0;
	margin: 0px 0 12px 0;
}

.notice {
    background: #fcfcfc;
    border: 1px solid #e4e4e4;
    padding: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.cutout {
    background: #e4e4e4;
    border: 1px solid #c9c9c9;
    padding: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

/* IE Dropdown Fix
==========================*/
.dropdown-fix {position: relative; z-index: 5;}
/* Page Title
==========================*/
.featured {
	border: 1px solid #e2e2e2;
	border-left: none;
	border-right: none;
	margin-top: -1px;
	background-image: linear-gradient(bottom, #FAFAFA 0%, #FCFCFC 100%);
	background-image: -o-linear-gradient(bottom, #FAFAFA 0%, #FCFCFC 100%);
	background-image: -moz-linear-gradient(bottom, #FAFAFA 0%, #FCFCFC 100%);
	background-image: -webkit-linear-gradient(bottom, #FAFAFA 0%, #FCFCFC 100%);
	background-image: -ms-linear-gradient(bottom, #FAFAFA 0%, #FCFCFC 100%);
	background-color: #fafafa;
    padding: 11px 0;
}

.featured h1, .title h1 {
	font-weight: bold;
	font-size: 22px;
    line-height:normal;
	
    display: inline;
}

.featured h2, .title h2 {
	font-weight: normal;
	font-size: 22px;	
    display: inline;
    line-height:normal;
}

.featured span {color:#a0a0a0;}


/* Images Overlay
==========================*/
.item-img, .post-img {position: relative;}

.overlay {
	height: 100%;
    left: 0;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 1;
	z-index: 40;
	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);
	-webkit-transition: opacity 180ms ease-in-out;
	-moz-transition: opacity 180ms ease-in-out;
	-o-transition: opacity 180ms ease-in-out;
	transition: opacity 180ms ease-in-out;
}

.overlay.zoom {
    background: url(./Images/overlay.png) no-repeat center center, url(./Images/overlay_bg.png) center center;

}

.overlay:hover {
	opacity: 1;
	-moz-opacity: 1;
	filter:alpha(opacity=100);
}

/* =============================================================== */
/* Header
================================================================ */
#mainlogo {
    margin-top:5px;
}

#brandlogo {
    margin-top:5px;
    max-width:200px;
    max-height:100px;
}

header {
    min-height: 80px;
}

#login {
    padding-top:5px; 
    text-align:right;
}

#login form {
    margin-bottom:10px;
}

#login a {
    position:relative;
    top:-1px;
}

#login select {    
   margin: 0px 5px 5px 0px;
   width:160px; 
   height:30px;
   display:inline-block;
}

/* Main Navigation
==========================*/

.selectnav {
    display: none; 
    cursor: pointer; 
    width: 100%; 
    padding: 8px; 
    height: 37px; 
    float: left; 
    font-size: 14px;
}


.mainelement {
    z-index: 99999;
}

#nav {
    float: right;
}

#wonav, #wonavsub {
    float: left;
}

#nav ul, #navigation li, #wonav ul, #wonavsub ul {
    list-style:none; 
    padding:0; 
    margin:0; 
    display:inline; 
}

#nav ul li, #wonav ul li, #wonavsub ul li{
    float:left; 
    position:relative;
}

    #nav ul li a, #wonav ul li a, #wonavsub ul li a {
        font-family: Helvetica,Arial,sans-serif;
        display: inline-block;
        color: #888;
        margin: 0 5px;
        text-decoration: none;
        font-size: 12px;
        border-bottom: 3px solid transparent;
    }

#nav ul li a {
	padding: 11px 10px 10px 10px;
}

#wonav ul li a, #wonavsub ul li a {
    padding: 2px 5px 5px 5px;
}

#nav ul li.arrow_right a, #wonav ul li.arrow_right a, #wonavsub ul li.arrow_right a{
    background: url(../images/link_list_arrow_02.png) no-repeat right 47% !important;
}

#nav ul li.arrow_right ul li a, #wonav ul li.arrow_right ul li a, #wonavsub ul li.arrow_right ul li a  {
    background-image:none !important;
}

#nav ul li a:hover, #wonav ul li a:hover, #wonavsub ul li a:hover{
	border-bottom: 3px solid #069;
}

#wonavsub ul li a {
    border-bottom: 3px solid #F58022;
}


#nav ul ul, #wonav ul ul {
	opacity: 0; 
	margin: -2px 0 0 5px;
  	filter: alpha(opacity=0); 
	position: absolute;
	top:-99999px; 
	left: 0;
	background: #fff;
	border: 1px solid #dddddd;
	border-top: 3px solid #069;
	z-index: 999;
}

#nav ul ul li a:hover, #wonav ul ul li a:hover {
	border-bottom: 1px solid #bbb;
}

#wonav ul li a:hover, #wonav ul ul li a:hover, #wonavsub ul li a:hover {
	cursor:pointer;
}

#nav ul ul li a, #wonav ul ul li a {
	padding: 8px 0;
	display: block;
	width: 150px;
	margin: 0 16px;
	font-family: Helvetica,Arial,sans-serif;
	font-weight: normal;
	font-size: 12px;
	border-bottom: 1px solid #dddddd;
	border-top: 1px solid transparent;
}

#nav ul ul ul, #wonav ul ul ul { 
	position:absolute; 
	top:-99999px; 
	left:100%; 
	opacity: 0;
	margin: -3px 0 0 0;
	z-index: 999;
}

#nav ul ul ul li a, #wonav ul ul ul li a { 
	border-bottom: 1px solid #dddddd !important;
	border-top: 1px solid transparent;
}

#nav ul ul li:last-child a, #navigation ul ul li:last-child a:hover, #wonav ul ul li:last-child a {
    border-bottom: 1px solid transparent
}

#nav ul ul ul li:last-child a, #wonav ul ul ul li:last-child a {
    border-bottom: 1px solid transparent !important
}

#nav ul li:hover>ul, #wonav ul li:hover>ul{ 
    opacity: 1; 
    position:absolute; 
    top:99%; 
    left:0;
}

#nav ul ul li:hover>ul, #wonav ul ul li:hover>ul{ 
    position:absolute; 
    top:0; 
    left:100%; 
    opacity: 1; 
    z-index:497; 
    background: #fff; 
    border: 0; 
}

#nav ul li:hover > a, #wonav ul li:hover > a {
    color: #444;
}

#nav ul ul li:hover > a, #wonav ul ul li:hover > a {
    border-top: 1px solid transparent; 
    color: #444;
}
.current {
    font-weight: bold !important; 
    color: #444 !important; 
    border-bottom: 3px solid #F58022 !important;
}

/* =============================================================== */
/* Footer
================================================================ */

footer {
    background: #2c2c2c; 
    bottom: 0; position: fixed;
    z-index: 9999;
    height:28px;   
    width:100%;
}
footer .foottext {
    color: #ccc; 
    margin: 4px 0;
}
footer .foottext a {
    color:#fff;
}

footer.sub-footer {
    background: #e4e4e4; 
    bottom: 28px; position: fixed;
    z-index: 9999;
    height:62px;   
    width:100%;
}

.wo-footer-job.sub-footer {
    left: 0;
}

/* Toolbar Menu
==========================*/
.tb-menu {
    height: 30px !important;
}
.tb-submenu {
    height: 22px !important;
    padding: 15px 0px 2px 2px;
    margin: 4px 0px 0px 0px;
}
.tb-menu, .tb-submenu {
    border-left: 5px solid #1f70ad;
    padding-top: 5px
}


/* =============================================================== */
/* Buttons
================================================================ */
table.buttons td:last-child {
    white-space: nowrap;
    padding-right: 30px;
}

.button {
	display: inline-block;
	font-weight: bold;
	font-family:  Helvetica,Arial,sans-serif;
	cursor: pointer;
	-webkit-border-radius: 3px;
	-moz-border-radius:3px;
	border-radius: 3px;
	margin: 0 5px 5px 0;
	*float: left;
	-webkit-box-shadow: inset 1px 0px 0px rgba(255, 255, 255, .3);
	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .3);
    white-space:nowrap;
}

.button-right {
	display: inline-block;
	font-weight: bold;
	font-family:  Helvetica,Arial,sans-serif;
	cursor: pointer;
	-webkit-border-radius: 3px;
	-moz-border-radius:3px;
	border-radius: 3px;
	margin: 0 0 5px 5px;
	float: right;
	-webkit-box-shadow: inset 1px 0px 0px rgba(255, 255, 255, .3);
	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .3);
}


.button:active, .button-right:active {
	-webkit-box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
	box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
}

.button.medium i, 
.button-right.medium i {float: left;margin: 2px 5px 0px -5px;}
.button.small i, 
.button-right.small i {float: left;margin: 1px 5px 0px -3px;}

.button.medium, 
.button-right.medium {
	padding: 7px 14px;
	font-size: 14px;
}

.button.small,
.button-right.small {
	padding: 6px 18px 6px 12px;
	font-size: 12px;
	font-family: Helvetica,Arial,sans-serif;
	line-height: 16px;
}

.button.icon,
.button-right.icon {
	padding: 6px 7px;
	font-size: 12px;
	font-family: Helvetica,Arial,sans-serif;
	line-height: 16px;
}

.button.tiny,
.button-right.tiny {
	padding: 2px 2px;
	font-size: 12px;
	font-family: Helvetica,Arial,sans-serif;
	line-height: 16px;
}

 .button-list{    
    border: 1px solid #dddddd;  
    width:100%;
    font-size: 1.2em;
    padding: 6px 0px;
    margin:0;
    text-align:center;
}

.button-list .button {
    float:right;
    margin-top:0;
    margin-bottom:0;
}

.button-list:hover {
    cursor:pointer;    
}

/* Button Menu
==========================*/

.button .caret {
    margin-left: 0;
}
.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.ui-menu { 
    position: absolute; 
    width: 150px; 
    z-index:3;
}

.ui-menu-item {
    border: 1px solid #e2e2e2;
    list-style-type:none;
}


/* Input Button
==========================*/
input[type="button"],
input[type="reset"],
input[type="submit"]  {
    -webkit-appearance: none;
	display: inline-block;
	font-weight: bold;
	font-family:  Helvetica,Arial,sans-serif;
	cursor: pointer;
	-webkit-border-radius: 3px;
	-moz-border-radius:3px;
	border-radius: 3px;
	*float: left;
	-webkit-box-shadow: inset 1px 0px 0px rgba(255, 255, 255, .3);
	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, .3);
	padding: 6px 12px;
	font-size: 12px;
    line-height:16px;
	width: auto !important;
	float: left;
    margin: 0px 5px 5px 0px;
    border: 1px solid #1f70ad;
	background-image: linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -o-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -moz-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -webkit-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -ms-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-color: #2778C8;
	color:#fff;
	text-shadow: 1px -1px 0px #1c6396;
	filter: dropshadow(color=#1c6396, offx=1, offy=1);
}

input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	-webkit-box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
	box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.08);
}

input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
    background: #287fc8;
}

input[type="checkbox"] {
    background-color: transparent;
}

tr input {
    width: 100%;
    border: 1px solid #e2e2e2;
    color: #333;
    outline:none;
}

tr select {
width: 100%;
}

/* Light Button
==========================*/
.button.light,
.button-right.light  {
	border: 1px solid #dddddd;
	background-image: linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -o-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -moz-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -webkit-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -ms-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-color: #F7F7F7;
	color:#444;
	text-shadow: 1px 1px 0px #fff;
	filter: dropshadow(color=#ffffff, offx=1, offy=1);
}

.button.light:hover,
.button-right.light:hover {background: #fbfbfb;}

/* Dark Button
==========================*/
.button.dark,
.button-right.dark {
	border: 1px solid #464646;
	background-image: linear-gradient(bottom, #464646 0%, #656565 100%);
	background-image: -o-linear-gradient(bottom, #464646 0%, #656565 100%);
	background-image: -moz-linear-gradient(bottom, #464646 0%, #656565 100%);
	background-image: -webkit-linear-gradient(bottom, #464646 0%, #656565 100%);
	background-image: -ms-linear-gradient(bottom, #464646 0%, #656565 100%);
	background-color: #464646;
	color:#fff;
	text-shadow: 1px -1px 0px #444;
	filter: dropshadow(color=#444444, offx=1, offy=1);
}

.button.dark:hover,
.button-right.dark:hover {background: #535353;}


/* Accent Button
==========================*/
.button.accent,
.button-right.accent {
	border: 1px solid #b23730;
	background-image: linear-gradient(bottom, #DB701E 0%, #F58022 100%);
	background-image: -o-linear-gradient(bottom, #DB701E 0%, #F58022 100%);
	background-image: -moz-linear-gradient(bottom, #DB701E 0%, #F58022 100%);
	background-image: -webkit-linear-gradient(bottom, #DB701E 0%, #F58022 100%);
	background-image: -ms-linear-gradient(bottom, #DB701E 0%, #F58022 100%);
	background-color: #DB701E;
	color:#fff;
	text-shadow: 1px -1px 0px #a43b37;
	filter: dropshadow(color=#a43b37, offx=1, offy=1);
}

.button.accent:hover,
.button-right.accent:hover {background: #e48131;}

/* Standard Button
==========================*/
.button.standard,
.button-right.standard {
	border: 1px solid #1f70ad;
	background-image: linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -o-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -moz-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -webkit-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -ms-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-color: #2778C8;
	color:#fff;
	text-shadow: 1px -1px 0px #1c6396;
	filter: dropshadow(color=#1c6396, offx=1, offy=1);
}

.button.standard:hover,
.button-right.standard:hover {background: #287fc8;}

.button.disabled,
.button-right.disabled,
.button.fake-disabled {
    border: 1px solid gray;
    pointer-events: none;
    background-color: gray !important;
    background-image: linear-gradient(bottom, gray 0%, darkgray 100%);
    background-image: -o-linear-gradient(bottom, gray 0%, darkgray 100%);
    background-image: -moz-linear-gradient(bottom, gray 0%, darkgray 100%);
    background-image: -webkit-linear-gradient(bottom, gray 0%, darkgray 100%);
    text-shadow: 1px -1px 0px darkgrey;
}

.button.fake-disabled {
    pointer-events: auto;
}

/* Progress Button
==========================*/
.button.progress,
.button-right.progress {
    border: 1px solid #e4c406;
    background-image: linear-gradient(bottom, #f0f226 0%, #f7e519 100%);
    background-image: -o-linear-gradient(bottom, #f0f226 0%, #f7e519 100%);
    background-image: -moz-linear-gradient(bottom, #f0f226 0%, #f7e519 100%);
    background-image: -webkit-linear-gradient(bottom, #f0f226 0%, #f7e519 100%);
    background-image: -ms-linear-gradient(bottom, #f0f226 0%, #f7e519 100%);
    background-color: #f0f226;
    color: #fff;
    text-shadow: 0px 1px 4px #333;
    filter: dropshadow(color=#f7e519, offx=1, offy=1);
    pointer-events: none;
}

.button.progress:hover,
.button-right.progress:hover {
    background: #f6f115;
}

/* Cancel Button
==========================*/
.button.cancel,
.button-right.cancel {
    border: 1px solid #922018;
    background-image: linear-gradient(bottom, #c92014 0%, #ec1a0c 100%);
    background-image: -o-linear-gradient(bottom, #c92014 0%, #ec1a0c 100%);
    background-image: -moz-linear-gradient(bottom, #c92014 0%, #ec1a0c 100%);
    background-image: -webkit-linear-gradient(bottom, #c92014 0%, #ec1a0c 100%);
    background-image: -ms-linear-gradient(bottom, #c92014 0%, #ec1a0c 100%);
    background-color: #c92014;
    color: #fff;
    text-shadow: 0px 1px 4px #333;
    filter: dropshadow(color=#ec1a0c, offx=1, offy=1);
    pointer-events: none;
}

.button.cancel:hover,
.button-right.cancel:hover {
    background: #aa1b11;
}

/* Reject Button
==========================*/
.button.reject,
.button-right.reject {
    border: 1px solid #c4a356;
    background-image: linear-gradient(bottom, #d7ae50 0%, #d7ae50 100%);
    background-image: -o-linear-gradient(bottom, #d7ae50 0%, #d7ae50 100%);
    background-image: -moz-linear-gradient(bottom, #d7ae50 0%, #d7ae50 100%);
    background-image: -webkit-linear-gradient(bottom, #d7ae50 0%, #d7ae50 100%);
    background-image: -ms-linear-gradient(bottom, #d7ae50 0%, #d7ae50 100%);
    background-color: #d7ae50;
    color: #fff;
    text-shadow: 0px 1px 4px #333;
    filter: dropshadow(color=#d7ae50, offx=1, offy=1);
    pointer-events: auto;
}

    .button.reject:hover,
    .button-right.reject:hover {
        background: #d7ae50;
    }


/* Success Button
==========================*/
.button.success,
.button-right.success {
    border: 1px solid #168f1c;
    background-image: linear-gradient(bottom, #27c62f 0%, #21ae35 100%);
    background-image: -o-linear-gradient(bottom, #27c62f 0%, #21ae35 100%);
    background-image: -moz-linear-gradient(bottom, #27c62f 0%, #21ae35 100%);
    background-image: -webkit-linear-gradient(bottom, #27c62f 0%, #21ae35 100%);
    background-image: -ms-linear-gradient(bottom, #27c62f 0%, #21ae35 100%);
    background-color: #27c62f;
    color: #fff;
    text-shadow: 1px -1px 0px #21ae35;
    filter: dropshadow(color=#21ae35, offx=1, offy=1);
}

.button.success:hover,
.button-right.success:hover {
    background: #28c343;
}

/* =============================================================== */
/* Fields
================================================================ */

fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

fieldset legend {
    display: none;
}
    
fieldset ol {
    padding: 0;
    margin: 0;
    list-style: none;
}

    fieldset ol li {
        padding-bottom: 5px;
    }

fieldset label {
    display: block;
    font-size: 1.2em;
    font-weight: 600;
}

fieldset label.checkbox {
    display: inline;
}

    fieldset textarea,
    fieldset input[type="date"],
    fieldset input[type="time"],
    fieldset input[type="datetime"],
    fieldset input[type="number"],
    fieldset input[type="tel"],
    fieldset input[type="email"],
    fieldset input[type="text"],
    fieldset input[type="password"],
    fieldset input[type="url"],
    fieldset input[type="color"],
    fieldset input[type="search"],
    fieldset select {
        border: 1px solid #e2e2e2;
        color: #333;
        font-size: 1.2em;
        margin: 5px 0 6px 0;
        padding: 5px;
        width: 100%;
        height: 32px;
        border-radius: 4px;
        overflow: auto;
        box-sizing: border-box;
        -ms-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

fieldset input[type="color"]{
    width: 50%;
    padding: 1px 2px;
    min-height: 32px;
}

fieldset textarea{
	height:300px;
}

fieldset #Progressbar{
    font-size: 1.05em;
    margin-bottom: 5px;
    color: #333;
    width: 100%;
}

fieldset textarea:focus,
fieldset input[type="date"]:focus,
fieldset input[type="time"]:focus,
fieldset input[type="datetime"]:focus,
fieldset input[type="number"]:focus,
fieldset input[type="tel"]:focus,
fieldset input[type="email"]:focus,
fieldset input[type="text"]:focus,
fieldset input[type="password"]:focus,
fieldset input[type="url"]:focus,
fieldset select:focus,
tr input:focus {
    border: 1px solid #7ac0da;
}

.search_init {
  border-radius: 2px;
  color: #666;
  padding: 1px 0px 1px 2px;
}

  .search_init:focus {
    color: #1c6396;
  }

table.dataTable tr:not(:first-child) th:first-child,
table.dataTable tr:not(:first-child) th:last-child {
  border-radius: 0px;
}

/*fieldset input[type="submit"] {
    background-color: #d3dce0;
    border: 1px solid #787878;
    cursor: pointer;
    font-size: 1.2em;
    font-weight: 600;
    padding: 7px;
}*/
label {
  display: inline;
  font-size: 1.2em;
  font-weight: 600;
}

/* login page */
#loginForm {
    border-right: solid 2px #c8c8c8;
    float: left;
    width: 45%;
}

#loginForm .validation-error {
    display: block;
    margin-left: 15px;
}

.scrollpanel
{
	clear:both;
	height:300px;
	overflow-y:scroll;
	overflow-x:hidden;
}

.nonbinding-editor-field {
    font-size: 19px;
    color: #333;
    padding: 5px;
    margin: 5px 0 6px 0;
    border: 1px solid #e2e2e2;
}

.editor-field {
    margin-bottom: 10px;
}

/* info and errors */
.message-info {
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error {
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.message-success {
    color: #7ac0da;
    font-size: 1.3em;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.error {
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

textarea.input-validation-error,
input[type="date"].input-validation-error,
input[type="time"].input-validation-error,
input[type="datetime"].input-validation-error,
input[type="number"].input-validation-error,
input[type="tel"].input-validation-error,
input[type="email"].input-validation-error,
input[type="text"].input-validation-error,
input[type="password"].input-validation-error,
input[type="url"].input-validation-error,
select.input-validation-error {
    border: 1px solid #e80c4d;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

/* =============================================================== */
/* Table
================================================================ */
table.standard-table{
	width:100%;
	border-radius:3px;
	border-collapse:separate;
	border-spacing:0;
	border:none;
	margin-bottom:15px;
}

table.standard-table th{
	border: 1px solid #dddddd;
	border-right: none;
	background-image: linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -o-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -moz-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -webkit-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-image: -ms-linear-gradient(bottom, #F7F7F7 0%, #FFFFFF 100%);
	background-color: #F7F7F7;
	text-align:left;
	padding:10px 15px;
	color:#444;
	vertical-align:top;
	font-size: 14px;
	font-weight: bold;
}
	
table.standard-table th:first-child{
	border-radius: 3px 0 0 0;
}

table.standard-table td:last-child {
	border-right: 1px solid #ddd;
}

table.standard-table th:last-child {
	border-radius: 0 3px 0 0;
	border-right: 1px solid #ddd;
}

table.standard-table td{
	padding:10px 15px;
	border:#e7e7e7 1px solid;
	border-top: none;
	border-right: none;
}
	
table.standard-table tr:hover td{background-color:#fafafa;}

table.checkbox-table tr td:first-child {
    width:20px;
    min-width:20px;
}

table.checkbox-table button {
    margin:0;
}

table.checkbox-table input {
    margin:0;
}

.search-table-container {
    height:180px;overflow:auto;
}

table.unresponsive-table{
	width:100%;
	border-radius:3px;
	border-collapse:separate;
	border-spacing:0;
	border:none;
	margin-bottom:15px;
}

table.unresponsive-table th{
	border: 1px solid #dddddd;
	border-right: none;
	background-image: linear-gradient(bottom, #f7f7f7 0%, #FFFFFF 100%);
	background-image: -o-linear-gradient(bottom, #f7f7f7 0%, #FFFFFF 100%);
	background-image: -moz-linear-gradient(bottom, #f7f7f7 0%, #FFFFFF 100%);
	background-image: -webkit-linear-gradient(bottom, #f7f7f7 0%, #FFFFFF 100%);
	background-image: -ms-linear-gradient(bottom, #f7f7f7 0%, #FFFFFF 100%);
	background-color: #F7F7F7;
	text-align:left;
	/*padding:10px 15px;*/
    padding:0px 15px;
	color:#444;
	vertical-align:top;
	font-size: 14px;
	font-weight: bold;
}
	
table.unresponsive-table th:first-child{
	border-radius: 3px 0 0 0;
}

table.unresponsive-table td:last-child {
	border-right: 1px solid #ddd;
}

table.unresponsive-table th:last-child {
	border-radius: 0 3px 0 0;
	border-right: 1px solid #ddd;
}

table.unresponsive-table td{
	/*padding:10px 15px;*/
    padding:0px 15px;
	border:#e7e7e7 1px solid;
	border-top: none;
	border-right: none;
}
	
table.unresponsive-table tr:hover {
    background-color:#fafafa;
    color:#606060;
}

.selected-cell { 
    border: 1px solid #1f70ad;
	background-image: linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -o-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -moz-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -webkit-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-image: -ms-linear-gradient(bottom, #2778C8 0%, #2B8EC7 100%);
	background-color: #2778C8;
	color:#fff;
	text-shadow: 1px -1px 0px #1c6396;
	filter: dropshadow(color=#1c6396, offx=1, offy=1);
}

.selected-cell:hover td { 
    background-color: #287fc8 !important;
	color:#fff !important;
}


table.unresponsive-table-no-hover{
	width:100%;
	border-radius:3px;
	border-collapse:separate;
	border-spacing:0;
	border:none;
	margin-bottom:15px;
}

  table.unresponsive-table-no-hover th {
    border: 1px solid #dddddd;
    border-right: none;
    background-image: linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
    background-image: -o-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
    background-image: -moz-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
    background-image: -webkit-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
    background-image: -ms-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
    background-color: #F7F7F7;
    text-align: left;
    /*padding:10px 15px;*/
    padding: 0px 20px;
    color: #444;
    vertical-align: top;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
  }

table.unresponsive-table-no-hover th.sorting{
    background-image: url('./Images/sort_both.png'), linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
    background-image: url('./Images/sort_both.png'), -o-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_both.png'), -moz-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_both.png'), -webkit-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_both.png'), -ms-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-color: #F7F7F7;
    background-repeat: no-repeat, repeat;
    background-position: center right, top left;
}

table.unresponsive-table-no-hover th.sorting_asc{
    background-image: url('./Images/sort_asc.png'),linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc.png'), -o-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc.png'),-moz-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc.png'), -webkit-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc.png'), -ms-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-color: #F7F7F7;
    background-repeat: no-repeat, repeat;
    background-position: center right, top left;
}

table.unresponsive-table-no-hover th.sorting_desc{
    background-image: url('./Images/sort_desc.png'),linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc.png'),-o-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc.png'),-moz-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc.png'), -webkit-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc.png'), -ms-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-color: #F7F7F7;
    background-repeat: no-repeat, repeat;
    background-position: center right, top left;
}

table.unresponsive-table-no-hover th.sorting_asc_disabled{
    background-image: url('./Images/sort_asc_disabled.png'), linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc_disabled.png'), -o-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc_disabled.png'), -moz-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc_disabled.png'), -webkit-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_asc_disabled.png'), -ms-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-color: #F7F7F7;
    background-repeat: no-repeat, repeat;
    background-position: center right, top left;
}

table.unresponsive-table-no-hover th.sorting_desc_disabled{
    background-image: url('./Images/sort_desc_disabled.png'), linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc_disabled.png'), -o-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc_disabled.png'), -moz-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc_disabled.png'), -webkit-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-image: url('./Images/sort_desc_disabled.png'), -ms-linear-gradient(bottom, #f7f7f7 0%, #fff 100%);
	background-color: #F7F7F7;
    background-repeat: no-repeat, repeat;
    background-position: center right, top left;
}
	
table.unresponsive-table-no-hover th:first-child{
	border-radius: 3px 0 0 0;
}

table.unresponsive-table-no-hover td:last-child {
	border-right: 1px solid #ddd;
}

table.unresponsive-table-no-hover th:last-child {
	border-radius: 0 3px 0 0;
	border-right: 1px solid #ddd;
}

table.unresponsive-table-no-hover td{
	/*padding:10px 15px;*/
    padding:0px 15px;
	border:#e7e7e7 1px solid;
	border-top: none;
	border-right: none;
}

#showHideColumnsPopup {
    position: absolute;
    right: 0;
    z-index: 9;
    padding: 6px;
    padding-bottom: 44px;
    width: 300px;
    height: 210px;
    border: 2px solid #3f8faf;
    border-radius: 5px;
    background-color: white;
}
#showHideColumnsPopup button {
    margin-top: 8px;
    margin-right: 10px;
    position: absolute;
    right: 0;
}
#showHideColumnsPopup .content {
    width: 100%;
    height: 100%;
    max-height: 210px;
    overflow: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
    #showHideColumnsPopup .content .col1,
    #showHideColumnsPopup .content .col2 {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        font-weight: bold;
    }

    #showHideColumnsPopup .content input[type="checkbox"] {
        margin-right: 5px;
    }

    #showHideColumnsPopup .content p {
        margin-bottom: 8px;
    }

.custom-dt-wrapper {
    overflow: auto;
}

.table_wo_row_1 {
  position: sticky;
  top: 0px;
}

.table_wo_row_2 {
  position: sticky;
  top: 22px;
}
.table_wo_checkbox {
  font-weight: bolder !important;
  font-size: xx-small !important;
}
.table_wo_column {
  border: 1px solid #e2e2e2 !important;
}

.workorder-details-layout-total-unit-on {
  float: right;
  width: 49%;
}

.workorder-details-layout-unit-on {
    float:left; 
    width: 45%;
    margin-left:2px;
}


@media only screen and (max-width: 767px) {   

    table.standard-table {
		display: block;
		position: relative;
		width: 100%;
	}
	
	table.standard-table thead {
		display: block;
		float: left;
	}
	
	table.standard-table thead tr {
		display: block;
	}
	
	table.standard-table thead tr th, table.standard-table tbody tr td {
		display: block;
	}
	
	table.standard-table tbody {
		display: block;
		width: auto;
		position: relative;
		overflow-x: auto;
		white-space: nowrap;
	}

	
	table.standard-table tbody tr {
		display: inline-block;
		vertical-align: top;
	}
	
	table.standard-table td {
		display: block;
	}
	
	
	table.standard-table.full, .dataTables_wrapper.full {
		margin: 0;
	}
	
	table.standard-table.full .footer, .dataTables_wrapper.full .footer {
		left: -15px;
		right: -15px;
	}

    table.checkbox-table tr td {
        width:auto;
        height:22px;
    }

    table.checkbox-table tr td:first-child {
        width:auto;
        height:22px;
    }

    .search-table-container {
        height:auto;overflow:auto;
    }

    .optional-element {
        display:none !important;
    }

    footer.sub-footer {
        font-size:80%;
    }
}


/* Search for DataTables Mobile mode*/

fieldset.filtersearch input {
    margin-left:10px;
    margin-right:10px;
    float:left;
    width:40%;
}

fieldset.filtersearch select {
    float:left;
    width:auto;
}

/* =============================================================== */
/* Icons
================================================================ */
/* Glyphicons
====================================*/
@font-face {
  font-family: 'Glyphicons Halflings';

  src: url('./Images/glyphicons-halflings-regular.eot');
  src: url('./Images/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('./Images/glyphicons-halflings-regular.woff2') format('woff2'), url('./Images/glyphicons-halflings-regular.woff') format('woff'), url('./Images/glyphicons-halflings-regular.ttf') format('truetype'), url('./Images/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}
.icon {
  position: relative;
  top: 1px;
	display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon.showhide {
    float:left;
    padding-right:5px;
    cursor:pointer;
	color:#2778C8;
}
.icon-asterisk:before {
  content: "\2a";
}
.icon-plus:before {
  content: "\2b";
}
.icon-euro:before,
.icon-eur:before {
  content: "\20ac";
}
.icon-minus:before {
  content: "\2212";
}
.icon-cloud:before {
  content: "\2601";
}
.icon-envelope:before {
  content: "\2709";
}
.icon-pencil:before {
  content: "\270f";
}
.icon-glass:before {
  content: "\e001";
}
.icon-music:before {
  content: "\e002";
}
.icon-search:before {
  content: "\e003";
}
.icon-heart:before {
  content: "\e005";
}
.icon-star:before {
  content: "\e006";
  padding-left:2px;
}
.icon-star-empty:before {
  content: "\e007";
}
.icon-user:before {
  content: "\e008";
}
.icon-film:before {
  content: "\e009";
}
.icon-th-large:before {
  content: "\e010";
}
.icon-th:before {
  content: "\e011";
}
.icon-th-list:before {
  content: "\e012";
}
.icon-ok:before {
  content: "\e013";
}
.icon-remove:before {
  content: "\e014";
}
.icon-zoom-in:before {
  content: "\e015";
}
.icon-zoom-out:before {
  content: "\e016";
}
.icon-off:before {
  content: "\e017";
}
.icon-signal:before {
  content: "\e018";
}
.icon-cog:before {
  content: "\e019";
}
.icon-trash:before {
  content: "\e020";
}
.icon-home:before {
  content: "\e021";
}
.icon-file:before {
  content: "\e022";
}
.icon-time:before {
  content: "\e023";
}
.icon-road:before {
  content: "\e024";
}
.icon-download-alt:before {
  content: "\e025";
}
.icon-download:before {
  content: "\e026";
}
.icon-upload:before {
  content: "\e027";
}
.icon-inbox:before {
  content: "\e028";
}
.icon-play-circle:before {
  content: "\e029";
}
.icon-repeat:before {
  content: "\e030";
}
.icon-refresh:before {
  content: "\e031";
}
.icon-list-alt:before {
  content: "\e032";
}
.icon-lock:before {
  content: "\e033";
}
.icon-flag:before {
  content: "\e034";
}
.icon-headphones:before {
  content: "\e035";
}
.icon-volume-off:before {
  content: "\e036";
}
.icon-volume-down:before {
  content: "\e037";
}
.icon-volume-up:before {
  content: "\e038";
}
.icon-qrcode:before {
  content: "\e039";
}
.icon-barcode:before {
  content: "\e040";
}
.icon-tag:before {
  content: "\e041";
}
.icon-tags:before {
  content: "\e042";
}
.icon-book:before {
  content: "\e043";
}
.icon-bookmark:before {
  content: "\e044";
}
.icon-print:before {
  content: "\e045";
}
.icon-camera:before {
  content: "\e046";
}
.icon-font:before {
  content: "\e047";
}
.icon-bold:before {
  content: "\e048";
}
.icon-italic:before {
  content: "\e049";
}
.icon-text-height:before {
  content: "\e050";
}
.icon-text-width:before {
  content: "\e051";
}
.icon-align-left:before {
  content: "\e052";
}
.icon-align-center:before {
  content: "\e053";
}
.icon-align-right:before {
  content: "\e054";
}
.icon-align-justify:before {
  content: "\e055";
}
.icon-list:before {
  content: "\e056";
}
.icon-indent-left:before {
  content: "\e057";
}
.icon-indent-right:before {
  content: "\e058";
}
.icon-facetime-video:before {
  content: "\e059";
}
.icon-picture:before {
  content: "\e060";
}
.icon-map-marker:before {
  content: "\e062";
}
.icon-adjust:before {
  content: "\e063";
}
.icon-tint:before {
  content: "\e064";
}
.icon-edit:before {
  content: "\e065";
}
.icon-share:before {
  content: "\e066";
}
.icon-check:before {
  content: "\e067";
}
.icon-move:before {
  content: "\e068";
}
.icon-step-backward:before {
  content: "\e069";
}
.icon-fast-backward:before {
  content: "\e070";
}
.icon-backward:before {
  content: "\e071";
}
.icon-play:before {
  content: "\e072";
}
.icon-pause:before {
  content: "\e073";
}
.icon-stop:before {
  content: "\e074";
}
.icon-forward:before {
  content: "\e075";
}
.icon-fast-forward:before {
  content: "\e076";
}
.icon-step-forward:before {
  content: "\e077";
}
.icon-eject:before {
  content: "\e078";
}
.icon-chevron-left:before {
  content: "\e079";
}
.icon-chevron-right:before {
  content: "\e080";
}
.icon-plus-sign:before {
  content: "\e081";
}
.icon-minus-sign:before {
  content: "\e082";
}
.icon-remove-sign:before {
  content: "\e083";
}
.icon-ok-sign:before {
  content: "\e084";
}
.icon-question-sign:before {
  content: "\e085";
}
.icon-info-sign:before {
  content: "\e086";
}
.icon-screenshot:before {
  content: "\e087";
}
.icon-remove-circle:before {
  content: "\e088";
}
.icon-ok-circle:before {
  content: "\e089";
}
.icon-ban-circle:before {
  content: "\e090";
}
.icon-arrow-left:before {
  content: "\e091";
}
.icon-arrow-right:before {
  content: "\e092";
}
.icon-arrow-up:before {
  content: "\e093";
}
.icon-arrow-down:before {
  content: "\e094";
}
.icon-share-alt:before {
  content: "\e095";
}
.icon-resize-full:before {
  content: "\e096";
}
.icon-resize-small:before {
  content: "\e097";
}
.icon-exclamation-sign:before {
  content: "\e101";
}
.icon-gift:before {
  content: "\e102";
}
.icon-leaf:before {
  content: "\e103";
}
.icon-fire:before {
  content: "\e104";
}
.icon-eye-open:before {
  content: "\e105";
}
.icon-eye-close:before {
  content: "\e106";
}
.icon-warning-sign:before {
  content: "\e107";
}
.icon-plane:before {
  content: "\e108";
}
.icon-calendar:before {
  content: "\e109";
}
.icon-random:before {
  content: "\e110";
}
.icon-comment:before {
  content: "\e111";
}
.icon-magnet:before {
  content: "\e112";
}
.icon-chevron-up:before {
  content: "\e113";
}
.icon-chevron-down:before {
  content: "\e114";
}
.icon-retweet:before {
  content: "\e115";
}
.icon-shopping-cart:before {
  content: "\e116";
}
.icon-folder-close:before {
  content: "\e117";
}
.icon-folder-open:before {
  content: "\e118";
}
.icon-resize-vertical:before {
  content: "\e119";
}
.icon-resize-horizontal:before {
  content: "\e120";
}
.icon-hdd:before {
  content: "\e121";
}
.icon-bullhorn:before {
  content: "\e122";
}
.icon-bell:before {
  content: "\e123";
}
.icon-certificate:before {
  content: "\e124";
}
.icon-thumbs-up:before {
  content: "\e125";
}
.icon-thumbs-down:before {
  content: "\e126";
}
.icon-hand-right:before {
  content: "\e127";
}
.icon-hand-left:before {
  content: "\e128";
}
.icon-hand-up:before {
  content: "\e129";
}
.icon-hand-down:before {
  content: "\e130";
}
.icon-circle-arrow-right:before {
  content: "\e131";
}
.icon-circle-arrow-left:before {
  content: "\e132";
}
.icon-circle-arrow-up:before {
  content: "\e133";
}
.icon-circle-arrow-down:before {
  content: "\e134";
}
.icon-globe:before {
  content: "\e135";
}
.icon-wrench:before {
  content: "\e136";
}
.icon-tasks:before {
  content: "\e137";
}
.icon-filter:before {
  content: "\e138";
}
.icon-briefcase:before {
  content: "\e139";
}
.icon-fullscreen:before {
  content: "\e140";
}
.icon-dashboard:before {
  content: "\e141";
}
.icon-paperclip:before {
  content: "\e142";
}
.icon-heart-empty:before {
  content: "\e143";
}
.icon-link:before {
  content: "\e144";
}
.icon-phone:before {
  content: "\e145";
}
.icon-pushpin:before {
  content: "\e146";
}
.icon-usd:before {
  content: "\e148";
}
.icon-gbp:before {
  content: "\e149";
}
.icon-sort:before {
  content: "\e150";
}
.icon-sort-by-alphabet:before {
  content: "\e151";
}
.icon-sort-by-alphabet-alt:before {
  content: "\e152";
}
.icon-sort-by-order:before {
  content: "\e153";
}
.icon-sort-by-order-alt:before {
  content: "\e154";
}
.icon-sort-by-attributes:before {
  content: "\e155";
}
.icon-sort-by-attributes-alt:before {
  content: "\e156";
}
.icon-unchecked:before {
  content: "\e157";
}
.icon-expand:before {
  content: "\e158";
}
.icon-collapse-down:before {
  content: "\e159";
}
.icon-collapse-up:before {
  content: "\e160";
}
.icon-log-in:before {
  content: "\e161";
}
.icon-flash:before {
  content: "\e162";
}
.icon-log-out:before {
  content: "\e163";
}
.icon-new-window:before {
  content: "\e164";
}
.icon-record:before {
  content: "\e165";
}
.icon-save:before {
  content: "\e166";
}
.icon-open:before {
  content: "\e167";
}
.icon-saved:before {
  content: "\e168";
}
.icon-import:before {
  content: "\e169";
}
.icon-export:before {
  content: "\e170";
}
.icon-send:before {
  content: "\e171";
}
.icon-floppy-disk:before {
  content: "\e172";
}
.icon-floppy-saved:before {
  content: "\e173";
}
.icon-floppy-remove:before {
  content: "\e174";
}
.icon-floppy-save:before {
  content: "\e175";
}
.icon-floppy-open:before {
  content: "\e176";
}
.icon-credit-card:before {
  content: "\e177";
}
.icon-transfer:before {
  content: "\e178";
}
.icon-cutlery:before {
  content: "\e179";
}
.icon-header:before {
  content: "\e180";
}
.icon-compressed:before {
  content: "\e181";
}
.icon-earphone:before {
  content: "\e182";
}
.icon-phone-alt:before {
  content: "\e183";
}
.icon-tower:before {
  content: "\e184";
}
.icon-stats:before {
  content: "\e185";
}
.icon-sd-video:before {
  content: "\e186";
}
.icon-hd-video:before {
  content: "\e187";
}
.icon-subtitles:before {
  content: "\e188";
}
.icon-sound-stereo:before {
  content: "\e189";
}
.icon-sound-dolby:before {
  content: "\e190";
}
.icon-sound-5-1:before {
  content: "\e191";
}
.icon-sound-6-1:before {
  content: "\e192";
}
.icon-sound-7-1:before {
  content: "\e193";
}
.icon-copyright-mark:before {
  content: "\e194";
}
.icon-registration-mark:before {
  content: "\e195";
}
.icon-cloud-download:before {
  content: "\e197";
}
.icon-cloud-upload:before {
  content: "\e198";
}
.icon-tree-conifer:before {
  content: "\e199";
}
.icon-tree-deciduous:before {
  content: "\e200";
}
.icon-cd:before {
  content: "\e201";
}
.icon-save-file:before {
  content: "\e202";
}
.icon-open-file:before {
  content: "\e203";
}
.icon-level-up:before {
  content: "\e204";
}
.icon-copy:before {
  content: "\e205";
}
.icon-paste:before {
  content: "\e206";
}
.icon-alert:before {
  content: "\e209";
}
.icon-equalizer:before {
  content: "\e210";
}
.icon-king:before {
  content: "\e211";
}
.icon-queen:before {
  content: "\e212";
}
.icon-pawn:before {
  content: "\e213";
}
.icon-bishop:before {
  content: "\e214";
}
.icon-knight:before {
  content: "\e215";
}
.icon-baby-formula:before {
  content: "\e216";
}
.icon-tent:before {
  content: "\26fa";
}
.icon-blackboard:before {
  content: "\e218";
}
.icon-bed:before {
  content: "\e219";
}
.icon-apple:before {
  content: "\f8ff";
}
.icon-erase:before {
  content: "\e221";
}
.icon-hourglass:before {
  content: "\231b";
}
.icon-lamp:before {
  content: "\e223";
}
.icon-duplicate:before {
  content: "\e224";
}
.icon-piggy-bank:before {
  content: "\e225";
}
.icon-scissors:before {
  content: "\e226";
}
.icon-bitcoin:before {
  content: "\e227";
}
.icon-btc:before {
  content: "\e227";
}
.icon-xbt:before {
  content: "\e227";
}
.icon-yen:before {
  content: "\00a5";
}
.icon-jpy:before {
  content: "\00a5";
}
.icon-ruble:before {
  content: "\20bd";
}
.icon-rub:before {
  content: "\20bd";
}
.icon-scale:before {
  content: "\e230";
}
.icon-ice-lolly:before {
  content: "\e231";
}
.icon-ice-lolly-tasted:before {
  content: "\e232";
}
.icon-education:before {
  content: "\e233";
}
.icon-option-horizontal:before {
  content: "\e234";
}
.icon-option-vertical:before {
  content: "\e235";
}
.icon-menu-hamburger:before {
  content: "\e236";
}
.icon-modal-window:before {
  content: "\e237";
}
.icon-oil:before {
  content: "\e238";
}
.icon-grain:before {
  content: "\e239";
}
.icon-sunglasses:before {
  content: "\e240";
}
.icon-text-size:before {
  content: "\e241";
}
.icon-text-color:before {
  content: "\e242";
}
.icon-text-background:before {
  content: "\e243";
}
.icon-object-align-top:before {
  content: "\e244";
}
.icon-object-align-bottom:before {
  content: "\e245";
}
.icon-object-align-horizontal:before {
  content: "\e246";
}
.icon-object-align-left:before {
  content: "\e247";
}
.icon-object-align-vertical:before {
  content: "\e248";
}
.icon-object-align-right:before {
  content: "\e249";
}
.icon-triangle-right:before {
  content: "\e250";
}
.icon-triangle-left:before {
  content: "\e251";
}
.icon-triangle-bottom:before {
  content: "\e252";
}
.icon-triangle-top:before {
  content: "\e253";
}
.icon-console:before {
  content: "\e254";
}
.icon-superscript:before {
  content: "\e255";
}
.icon-subscript:before {
  content: "\e256";
}
.icon-menu-left:before {
  content: "\e257";
}
.icon-menu-right:before {
  content: "\e258";
}
.icon-menu-down:before {
  content: "\e259";
}
.icon-menu-up:before {
  content: "\e260";
}
.icon-nothing:before {
  content: "\00A0";
}

/* =============================================================== */
/* List Styles
================================================================ */
.check_list li, .plus_list li, .minus_list li, .star_list li, .arrow_list li, .square_list li, .circle_list li, .cross_list li {list-style: none;margin: 5px 0;}

.check_list li {background: url(../Content/Images/list_check.png) no-repeat 0% 50%; padding: 0 0 0 18px;}
.plus_list  li {background: url(../Content/Images/list_plus.png) no-repeat 0% 50%; padding: 0 0 0 18px;}
.minus_list  li {background: url(../Content/Images/list_minus.png) no-repeat 0% 50%; padding: 0 0 0 18px;}
.star_list  li {background: url(../Content/Images/list_star.png) no-repeat 0% 50%; padding: 0 0 0 16px;}
.arrow_list  li {background: url(../Content/Images/list_arrow.png) no-repeat 0% 10%; padding: 0 0 0 16px;}
.square_list  li {background: url(../Content/Images/list_square.png) no-repeat 0% 50%; padding: 0 0 0 16px;}
.circle_list  li {background: url(../Content/Images/list_circle.png) no-repeat 0% 50%; padding: 0 0 0 16px;}
.cross_list  li {background: url(../Content/Images/list_cross.png) no-repeat 0% 50%; padding: 0 0 0 16px;}

/* =============================================================== */
/* Extra code for JavaScript integration
================================================================ */
ul.ui-autocomplete {
  list-style-type: none;
}

.template-download td {
    text-align:left;
    vertical-align:top;
}

.template-upload td {
    text-align:left;
    vertical-align:top;
}

.preview img {
    border: 1px solid black;
}

/*
    Element Specific items
    */

.psa-dialog-wraptext{
    white-space:pre-wrap;
}

.contact-info input[type="text"] {
    width:43%;    
    display: inline-block;
}

.contact-info select {
    width:33% !important;
    margin-right:2%;
    display: inline-block;
}

.contact-right {
    width:43%;    
    display: inline-block;
}

.contact-left {
    width:43%;
    margin-right:2%;
    display: inline-block;
}

.price-container {
    background-color:#AECCE6 !important; 
    border: 1px solid #c9c9c9; 
    padding: 10px; 
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px; 
    border-radius: 3px;
}

.cost-container {
    background-color:#FBF9C0 !important; 
    border: 1px solid #c9c9c9; 
    padding: 10px; 
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px; 
    border-radius: 3px;
}

.room-setting input[type="text"] {
    width:33%;    
    display: inline-block;
}

.room-setting select {
    width:33%;
    margin-right:2%;
    display: inline-block;
}

.room-setting span {
    width:33%;
    margin-right:2%;
    display: inline-block;
}
/* Select2 */

.select2-selection__rendered a {
    color: #333;
}

/* Full Calendar */
.fc-other-month {
    color:#444444;
}

.fc-toolbar h2 {
    font-size: x-large;
    line-height: normal;
}

div.fc-view.fc-employeeDay-view.fc-agenda-view {
    overflow-x: auto;
}

.fc-event a.fc-delete {
    position: absolute;
    top: 2px;
    right: 2px;
    text-align: right;
    color: #fff;
    text-decoration: none;
    z-index:2;
}

.fc-status-border {
    border-left: 10px solid !important;
}

.fc-more-popover {
    max-height: 300px;
    overflow-y: scroll;
    z-index: 99 !important;
}

.fc-agenda-view .fc-day-grid .fc-row .fc-content-skeleton {
  padding-bottom: 2px !important;
}

.fc-agenda-view div.fc-day-grid.fc-unselectable {
  max-height: 250px;
  overflow-y: scroll;
}

@media only screen and (max-height: 900px) {
  .fc-agenda-view div.fc-day-grid.fc-unselectable {
    max-height: 190px;
  }
}

@media only screen and (max-height: 768px) {
  .fc-agenda-view div.fc-day-grid.fc-unselectable {
    max-height: 130px;
  }
}

  .fc-agenda-view div.fc-row.fc-week.ui-widget-content {
    margin-right: 0px !important;
    border-right-width: 0px !important;
  }

  button span.ui-icon.ui-icon-refetch-svg {
    background-image: url(Images/calendar/refetch_normal.svg);
  }

  button.ui-state-hover span.ui-icon.ui-icon-refetch-svg {
    background-image: url(Images/calendar/refetch_hover.svg);
  }

button span.ui-icon.ui-icon-expand-svg {
    background-image: url(Images/calendar/expand_normal.svg);
    background-position-x: 50%;
    background-size: 16px;
}

button.ui-state-hover span.ui-icon.ui-icon-expand-svg {
    background-image: url(Images/calendar/expand_hover.svg);
    background-position-x: 50%;
    background-size: 16px;
}

button span.ui-icon.ui-icon-collapse-svg {
    background-image: url(Images/calendar/collapse_normal.svg);
    background-position-x: 50%;
    background-size: 16px;
}

button.ui-state-hover span.ui-icon.ui-icon-collapse-svg {
    background-image: url(Images/calendar/collapse_hover.svg);
    background-position-x: 50%;
    background-size: 16px;
}

  button span.ui-icon.ui-icon-today-svg {
    background-image: url(Images/calendar/today_normal.svg);
  }

  button.ui-state-hover span.ui-icon.ui-icon-today-svg {
    background-image: url(Images/calendar/today_hover.svg);
  }

  button span.ui-icon.ui-icon-prev-svg {
    background-image: url(Images/calendar/prev_normal.svg);
    background-position-x: 50%;
  }

  button.ui-state-hover span.ui-icon.ui-icon-prev-svg {
    background-image: url(Images/calendar/prev_hover.svg);
  }

  button span.ui-icon.ui-icon-next-svg {
    background-image: url(Images/calendar/next_normal.svg);
    background-position-x: 50%;
  }

  button.ui-state-hover span.ui-icon.ui-icon-next-svg {
    background-image: url(Images/calendar/next_hover.svg);
  }

  /*Full Calendar Technical*/
  .fc-technical-div {
    border-style: solid;
    border-width: 1px;
    border-color: #dddddd;
  }

  .fc-technical-table {
    border-bottom: solid;
    border-bottom-width: 1px;
    border-bottom-color: #dddddd;
    overflow-y: scroll;
    overflow-x: hidden;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
  }

    .fc-technical-table th {
      border-style: solid;
      border-width: 1px;
      border-color: #dddddd;
    }

    .fc-technical-table tr > th:first-child {
      vertical-align: middle;
      padding: 5px !important;
      width: 100px;
    }

    .fc-technical-table tr > th:last-child {
      vertical-align: middle !important;
      width: 20px;
    }

  .fc-disable-text-selection {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
  }

  .fc-eventMouseTooltip {
    width: auto;
    height: auto;
    border-width: 1px;
    border-style: solid;
    position: absolute;
    z-index: 10001;
    display: none;
    padding: 10px 10px 10px 10px;
    border-radius: 5px;
    color: whitesmoke;
    background-color: cadetblue;
  }

  .fc-eventHoliday {
    font-size: 12px;
    position: relative;
    padding-left: 5px;
  }

  /*Unscheduled Work Order Drag and Drop related styles*/
  /*Main container for Unscheduled Work orders*/
  .fc-tech-workorder-container {
    width: 96%;
    bottom: 1px;
    padding: 5px 5px 5px 5px;
  }

  .fc-jobs-workorders-container {
    padding: 0 10px;
    border: 1px solid #ccc;
    text-align: left;
    width: 100%;
  }

  .fc-jobs-workorders {
    border: 1px solid #c9c9c9;
    width: 100%;
    max-height: 200px;
    overflow-y: scroll;
    padding-bottom: 5px;
    margin-bottom: 5px;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
  }

  .fc-job-workorders {
    font-weight: bold;
    border: 1px solid #c9c9c9;
    display: inline-block;
    padding: 5px 5px 5px 5px;
    margin: 5px 5px;
  }

  .fc-job-workorder {
    font-weight: normal !important;
    display: inline-block;
    padding: 2px 2px;
    margin: 2px 2px;
    cursor: move;
    background: linear-gradient(to bottom, #eeeeee 0%,#cccccc 100%);
  }

  .fc-workorder-selected {
    background: #F58022 !important;
    opacity: 0.7;
    color: black;
  }

  .fc-tech-tooltip {
    position: relative;
    border-bottom: 1px dotted black;
  }

    .fc-tech-tooltip .fc-tech-tooltip-text {
      visibility: hidden;
      width: 120px;
      background-color: white;
      color: black;
      text-align: center;
      padding: 5px 0;
      border: solid thin black;
      position: absolute;
      z-index: 1;
      top: 100%;
      opacity: 0.8;
    }

    .fc-tech-tooltip:hover .fc-tech-tooltip-text {
      visibility: visible;
    }

    .fc-tech-tooltip .fc-tech-tooltip-text::after {
      content: "";
      position: absolute;
      bottom: 100%;
      left: 5%;
      margin-left: -5px;
      border-width: 5px;
      border-style: solid;
      border-color: black transparent transparent transparent;
    }

  .fc-psa-event-border {
    border-left-width: 8px !important;
    border-right-width: 0px !important;
    border-top-width: 0px !important;
    border-bottom-width: 0px !important;
  }

  /* This fixes an issue with base.css breaking the css styling on the map */
  .external-map img, object, video {
    max-width: none;
  }

  .external-map {
  }

  .external-directions {
    overflow-y: auto;
  }

  /* PSA-Scan supportting css.*/

  #interactive.viewport canvas.drawingBuffer, video.drawingBuffer {
    margin-left: -320px;
  }

  #interactive.viewport canvas, video {
    float: left;
    width: 320px;
  }

  .inline {
    float: left;
    margin: 3%;
  }

  /*Job Attachment css*/
  .list-view-table-header {
    text-align: left;
    font-weight: bold;
  }

  #filesDiv {
    overflow: auto;
    display: inline;
  }

  .shadowed-badge {
    position: absolute;
    bottom: 0;
    right: 0;
    margin-bottom: 6px;
    margin-right: 6px;
    color: #333;
    font-weight: bold;
    font-size: 15px;
  }
  .shadowed-badge.large-thumbnail{
    margin-bottom: 23px;
    margin-right: 32px;
  }
  .shadowed-badge.small-thumbnail{
    margin-bottom: 14px;
    margin-right: 8px;
  }

  .content-editable {
    outline-width: 0;
    min-height: 1em;
    line-height: 1em;
    padding-left: 2px;
    padding-bottom: 0px;
    padding-right: 0px;
    padding-top: 0px;
  }

  /*Job Sketching Css Start*/
  #canvasWrapper {
  }

  #canvas {
    width: 100%;
    height: 100%;
    margin: 0px;
  }

  #pntLine {
    background: url(Images/sketching/Line.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntRectangle {
    background: url(Images/sketching/Rectangle.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntRemove {
    background: url(Images/sketching/fileclose.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntCircle {
    background: url(Images/sketching/circle.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    width: 30px;
    height: 30px;
  }

  #pntEllipse {
    background: url(Images/sketching/Ellipse.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #FreeDraw {
    background: url(Images/sketching/FreeDraw.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntArrow {
    background: url(Images/sketching/Arrow.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    width: 30px;
    height: 30px;
  }

  #pntText {
    background: url(Images/sketching/Text.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntErase {
    background: url(Images/sketching/Eraser.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntRotateRight {
    background: url(Images/sketching/RightIcons.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  #pntRotateLeft {
    background: url(Images/sketching/LeftIcons.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 30px;
    height: 30px;
  }

  .customSizeTextBox {
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
  }
  /*Job Sketching Css End*/


  /* =============================================================== */
  /* Media Queries
================================================================ */


  /* Higher than 960 (desktop devices) */
  @media only screen and (min-width: 960px) {
    .flexslider {
      height: 345px;
    }

    .slider_description h1 {
      margin-bottom: 15px;
      font-size: 30px;
      line-height: 40px !important
    }

    #portfolio-wrapper {
      min-height: 350px;
    }

    .project .flexslider {
      min-height: 1px;
      margin-bottom: 20px;
    }
    /*.fc-technical-div {
        height: 690px;
        overflow-y:auto;
    }*/
    .fc-tbl-container {
      overflow-y: auto;
      overflow-x: hidden;
      max-height: 410px;
    }

    #WorkOrderDetailList {
      height: 420px !important;
    }

    #WorkOrderList {
      !important;
    }
  }

  /* Smaller than standard 960 (devices and browsers). */
  @media only screen and (max-width: 959px) {
  }

  /* Tablet Portrait size to standard 960 (devices and browsers) */
  @media only screen and (min-width: 768px) and (max-width: 959px) {
    .slider_description {
      margin-top: 90px;
    }

      .slider_description h2 {
        margin-bottom: 15px;
        font-size: 20px;
      }

      .slider_description h1 {
        margin-bottom: 15px;
        font-size: 30px;
        line-height: 40px !important
      }

      .slider_description p {
        display: none;
      }

      .slider_description h2 b {
        display: none;
      }

    .client-logo img {
      width: 148px;
      height: auto;
    }

    .post-title h2 a {
      padding-left: 145px;
    }

    .latest-post-blog, .latest-post {
      height: 65px;
    }

    .flickr-widget-blog a {
      width: 57px;
      height: 57px;
    }

    .avatar {
      height: 40px;
      width: 40px;
    }

    .testimonials_author {
      display: none;
    }

    .fc-jobs-workorders-container {
      padding: 0px 5px !important;
      border: 1px solid #ccc;
      text-align: left;
      width: 100%;
    }

    .fc-tbl-container {
      overflow-y: auto;
      max-height: 150px;
    }

    /*for smaller screen, it does not fit */
    #technicanTableFixedHeader {
      display: none;
    }
    /*Report Print Buttons are hidden, hence moving to next line*/
   /* .dxrd-toolbar-wrapper {
      overflow: auto !important;
    }

      .dxrd-toolbar-wrapper .dxrd-toolbar {
        width: 80% !important;
      }

      .dxrd-toolbar-wrapper:nth-child(12n+0).dxrd-toolbar {
        margin: 0% !important;
        clear: right !important;
      }*/

    #WorkOrderDetailList {
      height: 380px !important;
    }

    #WorkOrderList {
      height: 475px !important;
    }

    .total-table {
      font-size: 90% !important;
    }
  }


  /* All Mobile Sizes (devices and browser) */
  @media only screen and (max-width: 767px) {
    .slider_description {
      display: none;
    }

    #nav {
      float: none;
    }

    .js #menu {
      display: none;
    }

    .js .selectnav {
      display: block;
    }

    #backtotop a {
      display: none;
    }

    .social-links {
      margin: -5px 0 20px 0;
      float: left;
    }

    .info-box a {
      margin: 15px 0 0 0;
    }

    .info-box p {
      margin: 10px 0 0 0;
    }

    .post-content {
      margin: 0 !important;
    }

    .post-title h2 a {
      padding: 0;
    }

    .post-date {
      text-align: left;
    }

    .blog-sidebar {
      display: none;
    }

    .project .flexslider {
      margin-bottom: 20px;
    }

    .mr-rotato-prev, .mr-rotato-next, .mr-rotato-disabled {
      margin-right: -10px;
    }

    .fc-technical-div {
      height: 310px;
      /*for smaller screen, it does not fit */
      width: 600px;
    }

    .fc-view-container {
      /*for smaller screen, it does not fit */
      overflow-x: scroll;
    }

    .fc-tbl-container {
      overflow-y: auto;
      max-height: 300px;
    }

    .fc-tbl-container {
      overflow-y: auto;
      max-height: 300px;
    }

    /*for smaller screen, it does not fit */
    #technicanTableFixedHeader {
      display: none;
    }

    /*Report Print Buttons are hidden, hence moving to next line*/
    .dxrd-toolbar-wrapper {
      overflow: auto !important;
    }

      .dxrd-toolbar-wrapper .dxrd-toolbar {
        width: 50% !important;
      }

      .dxrd-toolbar-wrapper:nth-child(7n+0).dxrd-toolbar {
        margin: 0% !important;
        clear: right !important;
      }

    #WorkOrderDetailList {
      height: 380px !important;
    }

    #WorkOrderList {
      height: 490px !important;
    }

    .total-table {
      font-size: 90% !important;
    }

    .mobileView .mobileView-en{
      width: 90% !important;
    }
  }


  /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
  @media only screen and (min-width: 480px) and (max-width: 767px) {
    .client-logo img {
      width: 139px;
      height: auto;
    }

    .custom-slide {
      height: 270px;
    }

    .avatar {
      height: 35px;
      width: 35px;
    }

    .fc-technical-div {
      height: 220px;
      /*for smaller screen, it does not fit */
      overflow-y: auto;
      width: 602px;
    }

    .fc-tbl-container {
      overflow-y: auto;
      max-height: 210px;
    }

    /*for smaller screen, it does not fit */
    #technicanTableFixedHeader {
      display: none;
    }

    /*Report Print Buttons are hidden, hence moving to next line*/
    .dxrd-toolbar-wrapper {
      overflow: auto !important;
    }

      .dxrd-toolbar-wrapper .dxrd-toolbar {
        width: 50% !important;
      }

      .dxrd-toolbar-wrapper:nth-child(7n+0).dxrd-toolbar {
        margin: 0% !important;
        clear: right !important;
      }

    #WorkOrderDetailList {
      height: 380px !important;
    }

    #WorkOrderList {
      height: 490px !important;
    }
  }

  /* Minimum mobile size only */
  @media only screen and (max-width: 479px) {
    #login select {
      margin-bottom: 0px;
      width: 100px;
      height: 30px;
      display: inline-block;
    }

    .fc-technical-div {
      height: 220px;
    }

    .fc-tbl-container {
      overflow-y: auto;
      max-height: 150px;
    }

    /*for smaller screen, it does not fit */
    #technicanTableFixedHeader {
      display: none;
    }

    /*Report Print Buttons are hidden, hence moving to next line*/
    .dxrd-toolbar-wrapper {
      overflow: auto !important;
    }

      .dxrd-toolbar-wrapper .dxrd-toolbar {
        width: 30% !important;
      }

      .dxrd-toolbar-wrapper:nth-child(7n+0).dxrd-toolbar {
        margin: 0% !important;
        clear: right !important;
      }

    #WorkOrderDetailList {
      height: 380px !important;
    }

    #WorkOrderList {
      height: 490px !important;
    }
  }

  @media only screen and (min-height: 800px) and (max-height: 900px) {
    #WorkOrderDetailList {
      height: 385px !important;
    }

    #WorkOrderList {
      height: 555px !important;
    }
  }

  @media only screen and (min-width: 960px) and (max-width: 1270px) {
    #WorkOrderList {
      height: 500px !important;
    }
  }

  @media only screen and (min-width: 960px) and (max-width: 1270px) and (min-height: 800px) and (max-height: 900px) {
    #WorkOrderList {
      height: 580px !important;
    }
  }

  @media only screen and (min-width: 492px) and (max-width: 960px) and (min-height: 800px) and (max-height: 900px) {
    #WorkOrderDetailList {
      height: 330px !important;
    }

    #WorkOrderList {
      height: 410px !important;
    }

    .total-table {
      font-size: 90% !important;
    }
  }

  /* Print format */
  @media print {
    .fc-tech-workorder-container {
      display: none !important;
    }

    #FilterView {
      display: none !important;
    }

    #nav {
      display: none !important;
    }

    #login {
      display: none !important;
    }

    #mainlogo {
      display: none !important;
    }

    #calendar {
      width: 950px !important;
    }

    #printLisTbl {
      width: 950px !important;
    }
    /*.featured{
        display: none !important;  
    }*/
    .fc-day-grid-container {
      display: inline-table !important;
    }
    /*Advanced Scheduling*/
    #advancedView {
      width: 950px !important;
      height: 1350px !important;
    }

    #EventView {
      display: none !important;
    }

    #advancedSchControl {
      display: none !important;
    }

    #workSpace {
      overflow-x: visible !important;
      overflow-y: visible !important;
      width: auto !important;
      height: auto !important;
      border: none !important;
    }

    #lblGanttChart {
      display: inline-block !important;
    }

    #lblJobSpan {
      display: inline-block !important;
    }

    header {
      display: none !important;
    }

    footer {
      display: none !important;
    }

    td input {
      -webkit-box-shadow: none;
      box-shadow: none;
    }

    .notDisplayInPrint {
      display: none !important;
    }

    #JobTabs {
      margin: 0 0 !important;
    }
    /*Advanced Scheduling End*/
  }

  .ui-dialog .ui-dialog-titlebar {
    background: #1f70ad;
  }

  .ui-dialog .ui-dialog-title {
    color: white;
  }


  .float-right.checkbox {
    margin-top: 16px;
  }

  .float-right.label {
    padding-top: 15px;
    padding-right: 5px;
    font-size: 15px;
    font-family: Helvetica,Arial,sans-serif;
    line-height: 16px;
    color: #666
  }

  /* The switch - the box around the slider */
  .switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 22px;
  }

    /* Hide default HTML checkbox */
    .switch input {
      display: none;
    }

  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #287fc8;
    -webkit-transition: .4s;
    transition: .4s;
  }

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

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

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

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

  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }

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

  mark.WorkflowCC {
    background-color: red;
    color: white;
    font-weight: bold;
    padding: 2px 6px;
    margin-left: 12px;
  }

  select.dateFilterBox,
  input.dateFilterBox {
    width: 100%;
    display: inline-block;
    border: 1px solid #bababa;
    color: #333;
    margin: 5px 0 6px 0;
    padding: 5px;
    width: 100%;
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    outline: none;
    font: 1.2em Helvetica,Arial,sans-serif;
    max-width: 100%;
    display: block;
    background: #fff;
    -webkit-box-shadow: 0px 1px 1px 0px rgba(180, 180, 180, 0.1);
    box-shadow: 0px 1px 1px 0px rgba(180, 180, 180, 0.1);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
  }

  #ui-datepicker-div {
    z-index: 102 !important;
  }

  .color_block_for_dropdown_template {
    display: inline-block;
    float: right;
    border: 1px solid;
    border-color: #444444;
    min-width: 32px;
    max-height: 16px;
    margin-right: 6px;
  }

  .color_block_for_dropdown_format {
    display: inline-block;
    float: right;
    border: 1px solid;
    border-color: #444444;
    min-width: 32px;
    max-height: 16px;
    margin-top: 6px;
    margin-right: 8px;
  }

.color_block_for_edit_in_list {
  display: block;
  min-width: 22px;
  border: 1px solid;
  border-color: #000000;
}

.color_block_for_edit_in_view {
  display: inline-block;
  width: 22px;
  border: 1px solid;
  border-color: #000000;
}

.controlcenter_stage {
    position: relative;
    text-align: center;
    color: white;
}

.controlcenter_stage_counttext {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.CenterImage {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
}

.ControlCenterTextCount {
    color: white;
    width: 80%;
    font-size: 26px
}


/* Announcement Slide Bar */
#announcement-sidebar {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    width: 400px;
    height: 100vh; /* full height of viewport */
    background-color: #fff;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease;
    z-index: 1000;
    padding: 20px;
    transform: translateX(100%); /* slide out to right */
    transition: transform 0.6s ease;
    display: none; /* hidden by default */
    display: flex;
    flex-direction: column;
}

#announcement-sidebar.open {
    transform: translateX(0);
    display: block;
}

#announcement-sidebar p {
    font-size: 1.00rem; /* ~20px */
    font-weight: bold;
    margin: 0;
    line-height: 1.5; /* Adjust line height to better align */
}

.announcement-sidebar-divider {
    border: none;
    border-top: 2px solid #ccc;
    margin: 10px 0;
    width: 100%;
}

.announcement-sidebar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#announcement-sidebar-content {
    flex: 1;
    overflow-y: auto;
}

.announcement-box {
    background-color: #f9f9f9;
    padding: 8px 10px;
    border-left: 3px solid #2196F3;
    margin-bottom: 8px;
}

/* target the paragraph inside your announcement box */
.announcement-box p {
    font-size: 0.9rem !important;
    font-weight: 400 !important;
    color: #333;
    margin: 0;
    line-height: 1.4;
}

.announcement-sidebar-scrollable {
    max-height: 90vh;
    overflow-y: auto;
    padding-right: 8px;
}

.announcement-sitebar-item {
    display: flex;
    align-items: flex-start;
    gap: 8px; /* spacing between icon and box */
    margin-bottom: 10px;
}

.announcement-site-bar-small-icon {
    font-size: 0.8em;
    color: #bbb;
    cursor: pointer;
    margin-top: 12px; /* vertically align */
}