@import url("https://fonts.googleapis.com/css?family=Roboto:400,700");
@import url("https://fonts.googleapis.com/css?family=Merriweather+Sans:400,400italic");
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");

@media (min-width:1600px)
{
    /*.container{
        width:calc(100vw - 120px);
    }*/
}

body{
	width: 100%;
}
#mainheader.header {
	background-color: #000000;
	height: 50px;
}
#mainfooter.footer {
    background-color: #74787b;
    height: 50px;
	color: white;
}
#mainheader.header .logo{
	float: left;
	left: 20px;
	color: white;
}
#mainheader.header .logo h2{
	margin-top:15px;
    font-size: 18px;
}
#mainheader.header .menu{
	float: right;
	right: 50px;
	color: white;
}
#mainheader.header .menu .nav li a{
	color: white!important; background: #000;
}
#mainheader.header .menu .nav li a:hover,.header .menu .nav li a:active{
	color: #eed593!important;  background: #000;
}
#mainheader.header .menu .nav li.open>a{
	color: #eed593!important;  background: #000;
}

section{
	/*height: calc(100vh - 100px);*/
}
.content{
	height: 100%;
	margin: 0!important;
	padding: 0!important;
}
.content .row{
	margin: 0!important;
	padding: 0!important;
}
.left_content, .right_content{
	margin: 0;
    margin-top: 4px;
	padding: 0!important;
	height: 100%;
}
.left_content{
	transition: width .1s;
}

.right_border{
	position: absolute;
	height: calc(100% - 60px);
    margin-top: 30px;
    border-left: 1px solid #ddd;
}
.ham {
	display:none;
	position: relative;
}
#mainheader.header .dropdown-menu{
	background-color: #000!important;
}

@media only screen and (max-width : 992px){
	section{
		min-height: calc(100vh - 100px);
		height: 100%;
	}
	.right_border{
		display: none;
	}
} 

@media only screen and (max-width : 768px){
	.ham {
		display:block;
		text-align: right;
		font-size: 24px;
		color: white;
		cursor: pointer;
		padding-top: 10px;
		/*margin-right: 50px;*/
	}
	.ham:active {
		color: #337ab7;
	}
    .navbar-nav {
        margin: 0px 0px;
    }
	.menu .navbar-nav {
		display: none;
	    /*width: 100vw;*/
    	position: absolute;
    	z-index: 999;
    	/*background-color: #337ab7;*/
    	right: 0px;
	}
	.menu .navbar-nav li{
		/*padding-left: 20px;
		padding-right: 20px;*/
	}
	#mainheader.header .menu{
		position: relative;
		float: none;
		right: 0;
	}
	.sub-menu.navbar-nav > li{
		float: left;
	}
} 

@media only screen and (min-width : 768px){
	.ham {
		display: none;
	}
	
	.menu .navbar-nav {
		display: block;
	}

}
  

#left-panel #bible-content{padding:0;}
#left-panel #bible-content ul{padding:0;list-style:none}
#left-panel #bible-content li{padding:5px 15px}
#left-panel #bible-content li:hover{background-color:#e9e9e9;cursor:pointer}
#left-panel #bible-content li.hl{background-color:#b8cee6}
#left-panel #bible-content li.hl:hover{cursor:auto}
#left-panel #bible-content li.hl sup.verse-num{font-size: 11px;color:#000;font-family: Arial;}
#left-panel #bible-content{padding-bottom:5px}
#left-panel.fixed-height #bible-content{overflow-y:auto;padding-bottom:0}

#left-panel #bible-content-sec{padding:0;}
#left-panel #bible-content-sec ul{padding:0;list-style:none}
#left-panel #bible-content-sec li{padding:5px 15px}
#left-panel #bible-content-sec li:hover{background-color:#e9e9e9;cursor:pointer}
#left-panel #bible-content-sec li.hl{background-color:#b8cee6}
#left-panel #bible-content-sec li.hl:hover{cursor:auto}
#left-panel #bible-content-sec li.hl sup.verse-num{font-size: 11px;color:#000;font-family: Arial;}
#left-panel #bible-content-sec{padding-bottom:5px}
#left-panel.fixed-height #bible-content-sec{overflow-y:auto;padding-bottom:0}

ul.jb-verse-list{padding:0;list-style:none}
.jb-verse-list li{padding:5px 15px}
sup.strong-codes{padding:0 3px}
sup.verse-num{padding:0 5px 0 0;color:#999;font-family: Arial;font-size: 11px;}
sup.ballon{padding:0px;color:#999;font-family: Arial;font-size: 11px;}

#right-panel #ref-content #wordtable tr:hover{background-color:#e9e9e9;cursor:pointer}
#right-panel #ref-content #wordtable tr.hl{background-color:#b8cee6}
#right-panel #ref-content #wordtable tr.hl:hover{cursor:auto}

#bible-lookup{}

#book-chap-nav{padding:5px 0}
#book-chap-nav a{text-decoration:none}
#book-chap-nav a.disabled{color:#c0c0c0;pointer-events:none}

.tjc-cr li.ref-verses h4{margin-bottom:2px}
.tjc-cr li.ref-verses small{color:#4d4d4d}
.tjc-cr li.ref-verses p{margin-top:5px}
#tjc-ref .ref-vids a.hl,#tjc-elib .ref-vids a.hl{color:#f00}
#tjc-ref p.ref-vids.collapse,#tjc-elib p.ref-vids.collapse{margin:0}
#tjc-elib ul li{padding:3px 0}
#tjc-elib button{margin-left:3px}
#bible-cr .ref-vids a.hl{color:#999}
table.strong-def td{min-width:100px}
a[data-vid]{white-space:nowrap}
a[data-lang] i{margin-right:5px}
.caret.caret-up{border-top-width:0;border-bottom:4px solid #fff}
div.modal-article h1{font-size:24px}
div.modal-article h2{font-size:19px}
div.modal-article h3{font-size:17px}
div.modal-article h4{font-size:15px}
div.modal-article h5{font-size:14px}
div.modal-article h6{font-size:13px}
div.modal-article blockquote{font-size:14px}
ul.icon{list-style-type:none}
ul.icon li{text-indent:-1.4em}
ul.icon li p{text-indent:0}
ul.icon li:before{font-family:'Glyphicons Halflings';content:"\2a";float:left;width:1.4em}
ul.icon.plus li:before,ul.icon li.plus:before{content:"\2b"}
ul.icon.th-large li:before,ul.icon li.th-large:before{content:"\e010"}
ul.icon.th li:before,ul.icon li.th:before{content:"\e011"}
ul.icon.list li:before,ul.icon li.list:before{content:"\e012"}
ul.icon.ok li:before,ul.icon li.ok:before{content:"\e013"}
ul.icon.minus li:before,ul.icon li.minus:before{content:"\2212"}
ul.icon.star li:before,ul.icon li.star:before{content:"\e006"}
ul.icon.heart li:before,ul.icon li.heart:before{content:"\e005"}
ul.icon.check li:before,ul.icon li.check:before{content:"\e067"}
ul.icon.edit li:before,ul.icon li.edit:before{content:"\e065"}
ul.icon.info li:before,ul.icon li.info:before{content:"\e086"}
ul.icon.question li:before,ul.icon li.question:before{content:"\e085"}
ul.icon.random li:before,ul.icon li.random:before{content:"\e110"}
ul.icon.link li:before,ul.icon li.link:before{content:"\e144"}
ul.icon.new-window li:before,ul.icon li.new-window:before{content:"\e164"}
ul.icon.transfer li:before,ul.icon li.transfer:before{content:"\e178"}
.text-right{text-align:right}

/* typeahead */
.typeahead,
.tt-query,
.tt-hint {
    height: 30px;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 30px;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    outline: none;
}

.typeahead {
    background-color: #fff;
}

.typeahead:focus {
    border: 2px solid #0097cf;
}

.tt-query {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
    color: #999
}

.tt-menu {
    height: auto;
    max-height: 230px;
    overflow-y: auto;
}

.tt-menu {
    width: 100%;
    margin-top: 6px;
    padding: 6px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}

.tt-suggestion {
    padding: 3px 20px;
    font-size: 14px;
    line-height: 16px;
}

.tt-suggestion.tt-cursor {
    color: #fff;
    background-color: #0097cf;
}

.tt-suggestion p {
    margin: 0;
}

.gist {
    font-size: 14px;
}
/* example specific styles */
/* ----------------------- */

#browsinghistory {height:250px;overflow-y: auto;padding-bottom: 0}
#browsinghistory ul{padding:0;list-style:none}
#browsinghistory li{padding:5px 15px}
#browsinghistory li:hover{background-color:#e9e9e9;cursor:pointer}
#browsinghistory li.hl{background-color:#b8cee6}
#browsinghistory li.hl:hover{cursor:auto}
#browsinghistory li.hl sup.verse-num{color:#000;font-family: Arial;}

#searchresults-main-heading, #searchresults-secondary-heading {text-align: center; font-weight: bold;padding-bottom: 5px;}
#searchresults-main-content {height:320px;overflow-y: auto;padding-bottom: 0}
#searchresults-main-content ul {padding:0;list-style:none}
#searchresults-main-content li {padding:5px 15px}
#searchresults-main-content li:hover{background-color:#e9e9e9;cursor:pointer}
#searchresults-main-content li.hl {background-color:#b8cee6}
#searchresults-main-content li.hl:hover{cursor:auto}
#searchresults-main-content li.hl sup.verse-num {color:#000;font-family: Arial;}

#searchresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#searchresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#searchresults-right span.hl{background-color:#b8cee6}
#searchresults-right span.hl:hover{cursor:auto}

::-webkit-scrollbar {
    -webkit-appearance: none;
}

::-webkit-scrollbar:vertical{
    width: 16px;
}

::-webkit-scrollbar:horizontal  {
    height: 16px;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white; 
    background-color: rgba(0, 0, 0, .5);
}

::-webkit-scrollbar-track { 
    background-color: #fff; 
    border-radius: 8px; 
} 

#topic-main-content, #topic-main-toc, #topic-verse-content {height:320px;overflow-y: auto;padding-bottom: 0}

#searchwordsresults-main-heading, #searchwordsresults-secondary-heading {text-align: center; font-weight: bold;padding-bottom: 5px;}
#searchwordsresults {height:320px;overflow-y: auto;padding-bottom: 0}
#searchwordsresults ul{padding:0;list-style:none}
#searchwordsresults li{padding:5px 15px}
#searchwordsresults li:hover{background-color:#e9e9e9;cursor:pointer}
#searchwordsresults li.hl{background-color:#b8cee6}
#searchwordsresults li.hl:hover{cursor:auto}
#searchwordsresults li.hl sup.verse-num{color:#000;font-family: Arial;}

#searchwordsresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#searchwordsresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#searchwordsresults-right span.hl{background-color:#b8cee6}
#searchwordsresults-right span.hl:hover{cursor:auto}

#searchwordsresults-history {height:320px;overflow-y: auto;padding-bottom: 0}
#searchwordsresults-history span:hover{background-color:#e9e9e9;cursor:pointer}
#searchwordsresults-history span.hl{background-color:#b8cee6}
#searchwordsresults-history span.hl:hover{cursor:auto}

#searchwordsresults-toc {height:320px;padding-bottom: 0}

@media only screen and (max-width: 400px) {
    #book-chap{
        padding-bottom: 10px !important;
    }
}

@font-face {
    font-family:'SBLregular';
    src:url("fonts/SBL_Hbrw.e31d1ed9c0bf.woff") format('woff'),
        url("fonts/SBL_Hbrw.dbf49ba8a07d.ttf") format('truetype');
        font-weight:normal;
        font-style:normal
}

@font-face {
    font-family:'SBLregularIE';
    src:url("fonts/SBL_Hbrw.e31d1ed9c0bf.woff") format('woff'),
    url("fonts/SBL_Hbrw.dbf49ba8a07d.ttf") format('truetype');
    font-weight:normal;
    font-style:normal;
    unicode-range:U+0590-05FF
}

@font-face {
    font-family:'SBLregularIE';
    src:local('Arial');
    font-weight:normal;
    font-style:normal;
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000
}

@font-face{
    font-family:'scheherazaderegular';
    src:url("fonts/scheherazaderegot-webfont.d2c84493b8e0.woff") format('woff'),
    url("fonts/scheherazaderegot-webfont.4987ad9b7e9c.ttf") format('truetype');
    font-weight:normal;
    font-style:normal;
    unicode-range:U+0600–06FF
}

.SBLregular {
    font-family: SBLregular, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 26px;
    /*line-height: 1.6;*/
}

.SBLregular_medium {
    font-family: SBLregular, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 20px;
}

.SBLregular_small {
    font-family: SBLregular, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 18px;
}
.SBLregular_xsmall {
    font-family: SBLregular, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 16px;
}

@font-face {
    font-family: 'Ezra SIL';
    src: url('fonts/SILEOT.eot'); /* IE9 Compat Modes */
    src: url('fonts/SILEOT.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/SILEOT.woff') format('woff'), /* Modern Browsers */
         url('fonts/SILEOT.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
    font-family: 'SBL Hebrew';
    src: url('fonts/SBL_Hbrw.eot'); /* IE9 Compat Modes */
    src: url('fonts/SBL_Hbrw.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/SBL_Hbrw.woff') format('woff'), /* Modern Browsers */
         url('fonts/SBL_Hbrw.ttf')  format('truetype'); /* Safari, Android, iOS */
}

@font-face {
    font-family: 'Ezra-SIL-SR';
    src:url('fonts/Ezra-SIL-SR.ttf.woff') format('woff'),
        url('fonts/Ezra-SIL-SR.ttf.svg#Ezra-SIL-SR') format('svg'),
        url('fonts/Ezra-SIL-SR.ttf.eot'),
        url('fonts/Ezra-SIL-SR.ttf.eot?#iefix') format('embedded-opentype'); 
        font-weight: normal;
        font-style: normal;
}
@font-face {
    font-family: 'Gentium';
    src:url('fonts/Gentium.ttf.woff') format('woff'),
        url('fonts/Gentium.ttf.svg#Gentium') format('svg'),
        url('fonts/Gentium.ttf.eot'),
        url('fonts/Gentium.ttf.eot?#iefix') format('embedded-opentype'); 
        font-weight: normal;
        font-style: normal;
}
.ezra {
    font-family: Ezra SIL, SBL Hebrew, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 22px;
    line-height: 1.6;
    }

.gentium {
    font-family: 'Gentium';
    font-size: 18px;
    }
.ezra_small {
    font-family: Ezra SIL, SBL Hebrew, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 14px;
    }

.gentium_small {
    font-family: 'Gentium';
    font-size: 14px;
    }
.ezra_medium {
    font-family: Ezra SIL, SBL Hebrew, Verdana, sans-serif;
    direction:rtl;
    text-align: right;
    font-size: 18px;
    }

.gentium_medium {
    font-family: 'Gentium';
    font-size: 16px;
    }
.creditshd1 {
    font-weight: bold;
    line-height: 30px;
    font-size: 16px;
    padding-top: 15px;
    display: block;
}
.creditshd2 {
    font-weight: bold;
    padding-top: 10px;
    line-height: 23px;
    font-size: 14px;
    display: block;
}
.creditshd3 {
    line-height: 23px;
    font-size: 12px;
}
.creditsdiv {
    height:450px;overflow-y: auto;padding-bottom: 0;
}

#syntaxsearch {  }
#syntaxsearch ul{padding:0;list-style:none}
#syntaxsearch li{padding:5px 15px}
#syntaxsearch li:hover{background-color:#e9e9e9;cursor:pointer}
#syntaxsearch li.hl{background-color:#b8cee6}
#syntaxsearch li.hl:hover{cursor:auto}
#syntaxsearch li.hl sup.verse-num{color:#000;font-family: Arial;}

.radio-group label{
    overflow: hidden;
}
.radio-group input{
    height: 1px;
    width: 1px;
    position: absolute;
    top: -20px;
}
.radio-group .not-active {
    color: #3276b1;
    background-color: #fff;
}
.typeahead:focus::-webkit-input-placeholder
{
    color:transparent;
}

#searchpeopleresults-passages {height:320px;overflow-y: auto;padding-bottom: 0}
#searchpeopleresults-passages ul{padding:0;list-style:none}
#searchpeopleresults-passages li{padding:5px 15px}
#searchpeopleresults-passages li:hover{background-color:#e9e9e9;cursor:pointer}
#searchpeopleresults-passages li.hl{background-color:#b8cee6}
#searchpeopleresults-passages li.hl:hover{cursor:auto}
#searchpeopleresults-passages li.hl sup.verse-num{color:#000; font-family: Arial;}

#searchpeopleresults-filter {height:320px;overflow-y: auto;padding-bottom: 0}
#searchpeopleresults-filter span:hover{background-color:#e9e9e9;cursor:pointer}
#searchpeopleresults-filter span.hl{background-color:#b8cee6}
#searchpeopleresults-filter span.hl:hover{cursor:auto}

#searchplacesresults-passages {height:320px;overflow-y: auto;padding-bottom: 0}
#searchplacesresults-passages ul{padding:0;list-style:none}
#searchplacesresults-passages li{padding:5px 15px}
#searchplacesresults-passages li:hover{background-color:#e9e9e9;cursor:pointer}
#searchplacesresults-passages li.hl{background-color:#b8cee6}
#searchplacesresults-passages li.hl:hover{cursor:auto}
#searchplacesresults-passages li.hl sup.verse-num{color:#000; font-family: Arial;}

#searchplacesresults-filter {height:320px;overflow-y: auto;padding-bottom: 0}
#searchplacesresults-filter span:hover{background-color:#e9e9e9;cursor:pointer}
#searchplacesresults-filter span.hl{background-color:#b8cee6}
#searchplacesresults-filter span.hl:hover{cursor:auto}

#searchlexemeresults {height:320px;overflow-y: auto;padding-bottom: 0}
#searchlexemeresults ul{padding:0;list-style:none}
#searchlexemeresults li{padding:5px 15px}
#searchlexemeresults li:hover{background-color:#e9e9e9;cursor:pointer}
#searchlexemeresults li.hl{background-color:#b8cee6}
#searchlexemeresults li.hl:hover{cursor:auto}
#searchlexemeresults li.hl sup.verse-num{color:#000; font-family: Arial;}

#searchlexemeresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#searchlexemeresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#searchlexemeresults-right span.hl{background-color:#b8cee6}
#searchlexemeresults-right span.hl:hover{cursor:auto}

#searchphraseresults {height:320px;overflow-y: auto;padding-bottom: 0}
#searchphraseresults ul{padding:0;list-style:none}
#searchphraseresults li{padding:5px 15px}
#searchphraseresults li:hover{background-color:#e9e9e9;cursor:pointer}
#searchphraseresults li.hl{background-color:#b8cee6}
#searchphraseresults li.hl:hover{cursor:auto}
#searchphraseresults li.hl sup.verse-num{color:#000; font-family: Arial;}

#searchphraseresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#searchphraseresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#searchphraseresults-right span.hl{background-color:#b8cee6}
#searchphraseresults-right span.hl:hover{cursor:auto}

#searchphrasecombresults {height:320px;overflow-y: auto;padding-bottom: 0}
#searchphrasecombresults ul{padding:0;list-style:none}
#searchphrasecombresults li{padding:5px 15px}
#searchphrasecombresults li:hover{background-color:#e9e9e9;cursor:pointer}
#searchphrasecombresults li.hl{background-color:#b8cee6}
#searchphrasecombresults li.hl:hover{cursor:auto}
#searchphrasecombresults li.hl sup.verse-num{color:#000;font-family: Arial;}

#searchphrasecombresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#searchphrasecombresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#searchphrasecombresults-right span.hl{background-color:#b8cee6}
#searchphrasecombresults-right span.hl:hover{cursor:auto}

#topic-verse-content {height:320px;overflow-y: auto;padding-bottom: 0}
#topic-verse-content ul{padding:0;list-style:none}
#topic-verse-content li{padding:5px 15px}
#topic-verse-content li:hover{background-color:#e9e9e9;cursor:pointer}
#topic-verse-content li.hl{background-color:#b8cee6}
#topic-verse-content li.hl:hover{cursor:auto}
#topic-verse-content li.hl sup.verse-num{color:#000; font-family: Arial;}

#reftablist a{color:#333; background: #eed593;}
#reftablist a.hl{color:#333; background: #f5f5f5; font-weight: bold;}

#versetablist a{color:#333; background: #afbdda;}
#versetablist a.hl{color:#333; background: #f5f5f5; font-weight: bold;}

.clipboardinput {
        display: block;
        width: 100%;
        padding: 10px;
        border: 1px solid #DDD;
        color: #666;
}
.notetitle {
        display: block;
        width: 100%;
        padding: 10px;
        border: 1px solid #DDD;
        color: #666;
}

.notecontent {
        width:100%;
        height:95%; 
        box-sizing: border-box;         /* For IE and modern versions of Chrome */
        -moz-box-sizing: border-box;    /* For Firefox                          */
        -webkit-box-sizing: border-box; /* For Safari                           */
}

.table-borderless > tbody > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > thead > tr > th {
    border: none;
}

#left-panel, #right-panel {
    border-top-color: #f5f5f5;
    border-radius: 0px;
    margin-bottom: 0px;
}

.lefttabbackcolor {
    background: #afbdda;

}

.righttabbackcolor {
    background: #eed593;
}

.badge {
    cursor: pointer;
}

#ref-title, #chap-title, #chap-title-sec {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
}

.hebrewgreekword:hover{
    background-color:#FBF5E8;cursor:pointer;
}
.hebrewgreekwordhl{
    background-color:#eed593;cursor:auto;
}
.hebrewgreekwordhl:hover{
    background-color:#FBF5E8;cursor:pointer;
}

.hebrewword:hover{
    background-color:#e0e0fa;cursor:pointer;
}
.hebrewwordhl{
    background-color:#ffe9ce;cursor:pointer;
}

.table-responsive {
    border: 0px;
}

.treeview-root {
  position:relative;
}
.treeview-root,
.treeview-root ul {                                 
  list-style-type: none;
  padding: 0px;
  margin: 0;
}
.treeview-root li {
  padding-left: 1.5em;
}
.treeview-root > li {
  padding-left: 10px;
}
.treeview-handle {
  display: block;
  float: left;
  width: 10px;
  height: 11px;
  position: absolute;
  margin-left: -20px;
}
.treeview-handle:before {
  content:'\f096';
  font-family: FontAwesome;
}
.treeview-collapsed {
  cursor: pointer;
}
.treeview-collapsed:before {
  content: '\f196';
  font-family: FontAwesome;
}
.treeview-expanded {
  cursor: pointer;
}
.treeview-expanded:before {
  content: '\f147';
  font-family: FontAwesome;
}
.btn {
	padding: 4px 8px;
}

.tile {  
  	width: 100%;
	display: inline-block;
	box-sizing: border-box;
	background: #fff;		
	padding: 8px;
	margin-bottom: 5px;
	color: #fff;
	background: #676767;
    border-radius: 5px;
  }
.title {
	margin-top: 0px;
}
.tile:hover {
	color: #fff;
	background: #333333;
}

.modal-body .note-editor.note-frame {
            border-radius: 0;
}
.panel {
    margin-bottom: 0;
}
.modal-body {
    padding: 0;
}

.texts_here {
	cursor: pointer;
}

.verselist-clip { width:calc(100% - 310px); display:inline-block; }

@media (max-width: 400px) {
    .verselist-clip { width:100%; display:inline-block; }
}

.alert-blackinfo{color:#fff;background-color:#333;border-color:#333}
.alert-blackinfo hr{border-top-color:#a6e1ec}
.alert-blackinfo .alert-link{color:#245269}

.btn-otbook{color:#000000;background-color:#e2e6ff;border-color:#ffffff}
.btn-otbook.active,.btn-otbook.focus,.btn-otbook:active,.btn-otbook:focus,.btn-otbook:hover,.open>.dropdown-toggle.btn-otbook{color:#000000;background-color:#c0c9ff;border-color:#ffffff}
.btn-otbooksel{color:#ffffff;background-color:#001176;border-color:#ffffff}
.btn-otbooksel.active,.btn-otbooksel.focus,.btn-otbooksel:active,.btn-otbooksel:focus,.btn-otbooksel:hover,.open>.dropdown-toggle.btn-otbooksel{color:#ffffff;background-color:#001176;border-color:#ffffff}

.btn-ntbook{color:#000000;background-color:#ffecde;border-color:#ffffff}
.btn-ntbook.active,.btn-ntbook.focus,.btn-ntbook:active,.btn-ntbook:focus,.btn-ntbook:hover,.open>.dropdown-toggle.btn-ntbook{color:#000000;background-color:#ffdcc1;border-color:#ffffff}
.btn-ntbooksel{color:#ffffff;background-color:#924000;border-color:#ffffff}
.btn-ntbooksel.active,.btn-ntbooksel.focus,.btn-ntbooksel:active,.btn-ntbooksel:focus,.btn-ntbooksel:hover,.open>.dropdown-toggle.btn-ntbooksel{color:#ffffff;background-color:#924000;border-color:#ffffff}

.btn-lxxbook{color:#000000;background-color:#deffe4;border-color:#ffffff}
.btn-lxxbook.active,.btn-lxxbook.focus,.btn-lxxbook:active,.btn-lxxbook:focus,.btn-lxxbook:hover,.open>.dropdown-toggle.btn-lxxbook{color:#000000;background-color:#9de0a9;border-color:#ffffff}
.btn-lxxbooksel{color:#ffffff;background-color:#268537;border-color:#ffffff}
.btn-lxxbooksel.active,.btn-lxxbooksel.focus,.btn-lxxbooksel:active,.btn-lxxbooksel:focus,.btn-lxxbooksel:hover,.open>.dropdown-toggle.btn-lxxbooksel{color:#ffffff;background-color:#268537;border-color:#ffffff}

.btn-chapter{color:#000000;background-color:#e8c6e2;border-color:#ffffff}
.btn-chapter.active,.btn-chapter.focus,.btn-chapter:active,.btn-chapter:focus,.btn-chapter:hover,.open>.dropdown-toggle.btn-chapter{color:#000000;background-color:#f898e7;border-color:#ffffff}
.btn-chaptersel{color:#ffffff;background-color:#70005c;border-color:#ffffff}
.btn-chaptersel.active,.btn-chaptersel.focus,.btn-chaptersel:active,.btn-chaptersel:focus,.btn-chaptersel:hover,.open>.dropdown-toggle.btn-chaptersel{color:#ffffff;background-color:#70005c;border-color:#ffffff}

.btn-verse{color:#000000;background-color:#e8e6c8;border-color:#ffffff}
.btn-verse.active,.btn-verse.focus,.btn-verse:active,.btn-verse:focus,.btn-verse:hover,.open>.dropdown-toggle.btn-verse{color:#000000;background-color:#e1db81;border-color:#ffffff}
.btn-versesel{color:#ffffff;background-color:#4b4700;border-color:#ffffff}
.btn-versesel.active,.btn-versesel.focus,.btn-versesel:active,.btn-versesel:focus,.btn-versesel:hover,.open>.dropdown-toggle.btn-versesel{color:#ffffff;background-color:#4b4700;border-color:#ffffff}


.link {
    fill: none;
    stroke: #3A3B37;
}
.sibling {
    fill: none;
    stroke: #3A3B37;
}

.border {
    fill: none;
    shape-rendering: crispEdges;
    stroke: #aaa;
}
.hyper {
    text-decoration: none;
}

.hyper:hover {
    text-decoration: none;
    cursor:pointer;
}

#right-panel #ref-content .list{
    float: left;
    
    white-space: nowrap;
    
    margin-left: 7px;
    margin-top: 7px;
    margin-bottom: 7px;
    font-size: 14px;
}

#right-panel #ref-content .list .list-title{
    font-weight: bold;
}

#right-panel #ref-content .list:hover{background-color:#FBF5E8;cursor:pointer}
#right-panel #ref-content .list.hl{background-color:#eed593}
#right-panel #ref-content .list.hl:hover{cursor:auto}

#right-panel #ref-content .list-rows:hover{background-color:#e9e9e9;cursor:pointer;overflow-y: hidden;}
#right-panel #ref-content .list-rows.hl{background-color:#b8cee6;overflow-y: hidden;}
#right-panel #ref-content .list-rows.hl:hover{cursor:auto;overflow-y: hidden;}

.engtoheb {
    background:url(Hebrew.png) left top; 
   width:20px; 
   height:21px;
   margin:5px;
   display: block;
   float: left;
   background-size: 20px 21px;
}
.engtogreek {
    background:url(Greek.png) left top; 
   width:20px; 
   height:21px;
   margin:5px;
   display: block;
   float: left;
   background-size: 20px 21px;
}
.orgtoeng {
    background:url(English.png) left top; 
   width:20px; 
   height:21px;
   margin:5px;
   display: block;
   float: left;
   background-size: 20px 21px;
}
.orgtochn {
    background:url(Chinese.png) left top; 
   width:20px; 
   height:21px;
   margin:5px;
   display: block;
   float: left;
   background-size: 20px 21px;
}
.orgtokor {
    background:url(Korean.png) left top; 
   width:20px; 
   height:21px;
   margin:5px;
   display: block;
   float: left;
   background-size: 20px 21px;
}
#div_mynotes ul{padding:0;list-style:none}
#div_mynotes li{padding:5px 15px}
#div_mynotes li:hover{background-color:#e9e9e9;cursor:pointer}
#div_mynotes li.hl{background-color:#b8cee6}
#div_mynotes li.hl:hover{cursor:auto}

#div_communitynotes ul{padding:0;list-style:none}
#div_communitynotes li{padding:5px 15px}
#div_communitynotes li:hover{background-color:#e9e9e9;cursor:pointer}
#div_communitynotes li.hl{background-color:#b8cee6}
#div_communitynotes li.hl:hover{cursor:auto}

#div_groupnotes ul{padding:0;list-style:none}
#div_groupnotes li{padding:5px 15px}
#div_groupnotes li:hover{background-color:#e9e9e9;cursor:pointer}
#div_groupnotes li.hl{background-color:#b8cee6}
#div_groupnotes li.hl:hover{cursor:auto}

#bug_div2 ul.chat
{
    list-style: none;
    margin: 0;
    padding: 0;
}

#bug_div2 ul.chat li
{
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px dotted #B3A9A9;
}

#bug_div2 ul.chat li.left .chat-body
{
    margin-left: 60px;
}

#bug_div2 ul.chat li.right .chat-body
{
    margin-right: 60px;
}


#bug_div2 ul.chat li .chat-body p
{
    margin: 0;
    color: #777777;
}

#bug_div2 div.panel .slidedown .glyphicon, .chat .glyphicon
{
    margin-right: 5px;
}

#bug_div2 div.panel-body
{
    overflow-y: scroll;
    height: 250px;
}

img.screenshot {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
img.screenshot:hover {opacity: 0.7;}

#notesearchresults-main-heading, #notesearchresults-secondary-heading {text-align: center; font-weight: bold;padding-bottom: 5px;}
#notesearchresults-main-content {height:320px;overflow-y: auto;padding-bottom: 0}
#notesearchresults-main-content ul {padding:0;list-style:none}
#notesearchresults-main-content li {padding:5px 15px}
#notesearchresults-main-content li:hover{background-color:#e9e9e9;cursor:pointer}
#notesearchresults-main-content li.hl {background-color:#b8cee6}
#notesearchresults-main-content li.hl:hover{cursor:auto}
#notesearchresults-main-content li.hl sup.verse-num {color:#000;font-family: Arial;}

#notesearchresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#notesearchresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#notesearchresults-right span.hl{background-color:#b8cee6}
#notesearchresults-right span.hl:hover{cursor:auto}

sup.bsg-ref {
    cursor: pointer;
    color: #337ab7;
}

.right-pane-heading1 {
    color: #337ab7;
    font-weight: bold;
    font-size: 16px;
}

.right-pane-heading2 {
    color: #888;
    font-weight: bold;
    font-size: 14px;
}

.right-pane-heading3 {
    font-weight: bold;
}

.noteheading_version {
    font-weight: bold;
}
.noteheading_title {
    color: #888;
    font-weight: bold;
    font-size: 14px;
}

#div_guide_lesson_related li.uhl:hover{background-color:#e9e9e9;cursor:pointer}
#div_guide_lesson_related li.hl {background-color:#b8cee6}
#div_guide_lesson_related li.hl:hover{cursor:auto}

ul.dots * {
  /* disable border-box from bootstrap */
  box-sizing: content-box;
  list-style-type: none;  
}
ul.dots li {
  display: box;
  position: relative;
  width: 100%;
  padding: 5px 0px 0px 0px;
}
ul.dots li span {
  padding: 5px 0px 0px 15px;
  margin: 0 auto;
  text-align: center;
  position: relative;
}

ul.maindots li mark {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;   
  width: 10px;
  height: 10px;  
  background-color: #F00;
  position: absolute;
  top: 15px;
  font-size: 10px;
  line-height: 10px;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  color: #FFF;
  font-weight: 700;
}

ul.dots li mark {
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;   
  border: 2px solid #FFF;
  width: 15px;
  height: 15px;  
  background-color: #FF6B6B;
  position: absolute;
  top: -5px;
  left: -10px;
  font-size: 10px;
  line-height: 15px;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  color: #FFF;
  font-weight: 700;
}

ul.dots li mark.big {
  width: 30px;
  height: 30px;  
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  line-height: 30px;  
  font-size: 16px;  
  top: -10px;
  left: -15px;
}
ul.dots li mark.green {
  background-color: #27ae60;
}
ul.dots li mark.blue {
  background-color: #3498db;
}
ul.dots > li > a > span > mark {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-transform-origin: center bottom;
      -ms-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;   
-webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;  
}
ul.dots > li:hover > a > span > mark {
  -webkit-animation-name: bounce;
          animation-name: bounce;
}
ul.dots > li:hover > a > span > mark.rubberBand {
  -webkit-animation-name: rubberBand;
          animation-name: rubberBand;
}

ul.dots > li:hover > a > span > mark.swing {
  -webkit-transform-origin: top center;
      -ms-transform-origin: top center;
          transform-origin: top center;
  -webkit-animation-name: swing;
          animation-name: swing;
}
ul.dots > li:hover > a > span > mark.tada {
  -webkit-animation-name: tada;
          animation-name: tada;
}
ul.dots > li:hover > a > span > mark.wobble {
  -webkit-animation-name: wobble;
          animation-name: wobble;
}

div.wordfrq_verselist {
    font-size: 14px;
    font-weight: normal;
    min-height: 40px;
    max-height: 120px;
    overflow-y: auto;
}

div.wordfrq_verselist ul{padding:0;list-style:none;margin-top: 5px;margin-bottom: 0px;}
div.wordfrq_verselist li{padding:5px 15px}
div.wordfrq_verselist li:hover{background-color:#e9e9e9;cursor:pointer}
div.wordfrq_verselist li.hl{background-color:#b8cee6}
div.wordfrq_verselist li.hl:hover{cursor:auto}
div.wordfrq_verselist li.hl sup.verse-num{color:#000;font-family: Arial;}

/* animation keyframes */
@-webkit-keyframes bounce {
  0%, 20%, 53%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
            transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
            transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
            transform: translate3d(0,-4px,0);
  }
}

@keyframes bounce {
  0%, 20%, 53%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
            transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
            transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
            transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
            transform: translate3d(0,-4px,0);
  }
}

@-webkit-keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
            transform: scale3d(.97, .97, .97);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  0%, 20%, 40%, 60%, 80%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 1;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
            transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
            transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
            transform: scale3d(.97, .97, .97);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@-webkit-keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
            transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
            transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
            transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
            transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
            transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
            transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
            transform: scale3d(1.05, .95, 1);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
            transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
            transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
            transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
            transform: rotate3d(0, 0, 1, -5deg);
  }

  100% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
            transform: rotate3d(0, 0, 1, 0deg);
  }
}

@-webkit-keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: none;
            transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: none;
            transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
            transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
            transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
            transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
            transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
            transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 320px) {
/* Styles */
    .wordfrqcontainer {
        width:100%;
        -moz-column-count: 1;
        -moz-column-gap: 5px;
        -webkit-column-count: 1;
        -webkit-column-gap: 5px;
        column-count: 1;
        column-gap: 5px;
    }

    .wordfrqcontainer div.thumb {
        display: block;
        width: 100%;
        margin:0 0 5px;
    }
}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 768px) {
/* Styles */
    .wordfrqcontainer {
        width:100%;
        -moz-column-count: 2;
        -moz-column-gap: 10px;
        -webkit-column-count: 2;
        -webkit-column-gap: 10px;
        column-count: 2;
        column-gap: 10px;
    }

    .wordfrqcontainer div.thumb {
        display: block;
        width: 100%;
        margin:0 0 10px;
    }
}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1024px) {
/* Styles */
    .wordfrqcontainer {
        width:100%;
        -moz-column-count: 3;
        -moz-column-gap: 10px;
        -webkit-column-count: 3;
        -webkit-column-gap: 10px;
        column-count: 3;
        column-gap: 10px;
    }

    .wordfrqcontainer div.thumb {
        display: block;
        width: 100%;
        margin:0 0 10px;
    }
}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
/* Styles */
    .wordfrqcontainer {
        width:100%;
        -moz-column-count: 4;
        -moz-column-gap: 10px;
        -webkit-column-count: 4;
        -webkit-column-gap: 10px;
        column-count: 4;
        column-gap: 10px;
    }

    .wordfrqcontainer div.thumb {
        display: block;
        width: 100%;
       margin:0 0 10px;
    }
}

.checkmarkonly input[type=checkbox] {
    visibility: hidden;
}
.checkmarkonly {
    
    position: relative;
}
/**
 * Create the box for the checkbox
 */
.checkmarkonly label {
    cursor: pointer;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 3px;
    left: 0;
}

/**
 * Display the tick inside the checkbox
 */
.checkmarkonly label:after {
    opacity: 0.2;
    content: '';
    position: absolute;
    width: 9px;
    height: 5px;
    background: transparent;
    top: 6px;
    left: 7px;
    border: 3px solid #333;
    border-top: none;
    border-right: none;

    transform: rotate(-45deg);
}

/**
 * Create the hover event of the tick
 */
.checkmarkonly label:hover::after {
    opacity: 0.5;
}

/**
 * Create the checkbox state for the tick
 */
.checkmarkonly input[type=checkbox]:checked + label:after {
    opacity: 1;
}

.dynamicdivfrq {
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: 5px;
    padding-left: 15px;
    display: block;
    min-width: 120px;
}

.lecturedemorowdiv {
    padding:5px;
    margin:0px;
    -webkit-transition:background 2s;
    -moz-transition:background 2s;
    -o-transition:background 2s;
    transition:background 2s;
}

.tutorialword:hover{
    background-color:#e7eff9;cursor:pointer;
}
.tutorialwordhl{
    background-color:#b8cee6;cursor:auto;
}

#syntaxsearchreportresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#syntaxsearchreportresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#syntaxsearchreportresults-right span.hl{background-color:#b8cee6}
#syntaxsearchreportresults-right span.hl:hover{cursor:auto}

#nsyntaxsearchreportresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#nsyntaxsearchreportresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#nsyntaxsearchreportresults-right span.hl{background-color:#b8cee6}
#nsyntaxsearchreportresults-right span.hl:hover{cursor:auto}

.cgicon {
    background:url(sgicon.png) left top; 
   width:20px; 
   height:21px;
   margin-top: 7px;
   margin-left: 5px;
   margin-right: 5px;
   display: block;
   float: left;
   background-size: 20px 21px;
}

.hintsdiv {
    height:200px;margin-top:10px;overflow: hidden;padding-bottom: 0;
}
.hintstextdiv {
    line-height: 30px;
    font-size: 18px;
    padding: 5px;
    display: block;
    height: 125px;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

.hintstextdiv::-webkit-scrollbar {
    -webkit-appearance: none;
}

.hintstextdiv::-webkit-scrollbar:vertical{
    width: 16px;
}

.hintstextdiv::-webkit-scrollbar:horizontal  {
    height: 16px;
}

.hintstextdiv::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid #4d4d4d; 
    background-color: #777;
}

.hintstextdiv::-webkit-scrollbar-track { 
    background-color: #4d4d4d; 
    border-radius: 8px; 
} 

.hintscarouseldiv {
    padding: 0px;
    display: block;
    height: 35px;
    width: 100%;
    max-width: 100%;
}

.dropdown-subitem-a-icon {
    font-size: 20px;
    padding-right: 10px;
    color: #428bca;
}

.dropdown-subitem-a-text {
    font-size: 14px;
    position: relative;
    bottom: 4px;
}

.biblepane-menu-a-icon {
    margin-left: 10px;
    font-size: 20px;
    margin-top:4px;
}
.sortsyntax {
    background: url(sortsyntax.png) left top;
    width: 18px;
    height: 18px;
    top: 1px;
    display: inline-block;
    position: relative;
    background-size: 18px 18px;
}

#searchwordsresults .exp {
    letter-spacing: 1px;
    font-weight:bold;
}
#searchwordsresults .noidt{
    margin-left:0.5em;
    letter-spacing: 1px;
    text-indent:-0.5em;
}
#searchwordsresults .idt{
    margin-left:2em;
    text-indent:-1em;
}

#searchwordsresults .fn{
    display: block;
    font-size:smaller;
}

#topic-main-content li {
    line-height: 1.4em;
    height: auto;
    margin-top: 3px;
}

#mediacontents a {
    text-decoration: none;
}

#mediacontents h1 {
    margin: 0.67em 0 0.2em 0;
    font-size: 16px;
    font-weight: bold;
}

#mediacontents h1 a {
    font-size: 16px;
    font-weight: bold;
}

#mediacontents h2 {
    margin: 0.2em 0 0.2em 0;
}


#mediacontents h2 a {
    font-size: 15px;
    color: black;
    font-weight: bold;
}

#mediacontents h3 {
    margin: 0.2em 0 0.2em 0;
}


#mediacontents h3 a {
    font-size: 15px;
    color: grey;
    font-weight: bold;
}

#mediacontents h4 {
    margin: 0.2em 0 0.2em 0;
}


#mediacontents h4 a {
    font-size: 14px;
    color: black;
    font-weight: bold;
}

#mediacontents h5 {
    margin: 0.2em 0 0.2em 0;
}


#mediacontents h5 a {
    font-size: 14px;
    color: grey;
    font-weight: bold;
}

.maprouteblack{
    content:url("route.jpg");
}

.maproutegrey{
    content:url("route_grey.jpg");
}

.spanhighlight {
    background:#acf4c4;
}

#map_routes > li{
    
}
#map_routes > li:hover{
    cursor:pointer;
    
}
#map_routes > li.selected{
    background: #b8cee6;
}

#map_routes > li.selected:hover{
    cursor:pointer;
    
}

.popupfullscreenwrapper {
    margin: 0px !important;
    top: 0px !important;
    left: 0px !important;
    width: 100% !important;
    height: 100% !important;
}

.popupfullscreencontainer {
    height: 100% !important;
}

.popupfullscreensubcontainer {
    width: 100% !important;
    height: 90% !important;
    max-height: 90% !important;
}

ul.dash {
    list-style: none;
    margin-left: 0;
    padding-left: 1em;
}
ul.dash > li:before {
    display: inline-block;
    content: "-";
    width: 1em;
    margin-left: -1em;
}

div.remnote {
    padding:0px;
    margin:0px;
    
    white-space: nowrap;
}

.jbox-title-maxbutton {
    color: #999;
}

.jbox-title-maxbutton:hover
{
    color: #777;
    cursor:pointer;
}

.fullscreen {
    background:url("full-screen.png") left top; 
   width:12px; 
   height:12px;
   display: inline;
   margin-top:3px;
   background-size: 12px 12px;
}

.blackbutton {
    color: #fff;
    background-color: #666;
    border-color: #555;
}

.blackbutton-not-active {
    color: #666;
    background-color: #fff;
    border-color: #555;
}

#nsearchresults-main-heading, #nsearchresults-secondary-heading {text-align: center; font-weight: bold;padding-bottom: 5px;}
#nsearchresults-main-content {height:320px;overflow-y: auto;padding-bottom: 0}
#nsearchresults-main-content ul {padding:0;list-style:none}
#nsearchresults-main-content li {padding:5px 15px}
#nsearchresults-main-content li:hover{background-color:#e9e9e9;cursor:pointer}
#nsearchresults-main-content li.hl {background-color:#b8cee6}
#nsearchresults-main-content li.hl:hover{cursor:auto}
#nsearchresults-main-content li.hl sup.verse-num {color:#000;font-family: Arial;}

#nsearchresults-right {height:320px;overflow-y: auto;padding-bottom: 0}
#nsearchresults-right span:hover{background-color:#e9e9e9;cursor:pointer}
#nsearchresults-right span.hl{background-color:#b8cee6}
#nsearchresults-right span.hl:hover{cursor:auto}

#nsearchresults-history {height:320px;overflow-y: auto;padding-bottom: 0}
#nsearchresults-history span:hover{background-color:#e9e9e9;cursor:pointer}
#nsearchresults-history span.hl{background-color:#b8cee6}
#nsearchresults-history span.hl:hover{cursor:auto}

#nsearchresults-toc {height:320px;padding-bottom: 0}

.biblepane-main {
    border: dashed rgb(184, 206, 230);
}

.two-columns {
    -webkit-column-count: 2;
      -moz-column-count: 2;
           column-count: 2;
    overflow: hidden;
}

.one-column {
    overflow-y:auto;
}

*:fullscreen, *:-webkit-full-screen, *:-moz-full-screen {
    background-color: rgba(255,255,255,0);
}

::backdrop
{
    background-color: white;
}

.fullscreen-menu-a-icon {
    font-size: 40px;
}

.fullscreen-padding {
    padding: 40px;
}

.fullscreen-controls-left {
    position: fixed;
    left: 30px;
    bottom: 50%;
    transform: translate(-50%, -50%);
    margin: 0 auto;
}

.fullscreen-controls-top {
    position: fixed;
    left: 50%;
    top: 30px;
    transform: translate(-50%, -50%);
    margin: 0 auto;
}

.fullscreen-controls-right {
    position: fixed;
    right: 10px;
    bottom: 50%;
    transform: translate(-50%, -50%);
    margin: 0 auto;
}

.fullscreen-controls-bottom-right {
    position: fixed;
    right: 10px;
    bottom: 10px;
    transform: translate(-50%, -50%);
    margin: 0 auto;
    font-size: 30px;
}

a[data-view] i{margin-right:5px}

.commentaryth {
    white-space: pre-wrap;
    word-break: break-word;
    padding: 7px 9px;
    background-color: #EDECE9;
    line-height: 20px;
    vertical-align: top;
}

.commentarytd {
    white-space: pre-wrap;
    word-break: break-word;
    padding: 7px 9px;
    line-height: 20px;
    vertical-align: top;
}

.commentaryquote {
    border-left: 3px solid currentcolor;
    padding-left: 14px;
    padding-right: 14px;
}

.commentarytoggle {
    list-style: circle;
    padding-bottom: 5px;
    padding-top: 5px;
}

li.commentarytoggle::marker {
  content: "\f0d7"; /* FontAwesome Unicode */
  font-family: FontAwesome;
}

.commentaryul {
    padding-left:15px;
    padding-top:5px;
    list-style:none;
}

.commentaryli {
    /*padding-left:10px;*/
    list-style: circle;
    padding-bottom: 5px;
    padding-top: 5px;
}

.commentaryimg {
    display: block;
    object-fit: cover;
    border-radius: 1px;
    pointer-events: auto;
    width: 320px;
    border: 0;
}
.commentaryimgcaption {
    max-width: 320px;
    width: 320px;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 14px;
    line-height: 1.4;
    color: rgba(55, 53, 47, 0.65);
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 2px;
    display: block;
}

.wrapper-dropdown-3 {
    /* Size and position */
    position: relative;
    width: 360px;
    /*margin: 0 auto;*/
    /*padding: 10px;*/
    padding-left:7px;
    /* Styles */
    background: #fff;
    /*border-radius: 7px;
    border: 1px solid rgba(0,0,0,0.15);
    box-shadow: 0 1px 1px rgba(50,50,50,0.1);*/
    cursor: pointer;
    outline: none;

    /* Font settings */
    /*font-weight: bold;
    color: #8AA8BD;*/
}

.wrapper-dropdown-3:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    /*right: 15px;*/
    top: 50%;
    margin-top: -3px;
    border-width: 6px 6px 0 6px;
    border-style: solid;
    border-color: #000000 transparent;
}

.wrapper-dropdown-3 .dropdown {
  /* Size & position */
    position: absolute;
    top: 30px;
    left: 0;
    right: 0;

    /* Styles */
    background: white;
    border-radius: 5px;
    border: 1px solid rgba(0,0,0,0.17);
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
    font-weight: normal;
    transition: all 0.5s ease-in;
    list-style: none;

    /* Hiding */
    opacity: 0;
    pointer-events: none;
    padding-inline-start: 0px;
}

.wrapper-dropdown-3 .dropdown li a {
    font-size: 14px;
    display: block;
    padding: 8px;
    padding-left: 20px;
    text-decoration: none;
    color: #7f7f7f;
    border-bottom: 1px solid #e6e8ea;
    box-shadow: inset 0 1px 0 rgba(255,255,255,1);
    transition: all 0.3s ease-out;
}

.wrapper-dropdown-3 .dropdown li i {
    float: right;
    color: inherit;
}

.wrapper-dropdown-3 .dropdown li:first-of-type a {
    border-radius: 7px 7px 0 0;
}

.wrapper-dropdown-3 .dropdown li:last-of-type a {
    border-radius: 0 0 7px 7px;
    border: none;
}

/* Hover state */

.wrapper-dropdown-3 .dropdown li:hover a {
    /*background: #f3f8f8;*/
    color: #000;
}

.wrapper-dropdown-3 .dropdown:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 15px;
    /*border-width: 0 6px 6px 6px;
    border-style: solid;
    border-color: #fff transparent;    */
}

.wrapper-dropdown-3 .dropdown:before {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 100%;
    right: 13px;
    /*border-width: 0 8px 8px 8px;
    border-style: solid;
    border-color: rgba(0,0,0,0.1) transparent;    */
}

.wrapper-dropdown-3.active .dropdown {
    opacity: 1;
    pointer-events: auto;
}

#nsearch-showhidedetails {
        opacity: 0;
}
#checkmark-nsearch-showhidedetails {
    width: 20px;
    position: absolute;
    left: 5px;
    top: 5px;
    opacity: 0;
}
#checkmark-nsearch-showhidedetails.checked {
    opacity: 1;
}