/* -----------------------------------------------------------

    Project: CHAMBERLAIN.MyQresponsive
    Author: Nate Arnold (narnold@nerdery.com)

 ---------------------------------------------------------- */

/* ---------------------------------------------------------------------
 Reset
 ----------------------------------------------------------------------- */

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url(//fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGOode0-EuMkY--TSyExeINg.woff2) format('woff2'), url(//fonts.gstatic.com/s/sourcesanspro/v9/toadOcfmlt9b38dHJxOBGNbE_oMaV8t2eFeISPpzbdE.woff) format('woff');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url(//fonts.gstatic.com/s/sourcesanspro/v9/ODelI1aHBYDBqgeIAH2zlNV_2ngZ8dMf8fLgjYEouxg.woff2) format('woff2'), url(//fonts.gstatic.com/s/sourcesanspro/v9/ODelI1aHBYDBqgeIAH2zlBM0YzuT7MdOe03otPbuUS0.woff) format('woff');
}

#deviceList {
    min-height: 224px;
}

.flipperContainer {
    min-height: 524px;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video
{
    font: inherit;
    font-size: 100%;

    margin: 0;
    padding: 0;

    vertical-align: baseline;

    border: 0;
}

/* HTML5 display-role reset for older browsers */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section
{
    display: block;
}

body
{
    line-height: 1;
}

ol,
ul
{
    list-style: none;
}

blockquote,
q
{
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after
{
    content: '';
    content: none;
}

table
{
    border-spacing: 0;
    border-collapse: collapse;
}

/* ---------------------------------------------------------------------
 Global Styles
 ----------------------------------------------------------------------- */

body
{
    font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;

    color: #666;
}

a
{
    text-decoration: none;

    color: #1e3150;
}

img
{
    max-width: 100%;
    height: auto;
}

strong
{
    font-weight: 600;
}

label
{
    cursor: pointer;
}

.mixin-gradient
{
    background: #fff;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(40%, #fff), color-stop(100%, #f0f0f0));
    background: -webkit-linear-gradient(top, #fff 40%, #f0f0f0 100%);
    background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f0f0f0));
    background:         linear-gradient(to bottom, #fff 40%, #f0f0f0 100%);
}

.mixin-clearfix:before,
.mixin-clearfix:after
{
    display: table;

    content: ' ';
}

.mixin-clearfix:after
{
    clear: both;
}

.header-crown
    {
        margin-bottom: 30px;
        padding: 0 0 8px;

        background-color: #1e3150;
    }

.header-switchAccount {
    margin-bottom: 0;
    padding: 8px 0 10px 0;
    background-color: #3199cc;
    color: #fff;
    display: none;
}

    .accountSelect {
        font-size: 14px;
        line-height: 1;
        display: block;
        float: left;
        /*min-width:250px;*/
        margin: 0;
        padding: 8px 0 0 30px;
        color: #fff;
        font-weight: bold;
        
    }

    .admin {
        background: url("/Content/Assets/images/admin_icon.png") no-repeat left center;
    }
    .family {
        background: url("/Content/Assets/images/family_icon.png") no-repeat left center;
    }
    .guest {
        background: url("/Content/Assets/images/guest_icon.png") no-repeat left center;
    }

    .header-switchAccount div.fancy-select div.trigger {
        position: relative;
        overflow: visible !important;
        /*min-width: 150px;*/
        height: 22px;
        padding: 0 10px 0 0;
        cursor: pointer;
        -webkit-transition: all 240ms ease-out;
        transition: all 240ms ease-out;
        white-space: nowrap;
        /*text-overflow: ellipsis;*/
    }

    .header-switchAccount div.fancy-select div.trigger::after {
        position: absolute;
        top: 4px;
        right: 0;
        display: block;
        width: 0;
        height: 0;
        content: '';
        border: 5px solid transparent;
        border-top-color: transparent;
    }

     .header-switchAccount div.fancy-select div.trigger.open::after {
    border-top-color: transparent;
}

     .header-switchAccount div.fancy-select ul.options li.selected {
    /*background: #04bb08;*/
}

/* ---------------------------------------------------------------------
 Footer
 ----------------------------------------------------------------------- */

.footer
{
    margin: 40px 0 0;
    padding: 30px 0;

    color: white;
}

/* ---------------------------------------------------------------------
 Header
 ----------------------------------------------------------------------- */

.header
{
    padding: 0 0 30px;

    background-repeat: no-repeat;
    background-position: center bottom;
    -webkit-background-size: cover;
            background-size: cover;
}

.header-crown
{
    margin-bottom: 15px;
    padding: 0 0 8px;
}


.mix-header_center
{
    text-align: center;
}

/* ---------------------------------------------------------------------
 appIcon
 ----------------------------------------------------------------------- */

.appIcon
{
    display: inline-block;

    width: 100px;
    margin: 15px 15px 0 0;
    padding: 0;
}

.appIcon-img
{
    width: 100%;
    height: auto;
}

/* ---------------------------------------------------------------------
 Logo
 ----------------------------------------------------------------------- */

.appLogo
{
    display: block;

    width: 100%;
    height: auto;
    margin: 0 auto 15px;
}

.appLogo_right
{
    float: right;

    width: 60%;
    margin: 10px 0 0;
}

/* ---------------------------------------------------------------------
 Box
 ----------------------------------------------------------------------- */

.box
{
    margin: 0 0 20px;
    padding: 20px;
}

.box:before,
.box:after
{
    display: table;

    content: ' ';
}

.box:after
{
    clear: both;
}

.box-media
{
    float: none;

    width: 85px;
    height: 85px;
    margin: 0 auto 10px;

    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
            background-size: cover;
}

.box-bd
{
    overflow: hidden;
}

/* ---------------------------------------------------------------------
 Buttons
 ----------------------------------------------------------------------- */

.btn
{
    font-size: 12px;
    font-weight: 600;
    line-height: 1;

    display: inline-block;

    min-width: 60px;
    margin: 0;
    padding: 10px 18px;

    cursor: pointer;
    text-align: center;
    text-decoration: none;
    letter-spacing: 1.8px;
    text-transform: uppercase;

    color: #fff;
    border-radius: 6px;
}



.btn:hover,
.btn:active
{
    color: #fff;
}

.btn_alt:hover,
.btn_alt:active
{
    color: #fff;
}

.btn_icon
{
    min-width: 40px;
    padding: 0;

    vertical-align: baseline;
}

.btn_narrow
{
    padding: 6px;
}

.btn_block
{
    display: block;
}

.btn_large
{
    font-size: 14px;

    position: relative;

    margin-bottom: 20px;
    padding: 20px 30px;
}

.btn_large i
{
    position: absolute;
    top: 50%;
    right: 18px;

    margin-top: -9px;
}

.btn_rule
{
    position: relative;

    overflow: hidden;

    cursor: pointer;
}

.btn_confirm
{
    margin: 10px 10px 0 0;
    padding: 8px 12px;
}



/* ---------------------------------------------------------------------
 card
 ----------------------------------------------------------------------- */

.card
{
    position: relative;

    min-height: 340px;
    padding: 80px 20px 40px;

    background: #fff;
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, .3);
            box-shadow: 0 0 2px rgba(0, 0, 0, .3);
}

.card_small
{
    padding: 80px 20px 40px;
}

.card_hidden
{
    display: none;
}

.card-hd
{
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    left: 0;
}

.card-hd-title
{
    font-size: 16px;
    font-weight: 400;
    line-height: 1;

    display: block;

    width: 100%;
    margin: 0;
    padding: 10px 0;

    text-align: center;

    color: #fff;
}

.card-actions
{
    position: absolute;
    top: 50px;
    right: 10px;
    left: auto;

    margin: 0;
    padding: 0;

    list-style: none;
}

.card-actions > *
{
    display: inline-block;
}

.card-bd
{
    padding: 30px 0 15px;
}

/* ---------------------------------------------------------------------
 cardContainer
 ----------------------------------------------------------------------- */

.cardContainer
{
    margin: 0 0 40px;
    padding: 20px 0 0;

    background: #f0f0f0;
    -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, .3);
            box-shadow: inset 0 0 2px rgba(0, 0, 0, .3);
}

.cardContainer_pad
{
    padding: 20px 0;
}

/* ---------------------------------------------------------------------
 centeredList
 ----------------------------------------------------------------------- */

.centeredList
{
    list-style: none;

    text-align: center;
}

.centeredList > *
{
    display: inline-block;
}

/* ---------------------------------------------------------------------
 Checkbox
 ----------------------------------------------------------------------- */

.checkbox
{
    font-size: 13px;

    overflow: hidden;

    text-align: left;
}

.checkbox .input_checkbox ~ div label:before
{
    font-size: 14px;
    margin-right: 4px;
}

/* ---------------------------------------------------------------------
 Circles
 ----------------------------------------------------------------------- */

.circles
{
    margin: 0 auto;

    text-align: center;
}

.circles > *
{
    font-size: 120%;

    position: relative;

    display: block;
    overflow: hidden;

    width: 200px;
    height: 0;
    margin: 0 auto 20px;
    padding: 30px 40px 250px;

    border-radius: 50%;
    background-color: #fff;
}

/* ---------------------------------------------------------------------
 Container
 ----------------------------------------------------------------------- */

.container
{
    position: relative;

    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}

.container:before,
.container:after
{
    display: table;

    content: ' ';
}

.container:after
{
    clear: both;
}

/* ---------------------------------------------------------------------
 ContentInfo
 ----------------------------------------------------------------------- */

.contentInfo
{
    font-size: 12px;

    display: block;

    padding: 30px 0 0;
}

.contentInfo > *
{
    display: block;
}

/* ---------------------------------------------------------------------
 Device
 ----------------------------------------------------------------------- */

.device
{
    position: relative;

    text-align: center;
}

.device-location
{
    /*font-size: 18px;*/

    text-transform: uppercase;
     overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.device-name
{
     display: block;
    font-size: 18px;
    font-weight: bold;
    line-height: 24px;
    height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gatewayEntryText {
     overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
     display: block;
}
.device-img
{
    /*position: relative;*/
    z-index: 2;
    float: left;
    width: auto;
    height: 150px;
    margin: 0 auto;
}

.device-loader
{
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;

    margin-left: -16.5px;
}

/* ---------------------------------------------------------------------
 deviceContainer
 ----------------------------------------------------------------------- */

#deviceList
{
    padding-bottom: 40px;
}

/* ---------------------------------------------------------------------
 deviceRule
 ----------------------------------------------------------------------- */

.deviceRule + .deviceRule
{
    padding-top: 10px;
    display:block;
}

.deviceRule-name
{
    font-size: 20px;
    font-weight: 400;

    text-transform: uppercase;
     overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ---------------------------------------------------------------------
 fancySelect
 https://github.com/octopuscreative/FancySelect
 ----------------------------------------------------------------------- */

div.fancy-select
{
    position: relative;
}

div.fancy-select.disabled
{
    opacity: .5;
}

div.fancy-select div.trigger
{
    position: relative;

    overflow: hidden;

    width: 56px;
    height: 13px;
    padding: 0 10px 0 0;

    cursor: pointer;
    -webkit-transition: all 240ms ease-out;
            transition: all 240ms ease-out;
    white-space: nowrap;
    text-overflow: ellipsis;
}

div.fancy-select div.trigger:after
{
    position: absolute;
    top: 4px;
    right: 0;

    display: block;

    width: 0;
    height: 0;

    content: '';

    border: 5px solid transparent;
    border-top-color: #fff;
}

div.fancy-select div.trigger.open:after
{
    border-top-color: #f0f0f0;
}

div.fancy-select ul.options
{
    position: absolute;
    z-index: 50;
    top: 50px;
    left: 0;

    visibility: hidden;
    overflow: auto;

    min-width: 140px;
    max-height: 200px;
    margin: 0;

    list-style: none;

    -webkit-transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;
            transition: opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;

    opacity: 0;
    color: #666;
    border-radius: 6px;
    background: #f0f0f0;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
            box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}

div.fancy-select ul.options.open
{
    top: 32px;

    visibility: visible;

    -webkit-transition: opacity 300ms ease-out, top 300ms ease-out;
  /* have to use a non-visibility transition to prevent this iOS issue (bug?): */
  /*http://stackoverflow.com/questions/10736478/css-animation-visibility-visible-works-on-chrome-and-safari-but-not-on-ios*/
            transition: opacity 300ms ease-out, top 300ms ease-out;

    opacity: 1;
}

div.fancy-select ul.options li
{
    padding: 8px 12px;

    cursor: pointer;
    -webkit-transition: all 150ms ease-out;
            transition: all 150ms ease-out;
    white-space: nowrap;
}

div.fancy-select ul.options li.selected
{
    color: #fff;
}

div.fancy-select ul.options li.selected:hover
{
    color: #fff;
}

div.fancy-select ul.options li.hover
{
    color: #1e3150;
}

/* ---------------------------------------------------------------------
 flipperContainer
 ----------------------------------------------------------------------- */

.flipperContainer
{
    width: 100%;
    margin-bottom: 60px;

    -webkit-transition: height .2s linear;
            transition: height .2s linear;
    -moz-transform: perspective(1000px);
     -ms-transform: perspective(1000px);

    -webkit-perspective: 1000;
        -ms-perspective: 1000;
            perspective: 1000;
    -moz-transform-style: preserve-3d;
     -ms-transform-style: preserve-3d;
}

#schedulecardpanel
{
    margin-bottom: 60px;
}
/* ---------------------------------------------------------------------
 flipper
 ----------------------------------------------------------------------- */

.flipper
{
    position: relative;

    -webkit-transition: .6s;
            transition: .6s;
    -moz-transform: perspective(1000px);

    -webkit-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.flipper-front,
.flipper-back
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;

    -webkit-transition: .6s;
            transition: .6s;
    -webkit-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
            transform: rotateY(0deg);

    background-color: #fff;

    -webkit-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.flipper-front
{
    z-index: 2;

    -webkit-transform: rotateY(0);
        -ms-transform: rotateY(0);
            transform: rotateY(0);
}

.flipper-back
{
    z-index: 1;

    -webkit-transform: rotateY(-180deg);
        -ms-transform: rotateY(-180deg);
            transform: rotateY(-180deg);
}

.flipper.flipped > .flipper-back
{
    z-index: 2;

    -webkit-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
            transform: rotateY(0deg);

    webkit-transform: rotateY(0deg);
}

.flipper.flipped > .flipper-front
{
    z-index: 1;

    -webkit-transform: rotateY(180deg);
        -ms-transform: rotateY(180deg);
            transform: rotateY(180deg);
}

/* ---------------------------------------------------------------------
 formOptions
 ----------------------------------------------------------------------- */

.formOptions
{
    padding: 15px 0 0 20px;
}

.formOptions-toggles
{
    padding: 10px 0 20px;
}

/* ---------------------------------------------------------------------
 formField
 ----------------------------------------------------------------------- */

.formField
{
    position: relative;

  /* Necessary for hiding checkboxes & radio buttons */
    overflow: hidden;

    margin-bottom: 10px;
}

/* ---------------------------------------------------------------------
 formContainer
 ----------------------------------------------------------------------- */

.formContainer-fields
{
    margin-bottom: 20px;
    padding: 15px 15px 5px;

    border: 1px solid #666;
    border-radius: 12px;
    background-color: #f0f0f0;
}

.formContainer-indent
{
    padding: 10px 0 0 0;
}

.formContainer-ft_pad
{
    padding: 40px 0 0 0;
}

.formContainer-callous
{
    padding: 15px 0 0;
}

/* ---------------------------------------------------------------------
 12 Column Grid
 ----------------------------------------------------------------------- */

.grid:before,
.grid:after
{
    display: table;

    content: ' ';
}

.grid:after
{
    clear: both;
}

.phoneOnly {
    display: none;
}
/* ---------------------------------------------------------------------
 Hero
 ----------------------------------------------------------------------- */

.hero
{
    position: relative;

    display: none;
    overflow: hidden;

  /* Hides pseudo class on highlighted headings */
    width: 100%;
    height: 600px;

    -webkit-transition: all .3s ease-in;
            transition: all .3s ease-in;

    background: #8bdff8 url('/Content/Assets/images/hero.jpg') no-repeat center center;
    background-attachment: fixed;
    -webkit-background-size: cover;
            background-size: cover;
}

.hero-wrap
{
    position: relative;

    max-width: 1100px;
    height: 100%;
    margin: 0 auto;
    padding: 0 20px;
}

.hero-wrap:before,
.hero-wrap:after
{
    display: table;

    content: ' ';
}

.hero-wrap:after
{
    clear: both;
}

.hero-wrap-hand
{
    position: absolute;
    right: 95px;
    bottom: -31px;

    display: none;

    width: 345px;
    height: auto;

    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
}

.hero-wrap-hd
{
    font-size: 50px;

    position: absolute;
    top: 180px;
    left: 20px;

    width: 100%;

    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    text-align: left;

    color: #fff;
}

.hero-wrap-hd > *
{
    font-weight: 300;

    display: inline-block;

    margin: 0 0 10px;
    padding: 0 20px;

    border-radius: 6px;
}

.hero-wrap-hd > *:last-child
{
    color: #f38a00;
    background: rgba(255, 255, 255, .8);
}

/* ---------------------------------------------------------------------
 Headings
 ----------------------------------------------------------------------- */

.hdg
{
    font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-weight: 300;
}

.hdg_3
{
    font-size: 20px;
    font-weight: 400;

    text-transform: uppercase;
}

.hdg_center
{
    text-align: center;
}

/* ---------------------------------------------------------------------
 helptext
 ----------------------------------------------------------------------- */

.helpText
{
    font-size: 18px;

    margin-bottom: 20px;
}

/* ---------------------------------------------------------------------
 history
 ----------------------------------------------------------------------- */

.historyContainer
{
    overflow-y: auto;
}

.history > h3
{
    font-size: 20px;
    font-weight: 400;

    text-transform: uppercase;
}

.history > ul
{
    padding: 0 0 15px 5%;
}

/*.history > ul  > li
{
    padding: 0 0 0 25px;
}*/

/*.history .triggeredevent
{
    padding: 0 0 0 25px;
    background: #fff url('/Content/Assets/images/sm-icon_schedules-chamberlain.png') left center no-repeat;
}

.history .alert
{
 padding: 0 0 0 25px;
    background: #fff url('/Content/Assets/images/sm-icon_alerts-chamberlain.png') left center no-repeat;
}*/

/* ---------------------------------------------------------------------
 historyContainer
 ----------------------------------------------------------------------- */

/* ---------------------------------------------------------------------
 hList
 ----------------------------------------------------------------------- */

.hList:before,
.hList:after
{
    display: table;

    content: ' ';
}

.hList:after
{
    clear: both;
}

.hList > *
{
    float: left;

    width: 50%;

    text-align: center;
}

.hList > * + *
{
    margin-top: 5px;
}

/* ---------------------------------------------------------------------
 iconImage
 ----------------------------------------------------------------------- */

.iconImage
{
    display: block;

    width: 80px;
    height: 67px;
    margin: 0 auto;

    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: 80px 67px;
            background-size: 80px 67px;
}

/* ---------------------------------------------------------------------
 Inputs
 ----------------------------------------------------------------------- */

.input
{
    font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1.6;

    width: 94%;
    margin: 0;
    padding: 6px 2%;

    letter-spacing: 1.2px;

    border: none;
    border-radius: 6px;
    background-color: #fff;
}

.input:focus
{
    font-size: 12px;
  /* Overrides the 16px zooming fix for iOS on mobile */
}

.input_select
{
    width: 100%;
    height: 38px;
}

.input_small
{
    width: 40px;
}

.input_icon
{
    width: 80%;
    margin-right: 4%;
}

.input_serial
{
    width: 22%;
}

.input_serial + .input_serial
{
    margin-left: 5.5%;
}

.input_checkbox,
.input_radio
{
    position: absolute;
    right: 200%;
    bottom: 200%;
}

.input_radio + label:before
{
    font-family: FontAwesome;
    font-size: 16px;

    float: left;

    margin-right: 8px;

    content: '\f10c';
}

.input_radio:checked + label:before
{
    content: '\f192';
}

.input_checkbox ~ div label:before
{
    font-family: FontAwesome;
    font-size: 16px;

    float: left;

    margin-right: 8px;

    content: '\f10c';
}

.input_checkbox:checked ~ div label:before
{
    content: '\f05d';
}

/* ---------------------------------------------------------------------
 inputGroup
 ----------------------------------------------------------------------- */

.inputGroup
{
    text-align: center;
}

.inputGroup > *
{
    display: inline-block;
}

/* ---------------------------------------------------------------------
 Label
 ----------------------------------------------------------------------- */

.label
{
    font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    font-size: 12px;

    display: block;

    width: 100%;
    margin: 2px 0 0;
    padding: 0;

    text-align: left;

    -webkit-appearance: none;
}

.label_hidden
{
    position: absolute;

    overflow: hidden;
    clip: rect(0 0 0 0);

    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;

    border: 0;
}

.label_inline
{
    display: inline-block;

    width: auto;
    min-width: 40px;
}

/* ---------------------------------------------------------------------
 languageSelect
 ----------------------------------------------------------------------- */

.languageSelect
{
    font-size: 11px;
    line-height: 1;

    display: block;
    float: right;

    width: 140px;
    margin: 0;
    padding: 8px 0 0;

    color: #fff;
}

.languageSelect:before,
.languageSelect:after
{
    display: table;

    content: ' ';
}

.languageSelect:after
{
    clear: both;
}

.languageSelect-label,.accountSelect-label
{
    float: left;

    margin-right: 5px;
}

.mix-languageSelect_center
{
    float: none;

    margin: 0 auto;
}

/* ---------------------------------------------------------------------
 learnImage
 ----------------------------------------------------------------------- */

.learnImage
{
    display: block;

    width: 180px;
    height: auto;
    margin: 0 auto 20px;
}

/* ---------------------------------------------------------------------
 learnLoader
 ----------------------------------------------------------------------- */

.learnLoader
{
    margin: 0 auto;

    text-align: center;
}

/* ---------------------------------------------------------------------
 Links
 ----------------------------------------------------------------------- */

.link_alt
{
    text-decoration: none;

    color: white;
}

.link_hasIcon
{
    position: relative;

    display: inline-block;

    padding-left: 30px;
}

/* ---------------------------------------------------------------------
 menuContainer
 ----------------------------------------------------------------------- */

.menuContainer
{
    position: fixed;
    left: -80%;

    width: 80%;
    min-height: 100%;

    -webkit-box-shadow: inset -20px 0 40px rgba(0, 0, 0, .5);
            box-shadow: inset -20px 0 40px rgba(0, 0, 0, .5);
}

.menuContainer.isOpen
{
    left: 0;
}

/* ---------------------------------------------------------------------
 12 Column mobileGrid
 ----------------------------------------------------------------------- */

.mobileGrid:before,
.mobileGrid:after
{
    display: table;

    content: ' ';
}

.mobileGrid:after
{
    clear: both;
}

.mobileGrid-col
{
    float: left;
}

.mobileGrid-col + .mobileGrid-col
{
    margin-left: 2.127663%;
}

.mobileGrid-col_1of12
{
    width: 6.382989%;
}

.mobileGrid-col_2of12
{
    width: 14.893641%;
}

.mobileGrid-col_3of12
{
    width: 23.404293%;
}

.mobileGrid-col_4of12
{
    width: 31.914945%;
}

.mobileGrid-col_5of12
{
    width: 40.425597%;
}

.mobileGrid-col_6of12
{
    width: 48.936249%;
}

.mobileGrid-col_7of12
{
    width: 57.446901%;
}

.mobileGrid-col_8of12
{
    width: 65.957553%;
}

.mobileGrid-col_9of12
{
    width: 74.468205%;
}

.mobileGrid-col_10of12
{
    width: 82.978857%;
}

.mobileGrid-col_11of12
{
    width: 91.489509%;
}

.mobileGrid-col_12of12
{
    width: 100%;
}

/* ---------------------------------------------------------------------
 mobileMenu
 ----------------------------------------------------------------------- */

.mobileMenu
{
    width: 100%;
    padding: 35px 0 0;
}

/* ---------------------------------------------------------------------
 mobileLink
 ----------------------------------------------------------------------- */

.mobileLink
{
    font-size: 24px;

    position: relative;

    display: block;

    width: 66%;
    padding: 13px 10% 13px 24%;

    color: white;
    background: transparent;
}

.mobileLink:active
{
    color: white;
    -webkit-box-shadow: inset -20px 0 40px rgba(0, 0, 0, .5);
            box-shadow: inset -20px 0 40px rgba(0, 0, 0, .5);
}

.mobileLink-icon,#mobilemenureporting .fa
{
    position: absolute;
    top: 20px;
    left: 10%;

    width: 24px;
    height: auto;
}

/* ---------------------------------------------------------------------
 pageContainer
 ----------------------------------------------------------------------- */

.pageContainer.isOpen
{
    position: fixed;
    left: 80%;

    width: 100%;
}

/* ---------------------------------------------------------------------
 Pull Nav
 ----------------------------------------------------------------------- */

.pullNav_mobile
{
    float: right;
}

/* ---------------------------------------------------------------------
 registerStep
 ----------------------------------------------------------------------- */

.registerStep
{
    position: relative;

    width: 12%;
    height: 0;
    margin: 0 0 40px;
    padding: 4% 0 8%;

    color: #fff;
    border-radius: 50%;
    background-color: #f0f0f0;
}

.registerStep:after
{
    position: absolute;
    top: 50%;
    left: 100%;

    width: 150%;
    height: 3px;

    content: '';

    background-color: #f0f0f0;
}

.registerStep:last-child:after
{
    display: none;
}

.registerStep + .registerStep
{
    margin-left: 16%;
}

.registerStep-step
{
    font-size: 20px;
    line-height: 1;

    position: absolute;
    top: 50%;
    left: 0;

    width: 100%;
    margin-top: -10px;
}

/* ---------------------------------------------------------------------
 regError
 ----------------------------------------------------------------------- */

.regError,.regSpaceError
{
    display: none;

    color: #b00;
}

/* ---------------------------------------------------------------------
 rules
 ----------------------------------------------------------------------- */



#eventsContainer
{
margin-top:0px;
}

/* ---------------------------------------------------------------------
 historyContainer
 ----------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
 slickSlider
 https://github.com/kenwheeler/slick/
 ----------------------------------------------------------------------------- */

.slick-slider
{
    position: relative;

    display: block;

    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -ms-touch-action: none;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}

.slick-list:focus
{
    outline: none;
}

.slick-loading .slick-list
{
    background: #fff url('/Content/Assets/images/ajax-loader.gif') center center no-repeat;
}

.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-list,
.slick-track,
.slick-slide,
.slick-slide img
{
    -webkit-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    zoom: 1;
}

.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}

.slick-track:after
{
    clear: both;
}

.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}

.slick-slide img
{
    display: block;
     cursor: pointer;
}

.slick-slide.slick-loading img
{
    display: none;
}

.slick-slide.dragging img
{
    pointer-events: none;
}

.slick-initialized .slick-slide
{
    display: block;
}

.slick-loading .slick-slide
{
    visibility: hidden;
}

.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}

.slick-prev,
.slick-next
{
    font-size: 0;
    line-height: 0;

    position: absolute;
    top: 50%;

    display: block;

    width: 30px;
    height: 30px;
    margin-top: -15px;
    padding: 0;

    cursor: pointer;

    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
    background: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before
{
    font-family: FontAwesome;
    font-size: 25px;
    line-height: 1;

    color: #949494;

    -webkit-font-smoothing: antialiased;
}

.slick-prev
{
    left: -10px;
}

.slick-prev:before
{
    content: '\f053';
}

.slick-next
{
    right: -10px;
}

.slick-next:before
{
    content: '\f054';
}

/* Dots */

.slick-slider
{
    margin-bottom: 0px;
}

.slick-dots
{
    position: absolute;
    bottom: -45px;

    display: block;

    width: 100%;
    padding: 0;

    list-style: none;

    text-align: center;
}

.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}

.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}

.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 30px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '\2022';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before
{
    opacity: .75;
    color: black;
}

[dir='rtl'] .slick-next
{
    right: auto;
    left: -25px;
}

[dir='rtl'] .slick-next:before
{
    content: '\2190';
}

[dir='rtl'] .slick-prev
{
    right: -25px;
    left: auto;
}

[dir='rtl'] .slick-prev:before
{
    content: '\2192';
}

[dir='rtl'] .slick-slide
{
    float: right;
}

/* ---------------------------------------------------------------------------
 stackList -- Lays out horizontally on desktop but stacks vertically on mobile
 ----------------------------------------------------------------------------- */

.stackList
{
    padding-top: 30px;
}

.stackList > *
{
    margin-top: 20px;

    text-align: center;
    vertical-align: top;
}

/* ---------------------------------------------------------------------
 Toggle
 ----------------------------------------------------------------------- */

.toggle,.enableRuletoggle
{
    font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.6;

    position: relative;

    display: block;
    overflow: hidden;

    width: 90%;
    margin: 0;
    padding: 6px 5px 4px;

    cursor: pointer;
    letter-spacing: 1.2px;

    border: none;
    border-top: 1px solid #f0f0f0;
    border-radius: 6px;
    background-color: rgba(255, 255, 255, .6);

    -webkit-appearance: none;
}

.toggle:last-child,.enableRuletoggle:last-child
{
    border-bottom: 1px solid #f0f0f0;
}

.toggle:before,.enableRuletoggle:before
{
    font-family: FontAwesome;
    font-size: 28px;

    float: left;

    margin-right: 8px;
}

.toggle.is-selected:before,.enableRuletoggle.is-selected:before
{
    content: '\f205';
}

.toggle.not-selected:before,.enableRuletoggle.not-selected:before
{
    content: '\f204';

    color: #666;
}

.toggle-input
{
    position: absolute;
    right: 100%;
    bottom: 100%;
}

.toggle-name
{
    display: inline-block;
    overflow: hidden;

    max-width: 70%;
    padding-top: 8px;

    white-space: nowrap;
    text-overflow: ellipsis;
}

.toggle-name .sub-label {
    /*max-width: 90%;*/
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
}

.toggle-edit
{
    float: right;
    cursor: pointer;
    padding: 12px 10px;
}

/* ---------------------------------------------------------------------
 Triangle Section
 ----------------------------------------------------------------------- */

.triangleSection
{
    position: relative;

    margin-bottom: 60px;
    padding: 80px 0 60px;

    border-top: 2px solid #f38a00;
    border-bottom: 1px solid #ccc2b6;
    background-color: #f0f0f0;
}

.triangleSection-triangle
{
    position: absolute;
    top: 0;
    left: 50%;

    width: 0;
    height: 0;
    margin-left: -30px;

    border-top: 30px solid #f38a00;
    border-right: 30px solid transparent;
    border-left: 30px solid transparent;
}

/* ---------------------------------------------------------------------
 vList
 ----------------------------------------------------------------------- */

.vList
{
    list-style: none;
}

/* -----------------------------------------------------------
 Media Queries
 ---------------------------------------------------------- */

@media (min-width: 767px)
{
  /* ---------------------------------------------------------------------
   Header
   ----------------------------------------------------------------------- */

    .header
    {
        padding: 0 0 30px;

        border-bottom: 2px solid;
    }

    

    .mix-header_center {
    text-align: center;
}
    
  /* ---------------------------------------------------------------------
   Logo
   ----------------------------------------------------------------------- */

    .appLogo
    {
        margin: 15px 0 0;
    }

    .appLogo_alt
    {
        margin: 0 auto;
    }

    .appLogo_high
    {
        margin: 5px 0;
    }

  /* ---------------------------------------------------------------------
   appIcon Small
      Changed Width
   ----------------------------------------------------------------------- */

    .appIcon
    {
        width: 124px;
    }

  /* ---------------------------------------------------------------------
   card Small Device
   ----------------------------------------------------------------------- */

    .card
    {
        padding: 80px 40px 40px;
    }

    .card_small
    {
        padding: 80px 40px 40px;
    }

    .card-hd
    {
        top: 40px;
        right: auto;
        left: -20px;
    }

    .card-hd:before
    {
        position: absolute;
        z-index: -1;
        bottom: -10px;
        left: 0;

        width: 0;
        height: 0;

        content: '';

        border-top: 10px solid transparent;
        border-right: 20px solid #101a2b;
        border-bottom: 10px solid transparent;
    }

    .card-hd-title
    {
        font-size: 20px;

        display: inline-block;

        width: auto;
        margin: 0;
        padding: 10px 40px;

        text-align: left;
    }

    .card-actions
    {
        top: 40px;
        right: 40px;
    }

    .card-bd
    {
        padding: 60px 0 30px;
        
    }

    #rulescard .card-bd,#historycard .card-bd
    {
        padding: 30px 0 30px;
    }
  /* ---------------------------------------------------------------------
   Box Small
   ----------------------------------------------------------------------- */

    .box-media
    {
        float: left;

        margin: 0 20px 0 0;
    }

  /* ---------------------------------------------------------------------
   cardContainer Small
   ----------------------------------------------------------------------- */

    .cardContainer
    {
        padding: 40px 0 0;
    }

    .cardContainer_pad
    {
        padding: 40px 0;
    }

  /* ---------------------------------------------------------------------
   Circles Small
   ----------------------------------------------------------------------- */

    .circles > *
    {
        display: inline-block;

        margin: 0 20px;
    }

  /* ---------------------------------------------------------------------
   Container Small
   ----------------------------------------------------------------------- */

  /* ---------------------------------------------------------------------
   flipperContainer Small
   ----------------------------------------------------------------------- */

    .flipperContainer_left
    {
        width: 96%;
        margin-right: 4%;
    }

    .flipperContainer_right
    {
        width: 96%;
        margin-left: 4%;
    }

  /* ---------------------------------------------------------------------
   12 Column Grid Small
   ----------------------------------------------------------------------- */

    .grid-col
    {
        float: left;
    }

    .grid-col + .grid-col
    {
        margin-left: 2.127663%;
    }

    .grid-col_1of12
    {
        width: 6.382989%;
    }

    .grid-col_2of12
    {
        width: 14.893641%;
    }

    .grid-col_3of12
    {
        width: 23.404293%;
    }

    .grid-col_4of12
    {
        width: 31.914945%;
    }

    .grid-col_5of12
    {
        width: 40.425597%;
    }

    .grid-col_6of12
    {
        width: 48.936249%;
    }

    .grid-col_7of12
    {
        width: 57.446901%;
    }

    .grid-col_8of12
    {
        width: 65.957553%;
    }

    .grid-col_9of12
    {
        width: 74.468205%;
    }

    .grid-col_10of12
    {
        width: 82.978857%;
    }

    .grid-col_11of12
    {
        width: 91.489509%;
    }

    .grid-col_12of12
    {
        width: 100%;
    }

    .grid-col_6of12_centered
    {
        width: 48.936249%;
        margin-right: auto;
        margin-left: auto;
    }

    .grid-col_8of12_centered
    {
        width: 65.957553%;
        margin-right: auto;
        margin-left: auto;
    }

  /* ---------------------------------------------------------------------
   Hero Small Screens
   ----------------------------------------------------------------------- */

    .hero
    {
        display: block;
    }

  /* ---------------------------------------------------------------------
   hList
   ----------------------------------------------------------------------- */

    .hList > *
    {
        width: auto;

        text-align: left;
    }

    .hList > * + *
    {
        margin-top: 0;
        margin-left: 4px;
    }

    .hList_spaced > * + *
    {
        margin-left: 20px;
    }

  /* ---------------------------------------------------------------------
   Inputs Small
   ----------------------------------------------------------------------- */

    .input
    {
        width: 100px;
        padding: 8px 8px 6px;
    }

    .input_small
    {
        width: 40px;
    }

    .input_select
    {
        width: 100%;
        height: 38px;
    }

    .input_block
    {
        width: 95.5%;
        padding: 6px 2%;
    }

    .input_icon
    {
        width: 80%;
        margin-right: 5%;
    }

    .input_serial
    {
        width: 22%;
    }

  /* ---------------------------------------------------------------------
   languageSelect
   ----------------------------------------------------------------------- */

    .mix-languageSelect_center
    {
        float: right;
    }

  /* ---------------------------------------------------------------------
   Pull Nav Small
   ----------------------------------------------------------------------- */

    .pullNav
    {
        float: right;
    }

  /* ---------------------------------------------------------------------
   pageContainer
   ----------------------------------------------------------------------- */

    .pageContainer.isOpen
    {
        position: static;
    }

  /* ---------------------------------------------------------------------
   stackList Desktop Styles
   ----------------------------------------------------------------------- */

    .stackList
    {
        padding-top: 0;
    }

    .stackList > *
    {
        display: inline-block;

        width: auto;
        margin-top: 0;

        text-align: right;
    }

    .stackList > * i
    {
        padding: 6px 0 0;
    }

    .stackList > * + *
    {
        margin-left: 10px;
    }

  /* ---------------------------------------------------------------------
   Triangle Section
   ----------------------------------------------------------------------- */

    .triangleSection
    {
        margin-bottom: 60px;
        padding: 80px 0 60px;

        background-color: #fff;
    }
}

@media (min-width: 979px)
{
  /* ---------------------------------------------------------------------
   Container Medium
   ----------------------------------------------------------------------- */

  /* ---------------------------------------------------------------------
   Hero Medium Screens
   ----------------------------------------------------------------------- */

    .hero-wrap-hand
    {
        display: block;
    }

    .hero-wrap-hd
    {
        width: 70%;
    }

  /* ---------------------------------------------------------------------
   Inputs Medium
   ----------------------------------------------------------------------- */

    .input
    {
        width: 140px;
    }

    .input_small
    {
        width: 40px;
    }

    .input_select
    {
        width: 100%;
        height: 38px;
    }

    .input_block
    {
        width: 95.5%;
        padding: 10px 2%;
    }

    .input_icon
    {
        width: 86%;
        margin-right: 4%;
    }

    .input_serial
    {
        width: 25%;
    }

  /* ---------------------------------------------------------------------
   learnImage
   ----------------------------------------------------------------------- */

    .learnImage
    {
        float: left;

        margin: 5px 20px 20px 0;
    }
}

@media (min-width: 1170px)
{
  /* ---------------------------------------------------------------------
   Container Large
   ----------------------------------------------------------------------- */

  /* ---------------------------------------------------------------------
   Hero Large Screens
   ----------------------------------------------------------------------- */

    .hero-wrap-hd
    {
        width: 60%;
    }
}

/* -----------------------------------------------------------
 Media Utils
 ---------------------------------------------------------- */

/* Media dependent helper classes */

.isHiddenSmall
{
    display: none;
}

@media (min-width: 767px)
{
    .isHiddenSmall
    {
        display: block;
    }

    .isVisibleSmall
    {
        display: none;
    }
}

@media (min-width: 979px)
{
}

@media (min-width: 1170px)
{
}

/* -----------------------------------------------------------
DK changes
 ---------------------------------------------------------- */
.btn[type="submit"] {
    font-size: 11px;
    padding: 10px 22px;
}

.header .btn[type="submit"] {
        width: 100% !important;
    }

.account-header-control {
	position: relative;
}
.account-header-control .pending-invites-badge {
	display: none;
	background-color: #f00;
	border-radius: 50%;
	height: 11px;
	width: 11px;
	line-height: 11px;
	text-align: center;
	color: white;
	font-size: 10px;
	padding: 2px;
	position: absolute;
	bottom: -2px;
	right: 5px;
}

.validation-summary-errors,.field-validation-error,#newUserErrorMessage {
    text-align: left;
    color: #bb0000;
    margin-top: 10px;
}

.input-validation-error {
    outline: none;
    border: 1px solid #c05d5d !important;
}

#registerLoader {
    display: none;
}

.field-validation-valid
{
    display: none;
}
.validation-summary-valid
{
    display: none;
}

.notify-loading {
    background: #fff url('/Content/Assets/images/ajax-loader.gif') center center no-repeat;
}

.floating-notify-loading {
    background: url('/Content/Assets/images/ajax-loader.gif') center center no-repeat;
    height: 100%;
    width: 100%;
    /*left: 45%;*/
    position: absolute;
    /*top: 49%;*/
    z-index: 99;
    display: none;
}

.devicePicker a {
    color: #ffffff;
    text-decoration: none;
}

.devicePicker a:hover {
    color: #ffffff;
    text-decoration: none;
}

#timerdebug td {
    padding: 5px;
}

.js-trashDevice {
    cursor: pointer;
}

.flipped .card_devices {
    display: none;
}


.notimeago {
    display: none;
}

.js-listPlaceDevices {
    min-height: 20px;
}

.errormsgs {
    color: red;
    padding-left: 10px;
    text-align: left;
}

#deleteDeviceErrorMessage {
      color: red;
}

.card_addPlace .formContainer,.card_addPlaceHelp .formContainer {
    margin: 30px auto !important;
    /*width: 70%;*/
}

.registerGatewayInput {
    max-width: 250px;
}

.registerGatewayInput input {
    max-width: 50px;
}

.registeredAppIcon {
    margin: 0px 15px 0 0 !important;
}

.useAppHelpText {
    font-size: 17px;
    font-weight: bold;
    margin-bottom: 5px;
}

#RegisterGatewayForm .registerGatewayInput {
    max-width: 460px !important;
}

#RegisterGatewayForm .helpText {
    font-size: 18px;
    margin-bottom: 20px;
}

.addSensorWorkFlow,.addGarageWorkFlow,.addGateWorkFlow,.addCDOWorkFlow,.addLightWorkFlow,.notUsingDoorSensor,.selColorGDOBtn,.validationError,.addEditRuleTemplate,
#sensorSubStep2,#sensorSubStep3,#sensorSubStep4,.programDoorOpener,#formrulesErrorMessage,.startingAttempt,.FailureToLearnMessage,.startingAttempt,.custom-duration-options,.custom-time-options,.resetHidden
 {
    display: none;
}

#dashboardAddDevice {
    color: #4c4c4c;
    /*width: 150px;
    height: 150px;*/
}

#noDeviceMessage {
    max-width: 500px;
    margin: 0 auto;
}

#noDeviceMessage #dashboardAddDevice {
    text-align: center;
    margin-top: 20px;
}

.usingDoorSensorQuestion .helpText, .addSensorWorkFlow .helpText{
    padding-top: 20px;
}

.usingDoorSensorQuestion .yesDoorSensor {
    margin-right: 10px;
}

.deviceRule .ruleRow {
    position: relative;
    clear: both;
    min-height: 55px;
    border-style: solid none none;
    border-width: 1px medium medium;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: rgba(255, 255, 255, 0.6);
    border-color: #f0f0f0 -moz-use-text-color -moz-use-text-color;
}



.deviceRule .eventrow{
/*min-height: 30px;*/
}

.deviceRule .eventrow .toggle-edit{
padding-top: 18px;
}

.deviceRule .toggle,.deviceRule .enableRuletoggle {
    width: 80%;
    position: absolute;
    left: 0;
    border-style: none none none;
    border-width: 0 medium medium;
}

.device-rule .toggle-edit {
    width: 8%;
    position: absolute;
    right: 0px;
    display: block;
}

/*
This is the visible area of you carousel.
Set a width here to define how much items are visible.
The width can be either fixed in px or flexible in %.
Position must be relative!
*/
.jcarousel {
    position: relative;
    overflow: hidden;
}

/*
This is the container of the carousel items.
You must ensure that the position is relative or absolute and
that the width is big enough to contain all items.
*/
.jcarousel ul {
    width: 20000em;
    position: relative;

    /* Optional, required in this case since it's a <ul> element */
    list-style: none;
    margin: 0;
    padding: 0;
}

/*
These are the item elements. jCarousel works best, if the items
have a fixed width and height (but it's not required).
*/
.jcarousel li {
    /* Required only for block elements like <li>'s */
    float: left;
    width: 334px;
}

#deleteRule {
    margin-top: 20px;
    display: none;
}
.btn_delete {
    background-color: #b00 !important;
}

#addEditRule {
   min-height: 150px; 
}

.monitorOnly, .lowBattery, .sensorError, .OpenError, .CloseError, .isOfflineError {
	background-color: #ffc966;
	width: 170px;
	color: #ffffff;
	margin: 5px auto;
	text-align: left;
	padding: 3px;
	line-height: 22px;
	cursor: pointer;
	text-decoration: none;
	display: block;
}
.lowBattery:hover {
    color: #ffffff;
}

.monitorOnly i {
    padding-left: 4px;
    padding-right: 3px;
}

.lowBattery i,.sensorError i,.OpenError i,.CloseError i, .isOfflineError i{
    padding-left: 8px;
    padding-right: 6px;
}

.lowbatteryicon {
    display: inline-block !important;
    margin-top: 3px;
    margin-left: 5px;
}

.lowbatterytext {
   display: inline-block !important;
width: 85%;
vertical-align: top;
margin-top: 2px;
margin-left: 5px;

}

.monitorOnly .fa-angle-right,.lowBattery .fa-angle-right,.sensorError .fa-angle-right,.OpenError .fa-angle-right,.CloseError .fa-angle-right .isOfflineError .fa-angle-right {
    line-height: 22px;
}

.learnLoader .waitingText {
      float: right;
    font-size: 16px;
    font-weight: bold;
    line-height: 28px;
    text-align: left;
    width: 190px;
}

.cancelLearnMode {
    margin-top: 40px;
}

.card_manageDevices .formContainer-fields{
    background-color: #f0f0f0 !important;
}

#deviceList .device {
    /*min-width: 200px !important;*/
}

.imgContainer {
    position: relative;
    width: 150px;
    height: 150px;
    margin-left:auto;
    margin-right:auto;
}
.errorTriagle {
    position: absolute;
    height: 27px;
    right: 0;
    width: 33px;
    z-index: 9;
    margin-top: 11px;
   /*
    
    position: absolute;
    right: 0;
    */
}

.shieldIcon {
    position: absolute;
    height: 37px;
    right: 0;
    width: 31px;
    z-index: 9;
    margin-bottom: 11px;
    bottom: 0;
   /*
    
    position: absolute;
    right: 0;
    */
}
.device-status {
    clear: left;
}

.usingWifiQuestion .learnImage {
     margin: 35px 20px 100px 0;
}

#addDeviceErrorMessage {
    margin-top: 10px;
    margin-bottom: 10px;
}

#userGreeting {
    line-height: 35px;
}

input[type="text"],input[type="password"] {
    height: 20px !important;
}

#pwMinChars,#pwDontMatch,#pwMissingSomething {
    display: none;
    margin-bottom: 10px;
}

#IncompatibleGdoMessage {
    display: none;
    padding-top: 10px;
}

#myqserialnumberGDO,#myqSerialNumberDetonator,#myqSerialNumberInternetGateway,#GDONotmyq {
    text-align: center;
}

#helpresize {
    max-width: 650px;
    margin: 0 auto;
}


#myqserialnumber .grid  .deviceType{
    text-align: center;
    /*max-width: 200px;*/
    display: inline-block;
    cursor: pointer;
     margin: 0 auto;
}

#myqserialnumber .grid  .deviceType div{
    margin: 0 5px 20px;
}

@media (max-width: 700px) {
    #myqserialnumber .grid .deviceType {
        display: block;
        text-align: center;
       
    }
}

.googlebadge,.applebadge {
    width: 140px;
    height: 48px;
    -webkit-background-size: 140px 97px;
    background-size: 140px 97px;
    background-image: url(/Content/Assets/images/googleapplebadge2x.png);
}

.googlebadge
{
     background-position: 0 bottom;
}

.applebadge
{
     background-position: 0 top;
}

#partnerplace_name
{
    width:95%;
}

.enableCameraNotifications
{
    display: inline-block;
float: right;
font-family: "Source Sans Pro",Arial,Helvetica,sans-serif;
font-size: 11px;
font-weight: 400;
line-height: 1;
margin: 15px 10px 0 0;
text-align: right;
vertical-align: baseline;
width: 60%;
}

.card_managePartnerDevices .toggle-input {
    width: 10%;
    position: absolute;
    right: 0;
    border-style: none none none;
    border-width: 0 medium medium;
}

.card_managePartnerDevices .toggle, .enableCameraNotificationstoggle,.partnerdev
{
    font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    position: relative;
    display: block;
    overflow: hidden;
    width: 98%;
    margin: 0;
    padding: 6px 5px 4px;
    cursor: pointer;
    letter-spacing: 1.2px;
    border: none;
    border-top: 0px solid #f0f0f0;
    border-radius: 6px;
    background-color: inherit;
    -webkit-appearance: none;
}
 
.camrow
{
   border-bottom: 1px solid #ddd;
}

.nestcamzones
{
    margin-left: 10%;
}

.card_managePartnerDevices .toggle::before, card_managePartnerDevices .enableCameraNotificationstoggle::before
{
    float:right;
}

.enableCameraNotificationstoggle:last-child
{
    border-bottom: 0px solid #f0f0f0;
}

.enableCameraNotificationstoggle:after
{
    font-family: FontAwesome;
    font-size: 28px;

    float: left;

    margin-right: 8px;
}

.enableCameraNotificationstoggle.is-selected:after
{
    content: '\f205';
}

.enableCameraNotificationstoggle.not-selected:after
{
    content: '\f204';

    color: #666;
}

#cameraEventDetails
{
    text-align:left;

}

#cameraEventDetails h3
{
    text-align:left;
    font-size:16px;
    color:#666;
   
}

#cameraEventDetails .eventimage
{
    width: 400px;
    height:224px;
    overflow:hidden;
    margin:5px 0 !important;
}

#cameraEventDetails .viewlivefeed
{
    text-align:center;
     margin-top:5px;
}

#cameraEventDetails .viewlivefeed a
{
    text-decoration:none;
    font-size:14px;
}

#cameraEventDetails .viewlivefeed a i
{
    padding-left:5px;
    line-height: 16px;
}

#cameraEventDetails .eventdate
{
     text-align:left;
    font-size:14px;
    color:#666;
     margin:5px 0 !important;
}

.cameraEvent
{
    /*padding-left:25px;
    background:url('/Content/Assets/images/eventCameraIcon.png') center left no-repeat;*/
    margin-right:10px;
    cursor: pointer;
}

.passwordstregth
{
    font-size:12px;
    color:#888;
    padding: 5px;
}

.partofgateway
{
    border-bottom: 1px solid #dedede;
}

#deviceList
{
    padding-bottom:0px !important;
}
.gridview,.tileview
{
    display:table;
    position:relative;
}
.gridview .device
{
    float:left;
    width:200px;
    text-align:center;
    padding-bottom:40px;
    position:inherit;
    height:250px;
    display:block;
    margin:0px 1px;
}

.tileview .device .imgContainer
{
   height: 60px;
    width: 60px;
}

.tileview .device
{
    float:left;
    min-width:110px !important;
    max-width:110px !important;
    text-align:center;
    padding-bottom:40px;
    position:inherit;
    height:90px;
    display:block;
    margin:0px 3px;
}

.tileview .device-location
{
    font-size: 12px;
}

.tileview .device-name
{
    font-size: 12px;
    line-height: 10px;
}

.tileview .device-status
{
display: none;
}

.gridview .device:last-child,.tileview .device:last-child
{
   clear:right;
}

.gridview .device-img
{
    float:none !important;
}

.tileview .device-img
{
    float:none !important;
    width: 60px;
    height:60px;
}

.gridview .floating-notify-loading,.tileview .floating-notify-loading
{
    left: 0px;
    position: absolute;
    top: -10px;
    z-index: 999;
    display: none;
}


.back-to-top {
    position: fixed;
    bottom: 2em;
    right: 0px;
    text-decoration: none;
    color: #000000;
    background-color: rgba(235, 235, 235, 0.80);
    font-size: 12px;
    padding: 1em;
    display: none;
}

.back-to-top:hover {    
    background-color: rgba(135, 135, 135, 0.50);
}

.rulesectionstitle
{
    font-size: 20px;
    font-weight: bold;
}

.schedulesetdays, .scheduleattime
{
    margin-top:25px;
}

.devicerows
{
    text-align:left !important;
    border-color: #f0f0f0 -moz-use-text-color -moz-use-text-color;
    border-image: none;
    border-radius: 6px;
    border-style: solid none none;
    border-width: 1px medium medium;
     min-height: 50px;
    padding-top: 10px;
}

.devicerows .device-name {
    font-weight:normal;
}

.devicerows .setstate
{

}

.devicerows .col1
{
    width: 10%;
    float: left;
    vertical-align: middle;
}
.devicerows .col2
{
    width: 60%;
    float: left;
}
.devicerows .col3
{
    width: 30%;
    float: left;
    text-align: right;
}

#addEditEvent{
    margin-top:40px;
}



.deviceStateOptions .btn {
    color: #fff;
    padding: 10px 15px;
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    border-width:0;
     font-size: 12px;
    font-weight: normal;
    margin-top:5px;
    text-transform: inherit;
    cursor: default;
}

.deviceStateOptions .switch-toggle label{
    cursor: default;
}

.deviceStateOptionsChecked .switch-toggle label {
    cursor: pointer;
}

.deviceStateOptionsChecked .switch-toggle label:nth-child(2):nth-last-child(4),.deviceStateOptionsChecked  .switch-toggle label:nth-child(2):nth-last-child(4) ~ label,.deviceStateOptionsChecked  .switch-toggle label:nth-child(2):nth-last-child(4) ~ a{
   color: #fff;
}

.deviceStateOptionsChecked .btn {
    color: #fff;
    padding: 10px 15px;
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    border-width:0;
     font-size: 12px;
    font-weight: normal;
    margin-top:5px;
    text-transform: inherit;
}

.deviceStateOptions .switch-candy a {
    color: #fff;
}

.deviceStateOptionsChecked .switch-candy a
{
    color: #fff;
}


.deviceStateOptions .switch-toggle.switch-candy, .deviceStateOptions .switch-light.switch-candy > span
{
}

.deviceStateOptionsChecked .switch-toggle.switch-candy, .deviceStateOptionsChecked .switch-light.switch-candy > span
{
}

.timeanddays
{
    color: #999;
    text-transform: capitalize;
    display:block;
    font-size: 14px;
    margin-top: -5px;
    clear:both;
    margin-left:10%;
}

 .notificationMessageTheme {
            overflow: hidden;
            border: 0px solid #333;
            box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);
            position: relative;
             margin-bottom: 10px;
        }

       /* .notificationMessageTheme.noty_container_type_alert {
            background-color: #205081;
        }

        .notificationMessageTheme.noty_container_type_information {
            background-color: #205081;
        }

        .notificationMessageTheme.noty_container_type_error {
            background-color: #eaadad;
            color: #fff;
            font-weight: bold
        }

        .notificationMessageTheme.noty_container_type_warning {
            background-color: #fbb450;
            color: #fff;
        }

        .notificationMessageTheme.noty_container_type_success {
            background-color: #b1ce8c;
            color: #fff;
        }*/

        .notificationMessageTheme .noty_message {
            padding: 10px 20px 10px 5px;
        }

        .notificationMessageTheme .noty_close {
            position: absolute;
            top: 8px;
            right: 8px;
            width: 10px;
            height: 10px;
            /*background: url("data:image/png;base64,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");*/
            /*visibility: hidden;*/
            opacity: 0.8;
            cursor: pointer;
        }

        .notificationMessageTheme:hover > .noty_bar > .noty_message > .noty_close {
            visibility: visible;
        }

     

.notificationMessage
{
    background-color: #fff;
    border-left: 20px solid #205081;
    color: #303030;
    padding: 10px;
}

#invitedpopup{

}
#showschedulingnotication
{
    width:300px !important;
    height: 533px;
    background:url('/Content/Assets/images/1.png') center right no-repeat; 
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}

#showschedulingnotication2
{
    width:300px !important;
    height: 533px;
    background:url('/Content/Assets/images/2.png') center right no-repeat; 
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}
#showschedulingnotication3
{
    width:300px !important;
    height: 533px;
    background:url('/Content/Assets/images/3.png') center right no-repeat; 
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}

#showschedulingnoticationlm
{
    width:300px !important;
    height: 533px;
    background:url('/Content/Assets/images/lm-1.png') center right no-repeat; 
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}

#showschedulingnotication2lm
{
    width:300px !important;
    height: 533px;
    background:url('/Content/Assets/images/lm-2.png') center right no-repeat; 
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}
#showschedulingnotication3lm
{
    width:300px !important;
    height: 533px;
    background:url('/Content/Assets/images/lm-3.png') center right no-repeat; 
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}

#showschedulingnotication h1,#showschedulingnoticationlm h1
{
    font-size: 20px;
    font-weight: bold;
}


#schedcopy
{
    height: 480px;
    /*background-color: white;*/
    margin-top: 30px;
}

#showschedulingnotication  .noty_close,#showschedulingnotication2  .noty_close,#showschedulingnotication3  .noty_close,#showschedulingnoticationlm  .noty_close,#showschedulingnotication2lm  .noty_close,#showschedulingnotication3lm  .noty_close
{
    background:none;
}

.noty_buttons
{
    position:absolute;
    bottom: 15px;
    left: 13%;
    cursor:pointer;
}

.createSchedule {
    background: #359c42 none repeat scroll 0 0;
    border-radius: 7px;
    color: #ffffff;
    font-family: Arial;
    font-size: 13px;
    padding: 10px 60px;
    text-decoration: none;
    border: none;
    opacity:.8;
    cursor: pointer;
}

.createSchedule:hover {
  background: #029d01;
  text-decoration: none;
}

	#notyCloseButton,#notylCloseButton,#notystdCloseButton {
				  cursor: pointer;
                    position: absolute;
                    right: 5px;
                    top: 10px;
                    width: 30px;
                    height: 30px;
                    text-align: center;
			}

    
#showlightbanner
{
    width:300px !important;
    height: 179px;
    border: 0px solid #205081;
    color: #fff;
    padding: 0px;
}

#lightcopy
{
    height: 106px;
    margin-top: 60px;
    /*background-color: white;*/
}

.buyLight {
    background: #359c42 none repeat scroll 0 0;
    border-radius: 7px;
    color: #ffffff;
    font-family: Arial;
    font-size: 13px;
    padding: 10px 20px;
    text-decoration: none;
    border: none;
    opacity:.8;
    cursor: pointer;
    margin-left: 140px;
}

.buyLight:hover {
  background: #029d01;
  text-decoration: none;
}

#subheader
{
    line-height: 50px;
    position:relative;
}

#subheader i
{
    margin-right:10px;
    font-size:20px;
    color:#a3a3a3;
}

#subheader .grid-col
{
    margin-right:50px;
}

#subheader .grid-col a
{
    text-decoration: none;
    color:#666;
}

#subheader h2
{
    margin-left: 20px;
    line-height: 50px;
}

#subheader .menuselected a, #subheader .menuselected i
{
    color:#cccccc;
}

#subheader .grid .pointer::before {
    border-color: rgba(204, 204, 204, 0) rgba(204, 204, 204, 0) #ddd;
    border-width: 13px;
    margin-left: -13px;
}
#subheader .pointer::after, .pointer::before {
    border: medium solid transparent;
    bottom: 0px;
    content: " ";
    height: 0;
    left: 50%;
    pointer-events: none;
    position: absolute;
    width: 0;
}
#subheader .grid .pointer::after {
    border-color: rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) #f0f0f0 ;
    border-width: 12px;
    bottom: 1px;
    margin-left: -12px;
}
#subheader .pointer::after, .pointer::before {
    border: medium solid transparent;
    bottom: 0px;
    content: " ";
    height: 0;
    left: 50%;
    pointer-events: none;
    position: absolute;
    width: 0;
}
#subheader.grid-col .pointer
{
    display: block;
}
#subheader .pointer {
    background: #fff none repeat scroll 0 0;
    /*display: none;*/
    position: relative;
}

#selectAccountToManage {
	padding-bottom: 30px;
}

#AddNewUser
{
    text-align:center;
}

#AddNewUser #dashboardAddDevice
{
    margin-top:15px;
}

#inviteuser
{
    margin-top:50px;
    font-size:14px;
}

#inviteuser p
{
    margin-bottom:15px;
}

#inviteuseremailsent
{
    display:none;
}

.invintationsenttitle
{
    display:none;
}

#nousers
{
    /*display: none;*/
}

#userslist
{
    text-align: left;
}

#userslist .circle
{
width:50px;
height:50px;
border-radius:50%;
font-size:20px;
color:#fff;
line-height:50px;
text-align:center;
background:rgba(0, 0, 0, .3);
padding:10px;
}

	#userslist #inviteduserslist, #userlist #pendingInviteslist, #userlist #acceptedInvitesList {
		margin-top: 15px;
	}

		#userslist #inviteduserslist .circle, #userlist #pendingInviteslist .circle, #userlist #acceptedInvitesList  .circle {
			width: 50px;
			height: 50px;
			border-radius: 50%;
			font-size: 20px;
			color: #fff;
			line-height: 50px;
			text-align: center;
			background: rgba(0, 0, 0, .3);
			padding: 10px;
			vertical-align: text-bottom;
		}

	#userslist h3, #pendingInviteslist h3, #acceptedInvitesList h3 {
		font-size: 20px;
		font-weight: 400;
		text-transform: uppercase;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	#userslist .userdetail, #userslist #listPendingInvites, #userslist #listAccountsIBelongTo {
		position: relative;
		clear: both;
		min-height: 55px;
		border-style: solid none none;
		border-width: 1px medium medium;
		-moz-border-bottom-colors: none;
		-moz-border-left-colors: none;
		-moz-border-right-colors: none;
		-moz-border-top-colors: none;
		background-color: rgba(255, 255, 255, 0.6);
		border-color: #f0f0f0 -moz-use-text-color -moz-use-text-color;
		padding-top: 4px;
	}

#userslist .userdetail table{
    width:100%;
}

#userslist .userdetail .usersname{
    font-size: 16px;
    padding-left: 10px;
    vertical-align: middle;
}

#userslist #listAccountsIBelongTo .userdetail .usersname {
	line-height: 55px;
}

#userslist #listAccountsIBelongTo .userdetail .toggle-edit {
	padding: 0;
}

.invitestatus{
    font-size: 12px;
    color:#b00;
}

#createAccountLabel
{
    margin-top: 15px;
}

#pendingInviteslist, #acceptedInvitesList {
	display: none;
	position: relative;
	margin-top: 35px;
}

	#pendingInviteslist .pending-invites-badge {
		display: none;
		background-color: #f00;
		border-radius: 50%;
		height: 11px;
		width: 11px;
		color: white;
		font-size: 10px;
		padding: 2px;
		position: absolute;
		top: 10px;
		left: -20px;
		line-height: 11px;
		text-align: center;
	}

.alert {
    vertical-align: middle;
    margin-bottom: 10px;
}

.alert .histimg {
    /*width: 18px;
    height: 18px;*/
    vertical-align: middle;
	float: left;
}
.alert .histimg img {
    vertical-align: middle;
}
.alert .histmsg {
     vertical-align: middle;
    line-height: 20px;
    padding-left: 60px;
}

.histalerttime {
    font-size: 14px;
    font-weight: 700;
}

.histalertmsg {
    font-size: 18px;
    font-weight: 400;
}

.historyv5 > h3
{
    font-size: 16px;
    font-weight: 400;
    padding: 5px 10px;
    text-transform: uppercase;
    background-color: #f0f0f0;
}

.historyv5 > ul
{
    padding: 10px 0 15px 0;
}

.historyv5 > ul > li
{
    padding: 15px 0 3px 0;
}

#selectAccountToManage {
    margin-top: 20px;
}

.FormSectionTitle {
    margin-top: 20px;
    font-weight: 400;
}

#UpdateDeviceMessage .card { padding-top: 40px; }
#UpdateDeviceMessage .card-bd { padding-top: 0; }
#UpdateDeviceMessage #successfullRequest { display: none;}

.registration-form#eeaForm, .registration-form#nonEeaForm, #createAccountForm .eea-pii-explanation, #confirmGDPRForm .eea-pii-explanation {
    display: none;
}
.registration-form ul, .eea-pii-explanation ul, .review-policy-updates-form ul {
    list-style-type: disc;
    list-style-position: inside;
    padding-left: 20px;
}

#accountAdministrationForm .auxText { margin-top: 15px;}
#accountAdministrationForm .alertText { color: #f00; }
#accountAdministrationForm #accountAdministrationErrorMessage, #accountAdministrationForm #accountAdministrationSuccessMessage, #review-policy-updates-form #reviewPolicyUpdatesError {
    display: none;
}
#accountAdministrationForm #accountAdministrationErrorMessage, #review-policy-updates-form #reviewPolicyUpdatesError {
    color: #f00;
}