﻿/*
  | Version 10.2
 | Copyright 2012 Esri
 |
 | Licensed under the Apache License, Version 2.0 (the "License");
 | you may not use this file except in compliance with the License.
 | You may obtain a copy of the License at
 |
 |    https://www.apache.org/licenses/LICENSE-2.0
 |
 | Unless required by applicable law or agreed to in writing, software
 | distributed under the License is distributed on an "AS IS" BASIS,
 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 | See the License for the specific language governing permissions and
 | limitations under the License.
 */
/* This file contains the mobile specific style settings for "My Government Services" template */
/* The common settings for the styles are defined in "myGovernmentServices.css" */
/* Use this file to perform the following: */
/* 1.  Set the body styles                      - { Style(s) to look for: html, body } */
/* 2.  Set styles for icons, buttons and header styles
                                                - { Style(s) to look for: customButton,tableHeader,tdlHeader,tdHeader,imgOptions,imgShare}*/
/* 3.  Set the styles for search container      - { Style(s) to look for: divAddressContainer,divAddressHolder,imgLocate,bottomborder,divAddressPlaceHolder}*/

/* 4.  Set the styles for layer information display container
                                                 - { Style(s) to look for: divDataListContainer,divRepresentativeDataContainer,divDataListContent,divRepresentativeScrollContent,
                                                      divRepresentativeDataContainer,divContentStyle,divRepresentativeDirectionScrollContent,mblListItemTextBox,mblListItemIcon,
                                                      mblEdgeToEdgeList,mblListItemAnchor,divMobileContainerDetails,divMobileContainerView,opacityHideAnimation,
                                                      opacityShowAnimation}*/
 /* 5.  Set the styles for esri slider           - { Style(s) to look for: esriSimpleSlider}*/
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* Styles for body*/

html, body
{
    font-size: 15px !important;
}

/*---------------------------------------------------------------------------------------------------------*/
/*styles for icons, buttons and header styles*/

.customButton
{
    height: 35px !important;
}

.tableHeader
{
    width: 200px !important;
}

.tblHeader
{
    height: 52px !important;
}

.tdHeader
{
    width: 70px;
    font-weight: bolder;
    padding: 0px 10px 0px 10px;

}

.imgOptions,.imgShare
{
    height: 44px !important;
    width: 44px !important;
    vertical-align: middle;
}

/*---------------------------------------------------------------------------------------------------------*/
/*Styles for address container*/

.divAddressContainer
{
    top: 0px;
    left: 0px;
    background: rgba(0,0,0,0.9);
    position: absolute;
    z-index: 1008;
    width: 100%;
    height: 100%;
}

.divAddressHolder
{
    z-index: 1008;
    width: 100%;
    height: 100%;
    background-color: rgba(98, 98, 98,.95);
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 0 10px #fff;
    -moz-box-shadow: 0 0 10px #fff;
    -o-box-shadow: 0 0 10px #fff;
    box-shadow: 0 0 10px #fff;
}

.imgLocate
{
    height: 44px !important;
    width: 44px !important;
}

.bottomborder
{
    height :40px;
}

.divAddressPlaceHolder
{
  height: 44px !important;
  line-height: 34px;

}

/*---------------------------------------------------------------------------------------------------------*/
/*Styles for share application container*/

.divAppContainer
{
   z-index: 1006;
}

/*---------------------------------------------------------------------------------------------------------*/
/*Styles for layer information display container*/

.divDataListContainer, .divRepresentativeDataContainer, .divDataListContent, .divRepresentativeScrollContent
{
    overflow: hidden;
    position: relative;
}

.divRepresentativeDataContainer,.divRepresentativeScrollContent
{
   padding-left: 0px !important;

}

.divRepresentativeDataContainer
 {
        width: 100%;
}

.divContentStyle
{
    align: left;
    padding-left: 0px;
    background-color: #585858!important;
    position: relative;
    behavior: url("styles/PIE.htc");
    overflow: hidden;
}

.divRepresentativeDirectionScrollContent
{
    overflow: hidden;
    position: relative;
}

.mblListItemTextBox
{
    text-align: left !important;
}

.mblListItemIcon
{
    float: right;
    right: 10px !important;
    top: 2px !important;
    height: 44px !important;
    width: 44px !important;
    vertical-align: middle;
    margin-top: 2px!important;
}

.mblEdgeToEdgeList
{
    margin-right: 5px;
    background-color: #585858 !important;
}

.mblListItem
{
    color: #fff !important;
    height: 50px !important;
    line-height: 50px !important;
    padding-left: 10px !important;
}
.mblListItemAnchor
{
    padding-left: 0px !important;
}

.divMobileContainerDetails
{
    z-index: 1001;
    background-color: #585858;
    width: 100%;
    height: 100%;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 0 10px #fff;
    -moz-box-shadow: 0 0 10px #fff;
    -o-box-shadow: 0 0 10px #fff;
    box-shadow: 0 0 10px #fff;
}

.divMobileContainerView
{
    top: 0px;
    left: 0px;
    background-color: #282828;
    position: absolute;
    z-index: 10000;
    width: 100%;
    height: 100%;
}

.opacityHideAnimation
{
    visibility: hidden;
    opacity: 0;
    -webkit-transition: visibility 0s linear 0.5s, opacity 0.5s ease-in;
    -moz-transition: visibility 0s linear 0.5s, opacity 0.5s ease-in;
    -o-transition: visibility 0s linear 0.5s, opacity 0.5s ease-in;
}

.opacityShowAnimation
{
    visibility: visible;
    opacity: 1;
    -webkit-transition: opacity 0.5s ease-in;
    -moz-transition: opacity 0.5s ease-in;
    -o-transition: opacity 0.5s ease-in;
}

.divDataListContent
{
    width: 100%;
   height: 300px;
}

.divContentStyle
{
      width: 100%;
}

.divRepresentativeScrollContent
{
     width: 100%;

}

.divRepresentativeDirectionScrollContent
{
          width: 100%;
 }
.trToggleHeader
{
 font-family: Verdana;
    }
/*---------------------------------------------------------------------------------------------------------*/
/* esri slider style*/
.esriSimpleSlider
{
   left: 5px !important;
   top: 60px !important;
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*Styles for text area control*/

/* Portrait */

@media screen and (max-width: 320px)
{
     .txtAddress
    {
      height: 44px !important;
      font-size: 15px !important;
      width: 85% !important;
      padding: 0px !important;
    }
}

/* Landscape */

@media screen and (min-width: 321px) and (max-width: 480px)
{
    .txtAddress
    {
      height: 44px !important;
      font-size: 15px !important;
      width: 90% !important;
     padding: 0px !important;

    }
}
