/* #### Mobile Phones Portrait #### */
@media screen and (max-device-width: 480px) and (orientation: portrait){
  /* some CSS here */
    .modal-dialog {
        width: 450px;
         position:absolute;
    }


}

/* #### Mobile Phones Landscape #### */
@media screen and (max-device-width: 640px) and (orientation: landscape){
  /* some CSS here */
   .modal-dialog {
        width: 630px;
        margin: 30px auto;
        padding: 10px;
            
            position:absolute;
    }
}

/* #### Mobile Phones Portrait or Landscape #### */
@media screen and (max-device-width: 640px){
  /* some CSS here */
  .modal-dialog {
        width: 630px;
        margin: 30px auto;
        padding: 10px;
           
            position:absolute;
    }
}

/* #### iPhone 4+ Portrait or Landscape #### */
@media screen and (min-device-width: 320px) and (-webkit-min-device-pixel-ratio: 2){
  /* some CSS here */
  .modal-dialog {
       width: 343px;
        margin: 30px auto;
        padding: 10px;
         
            position:absolute;
    }
   .modal-header {
            /*background: rgba(0, 0, 0, 0) url("/Content/Images/popup_bg.png") repeat-x scroll left bottom;*/
            background: #1e5799;
background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
            border-bottom-color: #d0d0d0;
            
    border-top-left-radius: 0.3em;
    border-top-right-radius: 0.3em;
        }
}

/* #### iPhone 5 Portrait or Landscape #### */
@media (device-height: 568px) and (device-width: 320px) and (-webkit-min-device-pixel-ratio: 2){
  /* some CSS here */
  .modal-dialog {
       width: 343px;
        margin: 30px auto;
        padding: 10px;
           
            position:absolute;
    }
   .modal-header {
            
            background: #1e5799;
background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
            border-bottom-color: #d0d0d0;
            
    border-top-left-radius: 0.3em;
    border-top-right-radius: 0.3em;
        }
}

/* #### iPhone 6 and 6 plus Portrait or Landscape #### */
@media (min-device-height: 667px) and (min-device-width: 375px) and (-webkit-min-device-pixel-ratio: 3){
  /* some CSS here */
  .modal-dialog {
       width: 343px;
        margin: 30px auto;
        padding: 10px;
        position:absolute;
    }
   .modal-header {
            
            background: #1e5799;
background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
            border-bottom-color: #d0d0d0;
            
    border-top-left-radius: 0.3em;
    border-top-right-radius: 0.3em;
        }
}

/* #### Tablets Portrait or Landscape #### */
@media screen and (min-device-width: 768px) and (max-device-width: 1024px){
  /* some CSS here */
  .modal-dialog {
       width: 760px;
        /*margin: 30px auto;*/
        padding: 10px;
            left: 7%;
            padding-bottom: 30px;
            padding-top: 30px;
            right: auto;
            z-index: 1050;
            margin-top:20px;
            position:absolute;
    }
   .modal-header {
           
            background: #1e5799;
background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
            border-bottom-color: #d0d0d0;
            
    border-top-left-radius: 0.3em;
    border-top-right-radius: 0.3em;
        }
}

/* #### Desktops #### */
@media screen and (min-width: 1024px){
  /* some CSS here */

}

@media only screen and (min-width : 480px) {
    .modal-dialog {
        width: 600px;
        margin: 30px auto;
        padding: 10px;
            left: 25%;
            padding-bottom: 30px;
            padding-top: 30px;
            right: 25%;
            z-index: 1050;
            margin-top:20px;
            position:absolute;
    }
}

@media (min-width:768px) {
    .modal-dialog {
        width: 600px;
        margin: 30px auto;
    }

    .modal-dialog {
        padding: 10px;
        width: 580px;
        left: 25%;
        padding-bottom: 30px;
        padding-top: 30px;
        right: 25%;
        z-index: 1050;
        margin-top: 20px;
        position: absolute;
    }

    .modal-content {
        border-color: #d9d9d9;
        box-shadow: 0 0 17px rgba(0, 0, 0, 0.4);
    }

    .modal-content {
        background-clip: padding-box;
        background-color: #fff;
        border: 1px solid rgba(0, 0, 0, 0.2);
        border-radius: 6px;
        box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
        outline: 0 none;
        position: relative;
    }



    .modal-header {
       
       background: #1e5799;
background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
        border-bottom-color: #d0d0d0;
        
    border-top-left-radius: 0.3em;
    border-top-right-radius: 0.3em;
    }

    .modal-header {
        border-bottom: 1px solid #e5e5e5;
        min-height: 16.4286px;
        padding: 12px;
        text-align: center;
        border-top: 1px solid #1e5799;
    }

    .modal-title {
        margin: 0;
        line-height: 1.42857143;
        text-align: center;
        color: white;
    }

    .modal-body {
        position: relative;
        padding: 15px;
        text-align: center;
    }

    .modal-bodyl {
        position: relative;
        padding: 15px;
        text-align: left;
    }

    .modal-footer {
        text-align: left;
    }
    .close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #FFFFFF;
    text-shadow: 0 1px 0 #ddd;
    filter: alpha(opacity=20);
    opacity: .2;
}
}