﻿/* CSS for Mobiles */
@media only screen and (max-width: 767px)
{
    .esriCTMainContainer
    {
        height: calc(100% - 61px);
    }

    /*Melissa changed from height: calc(100% - 105px); to expand map to bottom of screen after removing submit button*/
   .esriCTMap
    {
        height: 100%;
    }

    #mapParentContainer .esriCTListHeader
    {
        display: block;
    }
    
    /*Melissa changed to none to remove submit button*/
    #mapParentContainer .esriCTReportButton
    {
        display: none;
    }

    #mapParentContainer, #sideContainer
    {
        width: 100% !important;
        border-width: 0px; /* To remove the left border of the containers */
    }

    #mapParentContainer
    {
        display: none;
    }

    #sideContainer
    {
        display: block !important;
    }

    .esriCTLoaderParent
    {
        width: 100%;
    }
    /* App header icons */

    .esriCTHeaderIcons
    {
        height: 44px !important;
        width: 44px !important;
        background-size: 44px !important;
    }

    .esriCTDesktopIcons
    {
        display: none;
    }

    .esriCTMobileIcons
    {
        display: block;
    }

    .esriCTMobileHelpIcon
    {
        display: none;
    }

    .esriCTHeaderContainer
    {
        height: 75px;
    }

    .esriCTMenuTabLeft
    {
        line-height: 70px;
        background-image: url(../images/banner_ped_thumbnail.png );
    background-repeat: no-repeat;
    }
    
    .esriCTListHeader {height:50px}
    
    .esriCTIssueListContainer
{
    margin-top: 50px;
}
    
    #floater 
{
    position:absolute;
    top:185px;
    right:10px;
    width:85px;
    height:330px;
    z-index:999!important;
    /*visibility:hidden;*/
    background-color:white;
    border: solid 1px #999;
   border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius: 3px; 
  padding:0px !important;
}

    .esriCTApplicationIcon
    {
        height: 59px;
        max-height: 59px;
    }

    .esriCTHelpIcon
    {
        height: 24px;
        width: 24px;
        background-size: 24px;
        margin-top: 15px !important;
    }
    /* End of App header icons */

    /* GeoForm Styles */

    .esriCTGeoFormParentContainer
    {
        width: 100%;
        left: 0;
    }
    /* End of GeoForm Styles */

    .esriCTCloseButton
    {
        margin-right: 24px;
    }

    .esriCTIssueWallMapItButton
    {
        display: block;
    }
    
    /*Melissa added to decrease button size on mobile*/
    .esriCTDetailsCommentButton
    {
     width: 43%;  /*23%*/
    }
    
    .esriCTDetailsPanelButton
    {
     width: 33%;  /*23%*/
    }

    /*.esriCTButtonLabel {
        display:none;
    }   --turning off to display button text on mobile*/

    .esriCTMapItButtonVisibility
    {
        display:inline;
    }
    /* help dialog css Start*/
    .esriCTModelDialog
    {
        top: 0px;
        width: 100%;
        height: 100%;
    }

    .esriCTModelDialog .modal-content
    {
        height:100%;

    }

    .esriCTModelDialog .modal-body
    {
        overflow: auto;
        height: calc(100% - 60px);
     }

    .modal-dialog
    {
        margin:0px;
    }

    .modal-open .modal
    {
        overflow-y: hidden;
    }
    /* help dialog css END*/
    
    /* Basemap and Legend widget CSS*/
    .esriCTOnScreenWidgetContainer 
    {
        top:130px;
    }

    /*.esriCTOnScreenWidgetContainer {
        left: 0px;
        top: 0px;
        height: calc(100% - 50px);
        width: 100%;
    }

    .esriCTOnScreenWidgetWrapper {
        height: 100%;
        width: 100%;
        overflow: auto;
    }*/

    /*Basemap and Legend widget CSS END*/
    

    .esriCTInfoImg
    {
        background-size: 20px;
        height: 20px;
        width: 20px;
    }

    .esriCTInfoImgRight
    {
        padding: 0;
        margin-right: 5px;
    }
    
    .tabPadding 
    {
     padding:50px 10px 10px 10px;
    }
}

/* CSS for MiniTablets */

@media only screen and (min-width: 480px) and (max-width:767px)
{
    .esriCTHeaderIcons
    {
        height: 44px !important;
        width: 44px !important;
        background-size: 44px !important;
    }

    .esriCTHeaderContainer
    {
        height: 75px;
    }

    .esriCTApplicationIcon
    {
        height: 59px;
        max-height: 59px;
    }

    .esriCTMainContainer
    {
        height: calc(100% - 61px);
    }

    .esriCTMenuTabLeft
    {
        line-height: 70px;
        background-image: url(../images/banner_ped_thumbnail.png );
     background-repeat: no-repeat;
    }
    
    .esriCTListHeader {height:50px}
    
    .esriCTIssueListContainer
{
    margin-top: 50px;
}
    
    #floater 
{
    position:absolute;
    top:185px;
    right:10px;
    width:85px;
    height:330px;
    z-index:999!important;
    /*visibility:hidden;*/
    background-color:white;
    border: solid 1px #999;
   border-radius:3px;
  -moz-border-radius:3px;
  -webkit-border-radius: 3px; 
  padding:0px !important;
}

    /*.esriCTButtonLabel {
        display:none;
    }   --turning off to display button text on mobile*/   

    .esriCTMapItButtonVisibility
    {
        display:inline;
    }
}

/* CSS for Tablet and iPad */
@media only screen and (min-width: 767px) and (max-width:1024px)
{

}

/* CSS for Devices other than desktop browser */
@media screen and (max-width:1024px)
{

    .esriCTHeaderFont
    {
        font-size: 17px;
    }

    .esriCTSigninAppCaptionDiv
    {
        height: 45px;
    }

    .esriCTHeaderIcons
    {
        height: 44px !important;
        width: 44px !important;
        background-size: 44px !important;
    }

    .esriCTHeaderContainer, .esriCTApplicationHeader
    {
        height: 75px;
    }

    .esriCTApplicationIcon
    {
        height: 59px;
        max-height: 59px;
    }

    .esriCTMainContainer
    {
        height: calc(100% - 61px);
    }

    .esriCTMenuTabLeft
    {
        line-height: 70px;
    }

    .esriCTHeaderIcons
    {
        margin: 8px 24px;
    }

    /* GeoForm Styles */

    .esriCTAttachmentSelectedCount
    {
        margin-top: 38px;
        float: none;
        margin-left: 0px;
    }
    /* End of GeoForm Styles */

    /* Start New app header */
    .esriCTLoginUserNameDiv
    {
        margin-top: 23px;
    }

    .esriCTHelpIcon
    {
       margin-top: 22px;
    }

    .esriCTCaretIcon
    {
        margin-top: 23px;
    }
    .esriCTOptions
    {
        top: 60px;
    }

    /* End New app header */

}

/* CSS for Devices other than mobile */
@media screen and (min-width: 768px)
{
    #mobileMenuContainer
    {
        display: none !important;
    }

    #mapParentContainer
    {
        width: 70%;
        display: block !important;
    }

    #sideContainer
    {
        width: 30%;
        display: block !important;
    }

    .esriCTCloseButton
    {
        margin-right: 24px;
    }
}

/* CSS for retina images for retina devices like ipad / tablets etc. */
@media only screen and (min-device-width : 319px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2)
{
    .esriCTSigninOrDiv
    {
        background-image: url('../images/seperator-2x.png') !important;
    }

}
