.highlight{background: #f9f2f4;padding: 12px;border: 1px solid #e3a8a8;}
.font-preview {border: 1px solid #ddd;padding: 12px; }
.output-file{font-size: 11px; border: 1px solid #FAEFD9;padding: 6px;font-style: oblique;background:#FAEFD9;margin:0}
.example-code{font-size: 11px; border: 1px solid #EEEEEE;padding: 6px;font-style: oblique;background:#EEEEEE}
.example-code pre{padding:6px}
.box-header small{padding-left: 6px;}
.notice {padding: 12px; margin-bottom: 12px;margin-top: 12px;}
.notice-danger {border: 3px dashed red;}

.btn-lang {padding-left: 2px !important; padding-right: 2px !important;}
.btn-lang img{border: 1px solid #fff;}

.panel-group .panel {margin-bottom: 0;border-radius: 0 !important;}
.panel-heading {border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;}

.info-box-desc{font-size: 12px !important;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} 
.info-box-text { font-size: 18px !important; font-weight: 600;}
.info-box-text em { font-size: 10px !important;text-transform: none !important;}
.small-box .icon {top: 0px;}
.callout-default{background: #fafafa; color: #222;border-left: 5px solid #ddd;}
.callout-default a{color: #222 !important;font-weight: 600;}

.content-header h1{font-weight: 600;font-family: 'Arial Narrow';font-size: 32px;font-family: 'FjallaOne';}
.well h1{font-weight: 600;font-family: 'Arial Narrow';font-size: 48px;font-family: 'FjallaOne';}
p.lead {font-family: 'PTSans';}

.icon-preview{background: url('../../../../templates/default/assets/img/bg.png');}
.icon-generator-box {height:100%;max-height:320px;overflow-y:scroll !important; overflow-x: hidden;}
.icon-generator-box .icon-generator-list:hover {background:#ddd; cursor: pointer; outline: none; }
.icon-generator-box .icon-generator-link {font-size:26px !important;display:inline-block;width:100%;vertical-align:central;text-align:center;outline:none;}
.icon-active  { background: #ccc;}
.img-preview{width: 192px;height: 192px;background: transparent;}      
.panel-title a{outline:none;}
.baseline {vertical-align: baseline !important;}
.icon-24{font-size: 24px !important; vertical-align: central; text-align: center; }
.icon-32{font-size: 32px !important;}
.icon-48{font-size: 48px !important;}

@keyframes blink {0% {opacity: 0} 49%{opacity: 0}50% {opacity: 1}}
.blink{animation: blink 1s infinite;}
.iframe{background: #ddd;border:1px solid #333}
.table-column td,.table-column th { border: 0 !important}
.table-column .mod-info{min-height: 100px;}
.vcenter {vertical-align: middle !important;}
#backend-column th{font-size: 12px;font-weight: normal;}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {border-bottom-right-radius: 0px !important;}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {border-bottom-left-radius: 0px !important;}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 0px !important;}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {border-top-left-radius: 0px !important;}
.icon-confirm {padding: 6px; margin: 12px;}
.table-confirm td{padding: 6px;}
select.form-control{width: 100% !important; max-width: 100%; min-width: 100%;}
.help-block{font-size: 11px;}
.red{color: red;}    
.cursor-move{cursor: move;}
.no-margin{margin: 0 !important;}
.no-padding{padding: 0 !important;}
.no-border{border:0 !important}

.box-addons{height: 360px;}
.box-addons .pull-left.btn{bottom: 10px;position: absolute;}
.box-addons .pull-right{bottom: 10px;position: absolute;right: 0;}

.select2-container {min-width: 160px;}
.v-align {vertical-align: middle !important;}
.move-cursor{cursor: move;}
hr{border-top: 1px solid #dedede;display: inline-block;width: 100%;}
 
.callout a {text-decoration: none !important;  }
/** ICON BOX **/
.icon-box{height:100%;width:100%;max-height:320px;overflow-x:scroll !important;min-height:200px}
.icon-box .icon-list{font-size:26px !important;display:inline-block;width:100%;vertical-align:central;text-align:center;outline:none}
.icon-box .icon-item{background:#fefefe;border: .5px solid #fff;}
.icon-box .icon-item:hover{background:#ddd}

.content-header > h1{font-weight:600;}
.content{min-height: 100%;}
.pointer{cursor: pointer !important;}
.text-dark{color:#333 !important;}
.page-list-title {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.small-box a{color: rgba(255,255,255,0.8);}
.small-box a:hover{color: #fff;}
 .bg-light.small-box h3,.bg-light.small-box p{color: #333 !important;}
.bg-light.small-box h3:hover,.bg-light.small-box p:hover{color: #333 !important;}
.tooltip{z-index: 9000000; position: absolute !important;}
.valign {vertical-align: middle !important;}

#latest-used td a:not(.btn) {font-weight: 600;text-transform: uppercase;}
.img-circle{background: #fff;}

.table-responsive > .table > tbody > tr > td,.table-responsive > .table > tfoot > tr > td {white-space: normal !important;}
.table-striped > tbody > tr:nth-of-type(2n+1) { background-color: #ECF0F5;}

#control-sidebar-emulator-android .control-sidebar-heading,#control-sidebar-emulator-ios .control-sidebar-heading{}
#control-sidebar-emulator-android .iframe,#control-sidebar-emulator-ios .iframe{max-width: 100%; height: 540px;border:0;margin:12px}

.dd { position: relative; display: block; margin: 0; padding: 0; max-width: 600px; list-style: none; font-size: 13px; line-height: 20px; }
.dd-list { display: block; position: relative; margin: 0; padding: 0; list-style: none; }
.dd-list .dd-list { padding-left: 30px; }
.dd-collapsed .dd-list { display: none; }

.dd-item,.dd-empty,.dd-placeholder { display: block; position: relative; margin: 0; padding: 0; min-height: 20px; font-size: 13px; line-height: 20px; }
.dd-handle { display: block; height: 30px; margin: 5px 0; padding: 5px 10px; color: #333;text-decoration: none; font-weight: bold; border: 1px solid #ccc; background: #fafafa;background: -webkit-linear-gradient(top, #fafafa 0%, #eee 100%); background:-moz-linear-gradient(top, #fafafa 0%, #eee 100%);background:linear-gradient(top, #fafafa 0%, #eee 100%); -webkit-border-radius: 3px; border-radius: 3px;box-sizing: border-box; -moz-box-sizing: border-box;}
.dd-handle:hover { color: #2ea8e5; background: #fff; }
.dd-item > button { display: block; position: relative; cursor: pointer; float: left; width: 25px; height: 20px; margin: 5px 0; padding: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; border: 0; background: transparent; font-size: 12px; line-height: 1; text-align: center; font-weight: bold; }
.dd-item > button:before { content: '+'; display: block; position: absolute; width: 100%; text-align: center; text-indent: 0; }
.dd-item > button[data-action="collapse"]:before { content: '-'; }
.dd-placeholder,.dd-empty { margin: 5px 0; padding: 0; min-height: 30px; background: #f2fbff; border: 1px dashed #b6bcbf; box-sizing: border-box; -moz-box-sizing: border-box; }
.dd-empty { border: 1px dashed #bbb; min-height: 100px; background-color: #e5e5e5;background-image: -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),  -webkit-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);background-image:-moz-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),-moz-linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff);background-image:linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff),linear-gradient(45deg, #fff 25%, transparent 25%, transparent 75%, #fff 75%, #fff); background-size: 60px 60px;background-position: 0 0, 30px 30px;}
.dd-dragel { position: absolute; pointer-events: none; z-index: 9999; }
.dd-dragel > .dd-item .dd-handle { margin-top: 0; }
.dd-dragel .dd-handle { -webkit-box-shadow: 2px 4px 6px 0 rgba(0,0,0,.1);box-shadow: 2px 4px 6px 0 rgba(0,0,0,.1);}

pre.shell{border: 1px solid #333;border-left: 3px solid red !important;background: #333;color: grey; font-family: "Lucida Console";border-radius: 0;padding: 6px !important;}
pre.shell:before{content: "$ ";position: relative;font-family: "Lucida Console";color: #FFF;}
pre.shell.ready{color: green !important;}
pre,code{border-radius: 0px !important;}
.btn,.callout{border-radius: 0 !important;}

.tab-footer::after {clear: both;}
.tab-footer::before, .tab-footer::after { content: " "; display: table;}
.tab-footer{padding-top: 10px; padding-left: 0; padding-bottom: 10px;background-color: #fff;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border-top-left-radius: 0;border-top-right-radius: 0;border-bottom-right-radius: 3px;border-bottom-left-radius: 3px;border-top: 1px solid #f4f4f4;}
.v-top {vertical-align: top !important;}
.alert{border-radius: 0px !important;opacity: .95 !important;}

.help-block li{font-size: 10px;padding-bottom: 5px;}
.help-block ul,.help-block ol{padding-left: 12px;}

.app-setup h1,.app-setup h2,.app-setup h3,.app-setup h4{margin-top: 12px;}
.app-setup h1 {font-weight: 600;font-family: 'Arial Narrow';font-size: 48px;font-family: 'FjallaOne';}
.app-setup h2 {font-weight: 600;font-family: 'Arial Narrow';font-size: 32px;font-family: 'FjallaOne';}
.app-setup h3 {font-weight: 600;font-family: 'Arial Narrow';font-size: 24px;font-family: 'FjallaOne';}
.app-setup h4 {font-weight: 600;font-family: 'Arial Narrow';font-size: 16px;font-family: 'FjallaOne';}
.app-setup .nav-tabs > li > a{border-radius: 0 !important;}
.app-setup .panel {border-radius: 0 !important;}

.help-dev {padding: 6px;font-size: 11px;border: 1px dashed #CDB901;margin: 6px 0 6px 0;}
.help-dev-alert {padding: 6px;font-size: 11px;border: 1px dashed #800000;margin: 6px 0 6px 0;}
.help-dev-success {padding: 6px;font-size: 11px;border: 1px dashed #008000;margin: 6px 0 6px 0;}

.responsive{ padding: 12px;}
.modal-addons .modal-dialog {width: 360px;}
.modal-addons .modal-dialog img{width: 100%;}

.box-addons .widget-user-header{background-position: center;background-repeat: repeat;background-size: cover;}
 
.note{border: 1px solid #ddd;padding: 12px;font-size: 11px;}
.note-default{border: 1px solid #eee;padding: 12px;background: #eee;}
.select2-container {min-width: 90px !important;}
.form-group.danger {border: 4px dashed red;padding: 8px;}
.form-group.danger:after {content:"This value is secret! only saved on this appbuilder setting and server side scripting (PHP or MySQL) and not stored in app code";color:#ff0000;font-size: 10px; font-weight: 600;line-height: 10px;}
.full-action {display: block;float: right;background:#7B0909;color:#fff;border: 2px; padding: 12px;font-weight: 600;font-size: 12px;border-radius: 0 0 0 12px;}