﻿/* LOGIN SCREEN */

body {
    font-size: 80%;
    padding-top: 97px;
}
.portals {
position: relative;
margin: 20px 0;
padding: 10px;
border: 2px solid grey;
border-radius: 15px;
background: white;
-webkit-box-shadow: 0px 2px 7px #000000;
-moz-box-shadow: 0px 2px 7px #000000;
box-shadow: 0px 2px 7px #000000;
}

h1 {
}

h2 {
    font-size: 2.2em;
    margin: 20px 0;
}

h3 {
    margin: .2em 0;
    font-size: 1.9em;
}

p {
    font-size: 16px;
}

.container {
    width: auto;
    position: relative;
}

.portals {
    border-radius: 0px;
    padding: 10px;
    margin: 0;
    box-shadow: 0 8px 8px grey, 0 -8px 8px grey;
    border: none;
}

.col1, .col2, .col3, .col4, .datefield {
    width: 100%;
    padding: 0;
    margin: 0;
    font-size: initial;
    padding: 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

#loggedInfo {
    
}

#Workgroups {
    font-size: 1.4em;
}

input[type="text"], .portals textarea, input[type="email"], .portals select, input[type="password"] {
    width: 100%;
    font-size: large;
    padding: 8px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

label {
    font-size: 1.5em;
}
/* HEADER */
header
{
    background: #1a2d5d; /* Old browsers */
    background: -moz-linear-gradient(top, #1a2d5d 1%, #0b7dc1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#1a2d5d), color-stop(100%,#0b7dc1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #1a2d5d 1%,#0b7dc1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #1a2d5d 1%,#0b7dc1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #1a2d5d 1%,#0b7dc1 100%); /* IE10+ */
    background: linear-gradient(to bottom, #1a2d5d 1%,#0b7dc1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a2d5d', endColorstr='#0b7dc1',GradientType=0 ); /* IE6-9 */
    border-bottom: 3px solid grey;
    position:absolute;
    z-index: 1000;
    top: 0;
    left:0;
    right:0;
    /*padding: 6px 0;*/
    -webkit-box-shadow: 0px 2px 7px #000000;
    -moz-box-shadow: 0px 2px 7px #000000;
    box-shadow: 0px 2px 7px #000000;
    /*overflow: hidden;*/
    height: 85px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
#headerLogo {
width: 340px;
margin: 5px auto;
}

.iconSheet
{
    background-image: url(./images/icons-White.png);
}

.footerSheet
{
    background-image: url(./images/icons-footer-Black.png);
}
/*#footerImage
{
    height:34px;
    width: 45%;
    background-position: 0 -122px;
    position:absolute;
    right:0;
}*/

#footerText {
    width: 50%;
}

#headerControl
{
    margin-bottom: 2px;
    min-width: 84px;
    text-align:right;
}
    #headerControl a
    {
        display: inline-block;
        width: 42px;
        height: 42px;
        margin-left: 7px;
    }

    /*#headerControl #settings, .settingsIco
    {
        background-position: 0 -210px;
        
    }
    #headerControl #settings:hover
    {
        background-position: -42px -210px;
        
    }

    #headerControl #loginBtn
    {
        background-position: 0 -42px;
    }
        #headerControl #loginBtn:hover
        {
            background-position: -42px -42px;
        }

    #headerControl #logoutBtn
    {
        background-position: 0 0;
    }
        #headerControl #logoutBtn:hover
        {
            background-position: -42px 0;
        }

.defaultIco
{
    background-position: 0 -462px;
}

.themesIco
{
    background-position: 0 -504px;
}

#headerControl #cancel
{
    background: url(./images//cancel.png) no-repeat;
}

#headerControl #incident, .incidentIco
{
    background-position:0 -126px;
}

#headerControl #officer, .officerIco
{
    background-position: 0 -168px;
}

#headerControl #homeBtn
{
    background-position: 0 -252px;
}
#headerControl #homeBtn:hover
{
    background-position: -42px -252px;
}

#homeButton
{
    background: url(./images/homeBtn.png) no-repeat;
}*/
    /*#headerControl a
    {
        display: block;
        width: 42px;
        height: 42px;
        float:right;
        background-position: 0 0;
    }*/

        /*#headerControl a:hover
        {
            background-position: 0 -42px !important;
        }*/

    /*#headerControl #settings, .settingsIco
    {
        background: url(./images//settings.png) no-repeat;
    }

    #headerControl #loginBtn
    {
        background: url(./images//login.png) no-repeat;
    }

    #headerControl #logoutBtn
    {
        background: url(./images//logout.png) no-repeat;
    }*/

/*.defaultIco
{
    background: url(./images//default.png) no-repeat;
}*/

/*.themesIco
{
    background: url(./images//themes.png) no-repeat;
}

#headerControl #cancel
{
    background: url(./images//cancel.png) no-repeat;
}

#headerControl #incident, .incidentIco
{
    background: url(./images//incident.png) no-repeat;
}

#headerControl #officer, .officerIco
{
    background: url(./images//officer.png) no-repeat;
}*/

/*#headerControl #homeBtn
{
    background: url(./images//home.png) no-repeat;
}*/
footer img
{
    float: right;
    width: 45%;
}

#buttons-nav
{
    float: right;
}

#loggedInfo
{
    margin: 10px 0;
    border-radius: 5px;
    padding: 6px;
    border: 1px inset;
    background: url(./images/announcementsBG.png);
    float: right;
}

    #loggedInfo strong
    {
        color: white;
        text-transform: capitalize;
        vertical-align: middle;
        display: inline;
        font-size: 14px;
    }

    #loggedInfo em
    {
        color: white;
        font-weight: 900;
        margin-left: 3px;
        display: inline-block;
    }
/* NAV */
nav {
    width: 100%;
}
nav a, #UploadAttachmentButton {
    margin-left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    background: #1a2d5d; /* Old browsers */
    background: -moz-linear-gradient(top, #1a2d5d 1%, #0b7dc1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#1a2d5d), color-stop(100%,#0b7dc1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #1a2d5d 1%,#0b7dc1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #1a2d5d 1%,#0b7dc1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #1a2d5d 1%,#0b7dc1 100%); /* IE10+ */
    background: linear-gradient(to bottom, #1a2d5d 1%,#0b7dc1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a2d5d', endColorstr='#0b7dc1',GradientType=0 ); /* IE6-9 */
    border: 2px solid grey;
    border-radius: 0;
    text-decoration: none;
    font-size: 2.2em;
    font-weight: bold;
    -webkit-box-shadow: 0px 2px 7px #000000;
    -moz-box-shadow: 0px 2px 7px #000000;
    box-shadow: 0px 2px 7px #000000;
    position: relative;
    text-align: center;
    width: 100%;
    display: block;
    position: relative;
    padding: 30px 20px 30px 40px;
}
    .navImg {
    margin: auto 0;
    position: absolute;
    left: 4px;
    bottom: 30%; 
    }
/* eIncident mobile!!*/
#createEIncident {
    margin-bottom: 5px;
}
#eIncidentForm input, #eIncidentForm input:not(.ui-spinner-input), #eIncidentForm .ui-spinner, #eIncidentForm select{
margin-bottom: 8px;
}


/* LOGIN PAGE */
#desktopImg {
    display: none;
}

#mobileImg {
    display: block;
    margin-left: 118px;
}

#loginField {
    margin-top: 0;
    width: 90%;
}
#workgroupInfo
{
    float: right;
}

.portalTitle {
    margin-bottom: 5px;
}

/* BOLO */
#slider
{
    width: 100%;
    height: 320px;
    overflow-x: hidden;
    overflow-y: hidden;
    white-space: nowrap !important;
    position: relative;
    margin: 0 auto;
}

#boloDiv
{
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    position: absolute;
    margin: 0;
    padding: 0;
    font-size: 0;
}
.boloTitle {
    display: block;
}
.slide
{
    font-size: 16px;
    display: inline-block;
    width: 100%;
    height: 320px;
    max-height: 320px;
    position: relative;
    overflow: hidden;
}

    .slide img
    {
        margin-top: 3px;
        max-height: 190px;
        width: auto;
        text-align:left;
        float:left;
        margin-right: 5px;
    }

    .slide h3 {
        display: block;
    }
.slideContent
{
    width: auto;
    margin-top: 0px;
}

    .slideContent article
    {
        padding: 0;
        display: block;
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 200px;
        height: 200px;
        width: auto;
        white-space: normal;
        margin-top: 3px;
        position:absolute;
        left:0;
    }

        .slideContent article p
        {
            font-size: 14px;
        }
            .slideContent article p a
            {
                font-size: 14px;
                display: block;
            }
    .slideContent section
    {
        position: absolute;
        font-style: italic;
        text-align: left;
        bottom: 0;
        left: 0;
        margin-left: 5px;
    }

    .slideContent article a
    {
        
        /*margin-bottom: 10px;
        white-space: pre-wrap;
        max-width: 245px;*/
    }

.announcementLink
{
    float:left;
    display:block;
    min-height: 20px;
    height: 20px;
    width: 97%;
    overflow:hidden;
    padding-left:2px;
}
.boloTitle
{
    width: 100%;
    display: block;
    margin: 1px;
    overflow: hidden;
}
.boloImage
{
    margin: 0 auto;
    float:left;
    left: auto;
    top:auto;
    /*position: absolute;
    left: 5px;
    top: 26px;*/
}

.control
{
    display: none;
    width: 42px;
    height: 61px;
    top: 50%;
    margin-top: -30px;
    position: absolute;
    cursor: pointer;
    background: url(./images/arrows.png) no-repeat;
}

    .control:hover
    {
        opacity: .6;
    }

#leftBtn
{
    background-position: 0 0;
    left: 0px;
    z-index: 1000;
}

#rightBtn
{
    background-position: -42px 0;
    right: 0px;
}

.slideContent section {
    position: absolute;
    font-style: italic;
    text-align: left;
    bottom: 0;
    left: 0;
    margin-left: 5px;
}
.menu.edit-delete-dateBolo {
position: absolute;
bottom: 0;
font-style: italic;
color: grey;
left: 0;
font-size: 16px;
}

/*  DISPLAYS */
/* ANNOUNCEMENTS DISPLAY */ /* LINKS */
#displays
{
    margin: 40px 0 20px 0;
    position: relative;
}

#displays article:hover, #displays .link:hover, .hilightRow:hover
{
    background: url(./images/hoverBG.png);
}

.announcementsCol {
    margin-top: 2em;
    width: auto;
    float: none;
    padding-bottom: 20px;
}

.announcementsCol a {
font-size: 1.6em;
padding-bottom: 17px;
}

article p {
    margin-top: .3em;
}

.linksCol {
    margin-top: 2em;
    width: auto;
    float: none;
    padding-bottom: 20px;
}

.fullView
{
    margin-top: 2em;
    width: auto;
}

.mobileLayout
{
    width:100%;
}
.mobileHeader
{
    width: 100%;
    position:fixed;
    z-index: 1000;
    left:0;
    right:0;
    top:0;
}

menu.edit-delete-date {
    position: absolute;
    bottom: 0;
    font-style: italic;
    color: grey;
    right: 0;
    font-size: 16px;
}
article p {
padding-bottom: 24px;
}
.date {
margin-bottom: 4px;
}

.delete {
    float: left;
    width: 30px;
    height: 30px;
    background-size: 27px;
    margin-right: 3px;
}

.edit {
    width: 30px;
    height: 30px;
    background-size: 27px;
    float: left;
}

.date {
    font-size: inherit;
}

#displays {
    padding-bottom: 20px;
}
.moreDisplays
{
    position: absolute;
    bottom: 3px;
    left: 0;
    width: 25px;
    height: 25px;
    cursor: pointer;
    background: url(./images/arrowDwn.png) no-repeat;
}

    .moreDisplays:hover
    {
        opacity: .6;
    }
.moreBtn {
    bottom: -20px;
    right: 0;
}

#announcements {
    width: auto;
}

    #announcements article {
        margin-bottom: 10px;
        border-bottom: 1px grey dashed;
    }

#linksCol {
    width: 100%;

}

    #links article {
        padding-bottom: 10px;
        margin-bottom: 10px;
        border-bottom: 1px grey dashed;
    }



#workgroup {
    margin-bottom: 10px;
}




/* EINCIDENTS */
#addEntityBtns {
    width: 100%;
    margin-bottom: 0px;
    margin-top: 20px;
    margin-left: 0;
    margin-right:0
}

#mainForm {
padding: 10px;
}
    #addEntityBtns a {
        float: none;
        font-size: x-large;
        margin: 0 auto 6px auto;
        text-align: left;
        padding: 20px 30px 30px 70px;
    }

.addEnt {

}

.required
{
    padding-left: 15px;
    margin-left: -7px;
    padding-top: 5px;
    margin-top: -5px;
    background: url(./images/req.png) no-repeat;
}

.not-required {
    padding-left: 15px;
    margin-left: -7px;
    padding-top: 5px;
    margin-top: -5px;
}

#incidentAttachments {
    float: none;    
}
    #incidentAttachments a {        
        text-align: left;
        padding-bottom: 30px;
    }

#UploadAttachmentButton {
    display: block;
    border-radius: 0;
    font-size: x-large;
    width: 100%;
    margin-bottom: 0px;
    margin-top: 0px;
    margin-left: 0;
    margin-right: 0;
    padding: 20px 30px 30px 70px;
}
.entityCount {
    
    float: right;    
}

.eIncidentDialog {
    width: 100% !important;
}

#Summary {

}
#adminAddTabs li {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    font-size: x-large;
    text-align: center;
}

#detailsDiv {
    margin-top: 0;
    font-size: 1.3em;
}

/* Mobile Workgroup DropDown */
.styled-select select
{
    background: transparent;
    width: 24px;
    height: 24px;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: none;
    opacity: 0;
    cursor: pointer;
    direction: rtl;
    margin-left: -10px;
}

.styled-select:hover
{
    opacity: 0.6;
}


.styled-select
{
    width: 24px;
    height: 24px;
    background: url(./images/ddStyled-White.png) no-repeat right transparent;
    display: block;
    float:right;
    margin-top: 0px;
    margin-right: 3px;
}

#mobile-workgroupLogo
{
    display:block;
    float:left;
    vertical-align:middle;
    width: 65%;
}
#mobile-workgroupLogo img
{
    max-height: 75px;
}
#userInfo
{
    margin-right: 0px;
}
#userInfo
{
    background-color: transparent;
    background-image: none;
    color: white;
    padding:0;
    margin-top:0;
    border-radius: 0;
    border: none;
    vertical-align:middle;
    font-size: 12px;
    width: 33%;
    text-align:right;

}

    #userInfo strong
    {
        font-weight: 700;
    }

    #userInfo em
    {
        font-style: italic;
    }

#workgroupName
{
    margin-top:7px;
    padding-right: 3px;
    text-align:right;
    display:block;
}

.absoluteCenterWrapper
{
    position: relative; /* Contains the image in the div */
    min-width:0px;
    height: 75px;
    float: left;
}
/* Positioning */
.absoluteCenter
{
    margin: auto; /* Required */
    position: absolute; /* Required */
    top: 0;
    bottom: 0; /* Aligns Vertically */
}
footer {
margin-top: 15px;
}
    footer p
    {
        float: left;
        margin-top: 0px;
        font-size: 12px;
        width: 80%;
        display:block;
    }
    footer img
    {
        display:block;
        float: right;
        width: 20%;
    }

#incidentAttachments
{
    margin-bottom: 15px;
}