#modal_myjbjs_settings > .modal-content > .body {
    height: 300px;
    overflow-y: auto;
}

#modal_myjbjs_settings.desktop > .modal-content {
    width: 550px;
}

#modal_myjbjs_settings.desktop > .modal-content > .body {
    padding: 0 2em 2em;
}

#modal_myjbjs_settings.mobile > .modal-content {
    width: 100%;
}

#modal_myjbjs_settings.mobile > .modal-content > .body {
    padding: 0 1em 1em;
}

#modal_myjbjs_settings.mobile > .modal-content > .subhead > .item {
    padding: 0 1em;
}

#modal_myjbjs_settings.mobile > .modal-content > .body > table {
    margin: 0 auto;
}

#modal_myjbjs_settings > .modal-content > .body > .databox + .databox {
    margin-top: 2em;
}

#modal_myjbjs_settings > .modal-content > .body .databox > .databox {
    margin-left: 1em;
}

#modal_myjbjs_settings > .modal-content > .body .databox .text {
    font-size: 14px;
    font-weight: 400;
}

#modal_myjbjs_settings > .modal-content > .body > .databox > .header {
    margin: .5em 0;
    font-size: 16px;
    font-weight: 600;
}

#modal_myjbjs_settings > .modal-content > .body > .databox > .databox > .header {
    margin: .5em 0;
    font-size: 15px;
    font-weight: 600;
}

#modal_myjbjs_settings > .modal-content > .body > .databox > .databox > .databox > .header {
    margin: .5em 0;
    font-size: 14px;
    font-weight: 600;
}

#modal_myjbjs_settings > .modal-content > .body .databox > .body {
	padding: 0;
	font-size: 14px;
}

#modal_myjbjs_settings > .modal-content > .body .databox > .header.query_list {
    margin-left : 1em;
}

#modal_myjbjs_settings > .modal-content > .body .databox > ul[name = "search_queries"] {
    list-style-type : none;
    margin          : 0 0 0 0.5em;
    padding         : 0;
}

#modal_myjbjs_settings > .modal-content > .body .databox ul[name = "search_queries"] > li {
    margin-top : 4px;
}

#modal_myjbjs_settings > .modal-content > .body .databox ul[name = "search_queries"] > li > span {
    font-size       : 1.5em; 
    vertical-align  : top; 
    cursor          : pointer;
    margin-right    : 1em;
}

#modal_myjbjs_settings > .modal-content > .body .databox ul[name = "search_queries"] > li > div {
    display : inline-block;
    margin-top : 0.2em;
    width : calc(100% - 2.5em);
}

#modal_myjbjs_settings > .modal-content > .body .databox input[type="checkbox"] {
    min-width       : 1.2em; 
    min-height      : 1.2em; 
    vertical-align  : middle;
}

#modal_myjbjs_settings > .modal-content > .body.search input[type="checkbox"] {
    margin-left     : 0; 
    margin-right    : 0.5em; 
}

#modal_myjbjs_settings > .modal-content > .body .databox label {
    vertical-align  : middle;
}

#modal_myjbjs_settings > .modal-content > .body .journal.input_box label {
    display: flex;
}

#modal_myjbjs_settings > .modal-content > .body .checkbox {
    margin : 0.5em 0 0.5em 0;
}

#modal_myjbjs_settings > .modal-content > .body .checkbox > div {
    margin-left : 2em;
}

@media (orientation: landscape) and (max-height:500px) {
	#modal_myjbjs_settings.mobile > .modal-content {
		width: 80%;
		top: 0;
    	left: 0;
		right: 0;
    	margin: 0 auto;
    	transform: inherit;
    }

	#modal_myjbjs_settings.mobile > .modal-content > .body {
	    height: 200px;
	}
}

@media (min-height:768px) {
	#modal_myjbjs_settings > .modal-content > .body {
    	height: 400px;
    }
}

@media (orientation: portrait) and (min-width:550px) {
	#modal_myjbjs_settings.mobile > .modal-content {
		width: 550px;
	    left: 0;
	    right: 0;
	    margin: 0 auto;
	    transform: inherit;
	    transform: translateY(-50%);
	}
}

.modal-content > div.footer > * {
    display : inline-block; 
}

.modal-content > div.footer > div:not(.button) {
    width : 1em; 
}

/* dropdown styles */
.dropdown {
	position: relative;
    display: inline-block;
}

.dropdown.opened {
    background-color: #575757;
}

.dropdown.opened > .title {
    padding: 2px 6px 1px;
}

.dropdown > .title {
	padding: 2px 6px 4px;
	white-space: nowrap;
    cursor: pointer;
}

.dropdown > .title > .content > .title-exclude {
    display: none;
}

.dropdown > .title > .content > * {
    vertical-align: middle;
}

.dropdown > .title > .content > * + * {
    margin-left: 6px;
}

.dropdown > .title > .sign {
    display: inline-block;
    margin-left: 6px;
    transform: scale(0.7, 1) translateY(25%);
}

.dropdown.opened > .title > .sign {
    padding-bottom: 3px;
    transform: scale(0.7, 1) rotate(180deg) translateY(25%);
}

.dropdown > .items {
    position: absolute;
    left: 0;
    margin-top: -1px;
    min-width: 100%;
    display: none;
    background-color: inherit;
    color: white;
    box-sizing: border-box;
    z-index: 1;
    font-size: .9em;
}

.dropdown.opened > .items {
    display: block;
}

.dropdown > .items > .item {
    white-space: nowrap;
    padding: 4px 6px;
    cursor: pointer;
}

.dropdown > .items > .item + .item {
    margin-top: -3px;
}

.dropdown > .items > .item.selected {
    background-color: #757575;
    cursor: default;
}

.dropdown > .items > .item > * {
    vertical-align: middle;
}

.dropdown > .items > .item > * + * {
    margin-left: 6px;
}

.topic_item {
    display: inline-block;
	margin-bottom: .5em;
	vertical-align: top;
    width: 10em;
}

.topic_item > * {
	display: table-cell;
}

#prompt_receive_alerts > .modal-content {
    background-color: #4F4F4F;
}

#prompt_receive_alerts.desktop > .modal-content {
    width: 400px;
}

#prompt_receive_alerts.mobile > .modal-content {
    width: 80%;
}

@media (max-width: 360px) {
    #prompt_receive_alerts.mobile > .modal-content {
        width: 100%;
    }
}

@media (max-height: 500px) and (orientation: landscape) {
    #prompt_receive_alerts.mobile > .modal-content {
        width: 400px;
    }
}

@media (orientation: portrait) and (min-width:550px) {
    #prompt_receive_alerts.mobile > .modal-content {
        width: 400px;
    }
}

#prompt_receive_alerts > .modal-content > .body {
    padding: 1em 1em 0;
    text-align: center;
}

#prompt_receive_alerts > .modal-content > .footer {
    padding: 1em;
    border: 0;
    text-align: center;
}

#setting_button_box {
    white-space : nowrap;
}

#setting_button_box > div {
    margin-left : 10%;
}

#setting_button_box > div:first-child {
    margin-left : 0;
}

#setting_selector_popup {
    position:absolute;
    display:inline-block;
    border: 1px solid lightgray;
    box-shadow: 4px 4px 4px lightgray;
    background-color: white;
    z-index: 1000;
}

#setting_selector_popup > .settingitem {
    margin      : 0.8em 2em 0.8em 1em;
    display     : block;
    white-space : nowrap;
}

#setting_selector_popup > .hseparator {
    margin     : 0;
    padding    : 0;
    display    : block; 
    width      : 100%; 
    border-top : 1px #d0d3d4 solid;
}