/****PPHVA START****/

/*TEMP HIDE MENU
#portlet-omhomenu, #portlet-omhomenu_new .portletHead {display:none;}
#toolBar li a {display:none;}
#toolBar li a#tool-logout,#toolBar li a#tool-me {display:inline-flex;}
#portlet-omhomenu_new {display:none;}*/

:root {
  /*
    ----  FROM PPHVA SITE  START  ----
  */

  /* Primary Dark Blue */
  --colors-primary-blue: #06175E;
  --colors-primary-blue-90: #1F2E6E;
  --colors-primary-blue-75: #445186;
  --colors-primary-blue-50: #828BAF;
  --colors-primary-blue-25: #C1C5D7;
  --colors-primary-blue-10: #E6E8EF;
  --colors-primary-blue-5: #F3F3F7;

  /* Blue */
  --colors-secondary-blue: #3B54BC;
  --colors-secondary-blue-90: #4E65C3;
  --colors-secondary-blue-75: #6C7FCD;
  --colors-secondary-blue-50: #9DA9DE;
  --colors-secondary-blue-25: #CED4EE;
  --colors-secondary-blue-10: #EBEEF8;
  --colors-secondary-blue-5: #F5F7FC;

  /* Secondary Salmon */
  --colors-primary-salmon: #FF977B;
  --colors-primary-salmon-75: #FFB19C;
  --colors-primary-salmon-50: #FFCBBD;
  --colors-primary-salmon-40: #FFD5CA;
  --colors-primary-salmon-25: #FFE5DE;

  /* Salmon Light */
  --colors-secondary-salmon: #FEB7A4;
  --colors-secondary-salmon-2: #FEC9BB;
  --colors-secondary-salmon-3: #FFDBD1;
  --colors-secondary-salmon-4: #FFEDE8;
  --colors-secondary-salmon-50: #FEFAF8;

  /* Salmon background */
  --bg-colors-salmon: #FBE9E3;
  --bg-colors-salmon-75: #FCEEEA;
  --bg-colors-salmon-50: #FDF4F1;
  --bg-colors-salmon-25: #C6C6C7;

  --colors-white: #FFFFFF;

  --colors-black: #1C1C1E;
  --colors-black-75: #555556;
  --colors-black-50: #8D8D8E;
  --colors-black-25: #C6C6C7;

  --colors-gray-dark: #474444;
  --colors-gray-dark-75: #757373;
  --colors-gray-dark-50: #A3A1A1;
  --colors-gray-dark-25: #D1D0D0;

  --colors-gray: #F0EEEE;
  --colors-gray-75: #F4F2F2;
  --colors-gray-50: #F8F7F7;
  --colors-gray-25: #FBFBFB;

  --colors-gray-light: #F4F4F5;
  --colors-gray-light-75: #F7F7F8;
  --colors-gray-light-50: #FAFAFA;
  --colors-gray-light-25: #FAFAFA;

  --colors-gradient-salmon: linear-gradient(180deg, #FED0C2 -24.49%, #FEB7A4 122.45%);
  --colors-gradient-blue: linear-gradient(180deg, #304393 0%, #06175E 100%);
  --colors-gradient-gray: linear-gradient(180deg, #FBFBFB 0%, #F3F3F4 100%);

  /* Feedback colors*/
  /* attention */
  --colors-yellow: #FAD683;
  --colors-yellow-75: #FBE0A2;
  --colors-yellow-50: #FDEBC1;
  --colors-yellow-25: #FEF5E0;
  /* success */
  --colors-green: #167A38;
  --colors-green-75: #519B6A;
  --colors-green-50: #8BBD9C;
  --colors-green-25: #C5DECD;
  
  /* warning */
  --colors-red: #C82A2A;
  --colors-red-75: #D65F5F;
  --colors-red-50: #E39595;
  --colors-red-25: #F1CACA;
  --colors-red-10: #FAEAEA;

  --colors-primary: var(--colors-primary-blue);
  --colors-heading: var(--colors-primary);
  --colors-body-text: var(--colors-gray-dark);

  /* from old, but is use in new layouts. For now */
  --colors-secondary-nav: hsl(226, 57%, 27%, 100%); /* Figma blue linear */
  --colors-primary-dark-blue-bg: #F9F9FB;

  /*
    ----  NEW COLORS FROM PPHVA SITE END  ----
  */

  --base-unit: 28px;
  --rembase: 16;
  --left-column-width:200px;
  --page-width: 1920px;
  --desktop-logo-width: 316px;
  --subpage-block-margin-top-bottom: 30px;
  --subpage-content-width: 820px;
  --z-index-top-bar: 1000;
  --block-y-margin: 30px;
  --container-x-padding: calc(var(--base-unit) * 1);	

  /* Typography. */
  --font-size-default: 16px;
  --line-height: 24px;
  --font-sans-serif: "Inter", sans-serif;
  --font-serif: "Times New Roman", Times, serif;
  --font-sans-serif-alt: "new-hero", sans-serif;

}

:root {

  --container-default-width: calc(70% + var(--container-x-padding) * 2);
}

html {
  font-size: 100%;
}

:root,
body {
  font-family: "Inter", sans-serif;
  font-family: var(--font-sans-serif);
  font-size: calc(var(--font-size-default) / var(--rembase) * 1rem);
  font-weight: 400;
  line-height: 24px;
  line-height: var(--line-height);
  letter-spacing: -0.01em;
  color: #1C1C1E;
  color: var(--colors-black);
  text-rendering: optimizeSpeed;
}

/*reset useragent styles, but not bootstrap
button:not(.btn):not(.btn-primary):not(.listViewTabButton):not(.col-1),
[type='button'],
[type='reset'],
[type='submit'] {
	all:unset;
}*/


button,
form,
input,
select,
textarea {
  font-family: "Inter", sans-serif;
  font-family: var(--font-sans-serif);
  font-size: inherit;
  font-weight: inherit;
  text-rendering: optimizeSpeed;
}

textarea {width:99%;}

input {
  border-radius: 4px
}

.qCheckbox input[type="checkbox"], .qRadio input[type="radio"], input[type="checkbox"], input[type="radio"] {
    height: 15px;
    width: 15px;
    /*vertical-align: middle;
    position: relative;
    bottom: 0.08em;*/
    vertical-align: -2px;
    margin: 0;
    padding: 0;
	margin-right:4px;
}

input::-moz-placeholder {
    opacity: 1;
    color: #06175E;
    color: var(--colors-primary);
  }

input:-ms-input-placeholder {
    opacity: 1;
    color: #06175E;
    color: var(--colors-primary);
  }

input::placeholder {
    opacity: 1;
    color: #06175E;
    color: var(--colors-primary);
  }

input:focus {
    outline: none !important;
    background-color: #FFFFFF;
    background-color: var(--colors-white);
}

fieldset label {
    color: #000;
    /*display: block;
    margin-bottom: 3px;*/
}

label, td.label {
    font-weight: bold;
    line-height: 1.4;
}

input.text, input[type=text], input[type=text].uneditable:hover, input[type=time], input[type=number], input.palaute_input, textarea, select, input.date.hasDatepicker {
    color: #2B456C;
    padding: 8px;
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: #2B456C !important;
    font-weight: bold;
}

input[type=submit].finish {
    border: none;
    background-color: #fbe9e3;
    background-color: var(--bg-colors-salmon);
    background-color: #feb7a4;
    background-color: var(--colors-secondary-salmon);
  	background-color: #feb7a4;
	background-color: var(--colors-secondary-salmon);
    border: 2px solid #feb7a4;
    border: 2px solid var(--colors-secondary-salmon);
    padding: 10px 32px 10px 32px;
    /* box-shadow: 0px 5px 15px #ccc;
    box-shadow: 0px 4px 10px #00000029;*/
}


span[id^='showed_if_'] label {
  color: black;
}

span[id^='showed_if_'] table {
  margin-left: 25px;
}

/*Hiding elements*/

#toolBar #tool-textsize, .profileContainerUserBar, 
#naviBar, #naviBarBkgnd, #portal-top #lang-switcher,
#profileLink,table#footerLogos, #showBtn,
#portlet-content-left2 .portletHead h5,
#portlet-content-left1 .portletHead h5,
#portlet-intro .portletHead h5, #portlet-omhointro .portletHead h5 {
	display:none;
}

/***portal-top start***/

#portal-top > * {
    flex-direction: column;
    /* flex-grow: 1; */
}

#portal-top {
  height: 90px;
  margin: 0 auto;
  /*max-width:1400px;*/
  width:100%;
  /* background-color: #2e3192; */
  display:flex;
  flex-wrap:wrap;
  align-items: center;
}

#portal-top #linkBar ul li a span {
	color: #fff;
	background: #0081C1;
	padding: 1px 4px 2px 4px;
	font-size: 80%;
}

h1#portal-logo {
    position: relative;
    background-image: url(images/PPHVA/Logo_desktop.png);
    background-repeat: no-repeat;
    background-position: 14px 5px;
    background-size: 175px;
    width: 14%;
    height: auto;
    border: 0;
    padding: 0;
    margin: 0;
    display: block;
    float: left;
    z-index: 150;
    background-color:#fff;
    min-width: 200px;
}

h1#portal-logo a {
	display: block;
	text-decoration: none;
	float:left;
	width:100%;
	height:90px;
	max-height:90px;
	overflow: hidden;
	border: 0;
	cursor: pointer;
    color:transparent;
}

/****PPHVA START****/
*,
::before,
::after {
	box-sizing: border-box;
}

html body {
	background-color:#F4F6F8;
	background-attachment:fixed;
    font-family: var(--font-sans-serif-alt);
	/*font-size: 90%;
	font-size:14px;*/
	color: #35414b;
	margin:0;
}

span[id^='showed_if_'] label {
  color: black;
}

span[id^='showed_if_'] table {
  margin-left: 25px;
}

/*Hiding elements*/

#toolBar #tool-textsize, .profileContainerUserBar, 
#naviBar,
#naviBarBkgnd,
#portal-top #lang-switcher, #profileLink,table#footerLogos, #showBtn {display:none;}

/***portal-top start***/

#portal-top > * {
    flex-direction: column;
    /* flex-grow: 1; */
}

#portal-top {
    height: 100px;
    margin: 0 auto;
    /* max-width:1400px; */
    width:100%;
    background-color: #2e3192;
    background-color: #1e306c;
    background-color: var(--colors-secondary-nav);
    background-color: #06175e;
    background-color: var(--colors-primary);	  
    display:flex;
    flex-wrap:wrap;
    /* align-items: center; */
    /* justify-content: center; */
    position: relative;
}

#portal-top #linkBar ul li a span {
	color: #fff;
	background: #0081C1;
	padding: 1px 4px 2px 4px;
	font-size: 80%;
}

h1#portal-logo {
    position: relative;
    background-image: url(images/PPHVA/Logo_desktop.png);
    background-repeat: no-repeat;
    background-position: 22px 10px;
    background-size: 175px;
    width: 14%;
    height: 100%;
    border: 0;
    padding: 0;
    margin: 0;
    display: block;
    float: left;
    z-index: 1;
    background-color:#fff;
    min-width: 220px;
}

h1#portal-logo a {
	display: block;
	text-decoration: none;
	float:left;
	width:100%;
	height:90px;
	max-height:90px;
	overflow: hidden;
	border: 0;
	cursor: pointer;
    color:transparent;
}

h2#portal-title {
	z-index: 1;
	color: var(--colors-white);
	padding: 29px;
	border-radius: 0 0 4px 4px;
	z-index: 2;
	background: #2e3192;
	background-color: #1e306c;
	background-color: var(--colors-secondary-nav);
	background-color: #06175e;
	background-color: var(--colors-primary);	  
	height: 100%;
	margin: 0px;
	margin-left: -3px;
	font-size: calc(21 / 16 * 1rem);
	padding-left: 23px;
    line-height: 42px;
}

/* toolBar */

/*#toolBar > ul:last-child::after {content:none;}*/

#toolBar {
	z-index: 3;
	margin-left: auto;
	display: flex;
	height:100%;
}

/*#toolBar ul {
	margin: 0;
	list-style: none;
	display:flex;
	flex-direction: row-reverse;
	height:100%;
	padding:0;
	align-items: flex-end;
}*/


element.style {
}
#toolBar ul {
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: row-reverse;
    height: 100%;
    align-items: center;
    justify-content: center;
    column-gap: 20px;
}

#toolBar ul ul { padding: 0; }
#toolBar ul li {
	margin-left: 0;
	/* float: right; */
}

#toolBar ul li:first-child {
    align-self: center;
    /* position: absolute; */
    /* right: 400px; */
}

/*Move settings to right
#toolBar ul li:nth-child(2) {
	position:absolute;
}*/

#toolBar ul li:nth-child(3) {
	/* position:absolute; */
	/* left: 393px; */
}


#toolBar ul li a {
	text-decoration: none; 
}
#toolBar ul li a {
    overflow: hidden;
    font-weight: bold;
    text-decoration: none;
    margin-right: 10px;
    color: var(--colors-white);
}

#toolBar ul li a#tool-logout, #toolBar ul li a#tool-exit {
    color: var(--colors-primary);
}

#toolBar ul li a#tool-home:hover, #toolBar ul li a#tool-me:hover {
	color: #FEB7A4;
    color: var(--colors-secondary-salmon);
}

#toolBar ul li a#tool-home {display:none;}

#tool-logout::after, #tool-exit::after {content:"" !important;}


#tool-logout::before, #tool-exit::before {
	font-family: 'Font Awesome 5 Free';
    content: "\f2f5";
	font-size:20px;
	margin-right:5px;
}

#tool-logout:hover::before, #tool-exit:hover::before {
  transform: translate3d(3px, 0, 0);
}

/* userBar, previously known as linkBar */

#userBar .home-button {
    background: none;
    padding: 0px;
    margin: 0px;
    color: #fff;
    text-align: center;
    border-radius: 0px;
    box-shadow: none;
    display: inline-block;
    box-shadow: none;
    outline: none;
    text-shadow: none;
    border: 0;
    float: left;
    cursor:pointer;
}

.home-button span {
    color: #FFF;
    -moz-transition: .2s;
    -webkit-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
}

.home-button span:hover {
    color: #FEB7A4;
    color: var(--colors-secondary-salmon);
}

.not-logged-in .home-button {display:none;}

#userBar {
  	display: flex;
	flex-grow: 1;
	justify-self: flex-end;
	align-items: center;
	flex-direction: row;
}

#userBar ul {
	margin: 0 auto;
	list-style: none;
}
#userBar ul li {

	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
}

#userBar a {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	padding: 14px 0 7px 10px;
    pointer-events: none;
}
#userBar a:hover {/* color: #de2e87; */}
#userBar a span {display: none;}

/*Some generic styles*/
ul li, ol li {
  font-size: 1rem;
  font-size: calc(16 / var(--rembase) * 1rem);
  line-height: 24px;
}

/*Some generic styles end*
/*wrapper*/
#wrapper {
	display:flex;
	flex-wrap:wrap;
	padding: 0;
	text-align: left;
    margin: 0 auto;
    max-width:1400px;
    width:100%;
    background:#fff;
    /*background: #f4f6f8;*/
    box-shadow:-5px -5px 9px rgba(0,0,0,0.1);
}
/*if full width check also portal-column-right rule*/
#wrapper {
	max-width: initial;
}

/* This is to keep home measurement tables in order */
@media (max-width: 750px) {
  #wrapper { width: fit-content; }
}

/* This is to keep home measurement tables in order */
@media (max-width: 750px) {
  #wrapper { width: fit-content; }
}

/*#wrapper {
  max-width: 1920px;
  max-width: var(--page-width);
  margin-left: auto;
  margin-right: auto;
}*/

#wrapper > #portal-content {
	max-width: 1400px;
	width: 83%;
	max-width: 83%;
	margin: 0 auto;
	float:none;
	display:flex;
	flex-direction:column;
	flex: 0 0 83%;	
    padding:10px;
    /*If narrow layout*/
    max-width: calc(var(--container-default-width) + var(--container-x-padding));
    align-items: center;
    margin-left:auto; 
}

#wrapper > #copyright {order: 4;} /* Will be displayed at the bottom of the pseudo-table */
#wrapper > #contentFoot {order: 3; } /* Will be displayed at the bottom of the pseudo-table */
#wrapper > #portal-column-left {/* order: 1; */} /* Will be displayed in the middle */
#wrapper > #portal-content {order: 2 !important; } /* Will be displayed at the top */ 
#wrapper > #portal-column-right {order: 5} /* Will be displayed at the top */ 

/* Portlets */

#portal-content .portlet { 
	margin: 0;
	clear: both;
    width:100%;
}

#portal-content hr {
    display: none;
}


/*portal-column-left*/

#portal-column-left {
	margin-top: 22px;
	width: 16%;
	max-width: calc(var(--left-column-width) + var(--container-x-padding) * 2);
	display:flex;
	flex-direction:column;
	flex: 0 0 16%;
}

#portal-column-left .portlet {
	padding: 5px 0 5px 0;
	margin:0;
    color:#111;
    border-bottom: 1px solid #eee;
    margin-left: 10px;
}

#portal-column-left .portletHead {
	padding: 10px 9px 10px;
	line-height: 1;
	word-wrap: break-word;
}

#portal-column-left .portlet .portletBody {	
	line-height: 1.3;
	padding: 2px 10px 6px 10px;
}

#portal-column-left .portlet {
	background-color: #fff;
	border-right: 1px solid #d2dce1;
}  

#portal-column-left #portlet-omhomenu .portletHead { display: none; }

#portal-column-left.not-logged-in #anon_fi_password {
    margin: 20px 0;
}

/*TEMP FOR NOT LOGGED IN WITH GRAY BACKGROUND

#portal-column-left .portlet {
    background-color: #fff;
    border-right: 1px solid #d2dce1;
}
#portal-column-left .portlet {
    padding: 5px 0 5px 0;
    margin: 0;
    color: #111;
    border-bottom: 1px solid #eee;
    margin-left: 10px;
}

#portal-column-left {
    box-shadow: -5px -5px 9px rgb(0 0 0 / 10%);
}

#portal-column-left .portletHead h5 {
    padding: 0 0 10px 0;
    margin: 0;
}

#portal-column-center .portlet {
    box-shadow: 5px 5px 9px rgb(0 0 0 / 10%);
    background: white;
    padding: 5px 25px;
}

#portlet-omhomenu a.button.center {width:100%;}

.infodiv {
	background-color: #fff;
    border-bottom: none;
    border-top: 10px solid #f4f6f8;
	margin: 0 -25px;
}


/*TEMP FOR NOT LOGGED IN WITH GRAY BACKGROUND*/




.portletHead {
	font-weight: bold;
	margin: 0;
	vertical-align: top;
}

.portletHead .leftCorner,
.portletHead .rightCorner, .portlet .portletHead ul { display: none; }

.portlet .portletBody {
	line-height: 1.5;
}

#portal-content .portlet .portletBody {	max-width:100%; position:relative;}

.portlet .portletBody .detail { font-size: 90%; }

.portlet .portletFoot,
.portlet .minimized { display: none; }

.portletDrop { height: 0; overflow: hidden; }
.portletDropActive { height: 8px; overflow: hidden; border: 1px solid #000; }
.portletDropHover { height: 32px; overflow: hidden; background-color: #f6bb1f; border: 1px solid #000; }

.portletDrag {
	opacity: .6;
	z-index: 1000;
}

/*portal-column-center*/

#portal-column-center {
	position: relative;
	width: auto;
	padding:0;
	margin: 0;
	/* min-height: 420px; */
	/*For the footer to stay at the bottom. Could be otherwise done with wrapper flex, but row-direction is used*/
	min-height: calc(100vh - 228px);
}

/***menu start***/

#portal-column-left .portlet {
	background-color: #fff;
   --subpage-menu-border-color:
	hsla(0, 0%, 31%, .4);
	border-color: var(--subpage-menu-border-color);
	border: none;
}  
#portal-column-left ul.menu  {
	--subpage-menu-border-color:
	hsla(0, 0%, 31%, .4);
	border-right: 1px solid var(--subpage-menu-border-color);
	/*border-style: solid;
	border-color: var(--subpage-menu-border-color);	*/
}

ul.menu,
ul.menu ul {
	margin: 0 0 4px 0;
	padding: 0;
    color:#fff;
}

ul.menu ul {
	margin: 3px 0 6px 11px;
	display: none;
	border:none;
}
.block {display:block!Important;}

/*ul.menu li {
	display: block;
	width: 100%;
	list-style: none;
}*/

/*ul.menu li a {
    font-weight:normal;
	color: #111;
	text-decoration: none;
	display: inline-block;
	padding: 10px 4px 10px 5px;
	position:relative;
}
ul.menu li a::after {
  content: "";
  height: 2px;
  width: 0%;
  background: #FEB7A4;
  background: var(--colors-secondary-salmon);
  display: block;
  position: absolute;
  bottom: 5px;
  transition: width .5s ease;
}

ul.menu li a:hover::after {
        width: 100%;
}*/

ul.menu li {
	padding:10px 0px 10px 5px;
}
/*If span is used*/
ul.menu li a {
    font-weight:normal;
	color: #111;
	text-decoration: none;
	display: inline-block;
	position:relative;
    width:100%;
}

ul.menu li a span:not(.info)::after {
    content: "";
    height: 2px;
    width:0;
    background: #FEB7A4;
    background: var(--colors-secondary-salmon);
    display: block;
    position: absolute;
    bottom: -7px;
    transition: width .5s ease;
}

ul.menu li a span:not(.info):hover::after {
        width: 100%;
}

ul.menu li:first-child a {border:none; background:none;}
ul.menu li a#tervtarkvalm {background:none;}
ul.menu li a#labra_ulkopk {background:none;}

ul.menu li ul li > a, ul.menu li ul li > a.noLink {background:none;}
ul.menu li ul li {
	margin: 0 0 0 4px;
	width: 100%;
}
ul.menu ul li a {
	font-weight: normal;
	padding: 5px 3px 5px 5px;
	line-height: 1.1;
    font-size:100%;
	border-top:none;
}
    
/*ul.menu li a .info, ul.menu li span.info {
	color: #000;
	background-color: #fabb00;
	font-size: 90%;
	float: right;
	margin-right: 9px;
	margin-left: 6px;
	display: block;
	min-width: 10px;
	text-align: center;
	letter-spacing: -1px;
	padding: 1px 4px 2px 4px;
	border-radius: 50%;
	-moz-border-radius:50%;
	-webkit-border-radius: 50%;
    margin-top:-4px;
}*/


ul.menu li a.info, ul.menu li span.info {
    color: #000;
    background-color: #fabb00;
    font-size: 90%;
    float: right;
    margin-right: 9px;
    margin-left: 6px;
    display: block;
    min-width: 10px;
    text-align: center;
    /* letter-spacing: -1px; */
    padding: 3px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    margin-top: -1px;
    width: auto;
    min-width:23px;
    line-height: normal;
}

/*ul.menu li > a.noLink, ul.menu li > a {
    background-image: url("images/PPHVA/pphva-arrows.png");
    background-position: right 4px;
    background-size: 25px;
    background-repeat: no-repeat;
}
ul.menu li > a.active.noLink.selected {
    background-image: url("images/PPHVA/pphva-arrows.png") !important;
    background-position: right -30px;
    background-size: 25px;
    background-repeat: no-repeat;
}

ul.menu li > a.active {
    color: #000000 !important;
    font-weight: bold;
    background-image: url("images/PPHVA/pphva-arrows.png") !important;
    background-position: right -30px;
    background-size: 25px;
    background-repeat: no-repeat;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    outline: none;
}

ul.menu li > a.selected {
    color: #000000 !important;
    font-weight: bold;
    background-image: url("images/PPHVA/pphva-arrows.png") !important;
    background-position: right -30px;
    background-size: 25px;
    background-repeat: no-repeat;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    outline: none;
}
ul.menu li > a.active.Link {
    background: none !important;
}*/

/*menu hover and active styles start*/

/*Blue one
ul.menu li a.active span {
  background-color: #3b54bc;
  background-color: var(--colors-secondary-blue);	
  border-top: 2px solid var(--colors-secondary-blue);
  border-bottom: 2px solid #3B54BC;
  border-bottom: 2px solid var(--colors-secondary-blue);
  --submenu-item-color: var(--colors-white);
  --submenu-active-marker-size: 34px
}

ul.menu li a.active::after {
        display: block;
        content: '';
        background-color: #3B54BC;
        background-color: var(--colors-secondary-blue);
        position: absolute;
        right: calc(var(--submenu-active-marker-size) * -0.5 - 0px);
        top: 0;
        bottom: 0;
        height: var(--submenu-active-marker-size);
        width: var(--submenu-active-marker-size);
        transform: rotateZ(45deg);
        transition: background-color 200ms ease;
        border-width: 2px 2px 0 0;
        border-style: solid;
        border-color: #3B54BC;
        border-color: var(--colors-secondary-blue);
        margin: auto 0;
}*/


ul.menu li a.active{
  --subpage-active-marker-size: 15px;
  --subpage-menu-border-color:
  hsla(0, 0%, 31%, .4);
  font-weight:bold;
  width:100%;
  /*border-bottom: 3px solid var(--colors-secondary-salmon);
  border-height:4px;*/
}

/*ul.menu li a > span {
  display: inline-block;
  padding: 2px 0;
  border-top: 1px solid transparent;
  border-bottom: 2px solid transparent;
  border-bottom-color: transparent;
}

ul.menu li a:hover span {
  border-bottom-color: #ff977b;
  border-bottom-color: var(--colors-primary-salmon);
}*/

ul.menu li a.active::after {
  content: "";
  background-color: #fff;
  position: absolute;
  right: -8px;
  top: 0;
  bottom: 0;
  height: var(--subpage-active-marker-size) !important;
  width: var(--subpage-active-marker-size) !important;
  transform: rotate(225deg);
  border-width: 1px 1px 0 0;
  border-style: solid;
  border-color: var(--subpage-menu-border-color);
  margin: auto 0;
  margin-left: 18px;
}

ul.menu li a.active::after {
  transform: rotate(45deg);
}

ul.menu li a span {
	position:relative
}

ul.menu li a.active span:not(.info)::after {
    content: "";
    height: 2px;
    width: 100%;
    background: #FEB7A4;
    background: var(--colors-secondary-salmon);
    display: block;
    position: absolute;
	bottom:-7px;
    transition: width .5s ease;

}
/*ul.menu li a.active span:not(.info) {
  border-bottom: 3px solid var(--colors-secondary-salmon);
  padding-bottom:4px;
}	*/

#mobile-menu-toolbar {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#mobile-menu-toolbar-start {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 0;
    margin-right: auto;
}

/*in desktop*/
#mobile-menu-toolbar-start {
    position: absolute;
    /*top: 95px;*/
    top: 85%;
    transform: scale(0.8);
    left:0;
}

#portlet-omhomenu button.home-button {
    background: none;
    padding: 0px;
    margin: 0px;
    color: #fff;
    text-align: center;
    border-radius: 0px;
    box-shadow: none;
    display: inline-block;
    font-weight: 400;
    font-size: .8em;
    box-shadow: none;
    outline: none;
    text-shadow: none;
    border: 0;
    float: left;
}

@media (pointer: fine), not all, screen and (-ms-high-contrast: active), (-ms-high-contrast: none){
    button.toggle-mobilenav {
        display: none !important;
    }
}  

/***menu end***/

/* Content styles */

a {
    margin-top: auto;
    color: #3b54bc;
    color: var(--colors-secondary-blue);
    text-decoration: none;
}


/*a:visited { color: #cb005c; }
a:hover { color: #cb005c; text-decoration: none; }*/

a.inst:hover span {text-decoration:underline;}

a.inst.before::before {
    font-family: 'Font Awesome 5 Free';
    content: '\f061';
    padding-right: 5px;
    font-weight: 900;
    color: #ffd5ca;
    color: var(--colors-primary-salmon);
}

a.inst.before:hover::before {
  	transform:translate(3px);
	display:inline-block;
}

a.inst.after::after {
    font-family: 'Font Awesome 5 Free';
    content: '\f061';
    margin-left: 6px;
    font-weight: 900;
    color: #ffd5ca;
    color: var(--colors-primary-salmon);
}

a.inst.after:hover::after {
  transform: translate3d(3px);
  display:inline-block;
}

a.icon-delete,
a.icon-information,
a.icon-save { line-height: 10; }
a.icon-delete {
	display: block;
	width: 16px;
	height: 16px;
	overflow: hidden;
	background-color: transparent;
	background-image: url(images/ico_delete.png);
	background-repeat: no-repeat;
    background-position:center top;
    margin:0 auto;
}

a.icon-delete:hover {
    background-position:center bottom;
}
th.header-delete {
	background-image:url(images/trash.png);
	background-repeat: no-repeat;
    background-position:center center;
}

a.icon-information {
	display: block;
	width: 16px;
	height: 16px;
	overflow: hidden;
	background: transparent url(images/ico_information.png) no-repeat 0 0;
}
a.icon-save {
	display: block;
	width: 16px;
	height: 16px;
	overflow: hidden;
	/*background: transparent url(images/icon_save.png) no-repeat 0 0;*/
}

a.boxLink,
a.boxLinkL,
a.boxLinkR {
	display: block;
	color: #409DBC;
	background: #fff;
	padding: 1px 4px 2px 4px;
	border: 1px solid #71B8D8;
	text-align: center;
}
a.boxLink:hover,
a.boxLinkL:hover,
a.boxLinkR:hover {
	color: #006C92 !important;
	background: #D0EEFA;
	text-decoration: none !important;
	border-color: #50A0C5;
}
a.boxLinkL,
a.boxLinkL:hover { background-image: url(images/boxlink_ico_arr_l.gif); background-repeat: no-repeat; background-position: center left; text-align: left; padding-left: 22px; }
a.boxLinkR,
a.boxLinkR:hover { background-image: url(images/boxlink_ico_arr_r.gif); background-repeat: no-repeat; background-position: center right; text-align: right; padding-right: 22px; }

img.left,
.floatL {
	float: left;
	margin: 2px 12px 4px 0;
}
.portlet img.left { margin: 1px 5px 2px 0; }
img.right,
.floatR {
	float: right;
	margin: 2px 0 4px 12px;
}
.center {
	text-align: center;
	margin: 8px auto 8px auto !important;
}

/*#portal-content img { position: relative; }*/

#portal-content .floatR,
#portal-content .floatL { position: relative; }

.alignR { text-align: right !important; }
.alignL { text-align: left !important; }
.alignC { text-align: center !important; }
.vAlignT { vertical-align: top !important; }
.vAlignM { vertical-align: middle !important; }
.vAlignB { vertical-align: bottom !important; }

.noPadding { padding: 0 !important; }


/*#portal-content ul li { list-style: url(images/bullet.gif); }
#portal-content .etusivu ul {padding:0!important; margin:20px 0;}
#portal-content .etusivu ul li  {
    list-style:none; 
    border-bottom:2px solid #ebebeb;
    padding:10px 0;
    margin:3px 0;
    width:100%;
    font-size:110%;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
}

#portal-content .etusivu ul.mydata li{ 
    background:#f0f0f0 url(images/icons.png) left -1213px no-repeat; 
    padding:15px 10px 15px 50px; 
    border:none;
}*/

/*nnServiceSelection ul li, .nnSpecialQueueSelection ul li, .nnPersonalQueueSelection ul li, .nnServiceCategory ul li {
    background:#fff; 
    padding:0; 
    margin:0; 
    padding:10px; 
    list-style:none!important;
}

.nnServiceSelection ul ul ul li, .nnSpecialQueueSelection ul ul ul li, .nnPersonalQueueSelection ul ul ul li, .nnServiceCategory ul ul ul li {
    margin:20px; 
    padding:10px; 
    list-style: url(images/bullet.gif) !important;
}

.nnServiceSelection ul, .nnServiceCategory ul, .nnSpecialQueueSelection ul, .nnPersonalQueueSelection ul{
    padding:0; 
    margin:2px 0;
  background-color: #fff;
}
.nnServiceSelection ul a, .nnServiceCategory ul a, .nnSpecialQueueSelection ul a, .nnPersonalQueueSelection ul a {
    font-weight:bold; 
    font-size:110%;
}

.nnServiceSelection ul p, .nnServiceCategory ul p, .nnSpecialQueueSelection ul p, .nnPersonalQueueSelection ul p {
    margin-left: 20px;
}
.nnPersonalQueueSelection span {font-weight:bold;}*/

/* Headings from PPHVA START. */

h1,.portletHead, .customTitle, #portal-content .portletHead h5, #portal-content .portletBody h1, h5  {
  color: #06175E;
  color: var(--colors-primary);
  font-size: calc(30 / 16 * 1rem);
  font-size: calc(30 / var(--rembase) * 1rem);
  line-height: 39px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

small {
  font-size: calc(16 / 16 * 1rem);
  font-size: calc(16 / var(--rembase) * 1rem);
  line-height: 27px;
  letter-spacing: -0.02em;
  font-weight: 500;
}

h1 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
}

h1 {
  margin-bottom: 24px;
}

h1{
  color: #06175E;
  color: var(--colors-primary);
  font-size: calc(30 / 16 * 1rem);
  font-size: calc(30 / var(--rembase) * 1rem);
  line-height: 39px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

@media (min-width: 750px) {

	h1 {
    font-size: calc(50 / 16 * 1rem);
    font-size: calc(50 / var(--rembase) * 1rem);
    line-height: 58px;
}
  }

h2 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
}

h2 {
  margin-top: 32px;
  margin-bottom: 16px;
}

@media (min-width: 750px) {

	h2 {
    margin-top: 40px;
    margin-bottom: 24px;
}
  }

h2 {
  color: #06175E;
  color: var(--colors-primary);
  font-size: calc(24 / 16 * 1rem);
  font-size: calc(24 / var(--rembase) * 1rem);
  line-height: 33.6px;
  font-weight: 500;
  letter-spacing: -0.01em;
}

@media (min-width: 750px) {

	h2 {
    font-size: calc(34 / 16 * 1rem);
    font-size: calc(34 / var(--rembase) * 1rem);
    line-height: 42px;
}
  }

h3 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
}

h3 {
  margin-top: 32px;
  margin-bottom: 16px;
}

h3 {
  color: #06175E;
  color: var(--colors-primary);
  font-size: calc(19 / 16 * 1rem);
  font-size: calc(19 / var(--rembase) * 1rem);
  line-height: 30px;
  font-weight: 500;
  letter-spacing: -0.01em;
}

@media (min-width: 750px) {

h3 {
    font-size: calc(26 / 16 * 1rem);
    font-size: calc(26 / var(--rembase) * 1rem);
    line-height: 35px;
}
  }

h4 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
}

h4 {
  margin-top: 32px;
  margin-bottom: 16px;
}

h4 {
  color: #1C1C1E;
  color: var(--colors-black);
  font-size: calc(17 / 16 * 1rem);
  font-size: calc(17 / var(--rembase) * 1rem);
  line-height: 24px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

@media (min-width: 750px) {

	h4 {
    font-size: calc(19 / 16 * 1rem);
    font-size: calc(19 / var(--rembase) * 1rem);
    line-height: 28.5px;
}
  }

h5 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
}

h6 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "new-hero", sans-serif;
  font-family: var(--font-sans-serif-alt);
  color: #06175E;
  color: var(--colors-heading);
}

/* Headings from PPHVA END. */

/*.no-left-content {
	margin-left:24%;
	width:95%;
}*/

/***FOOTER START***/

#copyright {
	display: block;
	height: 0;
	width:100%; /*when wrapper flex*/
	position: relative;
	bottom: -74px;
	padding: 0;
	z-index: 101;
	right: 11px;
	text-align: center;
	clear: both;
  	font-size: calc(11 / 16 * 1rem);
}
  
#copyright span {
	padding:0;
	color:#fff;
}

#copyright span > a {
    color: #FEB7A4;
    color: var(--colors-secondary-salmon);
}

#portal-column-right {
	display: block;
	position: relative;
	top: 1px;
	margin-top: 20px;
	width: 100%;
	background: none;
	border: none;
}

/*if content section is not full width otherwise upper can be used
#portal-column-right {
	display: block;
	position: absolute;
	margin-top: 20px;
	width: 100%;
	background: none;
	border: none;
	left: 0;
    bottom: 0;
}*/

#portlet-pphva_custom_footer .portletHead {display:none;}


@media (pointer: fine), not all, screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#portlet-pphva_custom_footer .copyright_quick_links * {
		box-sizing: content-box;
	}
}
#portlet-pphva_custom_footer #contentFoot {
	display: block;
}

#portlet-pphva_custom_footer #footer-menu {
    display: flex;
    justify-content: center;
}

#quickLinks #footer-menu ul {
    justify-content: space-evenly;
    width: 100%;
    padding-left: 0;
}

#portlet-pphva_custom_footer ul {
    display: flex;
    justify-content: space-around;
    list-style: none;
    width: 80%;
}

#portlet-pphva_custom_footer #quickLinks {
    flex-grow: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#portlet-pphva_custom_footer .copyright_quick_links * {box-sizing:content-box;}


#portlet-pphva_custom_footer .row1 {
	display: -ms-flexbox;
	display: flex;
	justify-content: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
    background-color: #2e3192;
    background-color: #1e306c;
    background-color: var(--colors-secondary-nav);
    background-color: #06175E;
    background-color: var(--colors-primary);	  
	text-align: center;
	margin: 0;
}

#portlet-pphva_custom_footer .row1 a {
	color: #fff !important;
}

#portlet-pphva_custom_footer .row1 a:hover {
  	text-decoration: underline;
}
#portlet-pphva_custom_footer #tool-textsize-footer a:hover{text-decoration: none;}

#portlet-pphva_custom_footer .row1 #footerLogo {
	padding:0 30px;
	display: none;
	justify-content: center;
}
    
#portlet-pphva_custom_footer ul{margin:revert;}

#portlet-pphva_custom_footer #textSizeLink {
	display: flex;
	justify-content: center;
}

#portlet-pphva_custom_footer #textSizeLink ul {
	flex-direction: row-reverse;
}

#portlet-pphva_custom_footer #tool-textsize-footer {
	padding: 10px;
}

#portlet-pphva_custom_footer #tool-textsize-footer a {
	/* color: #2B456C !important; */
	font-weight: bold;
	padding-left: 5px;
}

#portlet-pphva_custom_footer #tool-textsize-footer li {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding:0 2px;
}
#portlet-pphva_custom_footer #tool-textsize-footer {
  display: flex !important;
  width: 100%;
  flex-direction: row-reverse;
  justify-content: center;
}

#portlet-pphva_custom_footer #tool-textsize-footer {
  display: inline-block;
  width: 200px;
}

#portlet-pphva_custom_footer #textSizeLink ul li a#textsize-inc-footer:hover, #portlet-pphva_custom_footer #textSizeLink ul li a#textsize-dec-footer:hover, #portlet-pphva_custom_footer #textSizeLink ul li a#textsize-inc-footer:focus-visible, #portlet-pphva_custom_footer #textSizeLink ul li a#textsize-dec-footer:focus-visible {
  background-color: #2B456C;
  border-color: #000000;
}

#portlet-pphva_custom_footer #textSizeLink ul li a#textsize-inc-footer, #portlet-pphva_custom_footer #textSizeLink ul li a#textsize-dec-footer, #linkBar ul li a#textsize-inc, #linkBar ul li a#textsize-dec {
	display: block;
	width: 21px;
	height: 21px;
	overflow: hidden;
	background-repeat: no-repeat;
	padding: 0;
	margin: 1px 3px 0 1px;
	line-height: 10;
	border: 1px solid #000000;
	border-radius: 12px;
	-webkit-border-radius: 12px;
	/* box-shadow: 1px 1px 0 #bcd8d4; */
	background: url(images/icons.png) no-repeat;
  }

#portlet-pphva_custom_footer #textSizeLink ul li a#textsize-dec-footer {
    background-position: center -951px;
    margin-right: 4px;
}

#portlet-pphva_custom_footer #textSizeLink ul li a#textsize-dec-footer:hover {
    background-position: center -1002px !important;
}

#portlet-pphva_custom_footer #textSizeLink ul li a#textsize-inc-footer {
    background-position: center -853px;
    margin-right: 8px;
}

#portlet-pphva_custom_footer #textSizeLink ul li a#textsize-inc-footer:hover {
    background-position: center -903px !important;
}


/***FOOTER END***/


/*Buttons and other start*/

a {text-decoration: none;cursor:pointer;}

input.button {cursor:pointer;}

/*Overwrite some custom buttons and anchors*/
input[type=button],
input[type=submit],
input[type=reset],
button,
a.askLink,
a.blockLink, a.drafts, #portlet-actBehalf .portletBody a[href*="actBehalf"] {
    border-color: #828BAF;
    border-color: var(--colors-primary-blue-50);
    border-color:#06175E;
    border-color: var(--colors-primary);  
    background-color: #06175E;
    background-color: var(--colors-primary);
    color: #FFFFFF;
    transition: color ease,border ease,background ease;
    transition-duration: .1s;
    padding: 10px 12px 10px 10px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-flow: row nowrap;
    transition: background-color .3s ease;
    cursor: pointer;
    /*text-transform:uppercase;*/
    margin-right: 5px;
    margin-bottom: 5px;
    margin-top:5px;
  	margin-left: 1px;
}

input[type=button]:hover,
input[type=submit]:hover,
input[type=reset]:hover,
button:hover,
a.askLink:hover,
a.blockLink:hover, a.drafts:hover, #portlet-actBehalf .portletBody a[href*="actBehalf"]:hover {
	background-color: #1f2e6e;
    background-color: var(--colors-primary-blue-90);
    border-color: #1f2e6e;
    border-color: var(--colors-primary-blue-90);
}

/*input[type=button]::after,
input[type=submit]::after,
input[type=reset]::after,
button::after,
a.askLink::after,
a.blockLink::after, a.drafts::after {
	font-family: 'Font Awesome 5 Free';
    content: "\f061";
    margin-left: 6px;
    font-weight: 900;
}

input[type=button]:hover::after,
input[type=submit]:hover::after,
input[type=reset]:hover::after,
button:hover::after,
a.askLink:hover::after,
a.blockLink:hover::after, a.drafts:hover::after  {
  transform: translate3d(3px, 0, 0);
}*/

/*.btn, .btn-primary are bootstrap buttons*/

button.btn:not(.homeMeasurementInstructions button):not(.telescope .modifyRowButton),
button.btn-primary:not(.homeMeasurementInstructions button):not(.telescope .modifyRowButton) {
  display:inline-flex !important;
}



.button:not(.exportButtonHR), .btn:not(.link.btn), .btn-primary {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #fff;
  background-color: #06175e;
  background-color: var(--colors-primary);
  transition: color ease,border ease,background ease;
  transition-duration: .1s;
  padding: 10px 12px 10px 10px;
  border: 2px solid #06175E;
  border: 2px solid var(--colors-primary);
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-flow: row nowrap;
  transition: background-color .3s ease;
  cursor: pointer;
}

.button:not(.exportButtonHR), .btn:not(.link.btn), .btn-primary  {
  font-weight: 600;
  line-height: 22px;
  /*text-transform: uppercase;*/
}

.button:not(.exportButtonHR):hover,.btn:not(.link.btn):hover, .btn-primary:hover  {
    border-color: #1F2E6E;
    border-color: var(--colors-primary-blue-90);
    background-color: #1F2E6E;
    background-color: var(--colors-primary-blue-90);
}

.button:not(.exportButtonHR):hover:after, .btn:not(.link.btn):hover:after, .btn-primary:hover:after  {
  transform: translate3d(3px, 0, 0);
}

.button:active, .btn.active, .btn-primary.active   {
    border-color: #828BAF;
    border-color: var(--colors-primary-blue-50);
    background-color: #06175E;
    background-color: var(--colors-primary);
}

.button:active:after, .btn:active:after, .btn-primary:active:after   {
  transform: translate3d(3px, 0, 0);
}

.btn.disabled, .btn-primary.disabled,
.btn[disabled], .btn-primary[disabled],
.btn.disabled:hover, .btn-primary.disabled:hover,
.btn[disabled]:hover, .btn-primary[disabled]:hover,
.button[disabled],
.button.disabled,
.btnDisabled,
input[type=button].disabled,
input[type=submit].disabled,
input[type=reset].disabled,
button.disabled,
.blockLink.disabled,
.button.disabled:hover,
input[type=button].disabled:hover,
input[type=submit].disabled:hover,
input[type=reset].disabled:hover,
input[type=submit]:disabled,
input[type=button]:disabled,
input[type=reset]:disabled,
button.disabled:hover,
.btnDisabled:hover,
.blockLink.disabled:hover{
    filter: grayscale(1);
    opacity: 0.25;
    cursor: not-allowed;
    pointer-events: none;
}

.button.button--salmon {
  color: #06175e;
  color: var(--colors-primary);
  background-color: #ffcbbd;
  background-color: var(--colors-primary-salmon-50);
  border-color: #ffcbbd;
  border-color: var(--colors-primary-salmon-50);
}

.button.button--salmon:hover {
  border-color: #ffd5ca;
  border-color: var(--colors-primary-salmon-40);
  background-color: #ffd5ca;
  background-color: var(--colors-primary-salmon-40);
}

/*.button::after {
    display: flex;
    align-self: center;
    margin-left: 11px;
    transition: all .3s ease;

}

.button::after {
    content: "\e905";
} */

.button:not(.buttonIsletR .button):not(.exportButtonHR)::after 
/*.btn::after, .btn-primary::after*/  {
	font-family: 'Font Awesome 5 Free';
    content: "\f061";
    margin-left: 6px;
    font-weight: 900;
}

.button.button-small, .infoMessage.actBehalfInfo a {padding: 5px;}

.green {
    background-color:#167A38;
  	background-color:var(--colors-green);
  	border-color:#167A38;
  	border-color: var(--colors-green);
}

.green:hover {
    background-color:#519B6A;
  	background-color:var(--colors-green-75);
  	border-color:#167A38;
  	border-color: var(--colors-green);
}

.red {
    background-color:#C82A2A;
  	background-color:var(--colors-red);
  	border-color:#C82A2A;  
  	border-color:var(--colors-red);
}
  
.red:hover {
    background-color:#D65F5F;
  	background-color:var(--colors-red-75);
  	border-color:#C82A2A;  
  	border-color:var(--colors-red);
}

.listAllThreads {margin-top:10px;}

#tool-logout::after {
    content: "\f061";
}

#tool-me::after {
	font-family: 'Font Awesome 5 Free';
    content: "\f013";
    margin-left: 6px;
    font-weight: 900;
}

#tool-home::after {
	font-family: 'Font Awesome 5 Free';
    content: "\f015";
    margin-left: 6px;
    font-weight: 900;
}

.printThread .button::after {
    content: "\f02f";
}

fieldset {
    margin: 12px 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    clear: both;
    border: none;
}
fieldset, .helpFieldset, .helpTitleFieldset {
    background-color: #F4F2F2;
	background-color: var(--colors-gray-75);
    margin: 0 0 1.1em 0;
    padding: 3px 10px 4px 10px;
    border: 1px solid #F0EEEE;
	border: 1px solid var(--colors-gray);
    clear: both;
}

fieldset div.legend { margin:0; }
div.legend {
	display: block;
	padding: 2px 9px 3px 0px;
    font-size: calc(24 / 16 * 1rem);
    font-size: calc(24 / var(--rembase) * 1rem);
}

div#portlet-labs a.print, #printinr, a.pdf, a.exportButtonHR {
    padding: 1px 12px 10px 17px;
    background: transparent url(images/ico_print.png) no-repeat 1px 12px;
    float: right;
    line-height:40px;
}

ul.tabs li.messaging_custom_backlink a:before, #portlet-labs #measurePageGraphLink ~ a:before, #portlet-labs a.back:before, #portlet-myFolder a.downloadDoc span.myFolderBack:before, .hmBackButton:before {
    font-family: 'Font Awesome 5 Free';
    content: '\f060';
    margin-right: 6px;
    font-weight: 900;
}

/*For settings-page email and mobile verification start*/
    .error {font-style: italic;color: #F33;}
    .medium-password{color: #E4DB11;}
    .weak-password{color: #FF6600;}
    .strong-password{color: #12CC1A;}  
    .spanError{position:relative;margin-left:5px;}
    .confirm {color: #00d800;} 
    #newEmail {font-weight:bold;font-style: italic;}
/*For settings-page email and mobile verification end*/

/*Buttons and other ends*/  

/* fancyListing tables*/

table.fancyListing {
	margin: 10px 0 12px 0;
	clear: both;
    border-collapse: collapse;
    border: 1px solid #dbdbdb;
    width:100%;
}
.portlet table.fancyListing { margin: 0; }
table.fancyListing th {
	color: #fff;
	font-weight: bold;
	text-align: left;
	background-color: #4e65c3;
	background-color: var(--colors-secondary-blue-90);
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 7px 6px 7px 7px;
	white-space: nowrap;
	overflow: hidden;
	empty-cells: show;
	vertical-align: bottom;
	/*border-bottom: 1px solid #06175E;
	border-bottom: 1px solid var(--colors-primary);*/
	border: 1px solid #06175E;
	border: 1px solid var(--colors-primary);  
    border-bottom:none;
}

table.fancyListing th label { color: #fff; }
table.fancyListing th.sortable { cursor: pointer; }
table.fancyListing th.sortAsc { background: #4E65C3 url(images/bg_tblhead_asc.gif) no-repeat 100% 50%; }
table.fancyListing th.sortDesc { background: #4E65C3 url(images/bg_tblhead_desc.gif) no-repeat 100% 50%; }
table.fancyListing th.tblHeadMouse,
table.fancyListing th.sortable:hover { background-color: #4E65C3; }
.diabetesMainRow {background:#fff;}
table.fancyListing tr:nth-child(even) {background:#f3f3f3}
table.fancyListing tr {background:#fff;}
table.fancyListing td {
	padding: 4px 5px 4px 5px;
	border-right: 1px solid #ddd;
	vertical-align: top;
	line-height: 1.5;
	border-bottom:1px solid #ddd;

}

/*table.fancyListing td:last-child, table.fancyListing th:last-child{border-right:none;}*/
table.fancyListing tr.tblRowMouse td,
table.fancyListing tr.selected td,
table.fancyListing tr:hover td,
table.fancyListing tr.hilited td { background-color: #ddd !important; }
table.fancyListing td strong { font-weight: bold; }

table.fancyListing tr:nth-child(odd) {
    background: #f3f3f3;
}

table.fancyListing tr:nth-child(odd) {
    background: #FFFFFF;
}

/*For new inbox start*/
table.fancyListing .newStyle {
    line-height: 2;
}

table.fancyListing tr.tblRowMouse td, table.fancyListing tr.selected td, table.fancyListing tr.hilited td, table.fancyListing tr:hover td {
    background-color: #FFF !important;
}


table.fancyListing tr:nth-child(odd) td.emailTD { background: url(images/email.png) no-repeat center center; }
table.fancyListing tr:nth-child(even) td.emailTD { background: url(images/email.png) no-repeat center center; }
table.fancyListing tr:nth-child(even) td.smsTD { background: url(images/sms.png) no-repeat center center !important; }	
table.fancyListing tr.emailTD.hilited { background: url(images/email.png) no-repeat center center !important; }

/*For new inbox end*/

.diabetesChildRow .diabetesChildColumn {
	background-color: #FEF8F8;
}

/* 10.3 inr styles start */
.redtablet {
	background-image: url(images/m5red.png);
	background-repeat: no-repeat;
	background-position: 95% 50%;
	height: 39px !important;
	background-size: 38px;
  	width: 110px;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/m5red.png', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/m5red.png', sizingMethod='scale')"; 
    box-sizing: initial;
}

.bluetablet {
	background-image: url(images/m3blue.png);
	background-repeat: no-repeat;
	background-position: 95% 50%;
	height: 39px !important;
	background-size: 38px;
 	width: 110px; 
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/m3blue.png', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/m3blue.png', sizingMethod='scale')";  
    box-sizing: initial;  
}

.redtablet select, 
.bluetablet select {
  width: 70px !important;
}

.newINRInfo {
  	overflow: hidden;
}

.inrDosageTable td,
.inrDosageEditTable td {
  vertical-align: middle !important;
}
  
.buttonIsletR .button.red {
	margin-right: 10px;
}

#portlet-inrdosage {
	margin-bottom: 30px !important;
}

#portlet-inrdosage .inrDosageTable.fancyListing .dosage td:nth-child(1), 
#portlet-inrdosage .inrDosageTable.fancyListing .dosage td:nth-child(2), 
#portlet-inrdosage .inrDosageTable.fancyListing .dosage td:nth-child(3), 
#portlet-inrdosage .inrDosageTable.fancyListing .dosage td:nth-child(4), 
#portlet-inrdosage .inrDosageTable.fancyListing .dosage td:nth-child(5)
{
    background-color: #EBEEF8;
    background-color: var(--colors-secondary-blue-10);
}

#portlet-inrdosage .inrDosageTable .dosage {
   background-color:#fff;
}

.inrDosageTable.fancyListing tr:nth-child(2) th:nth-child(2),
.inrDosageTable.fancyListing tr:nth-child(2) th:nth-child(3),
.inrDosageTable.fancyListing tr:nth-child(2) th:nth-child(4),
.inrDosageTable.fancyListing tr:nth-child(2) th:nth-child(5),
.inrDosageTable.fancyListing th:nth-child(1) {
	background-color: #06175e;
    background-color: var(--colors-primary);
	background-color:#2e3192
}

#portlet-inrdosage .inrCommentButton,
#portlet-inrdosage .inrAddCommentButtonRow,
#portlet-inrdosage .inrDosageTable.fancyListing .dosageComment td {
 	background-color: #f3f3f3; 
}  

.inrDosageAuthor {
    padding-left: 12px !important; 
}

.inrAddCommentButtonRow td button {
 	margin-left: 12px !important; 
}

.inrDosageTable tr {
  border-left: 1px solid #ABABAB;
  border-right: 1px solid #ABABAB;
}

.inrDosageTable .removeCol img {
    margin-left: auto;
    margin-right: auto;
    display: block;
    cursor: pointer;
}

.graphTimespanSelection button {
    display: inline;
}
/* 10.3 inr styles end */


/* Lab result hierarchy */

.treeIconFirst,
.treeIconIntermediate,
.treeIconLast {	width: 21px; padding: 0; }
.treeIconFirst { background: transparent url(images/treeIconFirst.png) no-repeat 100% 50%; }
.treeIconIntermediate { background: transparent url(images/treeIconIntermediate.png) no-repeat 100% 50%; }
.treeIconLast { background: transparent url(images/treeIconLast.png) no-repeat 100% 50%; }
.treeIconStump { }


/*Search start*/

/*#country {
    height: 40px;
    font-family: "new-hero", sans-serif;
    font-family: var(--font-sans-serif-alt);
    width: 100%;
    max-width: 400px;
    padding: 0 0 0 16px;
    border-radius: 4px 0 0 4px;

    color: #FFFFFF;

    color: var(--colors-white);
    background-color: #06175E;
    background-color: var(--colors-primary);
    border: 1px solid #06175E;
    border: 1px solid var(--colors-primary);
  }

#country form {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    flex-flow: row nowrap;
    width: 250px;
  }
#country::-moz-placeholder {
      color: #FFFFFF;
      color: var(--colors-white);
  }

#country:-ms-input-placeholder {
      color: #FFFFFF;
      color: var(--colors-white);
  }

#country::placeholder {
      color: #FFFFFF;
      color: var(--colors-white);
  }

#country:focus {
      background-color: #06175E;
      background-color: var(--colors-primary);
  }

#country button {
    color: #FFFFFF;
    color: var(--colors-white);
    display: flex;
    justify-content: center;
    align-items: center;
    padding-right: 16px;
    cursor: pointer;

    border: 1px solid #06175E;

    border: 1px solid var(--colors-primary);
    background-color: #06175E;
    background-color: var(--colors-primary);
    border-radius: 0 4px 4px 0;
  }

.top-bar--secondary .search button:after {
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-feature-settings: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 22px;
  font-size: 24px;

  /* Better Font Rendering =========== 
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  }

.top-bar--secondary .search button:after {
  content: "\e91b";
  }*/

/*NEW STYLES FOR SEARCH*/
/*.searchInput {
  /* float: right; 
  align-self: flex-end;
  height: 2rem;
  width: 270px;
  margin: 20px 0;
  padding: 0 2rem 0 3.2rem;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 1rem;
  text-overflow: ellipsis;
  outline: 0;
  border-radius: 10rem;
  border: 0;
  border: .05rem solid lightgray;
}*/

.input-search-container{
  border-radius: 0.4rem;
  border: none;
  border: 0.2rem solid lightgray;
  width: fit-content;
  margin: 10px 0;
  padding:0 0.1rem 0 0.1rem;
  /*margin-left:auto;*/
  margin-right:5px;
  /*display:inline-block;*/
  display: flex;
  align-items: center;
}
.searchInput {
  border:none !important;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  font-size: 1rem;
  text-overflow: ellipsis;
  outline: 0;
  height: 2rem;
  width:200px;
}

form.searchInbox input[type="submit"] {
    padding:7px 12px 7px 10px;
}

#portlet-netnurseCustomer form.searchInbox {
    margin-right: 0 !important;
    margin-left: auto !important;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}


.autocomplete {
    background: white;
    z-index: 1000;
    font: 18px/22px "-apple-system", BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    overflow: auto;
    box-sizing: border-box;
    border: 1px solid lightgray;
    
}

.autocomplete * {
    font: inherit;
}

.autocomplete > div {
    padding: 0 4px;
}

.autocomplete .group {
    background: #eee;
}

.autocomplete > div:hover:not(.group),
.autocomplete > div.selected {
    background: #d9d9d9;
    cursor: pointer;
}

/*Search end*/

#portal-column-center a:focus-visible, #portal-column-center input:focus-visible, #portal-column-center select:focus-visible, #contentFoot a:focus-visible, #portal-column-center textarea:focus-visible, .attached_form button.icon-delete.remove:focus-visible, #portal-column-center button:focus-visible {
    /* border: 2px solid blue !important; */
    border-color: transparent;
    outline: none;
    box-shadow: 0 0 0 2px blue;
}

/*Skip maincontent start*/
#skipToMainContent {
    display: inline-block !important;
}

#skipToMainContent a {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    text-decoration: none;
    font-size: 20px;
    color: #2B456C;
}

#skipToMainContent a:focus {
    position: static;
    width: auto;
    height: auto;
    background: rgb(255, 255, 255) none repeat scroll 0% 0%;
    left: 50%;
    line-height: 1;
    margin-top: 0.125rem;
    padding: 0.5rem 2rem;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 121px;
    white-space: nowrap;
    outline: transparent solid 3px;
    border-radius: 2px;
    box-shadow: 0 0 3px #5a5b5c;
    -moz-box-shadow: 0 0 3px #5a5b5c;
    -webkit-box-shadow: 0 0 3px #5a5b5c;
    z-index: 1000;
}
/*Skip maincontent end*/

.infoMessage,
.alertMessage {
	color: #000;
	border-width: 1px;
	border-style: solid;
	padding: 4px 8px 6px 8px;
	margin: 6px 0 12px 0;
}
.infoMessage {
	display: block;
	background-color:#FAD683;
	background-color:var(--colors-yellow);
    border:1px solid #FAD683;
	border:1px solid var(--colors-yellow);
}
.alertMessage {
    margin-top:20px;
	color: #fff;
	background-color: #ea2a2b;
	border-color: #d52223 #ca1a1b #ca1a1b #d52223;
}
.alertMessage a { color: #fff71e; }

#timeoutWarning {
	background-color:#FAD683;
	background-color:var(--colors-yellow);
    box-shadow: 0 2px 13px #516b73;
    font-size: 110%;
    font-weight: bold;
    height: auto !important;
    padding: 13px 0 14px;
    position: fixed !important;
    text-align: center;
    z-index: 1000;
}

.infoMessage.actBehalfInfo {width:100%;}

.checkbox_error_message {margin-left:4px; color:red;}

tr.bloodtypeRow td  {max-width:10%;}

section,
.section,
.contentBox {
	padding: 12px 20px 16px 21px;
	margin: 1.5em 3px 1.8em 0;
}
section,
.section {
	background-color: #fceef5;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.contentBox {
	background-color: #fff;
	border: 1px solid #828281;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
}

.instructions {
 	background-color: #e6ecef;
	/*background-color: #D2DCE1;*/
	margin: 2em 3px 1.8em 0;
	padding: 12px 20px 16px 21px;
}
.instructions strong {
	font-size: 90%;
	font-weight: bold;
	display: block;
}

.huom {
	display: block;
	width: 88px;
	height: 90px;
	overflow: hidden;
	background: transparent url(images/sticker_huom.png) no-repeat 0 0;
	line-height: 50;
	float: left;
	margin: 0 12px 4px 0;
}
.sidenote {
	color: #b1648b;

	font-size: 85%;
	line-height: 1.2;
}

.s7_form_field_error {
  	background-color:#FBE0A2;
	background-color:var(--colors-yellow-75);
	border-color:#FAD683;
	border-color:var(--colors-yellow);
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    color: #000;
    display: block;
    font-size: 90%;
    padding: 0 6px;
}

.required {
    background: transparent url(images/required.gif) no-repeat scroll right center;
}


/* UI/Datepicker */

#ui-datepicker-div, .ui-datepicker-inline {
	font-family: Verdana, Tahoma, sans-serif;
	font-size: 12px;
	padding: 0;
	margin: 0;
	background-color: #ffffff;
	width: 200px;
	box-shadow: 2px 4px 12px #7f9c98;
}
#ui-datepicker-div, .ui-datepicker-inline {
	display: none;
	border-width: 1px;
	border-style: solid;
	border-color: #a1b6d6 #2B456C #2B456C #6b9e97;
	z-index: 9999 !important;
}
.ui-datepicker-header {
	color: #000;
	font-weight: bold;
	text-align: center;
	height: 1.3em;
	padding: 3px 0 3px 0 !important;
	text-shadow: #fff 1px 1px 1px;
}
.ui-datepicker-title { margin-top: 2px; }
.ui-datepicker-prev {float: left;margin: 1px 0 2px 5px;background: #fff url(images/bg_btn_cal_prev.png) no-repeat 0 -1px;}
.ui-datepicker-next { float: right; margin: 1px 5px 2px 0; background: #fff url(images/bg_btn_cal_next.png) no-repeat 0 -1px; }
.ui-datepicker-prev,
.ui-datepicker-next {
	display: block;
	width: 22px;
	height: 18px;
	border-width: 1px;
	border-style: solid;
	border-color: #a1b6d6 #2B456C #2B456C #a1b6d6;
	line-height: 10;
	overflow: hidden;
	border-radius: 4px;
	cursor: pointer;
}
.ui-datepicker-prev:hover,
.ui-datepicker-next:hover {
	border-color: #a1b6d6 #2B456C #2B456C #a1b6d6 !important;
	box-shadow: 1px 1px 4px #92c9c0;
}
.ui-datepicker-calendar { margin: 2px 3px 4px 3px; }
.ui-datepicker-calendar th {
	height: 14px;
	font-size: 10px;
	color: #fff;
	background-color: #2B456C;
	text-align: center;
}
.ui-datepicker-calendar th,
.ui-datepicker-calendar td { width: 28px; }
.ui-datepicker-calendar td {
	height: 18px;
	background-color: #fff;
	font-weight: normal;
	padding: 2px 0 0 3px;
	vertical-align: top;
	cursor: pointer;
	border: 1px solid #797a7a;
}
.ui-datepicker-calendar td a { color: #000; text-decoration: none; line-height: 1.2; }
.ui-datepicker-calendar td.ui-datepicker-current-day { background-color: #FFB27D; border-color: #c5b70c; }
.ui-datepicker-calendar td.ui-datepicker-current-day a { color: #000 !important; }
.ui-datepicker-calendar td:hover { background-color: #FFB27D !important; border-color: #00994a !important; }
.ui-datepicker-calendar td:hover a { color: #fff !important; }
.ui-datepicker-calendar td a:hover { text-decoration: none; }
.ui-datepicker-calendar .ui-datepicker-other-month,
.ui-datepicker-calendar .ui-datepicker-other-month:hover {
	background: transparent !important;
	border-color: #000 !important;
	cursor: default;
}
.ui-datepicker-calendar .ui-datepicker-today {
	background-color: #d8dcf0;
	border-color: #000;
}
.ui-datepicker-calendar .ui-datepicker-today a { color: #000; }


/*.buttonIsletL,
.buttonIsletR {
	width: 100%;
	margin: 4px 0 8px 0;
	clear: both;
}
.buttonIsletL .button {
	float: left;
	margin: 2px 3px 0 0;
}
.buttonIsletR .button {
	float: right;
	margin: 2px 0 3px 0;
}*/


/* UI/Slider */

.ui-slider-1 .ui-slider-handle, .ui-slider-2 .ui-slider-handle { 
	position: absolute; 
	z-index: 1; 
	height: 23px; 
	width: 12px; 
	top: 0; 
	left: 0; 
	background-image: url(images/slider-handle.gif);  
}
.ui-slider-1 .ui-slider-handle-active, .ui-slider-2 .ui-slider-handle-active { border: 1px dotted #000; }
.ui-slider-disabled .ui-slider-handle { opacity: 0.5; filter: alpha(opacity=50); }
.ui-slider-range { 
	position: absolute; 
	background: #50A029; 
	opacity: 0.3; 
	filter: alpha(opacity=30); 
	width: 100%; 
	height: 100%; 
}
/* Default slider backgrounds */
.ui-slider-1 { 
	width: 200px; 
	height: 23px; 
	position: relative; 
	background-image: url(images/slider-bg-1.png); 
	background-repeat: no-repeat; 
	background-position: center center; 
}
.ui-slider-2 { 
	width: 200px; 
	height: 23px; 
	position: relative; 
	background-image: url(images/slider-bg-2.png); 
	background-repeat: no-repeat; 
	background-position: center center; 
}


/*Tabs and Calendar used at least in in homemeasurements*/
/*ul.tabs {
	position: relative;
	display: block;
	width: 99%;
	float: left;
	clear: both;
	border-bottom: 1px solid #dbdbdb;
	margin: 0 0 8px 0;
	padding: 0;
}
ul.tabs li {
	float: left;
	margin: 2px 3px 0 0;
	list-style: none !important;
	list-style-image: none !important;
}
ul.tabs li a {
	display: block;
	float: left;
	color: #fff;
	background: #2e3192;
	font-size: 90%;
	font-weight: bold;
	white-space: nowrap;
	text-decoration: none;
	padding: 4px 8px 5px 8px;
	margin-bottom: -1px;
	border: 1px solid #dbdbdb;

}
ul.tabs li a:hover,
ul.tabs li a.selected {
	color: #000 !important;
	background: #fff;
	text-decoration: none !important;
	border-bottom: 1px solid #fff;
}
ul.tabs li a.disabled,
ul.tabs li a.disabled:hover {
	color: #bbb !important;
	background: #fff url(images/bg_tab.gif) repeat-x 0 100% !important;
	cursor: default;
	border-color: #b5b5b5 #b5b5b5 #888 #b5b5b5;
}*/

/* Tabs */

#portlet-content\:tabs .portletHead { display: none; }

ul.tabs {
	position: relative;
	width: 100%;
	float: left;
	clear: both;
	list-style: none;
	list-style-image: none;
	margin: 30px 0 8px 0;
	padding: 0;
}
ul.tabs li {
	font-size: 16px;
	float: left; 
	z-index: 10;
}

ul.tabs li a {
	border: 1px solid #2B456C;
	color: #2B456C;
	position: relative;
	display: block;
	float: left;
	font-weight: bold;
	white-space: nowrap;
	text-decoration: none;
	padding: 10px 20px 10px 20px;
	-moz-transition: .2s;
	-webkit-transition:.2s;
	-o-transition: .2s;
  	transition: .2s;
	z-index: 10;
    /*text-transform:uppercase;*/
}
ul.tabs li a:hover,
ul.tabs li a.selected,ul.tabs li a.selectedWithNewComments {
	background-color: #fbe9e3;
	background-color: var(--bg-colors-salmon);
	background-color: #feb7a4;
    background-color: var(--colors-secondary-salmon);
	color: #06175e;
	color: var(--colors-primary);
}
ul.tabs li a.disabled:hover {
	color: #ccc;
	background: #fff;
	border-color: #ccc;
	cursor: default;
}


/* Calendar */

.calendar td.measurements {
  color: #fff !important;
  background: #0d9500;
  border-color: #0d9500;
}

.calendar td.normal {
  background: #fff;
  border-color: #0d9500;
}

.calendarDay.normal.measurements {
  color: #fff !important;
  background: #0d9500;
  border-color: #0d9500;
}


table.calendar {
	//background: #fff url(images/calendar_bkgnd_top.gif) repeat-x top left;
	border: 1px solid #6AA5CF;
}
table.calendar td {
	text-align: center;
	padding: 0 !important;
	margin: 0;
}
table.calendar tr.calendarHeader td { padding: 2px 3px 3px 3px !important; }
table.calendar tr.calendarWeek td {
	padding: 2px 0 0 3px !important;
	width: 24px !important;
	height: 25px !important;
	overflow: hidden;
	text-align: left;
	vertical-align: top;
	border-width: 1px;
	border-style: solid;
	border-color: #7EB2D0 #3069A7 #3069A7 #7EB2D0;
	/* background: #fff; */
}
table.calendar tr.calendarWeek td.currentDay {
	background:#FABB00;
	}
table.calendar tr.calendarWeek td:hover, table.calendar tr.calendarWeek a:hover{
	background:#dc0368;
	color:#fff;
	cursor:pointer;
	} 
table.calendar tr.calendarWeek td.calendarDayEvent {
	background: #FFFFFF;
	border-color: #B79256 #795F34 #795F34 #B79256;
}
table.calendar tr.calendarWeek td.calendarDayOther {
	color: #5983A4 !important;
	background: #fff;
	border-color: #AACBE3 #77A3C8 #77A3C8 #AACBE3;
}
table.calendar td.calendarCurrentMonth {
	color: #4381B6;
	font-weight: bold;
	text-transform: capitalize;
}
table.calendar td.calendarDayToday { font-weight: bold; }
table.calendar tr.calendarWeekdays td {
	font-size: 85%;
	font-weight: bold;
	color: #87B2CA;
}
table.calendar .calendarPrevLink a,
table.calendar .calendarNextLink a,
table.linkCalendar .calendarPrevLink a,
table.linkCalendar .calendarNextLink a {
	display: block;
	font-weight: bold;
	text-align: center;
    cursor:pointer;
}
a.blockLink:hover,
table.calendar .calendarPrevLink a:hover,
table.calendar .calendarNextLink a:hover { text-decoration: none !important; }


table.linkCalendar {
	background: #fff url(images/calendar_bkgnd_top.gif) repeat-x top left;
	border: 1px solid #6AA5CF;
}
table.linkCalendar td {
	text-align: center;
	padding: 0 !important;
	margin: 0;
}
table.linkCalendar tr.calendarHeader td { padding: 2px 3px 3px 3px !important; }
table.linkCalendar tr.calendarWeek td a,
table.timeGrid td a {
	display: block;
	color: #000 !important;
	padding: 2px 3px 2px 3px !important;
	width: 24px !important;
	height: 25px !important;
	overflow: hidden;
	text-align: left;
	vertical-align: top;
	border-width: 1px;
	border-style: solid;
	border-color: #7EB2D0 #3069A7 #3069A7 #7EB2D0;
	background: #fff url(images/calendar_bkgnd_day.jpg) no-repeat top left;
	text-decoration: none !important;
}
table.linkCalendar tr.calendarWeek td.weekNumber a {
	display: block;
	width: 26px !important;
	padding: 4px 3px 0 3px !important;
	background: #F1FCFF;
	color: #4787B6 !important;
	font-size: 90%;
	font-weight: bold;
	text-align: center;
	border-color: #7EB2D0;
}
table.linkCalendar tr.calendarWeek td.weekNumber a:hover,
table.linkCalendar tr.calendarWeek td.weekNumber a.selected {
	color: #000 !important;
	background: #FFFCEE url(images/calendar_bkgnd_day_event.jpg) no-repeat top left;
	border-color: #B79256 #795F34 #795F34 #B79256;
}
table.linkCalendar tr.calendarWeek td.calendarDayEvent a,
table.linkCalendar tr.calendarWeek td.calendarDay a:hover,
table.linkCalendar tr.calendarWeek td.calendarDay a.selected,
table.timeGrid td a:hover {
	background: #FFFCEE url(images/calendar_bkgnd_day_event.jpg) no-repeat top left;
	border-color: #B79256 #795F34 #795F34 #B79256;
}
table.linkCalendar tr.calendarWeek td.calendarDayOther {
	padding: 2px 3px 2px 3px !important;
	width: 24px !important;
	height: 25px !important;
	color: #5983A4 !important;
	text-align: left;
	vertical-align: top;
	background: #fff;
	border-width: 1px;
	border-style: solid;
	border-color: #AACBE3 #77A3C8 #77A3C8 #AACBE3;
}
table.linkCalendar td.calendarCurrentMonth {
	color: #4381B6;
	font-weight: bold;
	text-transform: capitalize;
}
table.linkCalendar td.calendarDayToday { font-weight: bold; }
table.linkCalendar tr.calendarWeekdays td,
table.timeGrid th {
	font-size: 85%;
	font-weight: bold;
	color: #87B2CA;
}
table.timeGrid {
	background: #fff url(images/calendar_bkgnd_top.gif) repeat-x 0 -10px;
	border: 1px solid #6AA5CF;
}
table.timeGrid td {
	height: 21px;
	width: auto;
	background: transparent url(images/bkgnd_timegrid.gif) no-repeat top left;
}
table.timeGrid th {
	color: #4381B6;
	white-space: nowrap;
	height: 22px;
	font-size: 90%;
	text-align: center;
	vertical-align: bottom;
	padding-bottom: 2px;
}
table.timeGrid th.selected { color: #000; background: #FFEDAB; }
table.timeGrid th a { height: 15px; padding-top: 5px; }
table.timeGrid td a {
	background: #E0F3FC;
	padding: 2px 3px 2px 3px !important;
	width: 88% !important;
	height: auto !important;
	text-align: center;
	margin: 0 auto 0 auto;
}
table.timeGrid td.selected { background-color: #FFFDF2; }
table.timeGrid td a:hover,
table.timeGrid td a.selected { background: #FFF1C0; }
table.calendar, 
#dailyTable {
    border:1px solid #dbdbdb;;
    box-shadow:0 0 5px rgba(0,0,0,0.2);
}
table.calendar tr.calendarWeek td {
    border:none; 
}
table.calendar tr.calendarWeekdays td {
    color:#fff;
    background:#2e3192;
}
table.calendar tr.calendarWeek td.calendarDayOther {
    background:#f3f3f3;
    color:#999!important;
}
table.calendar .calendarPrevLink a, table.calendar .calendarNextLink a, table.linkCalendar .calendarPrevLink a, table.linkCalendar .calendarNextLink a {
  	background-color: #06175e;
  	background-color: var(--colors-primary);
    border: 2px solid #06175E;
    border: 2px solid var(--colors-primary);
    border:none;
    color:#fff !important;
    font-size:15px;
    padding:0 3px 5px 3px;
}
table.calendar td.calendarCurrentMonth {
    color:#35414B;
}    


/*Buttons and other ends*/  

/* new home measurements */

/*ul.tabs {
	font-size: larger; 
}*/

#portlet-pef .portletHead,
#portlet-bloodpressure .portletHead,
#portlet-sleep .portletHead,
#portlet-alcohol .portletHead,
#portlet-weight .portletHead {
	padding-top: 10px; 
}

#portlet-pef .portletBody,
#portlet-bloodpressure .portletBody,
#portlet-sleep .portletBody,
#portlet-alcohol .portletBody,
#portlet-weight .portletBody,
#portlet-bloodsugar .portletBody,
#portlet-homeMeasurementConfig .portletBody,
#portlet-omho_hmbutton2 .portletBody {
	max-width: 100% !important; 
}



@media screen and (max-width: 500px) {
  #portlet-pef,
  #portlet-bloodpressure,
  #portlet-sleep, 
  #portlet-alcohol,
  #portlet-weight,
  #portlet-bloodsugar,
  #portlet-omhodiabetes,
  #portlet-homeMeasurementConfig {
      padding-left: 5px !important;
	  padding-right: 5px !important;
  }
}

#homeMeasurementsCalendar .calendar {
    width: 100%;
}

#homeMeasurementsCalendar .calendarWeek td {
	height: 35px !important;
    font-size: large;  
}
/*added 270122*/
#homeMeasurementsCalendar table.calendar .calendarPrevLink a, #homeMeasurementsCalendar table.calendar .calendarNextLink a, #homeMeasurementsCalendar table.linkCalendar .calendarPrevLink a, #homeMeasurementsCalendar table.linkCalendar .calendarNextLink a {
    /*border: 1px solid #dc0368;
    border-radius: .25rem;*/
 	border: 2px solid #06175E;
  	border: 2px solid var(--colors-primary);
}

#homeMeasurementsCalendar .calendarWeek .calendarDay:hover,
#homeMeasurementsCalendar .calendarWeek .selectedDate {
    outline-color: #57a4e6 !important;
    outline-style: auto; 
    outline-style: solid;
    outline-width: 2px;
    outline-offset: -2px;
    background: #c0decc;
}

#homeMeasurementsCalendar .calendarWeek .future:hover {
	outline-style: none;
}

#homeMeasurementsCalendar .calendarWeek .future {
	color: grey;
    background: none;
}

#homeMeasurementsCalendar .calendarWeek .today {
	color: #2e3192;
    font-weight: bold;
    font-size: larger;
    padding-top: 0px !important;
}

#homeMeasurementsCalendar #monthSelector {
    text-transform: capitalize; 
  	width: 40%;
    height: 30px;
    margin-right: 5px;
    font-size: larger;
}

#homeMeasurementsCalendar #yearSelector {
  	width: 25%;
    height: 30px;
    font-size: larger;
}


@media screen and (max-width: 700px) {
  #homeMeasurementsCalendar #yearSelector {
      /*width: 30%;*/
      width:auto;
  }

  #homeMeasurementsCalendar #monthSelector {
      width: 50%;
  }
  
}

@media screen and (max-width: 450px) {
  #homeMeasurementsCalendar .calendarMeasureImage {
  	width: 40px;
  }
}

@media screen and (max-width: 350px) {
  #homeMeasurementsCalendar .calendarMeasureImage {
  	width: 30px;
  }
}

#homeMeasurementsCalendar .dailyMarkingExists {
 	outline-color: #ffc02f;
    outline-style: auto;
}

.homeMeasureContents {
   margin-top: 20px;
}

.homeMeasureContents .homeMeasurementDailyView {
	max-width: 750px;
}

.homeMeasureContents .homemeasurementSaveSuccessful {
    color: green;
  	white-space: nowrap;
    vertical-align: super;
}

.homeMeasureContents .errorMessage {
 	color: red; 
}

.homeMeasureContents .incorrectInput {
 	border-color: #ef5c06 !important;
  	border-width: 2px;
}

.homeMeasureContents #removeMeasureButton {
 	background: #e82525 !important; 
    
}

.homeMeasureContents #removeMeasureButton:enabled:hover {
 	background: #e82525 !important; 
    border-color: #d8e8df !important;
}

.homeMeasureContents .homeMeasurementsButton,
.homeMeasureContents .#removeMeasureButton {
 	margin-left: 10px;
    margin-bottom: 10px;
}

/*.homeMeasureContents .homeMeasurementsButton:disabled, 
.homeMeasureContents .homeMeasurementsButton:disabled:hover {
 	color: #fff;
    background-color: #dc0368 !important;
    border-color: #007bff !important;
  	cursor: default;
}*/

.homeMeasureContents .homeMeasurementsButton,
.homeMeasureContents .caledarTimeSpanButton,
#portlet-omhodiabetes button {
  	background-color: #06175e;
  	background-color: var(--colors-primary);
    border: 2px solid #06175E;
    border: 2px solid var(--colors-primary);
    border: none;
}


.homeMeasureContents .homeMeasurementsButton:focus,
.homeMeasureContents .caledarTimeSpanButton:focus,
#portlet-omhodiabetes button:focus {
 	box-shadow: none; 
}

#portlet-omhodiabetes button {
	margin-bottom: 8px;  
}

#portlet-omhodiabetes .portletBody {
	max-width: 100% !important; 
}

.homeMeasureContents .homeMeasurementsButton:hover {
  	background-color: #06175e;
  	background-color: var(--colors-primary);
}

.homeMeasureContents .fieldsetCaption {
  	box-shadow:  3px 4px 9px 0px #b6cad4;
    -moz-box-shadow:  3px 4px 9px 0px #b6cad4;
    -webkit-box-shadow:  3px 4px 9px 0px #b6cad4;
    padding: 10px;
}

.homeMeasureContents .homeMeasurementListView {
	border: 1px;
    border-color: #65aae0;
    border-style: solid;
    background-color: #f6fafd;
}

.homeMeasureContents .listViewContents {
    display: table;
}

.homeMeasureContents .listViewTable {
    margin-bottom: 20px;
    border-spacing: 2px;
    border-collapse: separate;
    background-color: #ffffff00;
}

.homeMeasureContents .listViewTableHeader {
	background: #D0E4F5;
    background: -moz-linear-gradient(top, #dcebf7 0%, #d4e6f6 66%, #b0cce4 100%);
    background: -webkit-linear-gradient(top, #dcebf7 0%, #d4e6f6 66%, #b0cce4 100%);
    background: linear-gradient(to bottom, #dcebf7 0%, #d4e6f6 66%, #b0cce4 100%);
    padding: 12px;
}

.homeMeasureContents .listViewColumn {
	padding: 4px;
    text-align: center;
    font-size: larger;
}

.homeMeasureContents .listViewEvenRow {
	background: #e1eaf2;
}

.homeMeasureContents .listViewOddRow {
    background: #efefef;
}

.homeMeasureContents .listViewRemoveImage {
 	padding: 5px; 
}

.homeMeasureContents .listViewLoadingGif {
 	padding: 10px; 
}

.homeMeasureContents .caledarTimeSpanButton {
	font-size: larger;
    margin: 2px;
    background-color: #68696b;
}

.homeMeasureContents .currentlySelectedDaysInGraph {
	background-color: #0033AA !important;
}

#graphRangeSection .currentlySelectedDaysInGraph {
    color: white !important;
}

.homeMeasureContents .legendSelection:hover {
	stroke: #ececec;
}

.homeMeasureContents .graphLoadingText {
 	margin-left: 10px;
    margin-top: 20px;
    font-style: italic; 
}

.homeMeasureContents .graphLoadingGif {
 	margin-left: 10px; 
}

.homeMeasureContents .container label {
 	white-space: nowrap; 
}


#alcoholMeasureContents .form-group {
    max-width: 50%; 
}

#sleepMeasureContents .sleepQualitySelection {
 	font-size: large;
    color: blue;
}

#sleepMeasureContents .sliderticks {
    display: flex;
    justify-content: space-between;
  	padding-right: 7px;
  	padding-left: 8px;
}

#sleepMeasureContents .sliderticks p {
    position: relative;
    display: flex;
    justify-content: center;
    text-align: center;
    width: 1px;
    background: #D3D3D3;
    height: 10px;
    line-height: 40px;
    margin: 0 0 20px 0;
}


.homeMeasureContents #bloodPressureMeasureDailyListView,
.homeMeasureContents .newMeasureForm {
	background: #ebebf5;
  	padding: 0px;
}

.homeMeasurementInstructions #instructionContents {margin-top:10px;}

.homeMeasureContents .homeMeasureSectionHeader {
    display: block;
    color: #fff;
    background: #2e3192;
    font-weight: bold;
    padding: 2px 8px 3px 8px;
    border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0; 
}


@media screen and (max-width: 500px) {
  .homeMeasureContents .listViewTableHeader {
       font-size: small;
       padding: 5px;
  }
}

@media screen and (max-width: 500px) {
    .homeMeasureContents .listViewColumn,
    .homeMeasureContents .homeMeasureCommentRow {
        font-size: small;
        padding: 0px;
    }
 
 	.homeMeasureContents .homeMeasurementDailyView,
    #portlet-omhodiabetes .homeMeasurementInstructions {
		padding: 0px;      
        margin: 0px;
    }
  
    #listViewTable td.listViewColumn.removeFromPrint button.homeMeasurementsButton.modifyRowButton {font-size: smaller !important;}  
}

@media screen and (max-width: 700px) {
   .homeMeasureContents .container {
   	  font-size: large;
  }
  
   .homeMeasureContents .container input {
   	  font-size: large;
  }  
}

@media screen and (max-width: 1080px) {
  .homeMeasureContents .container label {
      white-space: normal; 
  }
}

.homeMeasureContents .listViewEvenRow:hover,
.homeMeasureContents .listViewOddRow:hover {
  	background: #b9cae8;
}

.homeMeasureContents .bpBackgroundGreen {
  	background: #44b144;
}

.homeMeasureContents .bpBackgroundYellow {
  	background: #eaea57;
}

.homeMeasureContents .bpBackgroundRed {
  	background: #e64545;
}

.homeMeasureContents .homeMeasureCommentRow td {
 	background: #edf3f5;
    padding-left: 10px;
    word-break: break-word;
}

.bloodPressureValueLabel {
	white-space: normal !important;
}

#bloodSugarPortletHeader {
	font-size: 210% !important;
    font-weight: normal;
    display: block;
    line-height: 1.1;
    padding: 0 0 10px 1px;  
}


.homeMeasureContents .graphTooltip {
 	white-space: nowrap; 
}

.homeMeasureContents #bloodPressureMeasureListView {
    margin-bottom: 15px;
}


.homeMeasureContents .homeMeasurementSelectionButton {
	background: #fdfdfd;
    color: #102752;
    font-size: large;
}


.telescope .homeMeasureContents .newMeasureForm,
.telescope .homeMeasureContents .listViewRemoveImage {
 	display: none; 
}

.telescope .homeMeasureContents .listViewContents {
 	margin-left: 5px; 
}

.telescope .homeMeasurementInstructions,
.telescope .modifyRowButton {
  display: none !important; 
}

.telescope #backToHomeMeasureSelectionButton {
    margin: 10px;
}


.telescope #homeMeasurementsCalendar .calendar {
 	display: none; 
}


.telescope #portlet-homeMeasurementConfig {
 	display: block !important; 
}

.telescope #bloodPressureMeasureDailyListView {
 	display: none; 
}

.homeMeasureContents label {
 	font-size: medium; 
}

.telescope .homeMeasureContents .svg-container {
  	width: 700px;
    height: 600px;
}


#bloodSugarMeasureContents #bloodSugarMobileInputs1 .mobileViewTabButton {
    background-color: inherit;
    float: left;
    border: #d5ddff;
    border-width: thin;
    border-style: solid;
    outline: none;
    cursor: pointer;
    padding: 5px 0 5px 5px;
    background: #fff;
    width: 100%;
    height: 90px;
    border-radius: 12px;
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .mobileViewTabButtonSelected {
	background: #9fddf3ba !important;
    border-color: #00000070;
    border-width: 1px;
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .mobileViewTabButtonSelected .mealButtonLabel {
  	text-decoration: underline !important;
  	color: #1f1f1f;
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .bloodSugarSummary {
    font-weight: normal;
    font-style: italic;
    color: black; 
    font-size: medium;
    white-space: nowrap;
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .bloodSugarSummaryWrapper {
    margin-left: 1%;
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .mobileViewTabButton:hover {
    background: #ffe;
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .bloodSugarMobileViewLabel {
	margin-bottom: 0px;  
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1 .bloodSugarMobileViewInput {
	height: 30px;
    width: 100%; 
}

#bloodSugarMobileInputs1 {
 	margin-bottom: 20px; 
}

#bloodSugarMobileInputs1 #saveMeasureButton {
	margin-top: 10px;
    margin-bottom: 10px;
}

#bloodSugarMobileInputs1 .bloodSugarMobileViewInsert {
 	margin-top: 10px; 
}


#bloodSugarMeasureContents #bloodSugarMobileInputs2 .bloodSugarMobileViewLabel {
	margin-bottom: 0px;  
    width: 150px;
}

#bloodSugarMobileInputs2 .bloodSugarMobileViewInsert {
 	margin-top: 10px; 
    padding-right: 0px;
    padding-left: 0px;
    margin-bottom: 10px;
}

#bloodSugarMobileInputs2 .newMeasureForm {
 	background: #fdfdfd; 
}

#bloodSugarMobileInputs2 .bloodSugarMealSection {
 	display: block;
    color: #28303c;
    background: #fdfdfd;
    font-family: Verdana, Tahoma, sans-serif;
    font-weight: bold;
    text-shadow: 1px 1px 0 #effffd;
    padding: 8px 8px 8px 20px;
    border-radius: 6px 6px 6px 6px !important;
    border-width: thin;
    border-style: solid;
    border-color: #577f7f;
    -moz-border-radius: 6px 6px 6px 6px; 
    -webkit-border-radius: 6px 6px 6px 6px; 
    padding-top: 0px;
	padding-bottom: 0px;
}

#bloodSugarMobileInputs2 .bloodSugarMealHeader {
    padding-top: 8px;
    padding-bottom: 8px;
}


#bloodSugarMobileInputs2 .bloodSugarMealSection:active {
	background: #f3f3f3; 
}


#bloodSugarMobileInputs2 {
 	margin-bottom: 20px; 
}

#bloodSugarMeasureContents #bloodSugarMobileInputs2 .bloodSugarSummary {
    font-weight: normal;
    font-style: italic;
    color: black; 
}

#bloodSugarMeasureContents #bloodSugarMobileInputs2 .bloodSugarSummaryWrapper {
    margin-left: 10px;
}

#bloodSugarMobileInputs3 .bloodSugarMeal {
 	font-weight: bold; 
    background: #d3e0e4;
  	margin-top: 5px;
    margin-bottom: 3px;
    padding-top: 3px;
    padding-bottom: 5px;
}

#bloodSugarMobileInputs3 .bloodSugarMeal:hover {
 	border-style: solid;
    border-width: thin;
    border-color: #c5bfca;
    background: #e4eef1;
 	margin-bottom: 1px;
}

#bloodSugarMobileInputs3 .bloodSugarMobileViewValue {
 	float: right; 
}

#bloodSugarMobileInputs3 .bloodSugarMobileViewLabel {
 	font-style: italic; 
}

#bloodSugarMobileInputs3 .mealEditButton {
    float: right;
    margin-top: 2px; 
}

#bloodSugarMobileInputs3 .bloodSugarMobileViewInputLabel {
 	margin-bottom: 1px; 
    font-size: medium;
}

#bloodSugarMobileInputs3 .bloodSugarMobileViewInput {
 	margin-bottom: 10px; 
}

#bloodSugarMobileInputs3 .bloodSugarDialogHeader {
	display: block; 
    font-size: larger;
}


#bloodSugarDesktopInputs {
   margin-left: 0px; 
}

.bloodSugarDesktopInputLabel {
   margin-left: 5px;
}

#saveMeasureButton_desktop {
  margin: 5px;
}

#bloodSugarMobileInputs1,
#bloodSugarMobileInputs2,
#bloodSugarMobileInputs3,
#bloodSugarMobileList {
   display: none;
}


@media screen and (max-width: 700px) {
  #bloodSugarMobileInputs1,
  #bloodSugarMobileInputs2,
  #bloodSugarMobileInputs3,
  #bloodSugarMobileList {
     display: block !important;
  }
  
  #bloodSugarDesktopInputs,
  #bloodSugarDesktopList {
  	display: none !important;  
  }
  
  
  #portlet-bloodsugar #homeMeasurementsCalendar {
      order: 0 !important;
      margin-top: 20px;
  }
  
}


#bloodSugarMeasureContents .listViewTable th {
  font-size: smaller;
  padding: 5px;
}

#bloodSugarMeasureContents .listViewTable {
	border-collapse: collapse;
    background-color: white;
}

#bloodSugarMeasureContents .listViewTable td {
	border-right: 1px solid #ddd;
  	border-bottom: 1px solid #ddd;
    padding: 4px 5px 4px 5px;
}

#bloodSugarMeasureContents .listViewTable .bloodSugarBeforeColumn {
	border-left: 2px solid #ddd;
}

#bloodSugarMeasureContents .listViewTable .bloodSugarExtraMeasureColumn {
	border-left: 2px solid #ddd;
}

#bloodSugarMeasureContents .listViewTable .bloodSugarOkBg {
 	background-color: #29b129;
    font-weight: bold;
}

#bloodSugarMeasureContents .listViewTable tr:hover {
	background-color: #dddddd82;
}

#portlet-homeMeasurementConfig {
	background-color: #fff;
	border: 1px solid #D0E1E0;
	border-radius: 2px;
	clear: both;
	margin: 1em 0 1.1em;
	padding: 8px 14px 14px;
}


.homeMeasureContents .listViewTabButton {
    background-color: inherit;
    float: left;
    border: #d5ddff;
	color: #2e3192 !important;
    border-width: thin;
    border-style: ridge;
    outline: none;
    cursor: pointer;
    background: #fff;
    width: 100%;
    height: 60px; 
	font-size: large;
    padding-top: 10px;
    padding-bottom: 10px;  
}


.homeMeasureContents .listViewButtonSelected {
  	color: #FFF !important;
    background: #2e3192 !important;
	font-size: larger;
  	text-decoration: underline !important;
}

.homeMeasureContents .graphAndListViewSection {
    border-style: solid;
    border-width: 2px;
    border-color: #cbcbcb;
    max-width: 730px;
}

#bloodSugarMeasureContents .graphAndListViewSection {
 	 max-width: 1000px !important;
}

#bloodSugarMeasureContents .bloodSugarMobileViewResults {
 	float: right; 
}

.bloodSugarMobileMeasureDetails .bloodSugarMobileViewInputLabel {
 	font-size: 100%; 
}

#showExtraRows {
	margin-left: 10px; 
}

#pefMeasureContents input[type=checkbox] {
	width: 22px;
	height: 22px;
}


#pefReferenceValues .row {
 	margin-bottom: 10px; 
}

#pefReferenceValues .pefHeightLabel {
 	white-space: pre;
	margin-top: 20px !important;
}

#pefReferenceValues #heightInput {
	margin-top: 12px !important;
	margin-left: 15px;
}

#pefReferenceValues #saveHeightButton {
	margin-top: 10px !important; 
	margin-left: 10px;
}

.homeMeasureContents #timeSelectionTable table {
  margin-top: 0px !important;
}

#bloodSugarMeasureContents .homeMeasureSectionHeader button {
	display: table-row;
}

@media screen and (max-width: 1000px) {
    #bloodSugarMeasureContents .bloodSugarDesktopMealLabel {
        font-size: small !important; 
    }
}

.homeMeasureContents .listViewTabButton:hover {
	color: #fff !important;
    background: #2e3192 !important;
}

.homeMeasureContents .listViewButtonSelected:hover {
    color: #ffffff !important;
}

#homeMeasurementsCalendar td {
   border: 1px solid #6AA5CF;
}


#bloodSugarMeasureContents #bloodSugarMobileInputs1 .mobileViewTabButton {
  color: #1f1516;
  margin-top: 1px;
  display:inline-block;
}

.bloodSugarSummaryWrapper td {
 	width: 50% !important; 
}

.bloodSugarSummaryWrapper {
 	width: 100%; 
}

#bloodSugarDesktopList .listViewTable {
 	font-size: small; 
}

#bloodSugarMeasureContents .homeMeasureSectionHeader button {
    background: #ebebf5; 
    color: black;
}

#bloodSugarDesktopInputs {
 	padding-left: 0px; 
}

#bloodSugarMobileInputs1 .newMeasureForm {
 	margin-left: 0px;
    margin-right: 0px;
}

#bloodSugarMobileInputs1 .mobileViewTabButton {
 	padding: 3px; 
}

#homeMeasurementsCalendar #monthSelector {
    height: 40px;
}

#homeMeasurementsCalendar #yearSelector {
    height: 40px;
}

#bloodSugarMobileInputs1 .bloodSugarMobileViewInsert table td {
    width: unset !important;
    display: block;
}

.homeMeasureContents .modal-dialog .bloodSugarDialogHeader {
 	font-weight: bold;
    font-size: large; 
}


.telescope #configButton2 {
 	display: none; 
}

.dailyMeasuresTable {
 	font-size: small; 
}

#bloodpressureDailyView .newMeasureForm input {
  font-size: 15px;
}

#bloodpressureDailyView #timeOfDayMinutes,
#bloodpressureDailyView #timeOfDayHours { 
 	width: 43px !important; 
}


.homeMeasureContents form {
 	margin-left: 0px; 
}

.homeMeasureContents #selectedDate {
	background-color: white !important; 
}

#alcoholMeasureContents #drinksForDay,
#sleepMeasureContents #sleepAmount {
 	font-size: 20px;
	font-weight: bold;
}

#homeMeasurementsCalendar .calendarDay {
    width: 10% !important;
}

#alcoholTimeSpanSummary {
 	display: none; 
}

.homeMeasureContents .graphAndListViewSection .container-fluid {
 	margin-right: 0px;
    margin-left: 0px;
    padding-left: 0px;
    padding-right: 0px; 
}


#pefMeasureContents #pefMeasureListView {
   font-size: small;
}

#pefMeasureContents #pefMeasureListView th {
   font-size: small;
   padding: 5px; 
}

#morningTimeSelectionTable input {
 	width: 40px !important;
}

.addPefCommentButton {
    height: 40px !important;
    white-space: pre;
    max-width: 100% !important;  
}

#pefMeasureContents .timeOfDayHours,
#pefMeasureContents .timeOfDayMinutes {
 	width: 43px !important; 
}


#pefMeasureContents .pefBlowTypeHeader {
 	font-weight: bold; 
}

#pefMeasureStatistics table td {
    border-style: solid;
    border-width: thin;
  	padding: 3px;
}

.pefStatisticsValue {
	float: right; 	 
}

#bloodSugarMobileInputs2,
#bloodSugarMobileInputs3 {
 	display: none !important; 
}


/*Added 1711121 mobile rules*/
@media (pointer: coarse) {
    .homeMeasureContents.container.row {
       justify-content: center;
       margin-right: 0;
       margin-left: 0;
       padding:0;
    }
}  

#homeMeasurementsCalendar {
 	order: 1;
    margin-top: 20px;
}

.homeMeasurementInstructions .homeMeasureSectionHeader {
	background: #2e3192 url(images/minus_legend.png) no-repeat scroll 5px 9px !important;
    padding-left: 25px !important;
	display: block;
    color: #fff;
    font-family: Verdana, Tahoma, sans-serif;
    font-weight: bold;
    padding: 2px 8px 3px 8px;
    border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;   
    -webkit-border-radius: 3px 3px 0 0;  
}

@media screen and (max-width: 600px) {
	#portlet-alcohol .portletHead h5,
    #portlet-sleep .portletHead h5,
    #portlet-weight .portletHead h5,
    #portlet-bloodpressure .portletHead h5, 
    #bloodSugarPortletHeader,
    #portlet-pef .portletHead h5 {
    	display: block !important;  
    }
    
    .hmBackButton {
     	margin-left: 0px !important; 
  	 }
  
}

#portlet-bloodsugar .portletHead h5 {
	display: none !important;
}

#bloodsugarInstructions { display: none !important; }

#bloodSugarPortletHeader {
    font-weight: bold !important;
    color: #2B456C !important;
    border-bottom: none;
    font-family: Arial, sans-serif;
    font-size: 36px;
    letter-spacing: -1px;
    display: flex;
    align-items: center;
    margin: 0.1em 0 0.8em 0;
    padding: 15px 0 4px 0;
    word-break: break-word;
    hyphens: auto;
}

#bloodSugarInstructionContents,
#fillInstructionContents {
 	background: #ebebf5;
    padding: 0px; 
	margin-bottom: 10px;
}

#bloodSugarInstructionContents .homeMeasureSectionHeader,
#fillInstructionContents .homeMeasureSectionHeader,
#pefMeasureContents .homeMeasureSectionHeader {
	display: block;
    color: #fff;
    font-family: Verdana, Tahoma, sans-serif;
    font-weight: bold;
    text-shadow: 1px 1px 0 #638480;
    padding: 2px 8px 3px 8px;
    border-radius: 3px 3px 0 0;
    -moz-border-radius: 3px 3px 0 0;     
    -webkit-border-radius: 3px 3px 0 0;
}

.homeMeasurementDailyView {
    font-size: medium;
}

.homeMeasureContents .row td {
	display: table-cell;
	width: auto;
    float: none;
}


#bloodpressureReference {
	width: 100%; 
    font-size: medium;
}

#bloodpressureReference .referenceTableRow th {
	background-color: #2e3192;
}

#bloodpressureReference .referenceTableRow td {
	white-space: pre-line !important;
}

.homeMeasurementInstructions button {
	/*width: 30%;*/
}

#weightMeasureContents .homeMeasurementInstructions button {
	width: auto; 
}

#pefMeasureContents #instructionsButton,
#pefMeasureContents #blowInstructionsButton {
	margin-bottom: 10px; 
}

@media screen and (max-width: 500px) {
  .homeMeasurementInstructions button {
      width: 100% !important; 
  }
}

@media screen and (max-width: 800px) {
  #weightMeasureContents .homeMeasurementInstructions button {
      width: 48%; 
  }
}

.homeMeasurementInstructions #fillInstructionContents .instructionContents,
#pefMeasureContents .homeMeasurementInstructions .instructionContents{
    padding-left: 20px;
}

.homeMeasurementInstructions {
	font-size: medium; 
}

#pefInstructions {
	margin-right: 0px;
    margin-left: 0px; 
    padding-left: 0px;
    padding-right: 0px; 
}

#s7_form_healthMeasurementConfig fieldset {
	padding-left: 15px; 
	padding-right: 10px;
	padding-bottom: 15px;
}

#s7_form_healthMeasurementConfig .legend {
	margin-right: 0px;  
}

#s7_form_healthMeasurementConfig {
	margin-left: 0px; 
}

.DiabetesMeasurements {
	padding-bottom: 25px !important; 
}

#portlet-omhodiabetes #homemeasure_consent {
	margin-bottom: 15px;  
}

.telescope #homemeasure_consent {
 	display: none; 
}

.telescope #portlet-omhodiabetes {
	display: none;  
}

.bpLegendText,
.bloodsugarLegendText,
.sleepLegendText,
.pefLegendText {
	font-size: 12px !important; 
}

.graphAndListViewSection .tick {
	font-size: 10px !important; 
}

.telescope #portlet-bloodsugar #backToHomeMeasureSelectionButton {
	position: absolute;
    top: 30px;
    width: 95%;
}

.telescope #portlet-homeMeasurementConfig {
 	margin-top: 80px; 
}

#pefMeasureGraphSelections label {
	vertical-align: middle;
}

#bloodSugarDesktopList label {
 	vertical-align: top; 
}


#portlet-graph\:medicines {
	background: white; 
}


#medicines_graphTooltip {
	background: white; 
}

#bloodPressureMeasureContents #fillInstructionContents {
	margin-top: 7px; 
}

#bloodpressureReference .referenceTableColumn {
	box-shadow: none; 
	font-weight: bold;
}

.homeMeasureContents .listViewColumn {
	border-radius: 5px;
}

.homeMeasureContents #dailyListViewEmptyText {
	padding-left: 5px; 
}

#graphRangeSection .caledarTimeSpanButton:hover{
    text-decoration: none !important;
    background-color: #4f8be5 !important;
    color: #fff !important;
}

.homeMeasureCommentRow td {
    padding-top: 0;
    padding-bottom: 5px;
}

.homeMeasureCommentRow td i::before {
	content: "\21B3  ";
	font-weight: bold;
	font-style:normal;
}

#pefMeasureContents #blowInstructionContents {
	margin-top: 8px;  
}

.pefAfterMedicineBlows input[type=text], 
.pefBeforeMedicineBlows input[type=text] {
	min-width: 45px; 
}

.homeMeasureContents .pefMeasureSection {
	margin-bottom: 35px; 
}

#sleepMeasureContents .homeMeasurementInstructions,
#alcoholMeasureContents .homeMeasurementInstructions {
	margin-bottom: 20px !important; 
}

#bloodSugarDesktopList #listViewTable {
	width: 100%; 
}

#bloodSugarMeasureListView {
	display: contents; 
}

#bloodSugarDesktopList {
	margin: 5px; 
}

#bloodSugarMobileList {
	margin: 16px; 
}

#bloodSugarMobileList tr,
#bloodSugarDesktopList tr {
	border-left: 1px solid #ddd;
}

.modal-backdrop {
	width: 100% !important;
	height: 100% !important;
}

#bloodSugarMobileList {
	font-size: larger; 
}

#bloodSugarMobileList td,
#bloodSugarMobileList th {
	padding: 2px 15px 2px 15px !important;
}

.graphDateSpanInput,
#fetchListViewButton {
	/*font-size: larger !important;*/ 
	width: 135px !important;
}

#timespanInputSection .timeColon {
	margin: 7px;
	font-size: x-large;
}

#timespanInputSection td,
.homeMeasureContents #selectedTime td,
#pefMeasureContents .timeSelectionTable td {
	width: auto !important; 
}

#graphRangeSection .caledarTimeSpanButton {
	max-width: 200px; 
}

#printHomeMeasurementsButton {
	max-width: none; 
}

#portlet-graph\:medicines .portletBody table tr:nth-child(3) td:nth-child(1) {
	display: none;
}

#bloodPressureDesktopInputs tr {
	height: 50px
}

.addBloodSugarValuesHeadersRow td span {
	font-size: medium !important;
	font-weight: bold;
}

#bloodSugarDesktopInputs {
	max-width: 1000px;
}

#bloodSugarDesktopInputs table tbody tr td {
	width: 11% !important;
	padding: 1px;
}

#bloodSugarDesktopInputs table tbody tr td input {
	width: 98% !important;
	height: 52px !important;
}

#bloodSugarDesktopInputs table tbody tr td:nth-child(1) {
	 width: 27% !important; 
}

.bloodSugarChangeDay:hover {
	color: white !important;
	border-style: groove;
	border-width: 2px;
	border-color: white;
}

.bloodSugarChangeDay {
    background-color: #06175e;
	background-color: var(--colors-primary);
    border: 2px solid #06175E;
    border: 2px solid var(--colors-primary);
    color: #fff;
    font-size: 15px;
    border-radius: 0.25rem;  
}

.bloodSugarInputHeader #selectedDate {
	margin-right: 5px; 
}

.bloodSugarInstructionContents {
	margin-top: 10px; 
}

#bloodSugarMeasureContents #bloodSugarMobileInputs1  .mealButtonLabel {
	float: left;
	margin-left: 5px;
}

@media (pointer: coarse) and (max-width: 600px) {
	#portlet-homeMeasurementConfig .followedMeasurements .icon-delete {
    	margin-left: 20px;
  	}
	
	#portlet-homeMeasurementConfig .followedMeasurements table tbody:nth-child(3) tr {
    	display: grid;  
  	}
  
	#portlet-homeMeasurementConfig .followedMeasurements table tbody:nth-child(3) tr td {
    	margin-top: 10px;  
  	}  
  	
	#s7_healthMeasurementConfig_bloodSugarMeterTable tbody tr {
    	display: grid;  
	}
}

#portal-column-center #portlet-omhohmnav {
    padding: 0px;
}

/*if omhohrnav is used*/
#portal-column-center #portlet-omhohmnav{padding:0px;}
ul.tabs {margin:0;}
.telescope #portlet-omhohmnav {margin-top:25px;}

.homeMeasureContents #fetchListViewButton {
    display: block;
    margin-left: 0px !important;
}

.homeMeasureContents #timespanInputSection td:nth-child(3) input {
	margin-right: 10px; 
}

.homeMeasureContents #timespanInputSection table tr td {
	display: inline-flex; 
}

@media screen and (max-width: 350px) {
 	#fetchListViewButton {
    	width: 110px !important;  
  	}
}

@media screen and (max-width: 620px) {
	#bloodPressureMeasureContents .graphAndListViewSection #listViewTable .listViewTableHeader {
    	padding: 0px;
  	}
}

.homeMeasureContents .listViewRemoveImage {
	padding: 8px; 
    display: block;
    width: 16px;
    height: 16px;
    overflow: hidden;
    background-color: #ff0f0f00;
    background-image: url(images/ico_delete.png);
    background-repeat: no-repeat;
    background-position: center top;
    margin: 0 auto;  
}

.homeMeasureContents .listViewRemoveImage:hover {
    background-position: center bottom;
}


.homeMeasurementInstructions button {
	margin-right: 5px; 
}

@media screen and (max-width: 1080px) {
	#graphRangeSection button {
		width: 25%;
		max-width: none !important;
	}
}


@media screen and (max-width: 600px) {
	#graphRangeSection button {
		width: 30%;
	}
}

@media screen and (max-width: 450px) {
	#graphRangeSection button {
		width: 45%;
	}
}

#toggleConfig {
    /*background: url(images/settings.png) no-repeat scroll 3px 10px;*/
    padding-left: 19px;
	background-color: #06175e;
    background-color: var(--colors-primary);
}
#toggleConfig::before {
    font-family: 'Font Awesome 5 Free';
    content: "\f1de";
    /*font-size: 20px;*/
    margin-right: 5px;
    color:#ffffff;
    font-weight:900;
}

#portlet-omho_hmbutton2 {
	display: none; 
}

#portlet-omho_hmbutton2, #configButton2 {
    margin-top: -65px;
    margin-left: 15px;  
}


.DiabetesMeasurements #s7_healthMeasurementConfig_ label {
	margin-left: 8px;
    margin-top: 3px;  
}

#s7_healthMeasurementConfig_bloodSugarMeterTable label,
#s7_healthMeasurementConfig_bloodsugarTable label {
	display: inline-block;
    margin-right: 10px; 
}

@media screen and (max-width: 650px) {
  	#bloodsugar1HelpFS .floatR,
	#bloodsugar2HelpFS .floatR,
    #bloodsugarGestationalHelpFS .floatR {
    	width: auto !important;
    	float: none;
    	margin: 0 0 5px 0;
  	}
}

#bloodsugar1HelpFS .measureHg1HelpTable tbody, 
#bloodsugar2HelpFS .measureHg1HelpTable tbody,
#bloodsugarGestationalHelpFS .measureHg1HelpTable tbody {
	white-space: nowrap; 
}

#bloodsugar1HelpFS .measureHg1HelpTable thead th, 
#bloodsugar2HelpFS .measureHg1HelpTable thead th,
#bloodsugarGestationalHelpFS .measureHg1HelpTable thead th {
	padding-right: 5px;
}

#s7_healthMeasurementConfig_bloodsugarTable input {
	width: 50px; 
	margin-right: 5px;
}

#portlet-bloodsugar #listViewEmptyText {
	margin-left: 20px !important;
}

#bloodSugarMobileInputs1 {
	min-width: 320px; 
}

#bloodSugarMobileInputs1 .homemeasurementSaveSuccessful {
	margin: 0 !important; 
}

.modal-backdrop {
    z-index: 1 !important;
    display: none;
}

#bloodSugarMobileMeasureDetails {
	top: 50px; 
}

#bloodSugarMobileMeasureDetails .modal-content {
	border-width: 10px;
    border-color: #cfd8f7;
}

#backToHomeMeasureSelectionButton {
	display: none; 
}

#weightReference .referenceTableHeader {
	background-color: #2e3192;
}

.homeMeasureContents .flatpickr-mobile {
	background: white !important;
}

.homeMeasureContents .referenceTableColumn {
	width: auto !important; 
}




/* new home measurements end */

/* UserInfoPortlet styles - start - */

#portlet-userInfo .userInfoTable td { border-bottom: 1px solid #ccc; }
#portlet-userInfo .userInfoTable td td { border-bottom: none; }
#portlet-userInfo .formHelp {
	clear: both;
	background: #FFC2C2;
	padding: 3px 4px 3px 4px;
	margin: 2px 0 4px 0;
	line-height: 1.3;
}
#portlet-userInfo .userInfoTable label { padding-right: 5px; }
#portlet-userInfo .userInfoTable input[type=text] { width: 60px; }
#portlet-userInfo .userInfoTable div,
#portlet-userInfo .userInfoTable button {
	float: left;
	position: relative;
}
#portlet-userInfo .userInfoTable { border-collapse: collapse; }
#portlet-userInfo .userInfoTable .col1 { width: 140px; }
#portlet-userInfo .userInfoTable .col2 { width: 200px; }
#portlet-userInfo .userInfoTable .col3 { width: 250px; }
#portlet-userInfo #saveInfo {
    width: 100%;
    line-height: 1.1 !important;
    text-align: center;
    margin: 0;
    position: sticky;
    top: 2px;
    z-index: 1000;
}
#portlet-userInfo .weightRow a { font-size: 90%; }
#portlet-userInfo .multiselectionGrid tr input, 
#portlet-userInfo .multiselectionGrid tr label { cursor: pointer; }
#portlet-userInfo fieldset div.formOpen {
	background-image: url(images/minus_legend.png);
	background-repeat: no-repeat;
	background-position: 7px 50%;
	padding: 3px 10px 3px 25px;
    cursor: pointer;
}
#portlet-userInfo .closeButton { display: none; }
#portlet-userInfo #userInfoPrint { float: right; }


#portlet-userInfo .portletBody {
    padding: 10px;
    /*width: fit-content;*/ /*270421 moved to mobile*/
}

#portlet-userInfo .userInfoTable td {
	padding: 10px;
}

table.titleAndActions div.actions a {
    /*display: inline !important;*/
    margin-left: 10px;
}

table.titleAndActions div.actions {
    display: inline-block;
    text-align: right;
    width: 100%;
}

.medicationApprovalContainer, 
#approveMedButton {
    display: inline;
}

#addApprovalSection {
	/*box-shadow: 0px 6px 13px -7px #000, 5px 5px 10px 5px rgba(0,0,0,0);*/
	padding: 10px 0px;
}

#approvalComment {
	width: 99%;
}

.flexInputRow {
	display:flex;
    padding-bottom: 12px;
}
 
.flexInputRow input[type="text"] {
	margin-top: 0;
	margin-left: 5px;
}

#medicationApprovalContainer {
    order: 2;
    padding: 10px;
    background-color: #FAD683;
    background-color: var(--bg-colors-salmon);
}
/* UserInfoPortlet styles - end - */

/*myFolder start*/
.myFolderFolder {
    background: url(images/ico_folder.gif) no-repeat center 0;
    display: inline-block;
    padding: 1px 0 0 1px;
    text-decoration: none;
    width: 100%;
}

table.fancyListing td[class*="myFolder_select"] {text-align:center;}

#portlet-myFolder td a.downloadDoc {word-break:break-word;} 

/*myFolder end*/

/****Groups start****/

.currentGroup fieldset .legend {
	margin: 0 0 0 1px;
  	padding-left:17px;
  	border:none;
}  

#portlet-groups .currentGroup fieldset .legend.open {
	background: transparent url("images/minus_legend.png") no-repeat scroll 0 50%;
  	cursor: pointer;
}
#portlet-groups .currentGroup fieldset .legend.closed {
	background: transparent url("images/plus_legend.png") no-repeat scroll 0 50%;
  	cursor: pointer;
}

#portlet-groups #postMainContainer .postFS div {
    vertical-align: top;
}
#portlet-groups #postMainContainer .postFS .post div {
    display: inline-block;
}
#portlet-groups #postMainContainer .postFS .postTime {
    font-size: 95%;
}
#portlet-groups #postMainContainer .avatar {
    height: 48px;
    width: 48px;
}
#portlet-groups #postMainContainer .avatar img {
    border-radius: 10px;
    height: 100%;
    width: 100%;
}
#portlet-groups #postMainContainer .commentSpan div {
    display: inline-block;
}
#portlet-groups #postMainContainer .commentSpan {
    background-color: #e2f4c9;
    border-color: #a3da60 #76c529 #76c529 #a3da60;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    font-size: 90%;
    margin: 0.6em 0 0.7em;
    padding: 4px 8px 6px;
    width: 98%;
}
#portlet-groups #postMainContainer .commentText {
    margin-left: 15px;
    width: 65%;
}
#portlet-groups .commentContainer .authorName, #portlet-groups .commentContainer .postTime {
    margin-left: 5px !important;
}
#portlet-groups #postMainContainer .authorName {
    display: block !important;
    font-weight: bold;
    min-width: 90px;
}
#portlet-groups .miniText {
    font-size: 90%;
    white-space: nowrap;
}

#portlet-groups #addPost .sendMsgButton {
    vertical-align: top;
}
#portlet-groups .peerSupport {
    display: inline;
}
#portlet-groups #leftCol {
    float: left;
    width: 80%;
}
#portlet-groups #rightCol {
    float: right;
    width: 20%;
}
#portlet-groups #rightCol h4 {
    padding-left: 5px;
  	margin-top:0;
  	margin-bottom:0.1em;
}
#portlet-groups #rightCol .memberList, #portlet-groups #rightCol .leaderList {
    padding-left: 10px;
}
#portlet-groups #rightCol .online::before {
    content: url("images/status_online.png");
    margin: 0 5px 0 2px;
}
#portlet-groups #rightCol .offline::before {
    content: url("images/status_offline.png");
    margin: 0 5px 0 2px;
}
#portlet-groups .postText {
    white-space: pre-wrap;
}
#portlet-groups .oldComments {
    padding-bottom: 4px;
}
#portlet-groups a {
    text-decoration: none;
}

#portlet-groups .oldComments,
#portlet-groups .addComment,
#portlet-groups .commentContainer {
    margin-left: 25px;
}

#portlet-groups .commentSpan .miniText {
 		margin-top: -10px;
}


/****Groups end****/


/*NetnurseCustomer start*/

/*Hide button when pphva_messagingnavigation is used*/
#portlet-netnurseCustomer .askLink,
#portlet-netnurseCustomer .askLink + br, #portlet-netnurseCustomer a.drafts { display: none; }

#portlet-pphva_messagenavigation ul.tabs a.button.new_message {
    /*background-color: #ffcbbd;
    background-color: var(--colors-primary-salmon-50);*/
    color: #FFFFFF;
    margin: 0;
    margin-left: 30px;
}

ul.tabs a.button.new_message:hover, ul.tabs a.button.new_message.selected {
    /*background-color: #1F2E6E;
    background-color: var(--colors-primary-blue-90);*/
    background-color: #06175E;
    background-color: var(--colors-primary);
      background-color: #feb7a4;
    background-color: var(--colors-secondary-salmon);
}

#portlet-pphva_messagenavigation ul.tabs li.messaging_custom_backlink {
    float: right;
}

#portlet-pphva_messagenavigation ul.tabs li.messaging_custom_backlink a {
	/*border-color: #828BAF;
    border-color: var(--colors-primary-blue-50);
    background-color: #06175E;
    background-color: var(--colors-primary);
    color:#FFFFFF;*/
    background-color: #FFFFFF;
    background-color: var(--colors-white);  
    color:#000000;
    transition: color ease,border ease,background ease;
    transition-duration: .1s;
    padding: 10px 12px 10px 20px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-flow: row nowrap;
    transition: background-color .3s ease;    
}  

#portlet-pphva_messagenavigation ul.tabs li.messaging_custom_backlink a::after {content:"";} 

#portlet-pphva_messagenavigation ul.tabs li.messaging_custom_backlink a::before {
    content:"";
    font-family: 'Font Awesome 5 Free';
    content: "\f060";
    margin-right: 5px;
}

#portlet-pphva_messagenavigation ul.tabs li.messaging_custom_backlink a:hover::before {
    transform: translate3d(-3px, 0, 0);
}

.nnServiceSelection ul li, .nnSpecialQueueSelection ul li, .nnPersonalQueueSelection ul li, .nnServiceCategory ul li {
    padding: 0;
    margin: 0;
    list-style: none!important;
    display:flex;
}
.nnServiceSelection ul li, .nnSpecialQueueSelection ul li, .nnPersonalQueueSelection ul li {
	margin:14px 0px
}

#portlet-netnurseCustomer .nnServiceCategory > ul > li::before,
#portlet-netnurseCustomer .nnPersonalQueueSelection > ul > li::before,
#portlet-netnurseCustomer .nnSpecialQueueSelection > ul > li::before,
#portlet-netnurseCustomer .nnServiceSelection > ul > li::before {
	font-family: 'Font Awesome 5 Free';
    content: "\f015";
    margin-left: 6px;
    font-weight: 900;
	 content: "\f061";
   /* Better Font Rendering =========== */
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

#portlet-netnurseCustomer .nnServiceCategory > ul > li::before,
#portlet-netnurseCustomer .nnPersonalQueueSelection > ul > li::before,
#portlet-netnurseCustomer .nnSpecialQueueSelection > ul > li::before,
#portlet-netnurseCustomer .nnServiceSelection > ul > li::before {
	color: #FEB7A4;
	color: var(--colors-secondary-salmon);
	display: flex;
	align-self: center;
	margin-right: 20px;
	transition: all .3s ease;
}

#portlet-netnurseCustomer .nnServiceCategory > ul > li:hover::before,
#portlet-netnurseCustomer .nnPersonalQueueSelection > ul > li:hover::before,
#portlet-netnurseCustomer .nnSpecialQueueSelection > ul > li:hover::before,
#portlet-netnurseCustomer .nnServiceSelection > ul > li:hover::before {
  	transform: translate3d(3px, 0, 0);
}

/*#portlet-netnurseCustomer .fancyListing tr:last-child > td:last-child, #portlet-netnurseCustomer .fancyListing tr:last-child > td:first-child {border-radius: 4px 4px 4px 4px;}*/

 /*#portlet-netnurseCustomer li::before {
      color: #9DA9DE;
      color: var(--colors-secondary-blue-50);
    }*/

/*Hide unnecessary back button from forms*/
div.attached_form #ask a.back {display:none;}

form#s7_form_askform input[name="openMyFolderFileDialog"] {width:auto !important;}

#portlet-netnurseCustomer .button {
    width: max-content;
    float: right;
}

#portlet-netnurseCustomer #buttonsection {
    margin-bottom: 30px;
    display: inline-block;
    width:100%;
}

#portlet-netnurseCustomer #buttonsection a.button {
    margin-right: 15px;

}
.printThread {
    margin: 0 0 4px 0;
    padding-bottom: 25px;
}

/*NetnurseCustomer end*/

/*VERSIO 10.4*/
/* Styles for my folder file attachment dialog start */

.ui-dialog .ui-widget-overlay {
    background-color: #000000;
    opacity: 0.5;
    -moz-opacity:0.50;
    filter: alpha(opacity=50);
    width:100%;
    height:100%;
    z-index:1001;
    position:absolute;
}

.ui-dialog .ui-widget-header {
    border:1px solid #000000;
    border-bottom: 1px solid #00000052;
    background-color: #FFFFFF;
    color:#000000;
    font-size: larger;
    border-collapse:collapse;
    padding: 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;  
}

.ui-dialog {
    clear: both;
    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
    box-shadow: 0 5px 15px rgba(0,0,0,.5);  
    border-radius: 5px;
}

.ui-dialog-buttonset {
	 background-color: #FFFFFF;
	 border:1px solid #000000;
     border-top: 1px solid #00000052;
     border-bottom-left-radius: 5px;
     border-bottom-right-radius: 5px;
     padding: 3px;
}

.ui-dialog-content {
    border-left: 1px solid #000;
    border-right: 1px solid #000;
    background-color:#fff;
    overflow: auto;
    padding: 10px 5px 5px 5px;
    height: 400px !important;
}

.ui-dialog-titlebar.ui-corner-all {
	border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

/* Styles for my folder file attachment dialog end */


/* Message thread start*/

/* Message thread */

.feedback { margin-top: 20px; }
.msgFiles { padding-left: 10px; }
.messageThread .msgHeader { 
	font-weight: bold;
	padding: 3px 6px 4px 6px;
}
.messageThread .msgHeader .author {
	font-size: 90%;
	font-weight: normal;
	float: right;
}
.messageQuestion .msgHeader {
	/*background-color: #ebeef8;
	background-color: var(--colors-secondary-blue-10);*/
	background-color: #CED4EE;
	background-color: var(--colors-secondary-blue-25);	
	border: 1px solid #CED4EE;
	border: 1px solid var(--colors-secondary-blue-25);
	/*border: 1px solid #9DA9DE;
	border: 1px solid var(--colors-secondary-blue-50);*/	
	border-radius: 4px 4px 0px 0px;	
}
.messageQuestion .msgContent {
	background-color: #fff;
	border: 1px solid #CED4EE;
	border: 1px solid var(--colors-secondary-blue-25);
	/*border: 1px solid #9DA9DE;
	border: 1px solid var(--colors-secondary-blue-50);*/	
    border-radius: 0px 0px 4px 4px;
	border-top: none;
}
.messageAnswer .msgHeader {
	background-color: #f0f0f0;
	border: 1px solid #dbdbdb;
	background-color: #FFDBD1;
	background-color: var(--colors-secondary-salmon-3);
	border: 1px solid #FFDBD1;
	border: 1px solid var(--colors-secondary-salmon-3);
	border-radius: 4px 4px 0px 0px;
    border-bottom:none;
}
.messageAnswer .msgContent {
	background-color: #fff;
	border: 1px solid #dbdbdb;
	border-top: none;
	background-color: #FFFFFF;
	border: 1px solid #FFDBD1;
	border: 1px solid var(--colors-secondary-salmon-2);
	border-radius: 0 0 4px 4px;
    border-top:none;
}
.messageThread .messageQuestion pre { border: 1px solid #000; }
.messageThread .msgContent {
	padding: 4px 10px 6px 10px;
	white-space: pre-wrap; /* css-3 */
	white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
	white-space: -pre-wrap; /* Opera 4-6 */
	white-space: -o-pre-wrap; /* Opera 7 */
	word-wrap: break-word; /* Internet Explorer 5.5+ */
}
.messageThread .attachmentPreview {
	background-color: #f5f5f5;
	border: 1px solid #9DA9DE;
	border: 1px solid var(--colors-secondary-blue-50);
	padding:20px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing;
}

/*.printThread { margin: 0 0 12px 2px; }*/

.floaterFix { clear: both; }
.hidden { display: none !important; }
.clickable { cursor: pointer; }

option { background-color: #fff; color: #000; }
option.disabled { background-color: #fff; color: #888; }

tr.unread { font-weight: bold; }


/* Message thread end*/


/*lang-switcher start*/

/*DEFAULT NOT USED
#lang-switcher {
    height: 24px;
    right: 220px;
    top: 100px;
  	position:absolute;
  	float:right;
    z-index: 1000;
  	display:block !important;
}
#lang-switcher ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#lang-switcher ul li {
    display: inline;
    float: left;
    margin: 0 1px 0 7px;
    padding: 0;
}
#lang-switcher ul li a {
    border: 1px solid #0E54B1;
    display: block;
    height: 0 !important;
    overflow: hidden;
    padding-top: 16px;
    text-decoration: none;
    width: 20px !important;
}
#lang-switcher ul li a:hover {
    border-color: #B6E4FF;
    box-shadow: 0 0 10px #FFFFFF;
}
#lang-switcher ul li a:active {
    border-color: #FFFFFF;
}

#lang-switcher ul li#lang-fi a {
    background: url("images/flag-fi.gif") no-repeat scroll;
}
#lang-switcher ul li#lang-sv a, #lang-switcher ul li#lang-no a  {
    background: url("images/flag-sv.gif") no-repeat scroll;
  	display:none;
}
#lang-switcher ul li#lang-en a {
    background: url("images/flag-gb.gif") no-repeat scroll;
}*/

/*lang-switcher-cust start*/

#lang-switcher-cust {
    height: 24px;
    right: 12px;
  	position:relative;
  	float:right;
    z-index: 1000;
  	display:block;
}
#lang-switcher-cust ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#lang-switcher-cust ul li {
    display: inline;
    float: left;
    margin: 0 1px 0 7px;
    padding: 0;
}
#lang-switcher-cust ul li a {
    border: 1px solid #0E54B1;
    display: block;
    height: 0 !important;
    overflow: hidden;
    padding-top: 15px;
    text-decoration: none;
    width: 20px !important;
}
#lang-switcher-cust ul li a:hover {
    border-color: #B6E4FF;
    box-shadow: 0 0 10px #FFFFFF;
}
#lang-switcher-cust ul li a:active {
    border-color: #FFFFFF;
}

#lang-switcher-cust ul li#lang-fi a {
    background: url("images/flag-fi.gif") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
#lang-switcher-cust ul li#lang-sv a {
    background: url("images/flag-sv.gif") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
#lang-switcher-cust ul li#lang-en a {
    background: url("images/flag-gb.gif") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}

/*for registration page*/
.lang-switcher-cust-title {
    display: inline-block !important;
    float: left !important;
    margin-top: 25px;
    position: absolute !important;
    right: auto !important;
}
.h3pink_cust {
   /*border-radius: 3px 3px 0 0;
    box-sizing: border-box;
    color: #2d414b;
    font-size: 135%;*/
    margin: 16px 0 12px;
    /*font-weight: 600;*/
    padding: 0;
	display:inline-block !important;
  	width:auto !important;
}

/*lang-switcher-cust end*/

/*lang-switcher end*/

  
#kanta_container, #kela_container, #omaolo_container {
	background:#f5f5f5;
	font-weight:normal;
	padding:10px;
	text-align:left;
}

#kanta_img {margin-bottom:10px;}

/*Settings page start*/

.introLabel {font-weight:normal;}

.h3pink {
  	border-bottom: 3px solid #d3cfcf;
    padding-bottom: 5px;
}

#portlet-intro .portletHead, #portlet-omhointro .portletHead {display:none;} 

#portlet-intro fieldset, #portlet-omhointro fieldset {background:none;} 

/*Settings page end*/


/****PPHVA END****/

/* --------------------------
   *
   * Front page (logged in) start
   *
  ** ----------------------- 

  #portlet-frontpage .some-page-wrapper {
	  padding: 0 20px !important;
  }

  #portlet-frontpage .row {
	  padding: 0 !important;
  }

  #portlet-frontpage #myservices .linkDiv.msg {
	  min-width: 100% !important;
  }

  #portlet-frontpage #myservices .linkDiv.msg a {
	  width: 100%;
	  height: unset;
	  align-items: unset;
	  justify-content: unset;
	  background-origin: unset;
	  display: flex;
  }

  #portlet-frontpage #myservices .linkDiv.msg a span {
	  flex-direction: column;
	  align-items: unset;
  }

  #allservices .linkDiv {
	  margin-bottom: 20px;
  }

  #otherservices-list {
	  justify-content: space-around;
  }

  #otherservices-list a img {
	  width: 90px;
  }
  /* --------------------------
   *
   * Front page (logged in) end
   *
  ** ----------------------- */
  
/* --------------------------
 *
 * Front page
 *
** ----------------------- */

	#portlet-frontpage .portletHead {
		display: none;
	}
	#portlet-frontpage .linkDiv p {
	    margin: 0 !important;
	    text-align: center;
	    display: block;
	    width: 100%;
	}
	#portlet-frontpage .linkDiv p a {
		display: block;
	}
	#portlet-frontpage .linkDiv.msg a {
	    color: #ffffff !important; 
	}
	#portlet-frontpage .linkDiv.msg.service a { 
		color: #28367f !important;
		font-weight: bold;
		text-align: left;
	}

	#portlet-frontpage .row .column {
		position: relative;
	    width: 100%;
	    display: block;
	    flex: auto;
	}

	/* @media (min-width: 768px){
		#portlet-frontpage .row .column {
		    -ms-flex: 0 0 50%;
		    flex: 0 0 50%;
		    max-width: 50%;
		    padding-right: 15px;
		    padding-left: 15px;
		}
	} */

	/* #portlet-frontpage .linkDiv {
	    background-color: lightgray !important;
	    width: 100% !important;
	    margin: 0 auto 25px auto !important;
	    display: flex;
	    border-radius: 0 !important;
	} */
	/* #portlet-frontpage .linkDiv a {
		padding: 20px 25px !important;
	} */
	#portlet-frontpage .linkDiv.msg {
	    background-color: #28367f;
	    color: #ffffff;
	}
	#portlet-frontpage .linkDiv.msg a {
	    color: #ffffff; 
	    text-decoration: none;
	    /* padding: 18px 25px 14px 25px !important; */
		text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;      
         /*IE 11 won't wrap span without flex-basis or flex:1 and margin:0 auto in child span. flexbox-not-centering-vertically-in-ie*/
        flex-basis:100%;
	}

	#portlet-frontpage .linkDiv.msg.service { 
		background-color: #d6ecf2;
		color: #28367f;
	    border-radius: 0;
	    text-align: left;
	}
	#portlet-frontpage .linkDiv.msg.service p { 
		margin: 0;
	}
	#portlet-frontpage .linkDiv.msg.service a { 
		color: #28367f
	}
	#portlet-frontpage .linkDiv.msg.service strong { 
		color: #28367f; 
	}
	#portlet-frontpage .row {
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		/* margin-right: -15px;
		margin-left: -15px; */
		padding: 10px;
	}
	
span.INRLink.linkDivImg {
	background-image: url(/resource/skin/images/pphva/kotiseurannat@3x.png);
}
span.Kotimittaukset.linkDivImg {
	background-image: url(/resource/skin/images/pphva/kotiseurannat@3x.png);
}
span.labLink.linkDivImg, span.labs.linkDivImg {
	background-image: url(/resource/skin/images/pphva/laboratoriotulokset@3x.png);
}
span.groupsLink.linkDivImg {
	background-image: url(/resource/skin/images/pphva/ryhmat@3x.png);
}
span.messages.linkDivImg, span.messageServiceLink.linkDivImg {
	background-image: url(/resource/skin/images/pphva/viestit@3x.png);
}
span.occupational.linkDivImg {
	background-image: url(/resource/skin/images/new_icons/kainuunmeren_tt_logo.png);
}
span.prescription.linkDivImg {
	background-image: url(/resource/skin/images/pphva/reseptien_uusinta@3x.png);
}
span.myfolder.linkDivImg {
	background-image: url(/resource/skin/images/pphva/omat_dokumentit@3x.png);
}
span.maternity_clinic.linkDivImg {
	background-image: url(/resource/skin/images/pphva/neuvolapalvelut@3x.png);
}
span.omavointi.linkDivImg {
	background-image: url(/resource/skin/images/pphva/omavointi.png);
}
span.nutritionDiaryLink.linkDivImg, span.Päiväkirja.linkDivImg {
    background-image: url(/resource/skin/images/pphva/paivakirja@3x.png);
}

span.hetaLink.linkDivImg{
	background-image: url(/resource/skin/images/pphva/heta@3x.png);
}	
span.dailytaskLink.linkDivImg {
	background-image: url(/resource/skin/images/pphva/arjenhallinta@3x.png);
}

span.forms_and_questionnaires.linkDivImg,
span.gtiLink.linkDivImg {
	background-image: url(/resource/skin/images/pphva/lomakkeet2@3x.png);
}	

span.timebooking.linkDivImg {
	background-image: url(/resource/skin/images/pphva/ajanvaraus_yleinen2@3x.png);
}	

span.Koronakysely.linkDivImg, span.Tartunnanjaljityskysely.linkDivImg{
	background-image: url(/resource/skin/images/pphva/viestit@3x.png);
}

/*TEMP ICONS FOR FRONTPAGE START*/
#portlet-frontpage .linkDiv.msg a span.linkDivImg::after {
	font-family: 'Font Awesome 5 Free';
	margin-left: 6px;
	font-weight: 900;
	font-size: 2em;
    color:#FFB19C;
    color: var(--colors-primary-salmon-75);
}

span.INRLink.linkDivImg::after {
	content:"\f478";
}
span.Kotimittaukset.linkDivImg::after,span.homeMeasureLink.linkDivImg::after {
	content:"\f201";
}
span.labLink.linkDivImg::after, span.labs.linkDivImg::after {
	content: "\f492";
}
span.groupsLink.linkDivImg::after {
	content:"\f500";
}
span.messages.linkDivImg::after, span.messageServiceLink.linkDivImg::after {
	content:"\f0e0";
}
span.prescription.linkDivImg::after {
	content:"\f486";
}
span.myfolder.linkDivImg::after {
	content:"\f07c";
}
span.maternity_clinic.linkDivImg {
	background-image: url(/resource/skin/images/pphva/neuvolapalvelut@3x.png);
}
span.omavointi.linkDivImg {
	background-image: url(/resource/skin/images/pphva/omavointi.png);
}
span.nutritionDiaryLink.linkDivImg::after, span.Päiväkirja.linkDivImg::after {
    content:"\f02d";
}

span.hetaLink.linkDivImg{
	background-image: url(/resource/skin/images/pphva/heta@3x.png);
}	
span.dailytaskLink.linkDivImg {
	background-image: url(/resource/skin/images/pphva/arjenhallinta@3x.png);
}

span.forms_and_questionnaires.linkDivImg::after,
span.gtiLink.linkDivImg::after {
	content:"\f0ea";
}	

span.timebooking.linkDivImg::after {
	content:"\f073";
}

span.chat.linkDivImg::after {
	content:"\f086";
}	

span.Koronakysely.linkDivImg, span.Tartunnanjaljityskysely.linkDivImg{
	background-image: url(/resource/skin/images/pphva/viestit@3x.png);
}

/*TEMP ICONS FOR FRONTPAGE END*/


/*#myservices > div.box > div {
	display: flex;
	flex-wrap: wrap;
    align-items: center;
    justify-content: center;  
}
#portlet-frontpage .box {
	/*background-color: #fbe9e3;
	background-color: var(--bg-colors-salmon);*
	color: #06175e;
	color: var(--colors-primary);
}
	
#portlet-frontpage .linkDiv.msg {
	background-color: white;
	width: 200px !important;
	margin: 0 10px !important;
    /*background-color: #fbe9e3;
    background-color: var(--bg-colors-salmon);
}*/

#myservices > div.box > div {
	display: flex;
	flex-wrap: wrap;
	row-gap: 30px;
	column-gap: 30px;
    align-items: center;
    justify-content: center;
}
#portlet-frontpage .box {
	/*background-color: #fbe9e3;
	background-color: var(--bg-colors-salmon);*/
	color: #06175e;
	color: var(--colors-primary);
}
	
#portlet-frontpage .linkDiv.msg {
	text-decoration: none;
	color: #06175e;
	color: var(--colors-primary);
	padding: 20px 7px 17px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background-color: #fdf4f1;
	background-color: var(--bg-colors-salmon-50);
	border: 1px solid #FFDBD1;
	border: 1px solid var(--colors-secondary-salmon-3);
	border-radius: 4px;
	width: 180px;
	height: 180px;
    box-shadow:0 30px 30px -30px #00000059;
    /*justify-content: center;*/
}

#portlet-frontpage .linkDiv.msg:hover{
    border: 1px solid #FEB7A4;
    border: 1px solid var(--colors-secondary-salmon);
}

#portlet-frontpage .linkDiv p {
    margin: 0 !important;
    text-align: center;
    display: flex;
	justify-content: center;
    width: 100%;
}

#portlet-frontpage .linkDiv.msg a span:nth-child(1) {
	font-size: calc(16 / var(--rembase) * 1rem);
	/*width: 70px;
	height: 70px;*/
	display: flex !important;
	align-items: flex-end;
	justify-content: center;
	color: #000000 !important;
	font-weight: bold;
	overflow: visible;

	background-repeat: no-repeat;
	background-size: contain;
	background-origin: content-box;

	padding: 18px 25px 14px 25px !important;
    /*Don't shrink image*/
    flex-shrink: 0;
}

/*portlet-frontpage .linkDiv.msg a span:nth-child(1) {
	font-size: calc(16 / var(--rembase) * 1rem);
    width: auto;
    height: 50px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: #000000 !important;
    font-weight: bold;
    overflow: visible;
    background-repeat: no-repeat;
    background-size: contain;
    background-origin: content-box;
    padding: 18px 25px 13px 25px !important;
    /*don't shrink image
    flex-shrink: 0;
}*/


#portlet-frontpage .linkDiv.msg a span {
	/*font-size: calc(16 / var(--rembase) * 1rem);*/
    font-size: calc(14 / var(--rembase) * 1rem);
	display: flex !important;
	align-items: flex-end;
	justify-content: center;
	color: var(--colors-primary);
	overflow: visible;
	word-break: break-word;
	hyphens: auto;
}

#portlet-frontpage .some-page-wrapper {
	/*padding: 20px 70px;*/
    padding:20px 0px;
}

@media screen and (max-width: 375px) {
  #portlet-frontpage .some-page-wrapper {
      padding: 0px 0px !important;
  }
}

#allservices {
	margin-top: 50px;
}

.allserv > p > a {
	color: #000 !important;
	border-width: 2px;
	border-style: solid;
	border-color: #2B456C;
	font-family: Arial, sans-serif;
	font-size: calc(16 / var(--rembase) * 1rem);
	font-weight: bold;
	text-align: center;
	text-decoration: none !important;
	margin: 2px 4px 3px 2px;
	cursor: pointer;
	outline: none;
	border-radius: 30px;
	-moz-border-radius: 30px;  
	-webkit-border-radius: 30px;  
	border: none;
	background-color: #FFB27D;
	/* Compensate the lack of border by adding 2px to the padding */
	padding: 8px 32px !important;
	box-shadow: 0px 4px 10px #00000029;
	-moz-transition: .2s;
	-webkit-transition:.2s;
	-o-transition: .2s;
  	transition: .2s;
}

.allserv > p > a:hover {
	text-decoration: none !important;
	background-color: #FFF;
	color: #000 !important;
}

#portlet-pphva_frontpage_otherservices .portletBody {
	background-color: #f3f3f7;
	background-color: var(--colors-primary-blue-5);
	border: 1px solid #E6E8EF;
	border: 1px solid var(--colors-primary-blue-10);
}

#portlet-pphva_frontpage_otherservices .portletBody #otherservices {
	margin-top: 0;
	padding: 20px;
}

#otherservices > h2 {
	margin: 0 !important;
}

#otherservices-list {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
    justify-content: center;
}

#otherservices-list li {
	/*background-color: #FFF;*/
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	/* margin-right: 30px; */
	margin: 10px 40px;
}

#otherservices a img {
	width: 120px;
}

/*For not logged in frontpage*/

div.other-services-wrapper.not-logged-in {margin-top:80px;}

#otherservices-list.not-logged-in {
	display: flex;
	flex-wrap: wrap;
	padding: 0;
    justify-content: space-evenly;
}

#otherservices-list.not-logged-in  li {
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	margin: 10px 10px 10px 0px;
  	width: auto;
    height: 60px;
}

/*#otherservices.not-logged-in  a img {
	width: 160px;
}*/

#otherservices-list a img#kela_img {margin-top:-37px;}

#otherservices-list.not-logged-in a img#terveyskirjasto_img {width: 200px; margin:8px;}

#otherservices-list.not-logged-in a img#mentalLink_img {margin-top:-40px;width: auto;height: inherit;}

/*For not logged in frontpage end*/

#otherservices-list li a {
	display: flex;
	height:100%;
	align-items:center
}


#otherservices-list a img#kela_img {margin-top:-37px;}

#otherservices-list a img#terveyskirjasto_img {width:130px;}

#otherservices-list a img#mentalLink_img {margin-top:-13px;width:130px;}


/*TEMP SOLUTION TO CUSTOM HEADER START. REMOVE THESE STYLES WHEN IMPLEMENTED IN VERSION*/

#portlet-frontpage .linkDiv.msg.container.dummy_header{
	flex-basis:100%;
	background: none;
	border: none;
	box-shadow: none;
	height: 0;
}

#portlet-frontpage .linkDiv.msg.container.dummy_header .dummy_header.linkDivImg {display:none !important;}

#portlet-frontpage .linkDiv.msg.container.dummy_header a#dummy_header {pointer-events:none;}

#portlet-frontpage .linkDiv.msg.container.dummy_header a#dummy_header span.dummy_header.linkDivTitle {justify-content: flex-start;}

#portlet-frontpage .linkDiv.msg.container.dummy_header a#dummy_header span.dummy_header.linkDivTitle {display:none !important;}

#portlet-frontpage .linkDiv.msg.container.dummy_header::after {
	content:"Viimeksi käyttämäsi palvelut";
	color: #06175E;
    color: var(--colors-primary);
    font-weight: 500;
    letter-spacing: -0.01em;
    font-size: calc(34 / 16 * 1rem);
    font-size: calc(34 / var(--rembase) * 1rem);
    line-height: 42px;	
}

#portlet-frontpage .linkDiv.msg.container.dummy_header{
	flex-basis:100%;
	background: none;
	border: none;
	box-shadow: none;
	height: 0;
	margin-bottom: 24px;
}

#portlet-frontpage .linkDiv.msg.container.dummy_header .dummy_header.linkDivImg {display:none !important;}

#portlet-frontpage .linkDiv.msg.container.dummy_header a#dummy_header {pointer-events:none;}

#portlet-frontpage .linkDiv.msg.container.dummy_header a#dummy_header span.dummy_header.linkDivTitle {justify-content: flex-start;}

#portlet-frontpage .linkDiv.msg.container.dummy_header a#dummy_header span.dummy_header.linkDivTitle {display:none !important;}

#portlet-frontpage .linkDiv.msg.container.dummy_header p {display:none}

#portlet-frontpage .linkDiv.msg.container.dummy_header::after {
	content:"Suosituimmat palvelut";
	color: #06175E;
    color: var(--colors-primary);
    font-weight: 500;
    letter-spacing: -0.01em;
    font-size: calc(34 / 16 * 1rem);
    font-size: calc(34 / var(--rembase) * 1rem);
    line-height: 42px;	
}

/*#portlet-frontpage a i.info {
    color: #000;
    background-color: #fabb00;
    font-size: 90%;
    float: right;
    margin-right: 9px;
    margin-left: 6px;
    display: block;
    min-width: 10px;
    text-align: center;
    letter-spacing: -1px;
    padding: 1px 4px 2px 4px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%; 
}*/

#portlet-frontpage a i.info {
    color: #000;
    background-color: #fabb00;
    font-size: 90%;
    float: left;
    margin-right: 9px;
    margin-left: 6px;
    display: block;
    text-align: center;
    letter-spacing: -1px;
    padding: 1px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    width:auto;
    min-width:20px;
    font-style: normal;
}  

/*Making order high enough, so that static services will always stay under dummy header*/
#portlet-frontpage .linkDiv.msg.container.dummy_header.static {order:25;}
#portlet-frontpage .linkDiv.msg.container.chat.static {order:26;}
#portlet-frontpage .linkDiv.msg.container.messages.static {order:27;}
#portlet-frontpage .linkDiv.msg.container.timebooking.static {order:28;}
#portlet-frontpage .linkDiv.msg.container.labLink.static {order:29;}
#portlet-frontpage .linkDiv.msg.container.Kotimittaukset.static {order:30;}
#portlet-frontpage .linkDiv.msg.container.static {order:31;}

/*TEMP SOLUTION TO CUSTOM HEADER END*/


/* --------------------------
 *
 * Front page end
 *
** ----------------------- */



#mobile-menu,#mobileBack {display:none;}

/*if narrow center layout move border to left column*/

#wrapper {
    /*gray background*/
    /*background: #f4f6f8;*/
}

#wrapper > #portal-content {
    margin-left: 0;
    background:#fff;
  	/*if white wrapper background*/
    background:#fff;
	box-shadow: 5px 0px 9px rgb(0 0 0 / 10%);
}

#portal-column-left {
    margin-top: 0;
    margin-left: auto;
    background:#fff;
    --subpage-menu-border-color:
    hsla(0, 0%, 31%, .4);
    border-right: 1px solid var(--subpage-menu-border-color);
    box-shadow: -5px 0px 9px rgb(0 0 0 / 10%);
    max-width: calc(var(--left-column-width) + var(--container-x-padding) * 2);
    min-width: calc(var(--left-column-width) + var(--container-x-padding));
}

#portal-column-center {
    margin-left: 10px;
}
#portal-column-left ul.menu {border-right:none;}
ul.menu li a.active::after {
    right: -18px;
}  

#portal-column-left.not-logged-in #anon_fi_password {
    margin: 20px 0;
}

/***Other desktop screen resolution rules end***/

@media (pointer: fine),@media (hover: hover), screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /*IE11 fix*/

    @media screen and (max-width: 1060px) {
          #portal-column-left {flex-basis:auto;}
          #wrapper > #portal-content {flex-basis:60%;}
          #toolBar ul {column-gap:normal;}
    }  

    @media screen and (max-width: 940px) {
          #logged-user, #userBar ul {display:none;}
          #userBar {/* flex-grow: 0; */}
          #toolBar ul {flex-direction:column;align-items: flex-end;justify-content: flex-end;row-gap: 6px;}
          #toolBar {flex-direction:column;}
    }  

    @media screen and (max-width: 720px) {
          /*#toolBar ul li a#tool-logout, #toolBar ul li a#tool-exit {font-size: calc(15px);}*/
          #toolBar {flex-direction:column;align-items: flex-start;}
          #portal-top {flex-wrap: nowrap;height: 120px;}
          /*h2#portal-title {padding-right:10px;}*/
    }  

    @media screen and (max-width: 590px) {
          #portal-column-left {flex-basis: 100%;max-width:100%;}
          #wrapper > #portal-content {flex-basis: 100%;max-width:100%;}
    }  
}  
/***Other desktop screen resolution rules end***/

/****Mobile rules start****/

@media (pointer: coarse) {
	#portlet-pphva_custom_footer .row1, #portlet-pphva_custom_footer .row1 ul {
	    flex-direction: column;
	}
  
    /*@media screen and (max-width: 768px) {*/
      	h1#portal-logo {
          width: auto;
          margin: 0;
          /*display: none;*/
          float: left;
          background-image: url(images/PPHVA/logo_mobile_white.png);
		  background-color: transparent;
          background-position:7px 10px;
          background-size:initial;
          min-width:150px;
      	} 
      
      h2#portal-title {
        padding:0;
        font-size: calc(16 / 16 * 1rem);
        padding-left: 23px;
      }
      h1#portal-logo a {height:60px;}
    /*}  */ 

	/*Styles for custom background-image watermark. Added in site.js*/
	#watermark {
		  display:none;
	}    

	ul.tabs {
		flex-wrap: wrap;
	}

	ul.tabs li {
		width: 100%;
	}

	ul.tabs li a {
		width: 100%;
		box-sizing: border-box;
	}
  
    #portlet-pphva_messagenavigation ul.tabs a.button.new_message {margin-left:auto;margin-top:10px;}
  
    #portlet-pphva_messagenavigation ul.tabs li.messaging_custom_asklink {margin-top:20px;}

	#wrapper > #portal-content {
		margin: 0;
		min-height:unset;
		max-width: calc(var(--container-default-width) + var(--container-x-padding) * 2);
		max-width: 100%;
		flex: 0 0 auto;
		width: 100%;
		padding: 0;
		margin: 0;
        	margin-top: 10px;
      		padding: 0px 15px 0px 15px;
	}
	#wrapper #portal-column-center {
		width: 100%;
		margin:0;
	}	
  
    .no-left-content {
      margin-left: auto;
      width: auto;
    }

    /*settings terms*/
    #termsForm {padding-bottom:15px;}
  
    /*#portal-content .portlet .portletBody {padding: 0 10px 5px 10px;}*/
  
  .searchInput {width:170px;}
  
	/*h3 {
	font-size: 25px !important;
	}

	h4 {
	font-size: 22px !important;
	}*/


	/* Groups */

	/*#portlet-groups {
		padding: 0 10px;
	}*/
	/* Groups end */


	/* --------------------------
	*
	* Front page (logged in) start
	*
	** ----------------------- */

	#portlet-frontpage .some-page-wrapper {
		padding: 0 20px;
	}

	#portlet-frontpage .row {
		padding: 0;
	}

	#portlet-frontpage #myservices .linkDiv.msg {
		min-width: 100%;
		height: auto;
		padding: 0;
	}

	#portlet-frontpage #myservices .linkDiv.msg a {
		width: 100%;
		height: unset;
		align-items: unset;
		justify-content: unset;
		background-origin: unset;
		display: flex;
	}

	#portlet-frontpage #myservices .linkDiv.msg a span {
		flex-direction: column;
		align-items: unset;
        text-align: left;
	}
    /*To align info-spans*/
    #portlet-frontpage #myservices .linkDiv.msg a span.Laboratoriotulokset, #portlet-frontpage #myservices .linkDiv.msg a span.messages {
        flex-direction: row;
        align-items: center;
    }
  
	#allservices .linkDiv {
		margin-bottom: 20px;
	}

	#otherservices-list {
		justify-content: space-around;
        row-gap: 12px;
	}

	#otherservices-list a img {
		width: 90px;
        margin:0 !important;
	}
  
  #otherservices-list.not-logged-in {justify-content: center;}
  
  #otherservices-list.not-logged-in li {align-items:center;width:100%;}
      
    #portlet-frontpage a i.info {
        position: unset;
        margin-bottom: 0;
        margin-left: 3px;
    }  
	/* --------------------------
	*
	* Front page (logged in) end
	*
	** ----------------------- */

	.attached_form {
		display: flex;
		justify-content: center;
	}

	/* --------------------------
	*
	* Footer start
	*
	** ----------------------- */

	#footerLogo {
		padding-bottom: 0;
		padding-top:30px; /*021121*/
	}

	#footer-menu ul li {
		margin: 5px 0;
	}

	#copyright {
	    position: relative;
	    bottom: 20px;
	    padding: 0;
	    order: 6 !important;
	}
	
	/* --------------------------
	*
	* Footer end
	*
	** ----------------------- */



	/* --------------------------
	*
	* Header start
	*
	** ----------------------- */  

	#portlet-omhomenu {
	  background-color: #FFF !important;
	}
  
    #main-menu-wrapper {display:none;}    
                                                                        
    #main-menu-wrapper.mobilenav-open {
		display: block;
	} 

	/*#portlet-omhomenu #main-menu-wrapper {
		border: 1px #707070 solid;
		border-bottom: 0;
	}*/

	#portlet-omhomenu .row {
		height: unset !important;
	}

	.open-menu-icon {
		margin: 4px 0 0 10px;
	}

	#textSizeLink {
		display: none !important;
	}

	#contentHeader .menu_quick_links .wrapper > .row {
		display: flex;
		justify-content: space-between;
		margin: 0;
	}

	#headerLogo {
		display: inline-block;
		/*padding: 10px !important;*/
		padding: 0 0 0 10px;
	}

	#headerLogo span {
		font-size: 18px;
	}

	.home-button {
		margin: 10px;
	}

	.home-button span {
		color: #000;
	}

	#mobile-menu-toolbar {
		flex-direction: row;
	}

	#mobile-menu-toolbar .open-menu-icon {
		display: none;
	}

	#mobile-menu-toolbar .open-menu-button {
		font-weight: normal;
		margin: 15px 10px;
		padding: 8px 14px;
	border-radius: 25px;
	}

	/* Menu closed */
	#mobile-menu-toolbar .toggle-mobilenav {
		background-color: #17355D;
		color: #FFF;
	}

	/* Menu open */
	#mobile-menu-toolbar .toggle-mobilenav.open {
		background-color: #FFF;
		color: #17355D;
	}

	#main-menu-wrapper ul.menu li {
		margin: 5px;
	}

	nav#main-menu ul.menu li a {
		color: #0F2622;
		font-size: 18px;
	}

	/*#usermenu-menu {
	width: 100% !important;
	display: flex;
	padding: 20px 10px 20px 0 !important;
	justify-content: center !important;
	font-size: 25px;
	background-color: #17355D !important;
	flex-grow: 0 !important;
	}

	#usermenu-menu .dropdownmenu > .menu-link {
	display: flex;
	flex-direction: row-reverse;
	font-size: 18px;
	height: 38px;
	color: #FFF !important;
	}

	#usermenu-menu .dropdownmenu > a.menu-link:focus {
	font-size: 800px;
	}

	#usermenu-menu .userprofile.menu {
	  margin: 0;
	}*/

	#mobile-menu-toolbar {
		display: inline-block;
	}

	#main-menu-wrapper {
		width: 100%;
	}

	#main-menu-wrapper ul.menu {
		flex-direction: column;
		text-align: left;
		/*margin-left: 50px;*/
		line-height: 30px;
	}

	#main-menu-wrapper ul.menu li {
		width: fit-content;
	}

	#main-menu-wrapper ul.menu li a .info {
		line-height: normal;
		/*margin-top: 5px;*/
        margin-top: 0px;
	}

	/*#usermenu-menu .user_submenu {
		top: 392px !important;
	}*/
  
  

	/* --------------------------
	*
	* Header end
	*
	** ----------------------- */

	.attached_form td {
		padding-right: 10px;
	}
	#questionnaire_ask_form {
		width: 93%;
		display: flex;
		flex-direction: column;
	}

	#portlet-pphva_custom_footer  .row1, #portlet-pphva_custom_footer .row1 ul {
		flex-direction: column;
	}

	#portlet-pphva_custom_footer #textSizeLink {
		padding: 0 !important;
	}

	#portlet-pphva_custom_footer #tool-textsize-footer {
		display: flex !important;
		width: 100%;
		flex-direction: row-reverse;
		justify-content: center;
	}

	#portlet-pphva_custom_footer #tool-textsize-footer {
		display: inline-block;
		width: 200px;
	}

	#submitQuestionnaireButton {
		margin-bottom: 15px;
	}

	.qTextInput tbody tr td input {
		width: 80%;
		min-width: 50px;
	}
	.qNumber tbody tr td input {
		width: 80%;
		min-width: 50px;
	}

	#questionnairePersonInfo tbody tr {
		display: flex;
		flex-direction: column;
	}
	#questionnairePersonInfo tbody tr td input {
		width: 100%;
	}
	.qTextInput tbody tr td:nth-child(1), .qTextInput tbody tr td:nth-child(2),
	.qNumber tbody tr td:nth-child(1), .qNumber tbody tr td:nth-child(2) {
		display: inline-block;
	}

	#contentFoot .row ul {
		padding-left: 0px;
		line-height: 30px;
	}

	#portlet-netnurseCustomer .nnServiceCategory > h3.nnServiceCategoryName, #portlet-netnurseCustomer .nnPersonalQueueSelection span, #portlet-netnurseCustomer .nnSpecialQueueSelection span, #portlet-netnurseCustomer .nnServiceSelection span {
		display: block;
	}

	/* --------------------------
	*
	* Labs start
	*
	** ----------------------- */

	#portlet-labs .portletBody > b, #portlet-labs .portletBody > a {
		margin: 15px;
	}

	div#portlet-labs a.print {
		float: none;
		margin-bottom: 10px;
	}

	/*hide ask part in mobile*/
	#portlet-labs .moreToAsk {
		display: flex;
		flex-direction: column;
		padding: 10px;
		/*display: none;*/
	}

	/*#portlet-labs th.labsColumn_ask,*/
	#portlet-labs th.labsColumn_indicator,    
	/*#portlet-labs th.labsColumn_graphLink,*/
	#portlet-labs th.labsColumn_delete,
	#portlet-labs th.labsColumn_source {
		display: none;
	}

	#portlet-labs .fancyListing tr td.labsColumn_normValue {color:red;} /*Viitearvot*/

	#portlet-labs .fancyListing tr.labstatement {
		display: none;
	}
	/*Hide extra back-link from graph view*/
	#portlet-labs #measurePageGraphLink ~ a {
		display: none;
	}  

	#portlet-labs table.responsive td.labsColumn_date {
		border-top: 1px solid #bfbfbf;
		background-color: #ECEEF1;
		color: #2B456C;
		padding-top: 10px;
		border-radius: 5px 5px 0 0;
		font-size: 20px;    
	} 

  
    #portlet-labs .portletBody > b, #portlet-labs .portletBody > a {
        margin: 15px;
    }

    div#portlet-labs a.print {
      float: none;
      margin-bottom: 10px;
    }

    /*#portlet-labs th.labsColumn_ask,*/
    #portlet-labs th.labsColumn_indicator,    
    /*#portlet-labs th.labsColumn_graphLink,*/
    #portlet-labs th.labsColumn_delete,
    #portlet-labs th.labsColumn_source {
        display: none;
    }

    /*#portlet-labs td.labsColumn_ask,*/
    #portlet-labs td.labsColumn_indicator,    
    /*#portlet-labs td.labsColumn_graphLink,*/
    #portlet-labs td.labsColumn_delete,
    #portlet-labs td.labsColumn_source {
        display: none;
    }

    #portlet-labs .fancyListing tr td.labsColumn_normValue {color:red;} /*Viitearvot*/

    #portlet-labs .fancyListing tr.labstatement {
        display: none;
    }
    /*Hide extra back-link from graph view*/
    #portlet-labs #measurePageGraphLink ~ a {
          display: none;
    }  

    #portlet-labs table.responsive td.labsColumn_date {
      border-top: 1px solid #bfbfbf;
      background-color: #ECEEF1;
      color: #2B456C;
      padding-top: 10px;
      border-radius: 5px 5px 0 0;
      font-size: 20px;    
    } 
  
  	/*if ask is showing*/  
  	table.responsive td.labsColumn_ask:before {display:inline-block;}
    table.responsive td.labsColumn_ask input#askMore {vertical-align:baseline;}
  

	/* --------------------------
	*
	* labs end
	*
	** ----------------------- */



	/* --------------------------
	*
	* My folder start
	*
	** ----------------------- */

	#portlet-myFolder .fancyListing tr th:nth-child(4),
	/*#portlet-myFolder .fancyListing tr th:nth-child(5),*/
	#portlet-myFolder .fancyListing tr th:nth-child(6) {
		display: none;
	}

	#portlet-myFolder .fancyListing tr td:nth-child(4),
	/*#portlet-myFolder .fancyListing tr td:nth-child(5),*/
	#portlet-myFolder .fancyListing tr td:nth-child(6) {
		display: none;
	}


	/* --------------------------
	*
	* My folder end
	*
	** ----------------------- */


	/* --------------------------
	*
	* User info start
	*
	** ----------------------- */


	/*#portlet-userInfo .userInfoTable,
	#portlet-userInfo .userInfoTable td {
		width: 100%;
	}*/

	#portlet-userInfo .userInfoTable td {
		/*display: flex;*/
		padding: 0px;
		justify-content: space-between;
	}
  
    /*TEMP HIDE 130123**/
    #portlet-userInfo .heightDate, #portlet-userInfo .weightDate, #portlet-userInfo .weightAuthor, #portlet-userInfo .WHOClassification, #portlet-userInfo .waistDate, #portlet-userInfo .waistAuthor {display:none}

	#portlet-userInfo .userInfoTable tr > td:nth-child(1) {
		margin-top: 30px;
	}
  
    #portlet-userInfo .userInfoTable label {padding-right:0;}

	#portlet-userInfo .burdenRow {
		display: flex;
		flex-direction: column;
	}

  #portlet-userInfo #dTestTable .formGrid input[type=text] {width:50px !important;}
  
	#familyBurdenTable tr {
		display: flex !important;
		flex-direction: column !important;
		width: 100% !important;
	}

	#familyBurdenTable tr td {
		padding: 10px 0;
		word-break: break-word;
		hyphens: auto;
	}

	#portlet-userInfo .waistAuthor {
		white-space: unset !important;
	}

	/* --------------------------
	*
	* User info end
	*
	** ----------------------- */

	#portal-column-left.not-logged-in, #portal-column-left.not-logged-in + #portal-content {
		display: block;
		width: 100%;
		padding: 0;
		min-height: unset;
      	height:auto;
	}
    #portal-column-left.not-logged-in + #portal-content {
		padding:0px 15px 0px 15px;
    }
    /*Height 0 if menu not open*/
    #portal-column-left {height:0;}
  
    #portal-column-left.mobilenav-open-column-left {height:auto;}
  
	/*full width instead*/
	/*#portal-column-left.not-logged-in + #portal-content {
	padding: 10px !important;
	}*/

	#portal-column-center {
		min-height: unset;
	}

	#portlet-graph\:medicines table tr td div,
	#portlet-graph\:medicines #medicines_graph,
	#portlet-graph\:medicines #medicines_graph canvas {
		width: 100%; 
	}    
  
     /*in mobile*/
	 #mobile-menu-toolbar-start {
            display: flex;
            flex-direction: column;
            justify-content: center;
            margin-left: 0;
            margin-right: auto;
            position:relative;
            top:auto;
            transform: scale(0.9);
         }
      
    #portlet-omhomenu #main-menu-wrapper .dropdownmenu {display:none; height: 1px; padding: 0;}
    #portlet-omhomenu #usermenu-menu {height: 1px; padding: 0;}
  
  	#portal-column-left {
		width:100%;
		max-width: 100%;
		margin: 0;
		padding: 0;
      	flex: 0 0 auto;
	}

	#toolBar {
	    width: 100%;
	    display: flex;
	    background-color: #06175E;
	    background-color: var(--colors-primary);
	    height: auto;
	    flex-direction: row;
        margin-bottom: 5px;
        margin-top: 5px;
	}
    .open-menu-button-text {
    	display: none;
	}
  
    #toolBar #tool-logout,  #toolBar #tool-exit {padding:5px;}
  
    @media (max-width:330px) {
        #toolBar ul li a#tool-logout, #toolBar ul li a#tool-exit {
    		font-size: smaller;
    	} 
        #toolBar ul {
          	column-gap: 0;
  		}      
      	#portlet-userInfo .userInfoTable div, #portlet-userInfo .userInfoTable button, #portlet-userInfo .userInfoTable a  {
          	font-size: smaller;
      	}
    }
  

  
    #toolBar button.open-menu-button, #toolBar button.home-button {
        padding: 0px;
        margin: 0px;
        color: #fff;
        /* height: 53px; */
        line-height: 53px;
        width: 30px;
        text-align: center;
        border-radius: 0px;
        box-shadow: none;
        display: flex;
        font-weight: 400;
        font-size: .8em;
        box-shadow: none;
        outline: none;
        text-shadow: none;
        border: 0;
		align-items: center;
        justify-content: center;
      	background-color: #06175E;
    	background-color: var(--colors-primary);
    }
  
    button.open-menu-button.open .fa-bars:before {content:"\f00d"}
  
    #toolBar ul {
        justify-content: right;
        flex-grow: 1;
    }
  
    #userBar/*, #toolBar #tool-me*/ {display:none;}
    ul.menu li#menu_settings {display:block !important;}
    #portal-top {height:auto;}
  
  
    #mobileBack {
      width:max-content;
      display:block;
      margin-left:5px;
      background-color: #FFFFFF;
      background-color: var(--colors-white); 
      color:#000000;
      border: 2px solid #06175E;
      border: 2px solid var(--colors-primary);
    }
  
    @media (pointer: coarse) {
    	.frontpage-content ~ #contentFoot > .leftCorner #mobileBack {
        	display: none;
  		}  
    }
  
    #portal-column-left.not-logged-in ~ #contentFoot #mobileBack {display:none;}
  
  /*TEMP RULES*/
  /*Responsive tables. Class responsive added with jQuery or otherwise to table. Used in drafts*/
  /* --------------------------
  *
  * Responsive table start
  *
  ** ----------------------- */


  table.responsive 												{ min-height:.01%;	overflow-x:auto; }
  @media screen and (max-width: 801px) {
    table.responsive 											{ width:100%; overflow-y:hidden; -ms-overflow-style:-ms-autohiding-scrollbar;}
  }

  table.responsive 												{ border-collapse:collapse; border-spacing:0; margin-bottom:40px; margin-top:.5em;	 width:100%;  max-width:100%; }
  table.responsive thead tr 										{}
  table.responsive tfoot tr 										{}
  table.responsive thead th, 
  table.responsive tfoot th 										{font-size:.83333em;line-height:1.8;padding: 15px 14px 13px 14px;/* position:relative; */text-align:left;/*text-transform:uppercase;*/}
  table.responsive th, table.responsive td 						{ border-bottom: 1px solid #bfbfbf; padding:10px 14px; position:relative; vertical-align: top; }

  @media (max-width:1024px) {
    table.responsive 											{ font-size: .944444em;}
  }
  @media (max-width:767px) {
    table.responsive 											{ font-size: 1em;}
  }
  @media (max-width: 767px) {
    table.responsive 											{ box-shadow:none;border-width:0;}

    table.responsive thead tr, 
    table.responsive tfoot tr 									{ display:none;}
    table.responsive tbody tr 									{ -webkit-box-shadow:0px 7px 6px -6px rgba(0,0,0,.28); -moz-box-shadow:0px 7px 6px -6px rgba(0,0,0,.28); box-shadow:0px 7px 6px -6px rgba(0,0,0,.28); margin-bottom:20px; }
    table.responsive tbody tr:last-child 						{ margin-bottom:0;}

    table.responsive tr:hover 									{ background-color:#eee; color:#000;}
    table.responsive tr:hover:before 							{ color:hsl(0, 0%, 40%); }

    table.responsive tr,
    table.responsive td 										{ display:block; }
    table.responsive td 										{ padding: 5px 14px 10px 10px;}

    table.responsive td 										{ border: 1px solid #bfbfbf; border-top:none; border-bottom: none; background-color: transparent; position:relative; /*padding-left:30%;*/padding-left:14px; text-align: left; }
    table.responsive td:first-child 							{border-top: 1px solid #bfbfbf;background-color: #ECEEF1;color:#2B456C;padding-top: 10px;border-radius: 5px 5px 0 0;font-size: 20px;}
    table.responsive td:first-child:before 						{ color: #2B456C; font-size: 1.01em;}
    table.responsive td:last-child 								{ border-bottom: 1px solid #bfbfbf; border-right:1px solid #bfbfbf !important;}

    /*Data-labels. Generated in site.js*/
    table.responsive td:before 				                    { content: attr(data-label); display: block; color: #000000; font-size: 1em; font-weight: normal; /*text-transform: uppercase;*/ width: auto; white-space:nowrap; margin-right:10px;}  
       
    /*Alitutkimus*/ 
    #portlet-labs table.responsive tr.clickable.childLab {margin-top:-20px;}
    #portlet-labs table.responsive tr.clickable.childLab td.labsColumn_ask {display:none;}
    #portlet-labs table.responsive tr.clickable.childLab td.labsColumn_date:before {text-transform: none;}
    #portlet-labs table.responsive tr.clickable.childLab td.labsColumn_date {border-radius:0;}
    
  }
   
  @media (max-width: 430px) {
  		table.fancyListing tr:nth-child(odd) {background:none;}
  }  
        
  @media (max-width: 360px) {
    table.responsive td 										{ padding-left: 14px;}
    table.responsive td:before 									{ display:block; margin-left:0;}
  }
  
  table.fancyListing.responsive:not(.medicinesListContainer table.fancyListing.responsive) tr:nth-child(even) td {
    background-color: #FFF;
  }
  
  table.fancyListing.responsive tr:nth-child(even) td:first-child {background-color:#ECEEF1;}

  /*Should BE CHECKED THAT WORKS EVERYWHERE. Used at least in myfolder*/
  table.fancyListing .button, table.fancyListing button, input.btnSmall {font-size:85%; width:fit-content;} 

  /*Draft icon-delete as button*/
  #portlet-netnurseCustomer .fancyListing.responsive .icon-delete, #portlet-myFolder .fancyListing.responsive .icon-delete, 
  #portlet-netnurseCustomer .fancyListing.responsive .continueDraft,
  #portlet-labs .fancyListing.responsive .icon-delete, #portlet-labs .fancyListing.responsive.graphLink, div[id="portlet-homemeasure:pef"] .measurementsTable .icon-delete,
  div[id="portlet-homemeasure:bloodpressure"] .measurementsTable .icon-delete, 
  div[id="portlet-homemeasure:alcohol"] .measurementsTable .icon-delete,
  div[id="portlet-homemeasure:sleep"] .measurementsTable .icon-delete,
  div[id="portlet-homemeasure:weight"] .measurementsTable .icon-delete{
    color: #000 !important;
    background-color: #fff;
    border-width: 2px;
    border-style: solid;
    border-color: #2B456C;
    font-family: Arial, sans-serif;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    text-decoration: none !important;
    padding: 8px 30px 8px 30px;
    cursor: pointer;
    outline: none;
    border-radius: 25px;
    -webkit-border-radius: 25px;
    -moz-transition: .2s;
    -webkit-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
    background: none;
    display: block;
    width: auto; 
    height:auto;
  }	

  #portlet-netnurseCustomer .fancyListing.responsive .icon-delete:hover, #portlet-myFolder .fancyListing.responsive .icon-delete:hover,
  #portlet-netnurseCustomer .fancyListing.responsive .continueDraft:hover, #portlet-labs .fancyListing.responsive .icon-delete:hover{
    text-decoration: none !important;
    background-color: #2B456C;
    color: #fff !important;
  }
  #portlet-netnurseCustomer .fancyListing.responsive .icon-delete:after,  #portlet-myFolder .fancyListing.responsive .icon-delete:after,
  #portlet-labs .fancyListing.responsive .icon-delete:after,  div[id="portlet-homemeasure:pef"] .measurementsTable .icon-delete:after,
  div[id="portlet-homemeasure:bloodpressure"] .measurementsTable .icon-delete:after,
  div[id="portlet-homemeasure:alcohol"] .measurementsTable .icon-delete:after,
  div[id="portlet-homemeasure:sleep"] .measurementsTable .icon-delete:after,
  div[id="portlet-homemeasure:weight"] .measurementsTable .icon-delete:after{content:"Poista";}
  
  /*quick fix for date in measures*/
   @media (max-width: 430px) {
      .graphDateSpanInput, #homeMeasurementsCalendar #yearSelector, #homeMeasurementsCalendar #monthSelector {
            font-size: medium !important;
      }
  }
  
  /*quick fix2 for date in measures*/
   @media (max-width: 360px) {
      .graphDateSpanInput, #homeMeasurementsCalendar #yearSelector, #homeMeasurementsCalendar #monthSelector {
            font-size: small !important;
      }
	  #homeMeasurementsCalendar #monthSelector {
		    width: 56%;
	  }
	  #homeMeasurementsCalendar #yearSelector {
		    width: auto;
	  } 
   }	  

  /*Labs graphlnk button to desktop and mobile*/
@media (max-width: 450px) {             
    #portlet-labs .fancyListing.responsive .graphLink/*, #portlet-labs .fancyListing.responsive .icon-delete, #portlet-labs a.graphLink, #portlet-myFolder .icon-delete*/{
        color: #000 !important;
        background-color: #fff;
        border-width: 2px;
        border-style: solid;
        border: 2px solid #06175E;
        border: 2px solid var(--colors-primary);
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        text-decoration: none !important;    							 
        cursor: pointer;
        outline: none;						  
        -moz-transition: .2s;
        -webkit-transition: .2s;
        -o-transition: .2s;
        transition: .2s;
        background: none;
        display: block;
        width: auto; 
        height:auto;
    }
  
	#portlet-labs a.graphLink {width:fit-content;margin-left:auto;}

    #portlet-labs .fancyListing.responsive .graphLink:hover/*, #portlet-labs .fancyListing.responsive .icon-delete:hover, #portlet-labs a.graphLink:hover, #portlet-myFolder .icon-delete:hover*/{
          text-decoration: none !important;
          /*background-color: #2B456C;*/
          color: #fff !important;
    }
   /*div.portlet a.graphLink:after {
              font-family: 'Font Awesome 5 Free';
                content: '\f201';
                margin-right: 6px;
                font-weight: 900;
   }*/
    #portlet-labs .fancyListing.responsive .graphLink:after, #portlet-labs a.graphLink:after {content:"Kuvaaja";}
    #portlet-labs .fancyListing.responsive .icon-delete:after/*, #portlet-myFolder .icon-delete:after*/{content:"Poista";}
    /*Stop actBehalf link*/
    .actBehalfInfo a { 
        color: #000 !important;
        background-color: #fff !important;
        border-width: 2px;
        border-style: solid;
        border-color: #2B456C;
        font-family: Arial, sans-serif;
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        text-decoration: none !important;
        padding: 5px 20px 5px 20px;
        cursor: pointer;
        outline: none;
        border-radius: 25px;
        -webkit-border-radius: 25px;
        -moz-transition: .2s;
        -webkit-transition: .2s;
        -o-transition: .2s;
        transition: .2s;
        background: none;
        display: inline-block;
        width: fit-content;
        height: auto;
    } 
}  
      
  /* --------------------------
  *
  * Responsive table end
  *
  ** ----------------------- */  
  
  /*Minor fixes to healthrecord in mobile*/
  #portlet-HealthRecord table.titleAndActions {margin-bottom:10px;}
  #portlet-HealthRecord table.titleAndActions td {display:block;width:100%;}
  #portlet-HealthRecord table.titleAndActions div.actions {text-align:left;}
  #portlet-HealthRecord table.titleAndActions div.actions a {margin-left:0;}
  
  
  @media (max-width: 450px) {
    #portlet-groups img {max-width:300px;}
  }  
  
  #portlet-groups #leftCol,#portlet-groups #rightCol {float:none; width:100%;}
  
  /*Settings page*/
  #portlet-omhointro table.mydata, #portlet-intro table.mydata {width:100%;}
  #portlet-omhointro #owninfo table, #portlet-intro #owninfo table {width:100%;}
  #portlet-omhointro .mydata tr td,  #portlet-intro .mydata tr td {display:block; text-align:left !important}
  #portlet-omhointro .mydata tr td input, #portlet-intro .mydata tr td input {width:100% !important;}
  #portlet-omhointro #regForm, #portlet-intro #regForm {margin:0;}
  #portlet-omhointro .instructions, #portlet-intro .instructions {padding:8px 8px;}
  #portlet-omhointro select, #portlet-intro select {width:100%;}
  
  @media (max-width: 450px) {
    #portlet-netnurseCustomer #buttonsection .button {float:none; width: 100%;margin-top: 10px;}
    
    /*width 100% for healthrecord new values form*/
  	#portlet-HealthRecord table#formTableHR input.text, input[type=text], input[type=text],textarea, #portlet-HealthRecord table#formTableHR select {width:100% !important;}  
  }  
  
  div#portlet-labs a.print, #printinr, a.pdf, a.exportButtonHR {
     background: transparent url(images/ico_print.png) no-repeat 1px 0px;
  }
    
}	


/*from old styleheet fix*/

     @media (max-width: 430px) {
      /*Neuvola forms*/
      .inputGrid th {width:auto!important;}
      .inputGrid {max-width:100%; width:100%;}
      .inputGrid input {max-width:100%; width:100%;}
       #h1nimi, #lnimi, #Lnimi, #h2nimi, #h2hetu, #h1hetu, #lhetu, #Lhetu, #vanhempiemail, #vanhempinimi, #vanhempiosoite, #vanhempityopaikka, #vanhempityopaikka {
          max-width: 150px;
          width: 100% !important;
          min-width: 80px;
       }
       label.alignR[for*="hetu"] {width: 57px; word-break:break-word;}

      /*Oma kukkaro
      #baseSums td, #savingsBase table td, #goals td, #formTableHR td  {text-align:left!important;}
      #trafficLights {background-size:cover; width:50px;}
      #portlet-walletOverview .instructions.top {margin-left:60px;}
      #portlet-walletSavings h1.documentFirstHeading, #savingsBase {margin-left:0!important;}
      #portlet-walletSavings h1.documentFirstHeading {margin-top:120px!important;}
      #savingsBase {background:#fff;}
      #infoSavingLink {float:left!important;}
      #addNewSavingTable {width:100%!important; max-width:100%;}
      fieldset#permissions .legend, fieldset#regulars .legend, fieldset#mobile .legend, fieldset#accounting .legend, fieldset#savingsTarget .legend, fieldset#savingsEvents .legend {padding-left:40px;}*/
	}
       
/****Mobile rules end****/

/*Labs fixes start*/
div.portlet a.graphLink {
	width: 48px;
	height: 48px;
	text-decoration: none !important;
	background: transparent url(images/ico_graph.png) no-repeat top left;
	overflow: hidden;
	display:block;
	margin-left:auto;
	margin-right:auto;
}
div.portlet #measurePageGraphLink a.graphLink {
	margin-left:0px;
	margin-right:0px;
}

#portlet-labs #measurePageGraphLink ~ a div.measureGraphBackButtonHack {
    display: inline-block;
}

div.portlet a.graphLink:hover {
	box-shadow: inset 0 0 5px #FEB7A4;
	-moz-box-shadow: inset 0 0 5px #FEB7A4;
	-webkit-box-shadow: inset  0 0 5px #FEB7A4;
	-ms-filter: progid:DXImageTransform.Microsoft.Shadow(Color=#FEB7A4, Strength=1, Direction=135);
	filter: progid:DXImageTransform.Microsoft.Shadow(Color=#FEB7A4, Strength=1, Direction=135);
}

#portlet-labs .fancyListing.responsive .graphLink:hover {
    text-decoration: none !important;
    background-color: #FEB7A4;
    background-color: var(--colors-secondary-salmon);
    color: #fff !important;
}

td.labsColumn_delete {vertical-align:middle !important;} 

#portlet-labs span[id^="comment"]:empty {
    display: none;
}

/***Labs comment start***/
#portlet-labs span[id^="comment"] {
    background-color: #F4F2F2;
    background-color: var(--colors-gray-75);
    margin: 0 0 1.1em 0;
    padding: 3px 10px 4px 10px;
    border: 1px solid #F0EEEE;
    border: 1px solid var(--colors-gray);
    clear: both;
    border-radius: 4px;
    display:block;
}

#portlet-labs span[id^="comment"] > span.comment{
    /*background-color: #e2f4c9;
    border-color: #a3da60 #76c529 #76c529 #a3da60;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;*/
    font-size: 90%;
    margin: 0.2em 0 0.3em;
    /*padding: 4px 8px 6px;*/
    width: 98%;
    display: inline-block;
}


#portlet-labs .labCommentInfo img{
    /*background: transparent url(/resource/skin/images/ico_help.png) no-repeat;*/
    background-size: 20px 20px;
    display: inline-block;
    width: 20px; 
    height: 20px;
    margin:0px 0px -4px 5px;
    position:relative;
}

/***Labs comment end***/  
    
/*Labs fixes end*/
					
/*Frontpage container could also have image start*/


.subpage-header__image {
  width: 40%;
  flex: 0 0 auto;
  order: -1;
  /* height: 183px; */
  display: block;
  position: relative;
  /* flex-wrap: wrap; */
}

.section-content {
  /*width: 50%;
  max-width: 580px;
  padding: 40px 40px 40px 0;*/
}

.section-content {
  flex: 0 0 auto;
  width: 100%;
  display: block;
  /*padding: 20px 10px 30px 20px;*/
}

@media (min-width: 750px) {
.subpage-header__text {
  margin-top: 28px;
  /*max-width: 580px;*/
}
}	

.section-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
}
/*@media (min-width: 1200px) {
.section-wrapper {
  padding-left: 28px;
  padding-left: var(--container-x-padding);
}
}*/	  
@media (min-width: 750px) {
.section-wrapper {
  flex-direction: row;
  /*padding-left: 40px;
  flex: 0 0 50%;*/
  /*without-image*/
  flex: 0 0 100%;
}
}	  

@media (min-width: 750px) {
.section-container {
  margin-bottom: 84px;
  margin-bottom: calc(var(--base-unit) * 3);
}
  }	  

.section-container {
  border-radius: 4px;
  overflow: hidden;
    /* ff 3.6+ */
    background:-moz-linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(254, 183, 164, 0.18) 50%, rgba(255, 255, 255, 1) 100%); 

    /* safari 5.1+,chrome 10+ */
    background:-webkit-linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(254, 183, 164, 0.18) 50%, rgba(255, 255, 255, 1) 100%);

    /* opera 11.10+ */
    background:-o-linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(254, 183, 164, 0.18) 50%, rgba(255, 255, 255, 1) 100%);

    /* ie 6-9 */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#FFFFFF', GradientType=0 );

    /* ie 10+ */
    background:-ms-linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(254, 183, 164, 0.18) 50%, rgba(255, 255, 255, 1) 100%);

    /* global 94%+ browsers support */
    background:linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(254, 183, 164, 0.18) 50%, rgba(255, 255, 255, 1) 100%);
    padding:0;
}

@media (min-width: 750px) {
.section-content {
  width: 50%;
  max-width: 580px;
  padding: 40px 40px 40px 0;
}
  }	  
.section-content {
  flex: 0 0 auto;
  width: 100%;
  display: block;
  padding: 20px 10px 30px 0px;
}

/*frontpage container end*/

/***OuluBot styles overwrite start***/
.front-open-chat-button {background: #005a9b !important;}
#chat-container .iePmZk {
	/*background: #06175E !important;*/
	background: #005a9b !important;
}
#chat-container .hcXtgK {box-shadow: 0 0 0 2px blue !important; border:1px solid blue !important;}
#chat-container .kTXLKM {box-shadow: rgb(12 0 225 / 40%) 0px 0px 0px 2px, rgb(0 5 225 / 40%) 0px 0px 0px 2px inset !important;}
#chat-container .fMncPZ {fill:#003b66 !important;}
/***OuluBot styles overwrite end***/

/***feedbackPortlet start***/
#feedbackInstructions {
 	background-color: #e6ecef;
	/*background-color: #D2DCE1;*/
	margin: 2em 3px 1.8em 0;
	padding: 12px 20px 16px 21px;
}
#feedbackInstructions strong {
	font-size: 90%;
	font-weight: bold;
	display: block;
}
#feedbackSendButton{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #fff;
  background-color: #06175e;
  background-color: var(--colors-primary);
  transition: color ease,border ease,background ease;
  transition-duration: .1s;
  padding: 10px 12px 10px 10px;
  border: 2px solid #06175E;
  border: 2px solid var(--colors-primary);
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-flow: row nowrap;
  transition: background-color .3s ease;
  cursor: pointer;
}
#feedbackSendButton::after {
	font-family: 'Font Awesome 5 Free';
    content: "\f061";
    margin-left: 6px;
    font-weight: 900;
}
#feedbackSendButton:hover {
    border-color: #1F2E6E;
    border-color: var(--colors-primary-blue-90);
    background-color: #1F2E6E;
    background-color: var(--colors-primary-blue-90);
}
#feedbackSendButton:hover:after{
    transform: translate3d(3px, 0, 0);
}
/***feedbackPortlet end***/

/*Light login 210823*/
#portal-content.not-logged-in #portal-column-center #portlet-login .loginForm input.text {
  	width:350px !important;
}


#portlet-labs .moreToAsk,
#portlet-labs .labsColumn_ask {
	display: none;  
}

#mobileBack {
	display: none; 
}


