﻿
.btn {
  background: #428bca;
  border: #357ebd solid 1px;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-size: 14px;
  padding: 8px 15px;
  text-decoration: none;
  text-align: center;
  min-width: 60px;
  position: relative;
  transition: color .1s ease;
  /* top: 40em;*/
}
.btn:hover {
  background: #357ebd;
}
.btn.btn-big {
  font-size: 18px;
  padding: 15px 20px;
  min-width: 100px;
}
.btn-close {
  color: #aaaaaa;
  font-size: 30px;
  text-decoration: none;
  position: absolute;
  right: 10px;
  top: 15px;
}
.btn-close:hover {
  color: #919191;
}
.btn-full, .btn-to-normal{
  color: #aaaaaa;
  font-size: 30px;
  text-decoration: none;
  position: absolute;
  right: 40px;
  top: 15px;
}
.btn-full:hover, .btn-to-normal:hover {
    color: #919191;
}
.modal {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
}

.modal .modal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 20%;
}
.modal-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -200px;
  position: fixed;
  left: 50%;
  top: -100%;
  z-index:99;
  min-width: 400px;
  max-width: 400px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.modal-body {
  padding: 10px;
  min-height:200px;
  max-height:200px;
}
.modal-header,
.modal-footer {
  padding: 5px 10px;
}
.modal-header {
  border-bottom: #eeeeee solid 1px;
}
.modal-header h2 {
  font-size: 16px;
}

.modal-header h3 {
    font-size: 14px;
}
.modal-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}
/*ADDED TO STOP SCROLLING TO TOP*/
#close {
  display: none;
}

/*MODAL SMALL*/
.modalsmall {
  content: "" !important;
  background: rgba(0, 0, 0, 0.6) !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 89 !important;
}

.modalsmall .modalsmall-dialog {
  -webkit-transform: translate(0, 0) !important;
  -ms-transform: translate(0, 0) !important;
  transform: translate(0, 0) !important;
  top: 20% !important;
}
.modalsmall-dialog {
  background: #fefefe !important;
  border: #333333 solid 1px !important;
  border-radius: 5px !important;
  margin-left: -200px !important;
  position: fixed !important;
  left: 50% !important;
  top: -100% !important;
  z-index:89 !important;
  min-width: 400px !important;
  max-width: 400px !important;
  -webkit-transform: translate(0, -500%) !important;
  -ms-transform: translate(0, -500%) !important;
  transform: translate(0, -500%) !important;
  -webkit-transition: -webkit-transform 0.3s ease-out !important;
  -moz-transition: -moz-transform 0.3s ease-out !important;
  -o-transition: -o-transform 0.3s ease-out !important;
  transition: transform 0.3s ease-out !important;
  
}
.modalsmall-body {
  padding: 10px !important;
  min-height:200px !important;
  max-height:200px !important;
}
.modalsmall-header,
.modalsmall-footer {
  padding: 5px 10px !important;
}
.modalsmall-header {
  border-bottom: #eeeeee solid 1px !important;
}
.modalsmall-header h2 {
  font-size: 16px !important;
}
.modalsmall-footer {
  border-top: #eeeeee solid 1px !important;
  text-align: right !important;
}

/*MODAL MEDIUM*/
/*MODAL SMALL*/
.modalmedium {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 89;
}

.modalmedium .modalmedium-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 20%;
}
.modalmedium-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -300px;
  position: fixed;
  left: 50%;
  top: -100%;
  z-index:89;
  min-width: 600px;
  max-width: 600px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.modalmedium-body {
  padding: 10px;
  min-height:200px;
  max-height:200px;
}
.modalmedium-header,
.modalmedium-footer {
  padding: 5px 10px;
}
.modalmedium-header {
  border-bottom: #eeeeee solid 1px;
}
.modalmedium-header h2 {
  font-size: 16px;
}
.modalmedium-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}

/*MODAL MEDIUM2*/
.modalmedium2 {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 89;
}

.modalmedium2 .modalmedium2-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 20%;
}
.modalmedium2-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -300px;
  position: fixed;
  left: 45%;
  top: -100%;
  z-index:89;
  min-width: 700px;
  max-width: 700px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.modalmedium2-body {
  padding: 10px;
  min-height:300px;
  max-height:300px;
  overflow-y: scroll;
}
.modalmedium2-header,
.modalmedium2-footer {
  padding: 5px 10px;
}
.modalmedium2-header {
  border-bottom: #eeeeee solid 1px;
}
.modalmedium2-header h2 {
  font-size: 16px;
}
.modalmedium2-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}


/*MODAL MEDIUM2*/
.modalmedium3 {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 89;
}

.modalmedium3 .modalmedium3-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 10%;
}
.modalmedium3-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -300px;
  position: fixed;
  left: 45%;
  top: -100%;
  z-index:89;
  min-width: 700px;
  max-width: 700px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.modalmedium3-body {
  padding: 10px;
  min-height:350px;
  max-height:350px;
}
.modalmedium3-header,
.modalmedium3-footer {
  padding: 5px 10px;
}
.modalmedium3-header {
  border-bottom: #eeeeee solid 1px;
}
.modalmedium3-header h2 {
  font-size: 16px;
}
.modalmedium3-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}

/*MODAL DIALOG FOR CONTROLS NOT ALERT MESSAGES*/
.modallarge {
    content: "";
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
}

.modallarge .modallarge-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 20%;
}
.modallarge-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -500px;
  position: fixed;
  left: 50%;
  top: -100%;
  z-index:99;
  min-width: 1000px;
  max-width: 1000px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
 
}
.modallarge .modallarge-dialog-full {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0);
    top: 0%;
    background: #fefefe;
    border: #333333 solid 1px;
    border-radius: 5px;
    margin-left: 0px;
    position: fixed;
    left: 0%;
    z-index: 99;
    min-width: 1100px;
    max-width: 11000px;
    width: 100%;
}


.modallarge-body {
    padding: 10px;
    min-height: 300px;
    /*max-height:300px;*/
}
.modallarge-header,
.modallarge-footer {
  padding: 5px 10px;
}
.modallarge-header {
  border-bottom: #eeeeee solid 1px;
}
.modallarge-header h2 {
  font-size: 16px;
}
.modallarge-header h3 {
  font-size: 14px;
}
.modallarge-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}
/*MODAL DIALOG FOR CONTROLS NOT ALERT MESSAGES*/
.modalextralarge {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}

.modalextralarge .modalextralarge-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 5%;
}
.modalextralarge-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -500px;
  position: fixed;
  left: 50%;
  top: -100%;
  z-index:99;
  min-width: 1000px;
  max-width: 1000px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.modalextralarge-body {
  padding: 10px;
  min-height:500px;
  max-height:500px;
}
.modalextralarge-header,
.modalextralarge-footer {
  padding: 5px 10px;
}
.modalextralarge-header {
  border-bottom: #eeeeee solid 1px;
}
.modalextralarge-header h2 {
  font-size: 16px;
}
.modalextralarge-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}

/*MODAL DIALOG FOR EMAIL COMPOSE*/
.modalemail {
  content: "";
  background: rgba(0, 0, 0, 0.6);
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
}

.modalemail .modalemail-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 5%;
}
.modalemail .modalemail-dialog-full {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 0%;
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: 0px;
  position: fixed;
  left: 0%;
  z-index:99;
  min-width: 800px;
  max-width: 11000px;
  width: 100%;
}
.modalemail-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin-left: -500px;
  position: fixed;
  left: 50%;
  top: -100%;
  z-index:99;
  min-width: 1100px;
  max-width: 1100px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.modalemail-body {
  padding: 10px;
  min-height:350px;
  max-height:450px;
}
.modalemail-header,
.modalemail-footer {
  padding: 5px 10px;
}
.modalemail-header {
  border-bottom: #eeeeee solid 1px;
}
.modalemail-header h2 {
  font-size: 16px;
}
.modalemail-footer {
  border-top: #eeeeee solid 1px;
  /*text-align: right;*/
}
.clear {
	display: block;
	clear: both;
}

/* ALERTNOTIFICATION */

.alertnotificationmodal {
  content: "";
  position:absolute;
  top: 0;
  right: 0;
  z-index: 999;
}

.alertnotificationmodal .alertnotificationmodal-dialog {
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0);
  top: 20%;
}
.alertnotificationmodal-dialog {
  background: #fefefe;
  border: #333333 solid 1px;
  border-radius: 5px;
  margin: 5px;
  z-index:999;
  min-width: 300px;
  max-width: 300px;
  -webkit-transform: translate(0, -500%);
  -ms-transform: translate(0, -500%);
  transform: translate(0, -500%);
  -webkit-transition: -webkit-transform 0.3s ease-out;
  -moz-transition: -moz-transform 0.3s ease-out;
  -o-transition: -o-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  
}
.alertnotificationmodal-body {
  padding: 10px;
  min-height:50px;
}
.alertnotificationmodal-header,
.alertnotificationmodal-footer {
  padding: 5px 10px;
}
.alertnotificationmodal-header {
  border-bottom: #eeeeee solid 1px;
}
.alertnotificationmodal-header h2 {
  font-size: 16px;
}
.alertnotificationmodal-footer {
  border-top: #eeeeee solid 1px;
  text-align: right;
}

@media (max-width: 800px) {
    .modalextralarge-footer {
        position: absolute;
        bottom: 20px;
        width: 50%;
        border-top: none;
    }
}
@media (max-height: 800px) {
    .modallarge .modallarge-dialog {
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        transform: translate(0, 0);
        top: 1%;
    }
}