/*
 **********************************************************************************
 * Copyright (C) 2017-2020 by KEYARK, INC. - All Rights Reserved.
 * All information contained herein is proprietary and confidential to KEYARK, INC.
 * Any use, reproduction, or disclosure without the written
 * permission of KEYARK, INC. is prohibited.
 * Written by Victoria Pinchuk <vpinchuk@keyark.com>
 **********************************************************************************
 */
@import "icons.css";
body {
	margin: 0;
	padding: 0;
	text-align: left;
	background-color: white;
	background-image: url(../images/back_top.jpg);
	background-repeat: no-repeat;
	background-position: right top;
    overflow: hidden;
}


h1, h2, h3, h4, h5, h6 {
    margin: 0;
	margin-top: 16pt;
    padding: 16pt;
    text-indent: 0;
}

ul+*:not(p){padding-top:0};

h1 {font-size: 1.4em;}
h2 {font-size: 1.3em;}
h3 {font-size: 1.2em;}
h4 {font-size: 1.1em;}
h5, h6 {font-size: 1em;}
h6 {font-weight: normal;}

.modeluserguide .index { background: repeating-linear-gradient(135deg, white, lavender 1px, white 3px) !important;}
.modeluserguide .title { background-color: rgb(35 0 71 / 70%) !important;}
.modeluserguide  h5 {
	color:#440099 !important;
}

h1.title {
	font-size: 1.8em;
	white-space: nowrap;
    background-color: rgb(0,0,0, .7);
    color: white;
}

h1.title span {
	display: block;
    font-size: 10pt;     
    padding: 0;     
    font-weight: normal;
    float: right;
}

h1 img { 
	padding:0 1em; 
	vertical-align:middle;
}
.img {
     background-color: black;
     padding: .5em;
     display: none;
}

table {
	width:100%;
	table-layout:fixed;
}

td {
	border: 1px inset white;
	padding-bottom: .5em;
}

th { font-weight: bold;}

table:not(.inner), .content img {
    border: 10px solid #f0f0f0;
    outline: 1px solid #ccc;
}

p, table:not(.inner) {
	margin: 0;
    margin-top: .5em;
    line-height: 1.2em;
}

table.inner {
    line-height: 1em;
    font-family: monospace;
}
table.inner tr * {
	border:none;
	background-color:#f0f0f0;
}

.box {
     overflow: hidden;
}

.box > * {	padding-top:2em;}

.index {
	flex-basis: auto;
	border: 1px solid #666;
	background-color:#ddd;
	background: repeating-linear-gradient(135deg, white, #ddd 1px, white 3px);
	overflow-x: hidden;
	max-width: 20em;
}

.index p {
    font-size: 1.1em;
    border-bottom: 1px solid #ccc;
    padding: .1em .4em;
    border-right: 3px solid transparent;
}

.index p:hover {
    border-right-color: #6666cc;
    background-color: #fff;
}

.index p.MsoToc2 {margin-left:2em;}
.index p.MsoToc3 {margin-left:3.5em;}
.index p.MsoToc4 {margin-left:5em;}

.index a {
	color:#333;
	text-decoration: none;
	display: block;
}

.index a:hover {
	color:  #3333cc;
	text-decoration: underline;
}

.content {
	background-color: white;
	background-image: url(../images/back_top.jpg);
	background-repeat: no-repeat;
	background-position: right 0;
	background-attachment: local;
	flex-basis: 0;
	margin-left:1px;
	border: 1px solid #666;
	padding: 1em;
	font-size: 1em;
	overflow-y: scroll;
}

.content h5 {
    padding: 0.5em 0;
    color: #333;
}

table + p {margin-top: .5em;}

.content p {
	margin:0; 
	padding:0;
	overflow-wrap: break-word;
}

.content img {    
	display: block;
	margin: 1em 0; 
    max-width: 80%;
    max-height: 100%;
}

.modal img {    
	display: block;
    max-width: 98%;
    max-height: 98%;
}

.content td img {
	margin: auto; 
	max-width: initial;
}
.content td:first-child p { 
	text-align: center;
	overflow: hidden;
}

.content li {
    list-style: disc inside;
}

.content .FYI {
    background-color: lavender;
    padding: .8em;
}

.content .center {
	text-align: center;
    vertical-align: middle;
}

.content .custom-icon {
  font-family: "custom-icons";	
  font-weight: normal;
  text-decoration: none;
  text-transform: lowercase;
  color: #004080;
}

.content pre {
	margin: .5em 0;
}

/* The Modal (background) */
.modal {
  display: none; 
  position: fixed; 
  z-index: 1; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%; 
  background-color: rgba(255,255,255,.95); 
}

/* Modal Content (image) */
.modal-content {
  margin: auto;
  display: block;
  position: fixed;
  top: 50%;
  left: 50%;
  outline: 10px solid #ddd;

  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

.landscape {
	max-width: 99%;
	height: auto !important;
}

.portrait {
	max-height: 99%;
	width: auto !important;
}

.zoomable {	
	cursor: zoom-in;	
	height: auto !important;
}
.zoomable:hover {opacity: 0.8;}
.zoomout {cursor: zoom-out;}

.rotateCW {
	display: inline-block;
	-ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg); /* Standard syntax */
}

.rotateCCW {
	display: inline-block;
	-ms-transform: rotate(-90deg); /* IE 9 */
    -webkit-transform: rotate(-90deg); /* Safari */
    transform: rotate(-90deg); /* Standard syntax */
}

.custom-icon.bold {font-weight:bold;}