.blue-gradient-button {
  background-image: linear-gradient(to right, #1d95d1 , #154c87);
  border: none;
  color: white;
  padding: 15px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 20px;
  margin: 4px 2px;
  border-radius:40px;
  border-top-left-radius: 40px;
border-top-right-radius: 40px;
border-bottom-left-radius: 40px;
border-bottom-right-radius: 40px;
  overflow:hidden;
  width:270px;
  
  
}

.document-dropshadow{
    -moz-box-shadow: 0 0 7px #ccc;
    -webkit-box-shadow: 0 0 7px #ccc;
    box-shadow: 0 0 7px #ccc;
}
.slider {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  overflow: hidden;
  background-color: #000; color: #FFF;
  transition: all 0.7s;
}

.slider.close {
  top: 100%;
  height: 0;
}

.document-creator-input{
    border-radius:40px;
    border:0px solid #1d95d1;
    background:#1d95d1;
    width:200px;
    height:40px;
    margin:0;
    padding:0;
    padding-left:15px;
    padding-right:10px;
    color:white;
   
}

.custom-document-creator-input{
    border-radius:40px;
    border:0px solid #1d95d1;
    background:#1d95d1;
    width:200px;
    height:40px;
    margin:0;
    padding:0;
    padding-left:15px;
    padding-right:10px;
    color:white;
   
}

.document-creator-edit-custom-info-name-input{
 padding-left:10px;
 text-transform:capitalize;
 width:200px;
 background:white;
 border:0.5px #1d95d1 solid; 
 border-radius:30px;
 padding-right:70px;
 display:none;
   
}

.document-creator-edit-custom-info-name-input::placeholder{
 color:rgba(21,76,135,0.7);
 font-weight:300;
}

.white-document-creator-input{
    border-radius:40px;
    border:0.5px solid rgba(0,0,0,0.4);
    background:white;
    width:200px;
    height:40px;
    margin:0;
    padding:0;
    padding-left:15px;
    color:DarkGray;
    placeholder:DarkGray;
   
}

.white-document-creator-input::placeholder{
    
    color:black;
}

.identificationInfoBox{
  width:132.78px;

  border:1px solid rgba(0,0,0,0.7);
}

.triangle-up {
	width: 0;
	height: 0;
	border-left: 80px solid transparent;
	border-right: 80px solid transparent;
	border-bottom: 80px solid #1d95d1;
}
.fit-text {
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
  display: block;
  line-height: 1em; /* a */
  max-height: 2em; /* a x number of line to show (ex : 2 line)  */
}


/*Document Creator */
/*Scroll Bar*/
div  ::-webkit-scrollbar {
      width: 25px;
      z-index:9999;
  }
  /* Track */
div  ::-webkit-scrollbar-track {
        padding-top:10px;
      -webkit-border-radius: 10px;
      background-color: rgba(0,0,0,0.05);
      border-radius: 23px;
      height:60%;
      z-index:9999;
  }
  /* Handle */
div ::-webkit-scrollbar-thumb {
      -webkit-border-radius: 15px;
      border-radius: 15px;
         background-size:30px 126px;
      background-color:#1d95d1;
      background-repeat:no-repeat;
      z-index:9999;

  background-position:top;
  }

.text-gradient-2{
     background: -webkit-linear-gradient(left,#1d95d1 55%, #6fb9e6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.edit-mode-text-box{
    background:white;
    border:1px solid black;
    color:black;
}

.edit-mode-text-box::placeholder{
    
    color:DarkGray;
}


/* Document Creator Screen  */
#id-document-creator-div{
    
background:url("../img/pentexture.jpg") top center;
  background-repeat:repeat;
  background-size:350px;
   background-attachment: fixed;
  
}


/*Adjust Profile Photo */
#document-creator-add-face-photo-screen{
    width:100%;
    height:100%;
    position:fixed;
    background:black;
    background:rgba(0,0,0,0.15);
    z-index:9999;
    align-items: center;
   display:block;
    justify-content: center;
    z-index:9998;
   
}



#document-creator-adjust-face-photo-box{
    
    background: rgba(255, 255, 255, 0.98);
    border: 0.5px solid white;
    box-shadow: 0px 0px 0px 1px rgba(29,149,209,0.3); 
    border-radius:70px;
    height:500px;
    width:660px;
    display:block;
    
    
}

#document-creator-adjust-face-photo-screen-header{
    margin-top:30px;
    width:100%;
    height:40px;
    background:none;
}

#document-creator-adjust-face-photo-controls-box{
    margin-top:15px;
    border-radius:70px;
    height:400px;
    width:600px;
    z-index:9999;
   

}

#document-creator-adjust-face-photo-preview-image{
    border-radius:0px;
    border: 0.5px solid #1d95d1;
    width:224px;
    height:255px;
    overflow:hidden;
    position:relative;
    
}
#document-creator-adjust-face-photo-position-controls-container{
    
    position:absolute;
    height:100%;
    width:100%;
    background:none;
    z-index:9999;
}
#document-creator-adjust-face-photo-image{
    position:absolute;
    height:auto;
    width:100%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
    transform-origin: center center;
    transform: scale(1.0, 1.0);
}

#document-creator-set-face-photo-btn{
    
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid #1d95d1;
  color: #1d95d1;
  padding: 12px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 20px;
  font-weight:regular;
  margin: 4px 2px;
  border-radius:40px;
  overflow:hidden;
  width:265px;
  margin-top:40px;
  margin-bottom:0px;

    
    
    
}

#exit-set-face-photo-button{
		border: 1.8px solid #1d95d1;
	border-radius:360px;
    display: flex;
  align-items: center;
  justify-content: center;
    float:right;
  margin-top:0px;
  margin-right:6px;
  width:50px;
  height:50px;
  position:absolute;
	
}

.BlueBorderBlackCircleButton{
	border: 1.8px solid #1d95d1;
	border-radius:360px;
    display: flex;
    align-items: center;
    justify-content: center;
    width:50px;height:50px;
    text-align:right;
      -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;

   /*
     Introduced in Internet Explorer 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
   -ms-user-select: none;
   user-select: none;
}

#exit-set-face-photo-button-container{
	
	  margin-right:25px;
	
}

/* Save Document To Archive Dropdown */

.archiveListItem{
    
    transition:all 100ms ease;
}

.archiveListItem:hover{
  background:rgba(51, 76, 132, 0.07);
  border-color:white;
}

.idDocumentScrollDirectoryListButton{
    background:rgba(0, 0, 0, 0.05);
    color:DarkGray;
}

.idDocumentScrollDirectoryListButton:hover{
    background:rgba(0, 0, 0, 0.07);
    color:black;
}


.idDocumentDirectoryNavigationItemArchiveNameButton{
    
    color:black;
}

.idDocumentDirectoryNavigationItemArchiveNameButton:hover{
    
    color:#1d95d1;
}


/* Id Document Context Menu */

.idDocumentContextMenu{
    
    width:200px;
    box-shadow:0 4px 8px -2px rgba(0,0,0,0.13);
    display:none;
    position:fixed;
    transition:opacity 500ms ease;
    border:0.5px rgba(0,0,0,0.15) solid;
}

.idDocumentContextMenu.active{
    display:inline-block;
}

.idDocumentContextMenuItem{
    border-bottom:0.5px rgba(0,0,0,0.1) solid;
    height:55px;
    border-left:5px transparent solid;
    transition:all 400ms ease;
      -moz-user-select: none;
   -khtml-user-select: none;
   -webkit-user-select: none;

   /*
     Introduced in Internet Explorer 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
   -ms-user-select: none;
   user-select: none;
}
.idDocumentContextMenuItem:hover{
   border-left:5px #334c84 solid;
    background:rgba(0,0,0,0.015);    
}