/* topheader */
.cv-apps-topheader-logo {
   float: left;
   width: 60%;
}

.cv-apps-topheader-doctitle {
   float: left;
   width: 00%;
   vertical-align: top;
}

.cv-apps-topheader-account {
   float: left;
   width: 10%;
}
.cv-apps-topheader-account-position {
   float: right;
}
.cv-apps-topheader-account-position-margin-left {
   margin-left: 10px;
}

/* navigasi topheader boscv here2 */
.scrollmenu3 {
  background-color: #FFFFFF;
  overflow: auto;
  white-space: nowrap;
  /*height: 80px;*/
  border-bottom: 1px solid #D2D2D2;
}
.scrollmenu3 .ribbon-section {
  display: inline-block;
}
.ribbon-section-border-right {
  border-right: 1px solid #DADCE0;
}
.ribbon-section-margin-left {
   margin-left: 7px;
}

.ribbon-content {
  vertical-align: top;
  height: 57px;
}

.subribbon {
  display: inline-block;
  height: 57px;
  vertical-align: top;
}
.subribbon ul {
  margin: 0px;
  padding: 0px;
}
.subribbon ul li {
  display: inline-block;
  text-align: center;
  padding: 0px;
  text-decoration: none;
}
.subribbon-box {
  padding: 3px 5px 0px 0px; /* atas kanan bawah kiri */
  /*display: inline-block;*/
  float: left;
  /*height: 50px;*/
  overflow-x: hidden; /* kesamping */
  overflow-y: scroll; /* kebawah */
  border: 1px solid cornflowerblue;
  background-color: #FFFFFF;
}
.subribbon-box::-webkit-scrollbar {
  width: 12px;
}
.subribbon-box::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px cornflowerblue;
}
.subribbon-box::-webkit-scrollbar-thumb {
  -webkit-box-shadow: inset 0 0 6px deepskyblue;
}

.glass{
  /* background styles */
  position: relative;
  display: inline-block;
  /*padding: 15px 25px;*/
  /*background-color: green; /*for compatibility with older browsers*/
  /*background-image: linear-gradient(green,lightgreen); */
  background-color: deepskyblue; /*for compatibility with older browsers*/
  background-image: linear-gradient(deepskyblue,cornflowerblue);

  /* text styles */
  text-decoration: none;
  color: #fff;
  font-size: 14px;
  font-family: sans-serif;
  font-weight: 100;

  /* optional */
  border-radius: 3px;
  box-shadow: 0px 1px 4px -2px #333;
  text-shadow: 0px -1px #333;
}
.glass:after{
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: calc(100% - 4px);
  height: 50%;
  background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2));
}
.glass:hover{
  background: linear-gradient(#0FF,#08B);
}

.glass-red{
  /* background styles */
  position: relative;
  display: inline-block;
  /*padding: 15px 25px;*/
  /*background-color: green; /*for compatibility with older browsers*/
  /*background-image: linear-gradient(green,lightgreen); */
  background-color: crimson; /*for compatibility with older browsers*/
  background-image: linear-gradient(crimson,magenta);

  /* text styles */
  text-decoration: none;
  color: #fff;
  font-size: 14px;
  font-family: sans-serif;
  font-weight: 100;

  /* optional */
  border-radius: 3px;
  box-shadow: 0px 1px 4px -2px #333;
  text-shadow: 0px -1px #333;
}
.glass-red:after{
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: calc(100% - 4px);
  height: 50%;
  background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2));
}
.glass-red:hover{
  background: linear-gradient(crimson,red);
}

.glass-red-active {
   /* background styles */
  position: relative;
  display: inline-block;
  background-color: crimson; /*for compatibility with older browsers*/
  background-image: linear-gradient(crimson,red);

  /* text styles */
  text-decoration: none;
  color: #fff;
  font-size: 14px;
  font-family: sans-serif;
  font-weight: 100;

  /* optional */
  border-radius: 3px;
  box-shadow: 0px 1px 4px -2px #333;
  text-shadow: 0px -1px #333;
}
.glass-red-active:after{
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: calc(100% - 4px);
  height: 50%;
  background: linear-gradient(rgba(255,255,255,0.8), rgba(255,255,255,0.2));
}
/* end navigasi topheader boscv here2 */

/* area editor */
.area-editor {
  background-color: #E6E6E6;
  overflow: auto;
  white-space: nowrap;
  border: 0px;
  position: relative;
  width: 100%;
}
.area-editor-content {
  /*
  display: flex;
  justify-content: center;
  align-items: center;
  */
  padding: 20px 10px 20px 10px;
  /*white-space: nowrap;*/
  top: 50%;
  left: 50%;
  text-align: center;
}
.area-page {
  width: 600px;
  border: 1px solid #C6C6C6;
  background-color: #FFFFFF;
}
.area-page2 {
  width: 21.05cm;
  height: 29.76cm;
  max-width: 21.05cm;
  max-height: 29.76cm;
  border: 1px solid red;
  background-color: #FFFFFF;
  text-align: left;
}
.area-page-zoom {
  zoom: 200%;
}
/* end area editor */

.form-control-ribbon {
  display:block;width:100%;height:25px;padding:1px 12px;font-size:14px;color:#555;background-color:#fff;background-image:none;border:1px solid cornflowerblue;border-radius:4px;
}
.form-control-ribbon:focus {

}
.form-control-ribbon::-moz-placeholder {
  color:#999;opacity:1;
}
.form-control-ribbon:-ms-input-placeholder {
  color:#999;
}
.form-control-ribbon::-webkit-input-placeholder {
  color:#999;
}
.form-control-ribbon::-ms-expand {
  background-color:transparent;border:0
}
.form-control-ribbon[disabled],.form-control-ribbon[readonly],fieldset[disabled] .form-control-ribbon {
  background-color:#eee;opacity:1;
}
.form-control-ribbon[disabled],fieldset[disabled] .form-control-ribbon {
  cursor:not-allowed
}

html[dir="rtl"] .cv-apps-topheader-logo {
   float: right;
}

html[dir="rtl"] .cv-apps-topheader-doctitle {
   float: right;
}

html[dir="rtl"] .cv-apps-topheader-account {
   float: right;
}
html[dir="rtl"] .cv-apps-topheader-account-position {
   float: left;
}
html[dir="rtl"] .cv-apps-topheader-account-position-margin-left {
   margin-left: 0px;
   margin-right: 10px;
}

html[dir="rtl"] .ribbon-section-border-right {
  border-right: 0px solid #DADCE0;
  border-left: 1px solid #DADCE0;
}

html[dir="rtl"] .ribbon-section-margin-left {
   margin-left: 0px;
   margin-right: 7px;
}

/* menu klik kanan pada editor cv */
.cv-rightclick-menu {
	position: relative;
}

.cv-rightclick-menu-options {
   display: none;
   position: absolute;
   background-color: #E6E6E6;
   min-width: 250px;
   z-index: 1;
   bottom: 0;
   border: 1px solid #6495ED;
}
.cv-rightclick-menu-options-items {
   color: #000000;
   padding: 7px 10px 7px 10px;
   text-decoration: none;
   display: block;
   font-size: 14px;
   border-bottom: 0px solid black;
   cursor: pointer;
}
.cv-rightclick-menu-options-items-icon {
	float: left; width: 25px;
}
.cv-rightclick-menu-options-items-text {
	float: left;
}
.cv-rightclick-menu-options-items:hover {
   background-color: #F1F3F4;
}

/* ini ganti pake event onclick javascript saja, jadi ketika si elemen diklik maka dropdown akan muncul 
.cv-rightclick-menu:hover .cv-rightclick-menu-options {
   display: block;
}
*/

button[type="submit"] {
   border: 0px;
   outline:0;
}
button[type="submit"]:hover {
   border: 0px;
   outline:0;
}
button[type="submit"]:active {
   border: 0px;
   outline:0;
}

.vertical-align-top {
   vertical-align: top;
}
.vertical-align-bottom {
   vertical-align: bottom;
}
.vertical-align-middle {
   vertical-align: middle;
}