:root {
	--bs-font-sans-serif: 'Noto Sans', sans-serif;
}

/** keep footer at bottom of page using flexbox **/
body{ min-height: 100vh; margin:0; }
body{ display:flex; flex-direction:column; }
div.main-ctn{ flex:1; }
footer{ min-height:50px; }

.hidden {
    display: none!important;
}

.error {color: red;}

a[href^="https://"][target=_blank]:not(.not_ext):after,
a[href^="http://"][target=_blank]:not(.not_ext):after,
a[href^="ftp://"][target=_blank]:after {
  content: "\f08e";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: none;
  padding: 0px 2px;
  display:inline;
}

a[href^="http://"][target=_blank].ignoreExtLink:after {
	content: "";
}

.bg-lblue { background-color: #e9f4ff !important; }
.bg-blue { background-color:#3baae3; }
.bg-white { background-color:white; }
.bg-lgrey { background-color: #D3D3D3  !important; }
.bg-dblue { background-color: #002e5d; }

.cr-blue { color:#3baae3; }
.cr-white { color:white !important; }

.cr-green { color:green }
.cr-pink { color: #5e0034 !important }
.cr-strongred { color:#C00000 !important }
.cr-olivedrab { color:olivedrab }
.cr-blueviolet { color:blueviolet }
.cr-chocolate { color:chocolate }
.cr-wheat { color:wheat }

.bg-breast_cancer { background-color:#F68F35 }
.bg-breast_cancer2 { background-color:pink }
.bg-ovarian_cancer { background-color:#306430 }
.bg-pancreatic_cancer { background-color:#4289BA }
.bg-prostate_cancer { background-color:#D5494A }

.font-size-85em {font-size:0.85em }
.font-size-lg {font-size:large !important;}

.fs-sm {
    font-size: 0.95rem!important;
}

.fs-1rem {
    font-size: 1rem!important;
}

.w10 { width:10% }
.w20 { width:20% }
.w25 { width:25% }
.w35 { width:35% }
.w50 { width:50% }
.w65 { width:65% }
.w100 { width:100% }
.w-auto { width: auto!important; }
.w-95 { width:95% !important; }

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

.navbar {
  background-color: #002e5d;
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
  }

.navbar-toggler {
   border-color: white;
   color: white;
}

.fa.pull-right { margin-left:.3em; line-height: 1; }
.fa.pull-left { margin-right:.3em; line-height: 1; }

.navbar-nav>li>a, .footer a, .footer a:active, .footer a:hover{
	color: #d9e7f7;
}

.navbar-nav a.nav-link:active,
.navbar-nav a.nav-link:hover {
	color: #FFF !important;
	text-decoration: underline;
}

.pink-navbar {
	background-color:#EC5578;margin:5px 0 5px 0;padding:6px 0 0 0;
}

div.terms_n_conditions {
	height:200px;
	border:1px solid #ccc;
	background:#f2f2f2;
	overflow-x:hidden;
	overflow-y:auto;
	font-size: medium;
}

div#tandc div {white-space: pre-wrap;}

.prs_plots {max-width:370px;min-width:240px}
.cancer_plot {max-width:650px;min-width:270px;}

/* font awesome stacked green tick marks */
.fa-sm, .fa-sm>.fa-stack-1x {
    width:1em;
    height:1em;
    margin-top:-6px;
}

.fa-rotate-45 {
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	-o-transform:rotate(45deg);
	transform:rotate(45deg);
}

.table-sm>tbody>tr>td, .table-sm>tbody>tr>th, .table-sm>tfoot>tr>td, .table-sm>tfoot>tr>th, .table-sm>thead>tr>td, .table-sm>thead>tr>th {
	padding: 2px !important;	
}

/* Large devices (laptops/desktops, 992px and up to 1200px) */
@media only screen and (min-width: 992px) and (max-width: 1200px) {
	[id^="iarray"] .riskTxtMinHgt {min-height:195px;}
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	[id^="iarray"] .riskTxtMinHgt {min-height:165px;}
}

div.riskplot-tooltip {
    position: absolute;
    font-size: 0.95em;
    font-weight: bold;
    background: lightsteelblue;
    border: 0px;
    border-radius: 8px;
    pointer-events: none;
}


/* print styles
-------------------------------------------------- */

.page-break { page-break-before: always; }

@media print {
	.hidden { display: none !important; }
	table {
    	border-collapse: collapse;
    	margin-bottom: 5px;
	}
	table, th, td {
		border: 1px solid #ddd;
		font-size: 0.95em;
	}
	h3 {
		margin: 15px;
		padding-top: 15px;
	}
	.panel-primary, .alert, .svg {
		margin: 15px;
	}
	.panel-heading {
		font-weight: bold;
		font-size: large;
	}
	.no-print {
        display: none !important;
    }
}

@media print and (min--moz-device-pixel-ratio:0) {  /* mozilla specific background & colour  */
	th.population-risk {
		box-shadow: inset 0 0 0 1000px #90EE90;
    }
    th.moderate-risk {
		box-shadow: inset 0 0 0 1000px rgb(255, 204, 51);
    }
    th.high-risk {
		box-shadow: inset 0 0 0 1000px pink;
    }
	i.fa-circle.risk {
	    text-shadow: 0 0 pink !important;
		color: transparent !important;
	}
	i.fa-circle.norisk {
		text-shadow: 0 0 black !important;
		color: transparent !important;
	}
}

/* other styles
-------------------------------------------------- */
@media all {
	th.population-risk {
		background-color: lightgreen;
		-webkit-print-color-adjust: exact;
	}
	th.moderate-risk {
		background-color: rgb(255, 204, 51);
		-webkit-print-color-adjust: exact;
	}
	th.high-risk {
		background-color: pink;
		-webkit-print-color-adjust: exact;
	}

	i.fa.population-risk {
		color: lightgreen;
	}
	i.fa.moderate-risk {
		color: rgb(255, 204, 51);
	}
	i.fa.high-risk {
		color: pink;
	}

	div.arr {
		line-height: 1.25rem;
	}

	.alert-canrisk-info {
	    color: #1c4254;
	    background-color: #eaf5fc;
	    border-color: #bce8f1;
	}

	.alert-canrisk-warning {
    	color: #524021;
	    background-color: #ffffe6;
	    border-color: #faebcc;
	}

	.alert-info-grey {
	    color:  #565656;
	    background-color: #F4F4F4;
	    border-color:  #E5E5E5;
	}

	.alert-info-green {
		color: #454f47;
	    background-color: #f0faf0;
	    border-color:  #E2E8E3;
	}
	
	.alert-info-dark {
		color:  #313732;
	    background-color: #fbfdfc;
	    border-color:  #E2E8E3;
	}
}