body{
	background-color: white;
	background: unset;
	font-family: 'Verdana';

	opacity: 1;
	overflow-y: scroll;
	text-rendering:geometricPrecision;}



/* width limit */
body,#width_height{min-width: 480px;}



/*Gray text*/
.row > div{font-size: 14px;}



/*On startup */
#body{display: block;}

#body,
#startTextB{
	-webkit-transition: opacity .3s cubic-bezier(.79,.2,.65,.97);
	   -moz-transition: opacity .3s cubic-bezier(.79,.2,.65,.97);
	    -ms-transition: opacity .3s cubic-bezier(.79,.2,.65,.97);
	     -o-transition: opacity .3s cubic-bezier(.79,.2,.65,.97);
	        transition: opacity .3s cubic-bezier(.79,.2,.65,.97);}

#startTextA {
	position: fixed;
    top: 0;
	display: table;
	height: 95vh;
	width: 100%;}

#startTextB {
	display: table-cell;
	text-align: center;
	vertical-align: middle;}

.start,
.titleStart{opacity: 0;}







pre::-webkit-scrollbar,
pre::-webkit-scrollbar-corner,
pre::-webkit-scrollbar-thumb,
pre::-webkit-scrollbar-track{
	background-color: unset;
	box-shadow:unset;}

pre::-webkit-scrollbar{
	width: 8px;
	height: 8px;}

pre::-webkit-scrollbar-thumb,
pre::-webkit-scrollbar-track{
	border-radius: 8px;
	background-color: #88888842;}

pre::-webkit-scrollbar-track {
	background-color: #47474700;}




/*CODE*/
.code_block{margin-top: -5px;}
.input-group {
	display: inline-flex;
	margin-bottom: .5rem;
	width: unset;}

.input-group-prepend {
    margin-right: -6px;
}

pre{
	background: white!important;
	border-radius: 3px;
	border: none!important;
	max-height: 250px;
	position: inherit;
	z-index: 999;}

code[class*="language-"],
pre[class*="language-"]{
	text-shadow: unset!important
}
code{margin-right: 10px;}

.oneline {
	background: white!important;
	border: none!important;
	border-bottom-left-radius: 0!important;
	border-left: 0;
	border-top-left-radius: 0!important;
	display: inline-block;
	font-size: 13px;
	line-height: 1.8!important;
	padding: 8px 15px !important;
	white-space: nowrap!important;}



/*COPY ICON*/
img[src*="copy.svg"]{
	border-style: none;
	left: -3px;
	margin-right: -5px;
	position: relative;
	top: -2px;
	vertical-align: middle;
	width: 20px;}



/*HEADINGS*/
h1,
h2,
h3 {-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none}

h1 {font-size: 70px;}
h2 {font-size: 36px;font-weight: bold;margin-top: 25px;}
h3 {display: inline-block;
	position: relative;
	top: 7px;}
h5{margin-top: 0.7rem;}


/*Hidden*/
textarea{
	height: 0;
	opacity: 0;
	pointer-events: none;
	width: 0;
	position: absolute;
}

#copy{
	opacity: 0;
	pointer-events: none;
	position: fixed;
}



/*TAB*/
.tab{
	background-color: #f1f1f1 !important;
	display: none;
	margin-bottom: 20px;
	padding: 15px;
	position: relative;
	z-index: 3;
}

.tab:target {display: flex;}

tabs > a{
	background-color: rgb(248, 248, 248) !important;
	border: none;
	box-shadow: 0 -32px 10px -20px white inset;
	color: black;
	display: inline-block;margin: 0 4px -1px 0;
	font-weight: 600;
	outline: 0;
	padding: 15px 25px;
	position: relative;
	text-align: center;
-webkit-transition: all .3s cubic-bezier(.79,.2,.65,.97);
   -moz-transition: all .3s cubic-bezier(.79,.2,.65,.97);
     -o-transition: all .3s cubic-bezier(.79,.2,.65,.97);
        transition: all .3s cubic-bezier(.79,.2,.65,.97);
	z-index: 2;}

@media (max-width: 575.98px){
	tabs > a{ padding: 15px 14px; }}

tabs > a:focus {outline: 0;}
tabs > a:hover {
	color: #888;
	cursor: pointer;}

tabs{
	display: block;
	margin-top: -58px;
	position: relative;
	top: 759px;
	transform-origin: 7px 61px;
	transform: rotate(270deg);
	user-select: none;}

@media (max-width: 1300px){
	tabs{
		margin-top: 6px;
		top: unset;
		transform-origin: unset;
		transform: unset;}}

tabs > a.shower{
	background-color:#f1f1f1 !important;
	box-shadow: 0 0 10px -20px white inset;}



/* Examples */
.btn-example{ margin-top: 10px; }
#styles{ margin:.5rem 0; }
#displays{ margin:.5rem 0; }



/* Popover */
.bs-popover-auto[x-placement^=left] .arrow::after,
.bs-popover-left .arrow::after { border-left-color: #007bff; }
.bs-popover-auto[x-placement^="right"] .arrow::after,
.bs-popover-right .arrow::after { border-right-color: #007bff; }
.bs-popover-auto[x-placement^="top"] .arrow::after,
.bs-popover-top .arrow::after { border-top-color: #007bff; }

.popover-body {
	background-color: #007bff;
	border-color: #007bff;
	color: #fff;
	font-weight:bold;}



/* bottom menu */
/* theme switch */
#switch{ height: 37px;}
#switch-holder{
	position: absolute;
	right:.5rem;}

/* width height */
#width_height{z-index: 5;}
#width_height .input-group{max-width: 130px;}
#width_height .input-group-text{padding-right: 15px;}