﻿/* Sticky footer styles


html {
  position: relative;
  min-height: 100%;
  
}

body {
    Margin bottom by footer height
    margin-bottom: 120px;  
}


    .diers-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  Set the fixed height of the footer here 
  height: 120px;
  background-color: #f5f5f5;
}

-------------------------------------------------- */




html, body {height: 100%;}

#main {overflow:auto;
       min-height: 90%;
	padding-bottom: 90px;}  /* must be same height as the footer */

#footer {
    position: relative;
	margin-top: -90px; /* negative value of footer height */
	height: 90px;
    background-color: #f5f5f5;
	clear:both;} 

.mobile-device-modal-window{
     width: 900px;
}


/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */
/*
body > .container {
  padding: 60px 15px 0;
}
.container .text-muted {
  margin: 20px 0;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	Ajax Loading style
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#loading_div {  
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(51,51,51,0.7);
    z-index: 10;    
}

.loading { 
    /*border:1px solid #ddd; 
    padding:20px; 
    margin:40px 5px; 
    width:80px;*/
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -32px; /* -1 * image width / 2 */
    margin-top: -32px;  /* -1 * image height / 2 */
    display: block;         
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	Forms
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.form-title {
    color: #337AB7;    
}

.form-seperator {
    border-radius: 5px;
    background-color: #7BA9D0;    
    color: #ffffff;
}

.form-footer-summary {
    text-align: right;   
    font-style: italic;
    font-weight: bold;
}


.deleted-record{
    color: red;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	Tabs
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.tab-content {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding: 10px;
}

.nav-tabs {
    margin-bottom: 0;
}

.mytable {
  border-spacing: 5px;
  /*padding-top:20px;*/ 
  border-collapse:separate;
}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	Errors
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.err{
    color: red;
}

.published-option{
    color: blue;
    font-weight: 600;
}

.unpublished-option{
    color: #FFA500;
    font-weight: 600;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	Modals
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.modal-xxl {
            width: 1024px;
        }

.tab-content {
  margin:0;
  padding:0;
}
.content {
  margin:1em;
  padding:1em;
}

/*
.modal-dialog {
  width: 98%;
  height: 92%;
  padding: 0;
}

.modal-content {
  height: 99%;
}
*/

a:link {
    text-decoration: none;
}

/*.my-modal-popup{

    @media (min-width: 1400px){

        .modal-lg {
            width: 1308px;
        }
    }

}*/

.selectedRow {
    color: darkorange;
}

.mandatoryField{
    color: #FFA500
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*
	Wizard
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#wizard-step-container {
  margin: 20px 0;
}

#wizard-content-container {
  margin: 20px 0;
}

#wizard-navigation-container {
  border-top: 1px solid #eee;
  margin: 20px 0;
  padding-top: 20px;
}


/**SLIDER**/

/* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}


/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

.radioSelected {
    color: #2196F3;
}

.btn-xl {
    padding: 10px 20px;
    font-size: 20px;
    border-radius: 10px;
    width:100%;
    height: 300px;
    display: block;
}





.box {
    width:100%;
    height:100%;
    /*background-color:#d9d9d9;*/
    position:fixed;
    top:0%;
    left:0%;    
    
}

.panel-default {
  border-color:#3072AD;
  font-weight: bold;
}

.panel-default .panel-heading {
  background: #3072AD;
  color: #FFFFFF;
  font-weight: bold;
}

.highlighted-record{
    background-color: #5CB85C;
}


#wrapper1, #wrapper2{
    width: 4000px;     
    overflow-x: scroll; 
    overflow-y:hidden;
}

#wrapper1{
    height: 20px; 
    overflow-y:hidden;
}

#wrapper2{
    /*height: 100px; */
    overflow-y:auto;
}

#div1 {
    width:5000px; 
    height: 20px; 
}

#div2 {
    width:5000px; 
    /*height: 100px; */
    overflow: auto;
}

.md-dialog-container{
    max-width: 100%;
    max-height:70%;    
}

.md-dialog-backdrop.md-opaque.ng-scope{    
    height: 100% !important;
    
}


.app-modal-window .modal-dialog {
    width: calc(100vw - 50px);
    /*height: calc(80vh);*/
}

.modal-body{
    /*height: calc(75vh);*/
}

.modal-body .super{
    /*height: calc(75vh);*/ 
    overflow: auto;
}

.modal-footer{
    /*height: calc(10vh);*/
}

/*
.app-modal-window .modal-dialog {
    width: calc(100vw - 50px);
    height: calc(80vh);
}

.modal-content{
    height: calc(80vh);
}

.modal-footer{
    height: calc(5vh);
}
    */

/* 
.modal-body {
 
    
 
    height: 100%;
 
    background-color:#BBD6EC;
 
}       
*/

.drop-box {
    background: #F8F8F8;
    border: 5px dashed #DDD;
    width: 200px;
    height: 65px;
    text-align: center;
    padding-top: 5px;    
}

.dragover {
    border: 5px dashed blue;
}