/* ==========================================================================
   Media Queries

  (orientation: portrait)  (orientation: landscape)

@media screen and (max-width:320px) {}
@media screen and (min-width:321px) and (max-width:479px) {}
@media screen and (min-width:480px) and (max-width:639px) {}
@media screen and (min-width:640px) and (max-width:767px) {}
@media screen and (min-width:768px) and (max-width:959px) {}
@media screen and (min-width:960px) and (max-width:1023px) {}
@media screen and (min-width:1024px) and (max-width:1279px) {}
@media screen and (min-width:1280px) and (max-width:1599px) {}
@media screen and (min-width:1600px) {}
@media screen and (min-width:1920px) {}

   ========================================================================== */

@media screen and (max-width:320px) {
    #main {width: 100%;}
    #content {  float: left;  margin-bottom: 0px; padding: 0;  width: 100%; }
    #sidebar { float: left; width: 100%; display: block; margin:0 0 20px 0;}
    a.reval-btn-help { clear: left;}   
    .skyscraperright {  float: none; width: 100%; max-width: none; max-height: 133px;}
    .rev-block_50 { width: 100%;}
    a.reval-btn-help { clear: left;}
    a.reval-btn-add { clear: left;}
    /*    a.reval-btn { clear: left;}*/
    .form-block_50 { width: 100%; float: left;}
    a.mobile{display:block;}   
    a.desktop{display:none;}
    .table-heading-text {  display: none;     }
    p.hidden-header {      display:block;     }
    .table-actual-text {   width:100%; text-align: left !important; padding:5px 0px; float:left;    }
    .toggle-menu-icon {  display:block; }
    #jcn-header ul#dropdown, #gpn-header ul#dropdown {      display:none;     }
    .logo img {      width:60%; height:auto;     }
    .banner-area {     padding:10px 0;     }
    .data-display-left div.title  {  width: 100%; padding:10px 20px 0px;    }
.data-display-left div.desc  {  width: 100%; padding:0px 20px 10px;   }
}
@media screen and (min-width:321px) and (max-width:479px) {
    #main {width: 100%;}
    #content {  float: left;  margin-bottom: 0px; padding: 0;  width: 100%;}
    #sidebar { float: left; width: 100%; display: block; margin:0 0 20px 0;}
    a.reval-btn-help { clear: left;}
    .skyscraperright {  float: none; width: 100%; max-width: none; max-height: 133px;} 
    .rev-block_50 { width: 100%;}
    a.reval-btn-help { clear: left;}
    a.reval-btn-add { clear: left;}
    /*    a.reval-btn { clear: left;}*/
    .form-block_50 { width: 100%; float: left;}
    a.mobile{display:block;}   
    a.desktop{display:none;}
    .table-heading-text {  display: none;     }
    p.hidden-header {      display:block;     }
    .table-actual-text {   width:100%; text-align: left !important; padding:5px 0px; float:left;    }
    .toggle-menu-icon {  display:block; }
    #jcn-header ul#dropdown, #gpn-header ul#dropdown {      display:none;     }
    .logo img {      width:60%; height:auto;     }
    .banner-area {     padding:10px 0;     }
    .data-display-left div.title  {  width: 100%; padding:10px 20px 0px;    }
.data-display-left div.desc  {  width: 100%; padding:0px 20px 10px;   }
}
@media screen and (min-width:480px) and (max-width:639px) {
    #main {width: 100%;}
    #content {  float: left;  margin-bottom: 0px; padding: 0;  width: 100%;}
    #sidebar { float: left; width: 100%; display: block; margin:0 0 20px 0;}
    /*#sidebar .notstarted-circle { float: left; width: 10%; }
    #sidebar .underway-circle { float: left; width: 10%; }
    #sidebar .complete-circle { float: left; width: 10%; }
    #sidebar .icon-label { float: left; width: 40%; margin-left:0px; }*/

    .toggle-menu-icon {  display:block; }
    #jcn-header ul#dropdown, #gpn-header ul#dropdown {      display:none;     }

    a.reval-btn-help { clear: left;}
    .skyscraperright {  float: none; width: 100%; max-width: none; max-height: 133px;}  
    a.reval-btn-help { clear: left;}
    a.reval-btn-add { clear: left;}
    a.reval-btn { clear: left;}
    .form-block_50 { width: 100%; float: left;}
    a.mobile{display:block;}
    a.desktop{display:none;}
    /* width: 80%!important;
    left: 10%!important;
    top: 20%!important; */
    .table-heading-text {  display: none;     }
    p.hidden-header {      display:block;     }
    .table-actual-text {   width:100%; text-align: left !important; padding:5px 0px; float:left;    }
    .logo img {      width:60%; height:auto;     }
    .banner-area {     padding:10px 0;     }
    .data-display-left div.title  {  width: 100%; padding:10px 20px 0px;    }
.data-display-left div.desc  {  width: 100%; padding:0px 20px 10px;   }

}
@media screen and (min-width:640px) and (max-width:767px) {
    #content {  float: left;  margin-bottom: 50px; padding: 0 5% 0 5%;  width: 100%; box-sizing: border-box;}   
    #sidebar { float: left; width: 90%; display: block; box-sizing: border-box; margin:0 5% 20px 5%;}
    a.reval-btn-help { clear: left;}
    a.reval-btn-add { clear: left;}
    /*    a.reval-btn { clear: left;}*/
    .form-block_50 { width: 50%; float: left;}
    a.mobile{display:block;}   
    a.desktop{display:none;}
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 80%!important;
    left: 10%!important;
    top: 20%!important;
}
}
@media screen and (min-width:768px) and (max-width:959px) {
    a.mobile{display:block;}   
    a.desktop{display:none;}
    .form-block_50 { width: 100%; float: left;}
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 80%!important;
    left: 10%!important;
    top: 20%!important;
}
}
@media screen and (min-width:960px) and (max-width:1023px) {
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 80%!important;
    left: 10%!important;
    top: 20%!important;
}    
    
}
@media screen and (min-width:1024px) and (max-width:1279px) {
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 80%!important;
    left: 10%!important;
    top: 20%!important;
}   
    
}
@media screen and (min-width:1280px) and (max-width:1599px) {
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 70%!important;
    left: 15%!important;
    top: 20%!important;
}  
    
}
@media screen and (min-width:1600px) {
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 50%!important;
    left: 25%!important;
    top: 20%!important;
}    
    
}
@media screen and (min-width:1920px) {
    .ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.ui-dialog-buttons.ui-draggable.ui-resizable {
    width: 50%!important;
    left: 25%!important;
    top: 20%!important;
}
    
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {        background: transparent !important;        color: #000 !important;        box-shadow: none !important;        text-shadow: none !important;    }
    a, a:visited {        text-decoration: underline;    }
    a[href]:after {        content: " (" attr(href) ")";    }
    abbr[title]:after {        content: " (" attr(title) ")";    }
    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {        content: "";    }
    pre, blockquote {        border: 1px solid #999;        page-break-inside: avoid;    }
    thead {        display: table-header-group;    }
    tr, img {        page-break-inside: avoid;    }
    img {        max-width: 100% !important;    }
    @page {        margin: 0.5cm;    }
    p, h2, h3 {        orphans: 3;        widows: 3;    }
}


/* ===============
    ALL: IE Fixes
   =============== */

.ie7 .title { }


/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {    background-color: transparent;    border: 0;    overflow: hidden;    text-indent: -9999px;}
.ir:before {    content: "";    display: block;    width: 0;    height: 150%;}
.hidden {    display: none !important;    visibility: hidden;}
.visuallyhidden {    border: 0;    clip: rect(0 0 0 0);    height: 1px;    margin: -1px;    overflow: hidden;    padding: 0;    position: absolute;    width: 1px;}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {    clip: auto;    height: auto;    margin: 0;    overflow: visible;    position: static;    width: auto;}
.invisible {    visibility: hidden;}
.clearfix:before, .clearfix:after {    content: " ";    display: table;}
.clearfix:after {    clear: both;}
.clearfix {    zoom: 1;}