.containerSmall{
    width: 600px !important;
    max-width: 100% !important;
}

.modalPopup {
    border-radius: 6px;
    background: #f5f5f5;
    max-height: 90%;
    width: 50%;
    position: fixed;
    top: 5%;
    left: 25%;
    z-index: 300;
    display: none;
    padding: 10px;
    -moz-box-shadow: 0px 5px 10px #444;
    -ms-box-shadow: 0px 5px 10px #444;
    -webkit-box-shadow: 0px 5px 10px #444;
    box-shadow: 0px 5px 10px #444;
    overflow-y: auto;
}

.popupContainer {
    overflow: auto;
    padding: 10px;
    background: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #ddd;
    -moz-box-shadow: 0 1px 0 #bbb;
    -ms-box-shadow: 0 1px 0 #bbb;
    -webkit-box-shadow: 0 1px 0 #bbb;
    box-shadow: 0 1px 0 #bbb;
}

.popupContainer .cardContainer{
    -webkit-border-radius: none;
    -moz-border-radius: none;
    border-radius: none;
    border: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.popupContainer .clHeadSecondary h2 {
    font-size: 1em !important;
}

.modalPopup label.standard {
    width: 40%;
}
.modalPopup .formLine{
    width: 60%;
}

.popupTitle {
    height: 22px;
    font-size: 18px;
    margin-bottom: 5px;
    position: relative;
}
.view-popup-close{
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    height: 20px;
    cursor: pointer;
    opacity: 0.75;
}

.view-popup-close:hover{
    opacity: 1;
}

.view-popup-trigger{
    cursor: pointer;
}

.view-popup-overlay{
    position:fixed;
    background-color: #000000;
    background-color: rgba(127, 127, 127, 0.5);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 50;
    width: 100%;
    height: 100%;
    display:none;
}

.closePopup {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    height: 20px;
    cursor: pointer;
    opacity: 0.75;
}

.popupLink {
    cursor: pointer;
}

.overlay {
    position:fixed;
    background-color: #000000;
    background-color: rgba(127, 127, 127, 0.5);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 50;
    width: 100%;
    height: 100%;
	display:none;
}

.closePopup:hover{
    opacity: 1;
}

.timeoutModalPopup{border-radius: 6px; background: #fff; max-height: 90%; width: 30%; position: fixed; top: 5%;left: 35%; z-index: 300;display: block;}
/*.timeoutPopupContainer{ overflow: auto; max-height: 600px; background: #fff;}
*/.timeoutModalPopup label.standard{width: 40%;}
.timeoutPopupTitle{position: relative;}
.timeoutOverlay {
    position:fixed;

    background-color: rgba(0, 0, 0, 0.5);
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 20;
}


@media (max-width: 1349px) {
    .modalPopup{width: 60%; top: 5%; left: 20%;}
}

@media (max-width: 767px) {

    .modalPopup{height: 90%; width: 96%;top: 5%;left: 2%; }
    .popupContainer{height: 100%; overflow: auto;}
}

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
  .modalPopup{width: 96%;top: 5%;left: 2%; }
  .popupContainer{height: 100%; overflow: auto; }  
}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
.modalPopup{height: 100%; width: 96%;top: 5%;left: 2%;  }
  .popupContainer{height: 100%; overflow-y: scroll; /* has to be scroll, not auto */
  -webkit-overflow-scrolling: touch; }
}