@font-face{ 
	font-family: 'Gibson-Regular';
	src: url('/Content/font-awesome/fonts/Gibson-Regular-webfont.eot');
	src: url('/Content/font-awesome/fonts/Gibson-Regular-webfont.eot?#iefix') format('embedded-opentype'),
	     url('/Content/font-awesome/fonts/Gibson-Regular-webfont.woff') format('woff'),
	     url('/Content/font-awesome/fonts/Gibson-Regular-webfont.ttf') format('truetype'),
	     url('/Content/font-awesome/fonts/Gibson-Regular-webfont.svg#webfont') format('svg');
}

@font-face{ 
	font-family: 'Gibson-SemiBold';
	src: url('/Content/font-awesome/fonts/Gibson-SemiBold-webfont.eot');
	src: url('/Content/font-awesome/fonts/Gibson-SemiBold-webfont.eot?#iefix') format('embedded-opentype'),
	     url('/Content/font-awesome/fonts/Gibson-SemiBold-webfont.woff') format('woff'),
	     url('/Content/font-awesome/fonts/Gibson-SemiBold-webfont.ttf') format('truetype'),
	     url('/Content/font-awesome/fonts/Gibson-SemiBold-webfont.svg#webfont') format('svg');
}

html
{
    min-height: 100%;
    /*height: 100%;*/
    margin: 0;
    padding: 0; 
    font-family:'Gibson-Regular','Gibson-SemiBold', Verdana !important;
    font-size: 13px;
    
    background: #FFFFFF; /* Old browsers */
    
/******** 
   LEFT AND RIGHT SIDES - SKYBLUE HAS A GRADIENT LIGHT TO DARK BLUE. 
   TO NOT HAVE A GRADIENT, USE THE SAME START AND END COLORS. 
   TO NOT HAVE ANY COLOR, USE WHITE: #FFFFFF
********/
    background: -moz-linear-gradient(top, #FFFFFF 0%, #FFFFFF 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#FFFFFF)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #FFFFFF 0%,#FFFFFF 100%); /* IE10+ */
    background: linear-gradient(to bottom, #FFFFFF 0%,#FFFFFF 100%); /* W3C */    
}

html body {
  margin: 0;
  padding: 0;  
}

.clear {
    clear: both;
}
.clearfix:after {
  display: block;
  visibility: hidden;
  height: 0;
  clear: both;
  content: ".";
}

/************ CHANGE TO YOUR LOGO FILENAME AND SIZE AND ADJUST BACKGROUND-POSITION ****************/
.Logo {    
    background-image: url('../Images/solventum-logo-horz-clr-pos-rgb-en5.png') !important;
    width: 466px;
    height: 95px;
    margin: 0px auto;
    background-repeat: no-repeat;
    padding: 20px;
    background-color: white;
	background-position: 45px 30px 
	align: left;
}

/******** 
	'WELCOME' BAR (LEFT TO RIGHT GRADIENT) - typically begins with white (ffffff) and ends in another color. Use same colors to have no gradient
********/
.main-content-banner {
background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxNSUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMTM1OGFmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(left,  #ffffff 15%, #05DD4D 100%, #ffffff 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(15%,#ffffff), color-stop(100%,#05DD4D), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(left,  #ffffff 15%,#05DD4D 100%,#ffffff 100%);
background: -o-linear-gradient(left,  #ffffff 15%,#05DD4D 100%,#ffffff 100%);
background: -ms-linear-gradient(left,  #ffffff 15%,#05DD4D 100%,#ffffff 100%);
background: linear-gradient(to right,  #ffffff 15%,#05DD4D 100%,#ffffff 100%);
position: absolute; 
left: 15px; 
right: 25px; 
width: 995px; 
text-align: right; 
height: 25px; 
border-radius: 4px;
color: #ffffff  /* 'Welcome' font color */
}

/******** MENU BAR (LEFT TO RIGHT GRADIENT) - USE SAME COLORS TO HAVE NO GRADIENT ********/
.main-menu {
    background: #000000; /* Old browsers */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmOTkwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjcyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #000000 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #000000 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #000000 0%,#000000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #000000 0%,#000000 100%); /* IE10+ */
    background: linear-gradient(to bottom, #000000 0%,#000000 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=0 );*/ /* IE6-8 */


    height: 33px; 
    position: absolute; 
    left: 15px; 
    top: 30px; /************* CHANGED 95 to 30 - makes the menu bar closer to the welcome bar **************/
    z-index: 3000; 
    width: 995px; 
    font-family:'Gibson-SemiBold' !important;
	font-size: 14px;    
}

#menu .k-state-selected{
    background-color: #000000 !important;    
}

/* MENU HOVER COLOR */
#menu .k-state-hover{
   background-color: #000000 !important;    
}

#menu ul{
   list-style-type: none;
   text-align: center;
}
#menu li{
   display: inline;
   text-align: center;
   color: #000000;
}

/*On menu bar keeps links with white text and removed blue hover effect*/
#menu .k-link {
    color: white;
    background-color: #000000;
}

.k-link:link, 
.k-link:visited
{
    color: #000000;
    font-weight: bold;
}

.link {
    cursor:hand;
    cursor:pointer;
}

.titleContentSection
{
    color : #FF0000 !important;            
}


/*  
********************* LOCATION OF CONTENT **************************
--> Essentially to make all 3 pages work, I think we need to keep these settings.
--> Login page and CSR page honor the 'top' position and the content is closer to the menu. On the Consumer page, there must be something else in between the menu and the content.
Login page: These settings center the content
Consumer Page: These settings make the search & grid take up 75% of the screen under the menu. Can't change to 100% because then it's way too large for CSR. 
Seems like the Consumer view is intended to always have the right side area for an add. You can hide the ad but I can't get rid of the white space 
(even hidding or changing the width on the inner-wrap-right doesn't help)
CSR: Uses full width under the menu.
 */
#inner-wrap {
    top: 35px !important;
}
/*  White space on right side of content */
#inner-wrap-right {
    width: 22%;   
    border-left: 1px solid #000000;
    text-align:right; 	
}
#inner-wrap-left {
    width: 75%;
    left: 25px;
    top: 40px;   /* starting position of content after menu bar */
    position: absolute;
}
/* ********************* END LOCATION OF CONTENT *********************/



/*Required field (*) color*/
.text1 {
    color: #ff0000; 
}

/*Link color*/
.text2 {
    color: #000000;
}

/************ colors behind the login and search areas *******************/
.roundbox1 {
    border-radius : 4px;
    border: 1px solid #333333;
    background-color:#DDDDDD;
    padding:10px 20px 10px 20px;
    overflow:auto;
}

.roundbox2 {
    border-radius : 4px;
    border: 1px solid #333333;
    background-color:#DDDDDD;
    padding:10px 20px 10px 20px;
    overflow:auto;
}

/************ 'main' buttons like login, register, search, reset ************/
.button1 {
    border: 1px solid #000000;
    font-family:'Gibson-SemiBold' !important;
    color: #ffffff;
    background: #000000; /* Old browsers */
/******** GRADIENT FOR BUTTONS – SET TO SAME COLOR IF YOU DON’T WANT GRADIENT ********/
    background: -moz-linear-gradient(top, #000000 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #000000 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #000000 0%,#000000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #000000 0%,#000000 100%); /* IE10+ */
    background: linear-gradient(to bottom, #000000 0%,#000000 100%); /* W3C */
}

/************ buttons like "+" and "x" in search area ************/
.button2 {
    border: 1px solid #000000;
    font-family:'Gibson-SemiBold' !important;
    color: #ffffff;
    background: #000000; /* Old browsers */
    background: -moz-linear-gradient(top, #000000 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #000000 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #000000 0%,#000000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #000000 0%,#000000 100%); /* IE10+ */
    background: linear-gradient(to bottom, #000000 0%,#000000 100%); /* W3C */
}


/* Keep button text white upon click */
.k-button {
    color: white!important;
    vertical-align: top;
}

/* button hover color */
.k-button:hover {
    background-color: #588ECA!important;
}

/*Removes blue shadow from buttons*/
.k-button:focus {
    box-shadow: none !important;
    border-color: transparent;
}

/*Removes blue focus effect on input fields*/
.k-input {
    border-color: #333333 !important;
    box-shadow: none !important;
}

/*Removes blue shadow from input*/
.text-box:focus {
    outline: none;
}

/*Removes hover color from input text fields */
.k-input.k-textbox.valid:hover {
    background-color: white !important;
}
.k-input.k-textbox:hover {
    background-color: white !important;

}

div.centre
{    
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.label {
    font-family : Verdana !important;
    font-size: 12px;
    font-weight: bold; 
    padding-left:3px;
    word-spacing:3px;
}

.labelemail {
    font-family : Verdana !important;
    font-size: 12px;
    font-weight: bold;    
    padding:2px 0px 2px 0px;
    word-spacing:3px;
    width:60px;
    display:inline-block;
}

.headline {
    font-family:'Gibson-Regular' !important;
    font-size: 22px;
}

.img-sidebar {
    padding-left:10px;
    padding-bottom:10px;
    padding-right:0px;
}
.bold {
    font-weight:bold !important;
}

.k-pager-sizes-label {
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 20px;
}

.k-pager-wrap > .k-link {
    border-radius: 4px;
    background-color: #000000 !important;
}

.k-pager-numbers .k-state-selected
{
    color:#000000;
    font-weight:bold;
    border-radius : 0px;
    background-color: #ffffff;
    -webkit-box-shadow: none ;
    box-shadow: none;
    line-height: 23px;
    border-style: none;
}

.k-grid .k-pager-wrap, 
.k-pager-numbers > li a
{
    color: #333333 !important;
}

.k-pager-sizes {
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}



#wrap {
min-height:100%;
position:relative;
}

/************************* Calendar ********************

/* Color of font in Calendar header */
.k-calendar .k-header .k-link:link,
.k-calendar .k-header .k-link:visited
{
color: #ffffff !important;
background-color: #000000 !important;
}

/* Fixes some of the calendar colors but today's date is still blue */
.k-calendar .k-today.k-state-selected {
    background-color: #000000 !important;
}
td.k-state-selected.k-state-focused, .k-state-selected.k-state-highlight {
    background-color: #000000 !important;
}
.k-button:hover, .k-autocomplete.k-state-hover, .k-picker-wrap.k-state-hover, .k-numeric-wrap.k-state-hover, .k-dropdown-wrap.k-state-hover, .k-textbox:hover, .k-state-hover, .k-state-hover:hover, .k-pager-wrap .k-link:hover, .k-other-month.k-state-hover .k-link, div.k-imagebrowser-dropzone em{
    background-color: #588ECA !important; 
	color: #000000
}
.k-listview>.k-state-focused.k-state-selected, .k-state-selected td.k-state-focused, td.k-state-focused.k-state-selected {
  box-shadow: none !important;
}
/************************ End Calendar ************************************************/

/*********** CHANGE GRID HEADER COLOR****************/
.k-pager-wrap > .k-link {
border-radius: 4px;
background-color: #000000 !important;
}
.k-block, .k-header, .k-grid-header, .k-toolbar, .k-grouping-header, .k-tooltip, .k-pager-wrap, .k-button, .k-draghandle {
background-color: #000000;
}
/*********** END GRID HEADER ****************/

.k-grid-header .k-header:first-child, 
.k-grid tbody td:first-child, 
.k-grid tfoot td:first-child {
    border-left-width : 0px !important;
    border-left-color: transparent !important;
}

.k-pager-wrap.k-grid-pager.k-widget {
    box-shadow: none;
    -webkit-box-shadow: none;
}
/************* Trying to change the hover color of the disabled grid paging buttons but it's not working *******/
.k-link .k-pager-nav .k-state-disabled:hover{
    background-color: #000000
}	

img {
    border: none;
}

/*************** Dropdowns *************************************/
.ddlActions .k-dropdown-wrap
{
    font-size: 11px !important;
    background-color : transparent !important;
    border-color: transparent !important;
    border-width:0px !important;    
}
.ddlActions .k-dropdown-wrap .k-select .k-icon
{
    background-position : 0 0 !important;
    background-color : transparent !important;
    background-image: url("/Images/dropdown.png") !important;
}
.ddlActions .k-dropdown-wrap.k-state-default .k-input,
.ddlActions .k-dropdown-wrap.k-state-default.k-state-hover .k-input,
.ddlActions .k-dropdown-wrap.k-state-default.k-state-focused .k-input
{
   color: #333333 !important; 

}

/* hover color of drop downs and calendar */
.k-state-hover:hover {
    background-color: #588ECA !important;
}

/* Color in arrow area of drop down when clicked */
span.k-dropdown-wrap.k-state-default.k-state-focused.k-state-active.k-state-border-down {
    background-color: #588ECA !important;
}
li.k-item.k-state-selected.k-state-focused {
    background-color: #588ECA !important;
    color: #333333;
    border-color: transparent !important;
}
li.k-item.k-state-selected.k-state-focused:hover {
    background-color: #588ECA !important;
    color: #333333 !important;
    border-color: transparent !important;
}
span span.k-dropdown-wrap.k-state-default.k-state-focused {
    background-color: #588ECA !important;
}
span.k-input {
    background-color: white !important;
    color: #333333 !important;
}
.k-popup .k-list .k-item:hover {
    background-color: white !important;
    color: #333333 !important;
}

/*Keeps drop down arrow black does not disappear*/
.k-i-arrow-60-down:hover {
    color: black;
}
/*************** End Dropdowns *************************************/


.k-grid-column-link
{
    color: #333333 !important;
    text-decoration: underline;
    cursor: pointer;
    cursor:hand;
}

.ddlActions.grid-buttons > ul
{
    font-size: 11px !important;
    background-color : transparent !important;
    border-color: transparent !important;
    border-width:0px !important;    
    color: #333333 !important;
}
.ddlActions.grid-buttons > ul .k-item .k-icon
{
    background-position : 0 0 !important;
    background-color : transparent !important;
    background-image: url("/img/dropdown.png") !important;
}
.ddlActions.grid-buttons > ul .k-item.k-state-default.k-state-hover,
.ddlActions.grid-buttons > ul .k-item.k-state-default.k-state-hover .k-link,
.ddlActions.grid-buttons > ul .k-item.k-state-default .k-state-active
{
    background-color : transparent !important;
    color: #000000 !important;
}
.ddlActions.grid-buttons > ul .k-item .k-animation-container > ul
{
    border-radius: 4px;
    color: #000000 !important;
    width: 100% !important;
}
.ddlActions.grid-buttons > ul .k-item .k-animation-container .k-group .k-item .k-link
{
    font-size:12px !important;
    font-weight: normal;
    color: #000000 !important;
}
.ddlActions.grid-buttons > ul .k-item .k-animation-container .k-group .k-item .k-link:hover
{
    color: #000 !important;
    border-color: #000000  !important;
    background-color: #000000 !important;
    border-radius: 4px;
}

.filter div > .k-widget,
.filter div > .k-input
{
    margin-left:6px;
}
.filter div 
{
    padding-top:2px;
    padding-bottom:5px;
}


.nodisplay {
    display:none;
}

/********** BACKGROUND IN DELIVERY OPTIONS SECTION ************/
.k-alt, .k-separator {
	background-color: #DDDDDD;
}

#modal-upload-publicdocs .filter div.k-upload {
    background: none;
    padding: 0px; 
    border: 0px;
    display: inline-flex;
}
#modal-upload-publicdocs .filter div.k-upload > ul.k-upload-files {
    display:none;
}

li#consentUsers_Option { 
    display:inline; 
}

/* Pushes cursor out from left border so that it shows up */
input#consumerId, input#genericField2, input#genericField3, input#CreateUser, input#password, input#confirmPassword, input#email, input#emailConfirmation, input#Questions_Answer1, input#Questions_Answer2 {
	padding-left: 5px;
}

/******* ERROR COLOR *******/
div.validation-summary-errors {
    color: #ff0000;
}

.footer {
    min-height:40px;
    background-color :#ffffff;    
    /*width: 1024px;*/
    width: 85%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    color: #666666;
    font-family : Verdana !important;
    font-size: 11px; 
}

.footer > div {
    border-top: 1px solid #000000;
    padding-top:5px;
    width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 975px; 
    margin-left: 25px;
}


/*Targets IE 10+ */
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  
    /* IE10+ specific styles go here */  
    #tblOpts tbody tr td:nth-of-type(2) fieldset span:first-of-type {display:inline;}
    #tblOpts tbody tr td:nth-of-type(2) fieldset span label[title="Print and Mail"] {display:none;}

    /* these lines delete the dropdown arrow span and replace the content in parent span with a UNICODE dropdown arrow*/
    .k-dropdown-wrap > .k-select {
        color: black !important;
    }
    .k-dropdown-wrap > .k-select::after {
        content: "?";
    }
    .k-i-arrow-60-down {
        display: none;
    }
}

label[for="datepicker-archive-end"] {
	visibility: hidden;
}
/* Select down from closest parent with an ID to the *first* <span> that contains the Print and Mail option */
#tblOpts tbody tr td:nth-of-type(2) fieldset span:first-of-type /*{display:none;}
/* Since the display attribute is inherited by children, the span containing the online label gets hidden 
   by the above CSS. This next line selects the child span and resets the display to initial, canceling the
   hidden display value that would normally be inherited. */
#tblOpts tbody tr td:nth-of-type(2) fieldset span span:first-of-type {display:initial;}
/* Also hide the <br> tag in the delivery options block so that the now-unneeded separator space is removed. */
#tblOpts tbody tr td:nth-of-type(2) fieldset br {display:none;}

