/* ============= Open Support Ticket Styling =============== */

#cb-ticket-form div#loader {
  width: 50%;
}
#cb-ticket-form div#loader div.img-spacer {
  width: 60px;
  margin:auto;
}

.toplevel_page_supticket div .notifications {
  margin: 5px 0px 2px;
  width: 50%;
}

/*hide menu item from left-hand admin menu ...since we have our own at the top */
li#toplevel_page_supticket {
  display: none!important;
}

div li#wp-admin-bar-wp-admin-bar-cb-sticket {
    float: right !important;
    box-sizing: border-box;
}

li.cb-sticket {
    margin-left: 1.3% !important;
    color: #ffffff !important;
}

li.cb-sticket .ab-item {
padding: 0 10px 0 40px !important;
    background-repeat: no-repeat!important;
    background-image: url('../images/support-icon-2x.png')!important;
    background-size: 32px 32px !important;
    background-position: 3px center !important;
    overflow: hidden;
    background-color: #be2a32 !important;
    color: #ffffff !important;
}

#cb-ticket-form {
    margin-bottom: 30px;
    margin-right: 20px;
}

#cb-ticket-form input,
#cb-ticket-form select,
#cb-ticket-form textarea,
#cb-ticket-form li.rate
{
    display: block;
    margin-left: 0;
    width: 50%;
}

#cb-ticket-form li.rate input {
    width: initial;
    display: inline-block !important;
}

#cb-ticket-form #cb-sticket-submit {
    -webkit-appearance: none;
    border: 0;
    width: 50%;
    padding: 10px 0 12px 0;
    font-weight: bold;
    cursor: pointer;
    font-size: 16px;
    background-color: #be2a32;
    color: #ffffff;
}

#cb-ticket-form #cb-sticket-submit:hover {
    /* background-color: #9e232a; */
}

#cb-ticket-form label {
margin-bottom: 8px;
display: block;
}

#cb-ticket-form ul > li {
margin-bottom: 16px;
}

#cb-ticket-form p.cb-sticket-severity {
    font-size: 11px;
}

#cb-ticket-form hr.divider {
    display: inline-block;
    margin-bottom: 16px;
}

#cb-ticket-form p.cb-sticket-description,
#cb-ticket-form p.cb-sticket-severity-description,
#cb-ticket-form p.cb-sticket-severity,
#cb-ticket-form hr.divider
{
    width: 50%;
}

#cb-ticket-form p.cb-sticket-title {
    font-size: 22px;
    font-weight: bold;
    line-height: 1.2em;
    margin-bottom: 0.6em;
}

#cb-ticket-form .standard-rate-desc, #cb-ticket-form .emergency-rate-desc {
    display: inline-block;
    vertical-align: text-top;
    width: calc(100% - 27px);
}

#cb-ticket-form input[type=checkbox] {
    margin-right: 10px;
}

body #wpadminbar ul#wp-admin-bar-root-default > li .ab-sub-wrapper {
    margin-left: -5px !important;
}

@media (max-width: 900px) and (min-width: 783px) {

    li.cb-sticket .ab-item {
        font-size: 10px !important;
        /* width: 100px !important; */
        line-height: 15px !important;
    }

}

@media (max-width: 782px) {

    div li#wp-admin-bar-wp-admin-bar-cb-sticket {
        padding: 0 0px 9px 12px !important;
        height: 49px;
        width: 64px;
        margin-left: 0 !important;
    }
    
    li.cb-sticket .ab-item {
        /* display: none !important; */
        text-indent: 20px;
        background-position-x: center !important;
        background-position-y: center !important;
    }

    li.cb-sticket a.ab-item:hover,
    li.cb-sticket a.ab-item:focus
    {
        background-color: #be2a32 !important;
    }

    li.cb-sticket {
        display: inline-block !important;
        /* width: 14px !important; */
    }

    #cb-ticket-form {
        margin-right: 8px;
    }

    #cb-ticket-form input[type=checkbox] {
        width: 25px !important;
        height: 25px !important;
    }

    #cb-ticket-form .standard-rate-desc, #cb-ticket-form .emergency-rate-desc {
        width: calc(100% - 36px);
    }
    
    /* body #wpadminbar ul#wp-admin-bar-root-default>li {
        padding: 3px 4px 3px 4px !important;
    } */
    
    body #wpadminbar .quicklinks .ab-top-secondary > li {
        padding-top: 3px !important;
    }
    
    body #wpadminbar .quicklinks .ab-top-secondary > li .ab-sub-wrapper {
        margin-top: 3px !important;
    }
    
    body #wpadminbar ul#wp-admin-bar-root-default > li .ab-sub-wrapper {
        margin-top: 3px !important;
        margin-left: -5px !important;
    }

}

@media (min-width: 961px) and (max-width: 1199px) {

    #cb-ticket-form input,
    #cb-ticket-form select,
    #cb-ticket-form textarea,
    #cb-ticket-form #cb-sticket-submit,
    #cb-ticket-form p.cb-sticket-description,
    #cb-ticket-form p.cb-sticket-severity,
    #cb-ticket-form p.cb-sticket-severity-description,
    #cb-ticket-form li.rate,
    #cb-ticket-form hr.divider,
    .toplevel_page_supticket div .notifications
    {
        width: 70%;
    }

}

@media (max-width: 960px) {

    #cb-ticket-form input,
    #cb-ticket-form select,
    #cb-ticket-form textarea,
    #cb-ticket-form #cb-sticket-submit,
    #cb-ticket-form p.cb-sticket-description,
    #cb-ticket-form p.cb-sticket-severity,
    #cb-ticket-form p.cb-sticket-severity-description,
    #cb-ticket-form li.rate,
    #cb-ticket-form hr.divider,
    .toplevel_page_supticket div .notifications
    {
        width: 100%;
    }

}

@media (min-width: 783px) and (max-width: 1199px) {
    
    div li#wp-admin-bar-wp-admin-bar-cb-sticket {
        padding: 0 3px 9px 12px !important;
        height: 35px !important;
        width: 51px !important;
        margin-left: 0 !important;
    }
    
}

@media (max-width: 1199px) {

    body li#wp-admin-bar-wp-admin-bar-cb-sticket a {
        background-image: url(http://cbplayground.wpengine.com/wp-content/plugins/marketsmart-powersite-master/images/support-icon-transparent-2x.png) !important;
        background-size: 80% !important;
        /* background-position: center center !important; */
        background-repeat: no-repeat !important;
        text-indent: 200px;
        width: 100%;
        overflow: hidden;
        line-height: 4;
        height: 100% !important;
        white-space: nowrap;
    }
    
    body li.cb-sticket .ab-item {
        padding: 3px !important;
    }

    
}


@media (min-width: 783px) and (max-width: 960px) {

    body #wpadminbar .quicklinks .ab-top-secondary > li > a.ab-item {
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        width: 52px;
        position: relative;
    }

    body #wpadminbar .quicklinks .ab-top-secondary > li > a.ab-item img {
        position: absolute;
        top: 6px;
        right: 6px;
        width: 26px !important;
        height: 26px !important;
    }

}

@media (max-width: 600px) {
    
    #wpcontent {
        margin-top: 0 !important;
    }
    
    body #wpadminbar ul#wp-admin-bar-root-default > li .ab-sub-wrapper {
        left: 5px !important;
    }
    
    body #wpadminbar .quicklinks .ab-top-secondary > li .ab-sub-wrapper {
        left: 10px !important;
    }
    
}


@media (max-width: 449px) {
    
    body #wpadminbar ul#wp-admin-bar-root-default > li > a,
    body #wpadminbar ul#wp-admin-bar-root-default > li > a:before,
    body #wpadminbar ul#wp-admin-bar-root-default > li > a span.ab-icon,
    body #wpadminbar ul#wp-admin-bar-root-default > li > a span.ab-icon:before
    {
        width: 40px !important;
    }
    
    body #wpadminbar ul#wp-admin-bar-root-default > li.cb-sticket > a.ab-item {
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
}


@media (max-width: 349px) {
    
    body #wpadminbar ul#wp-admin-bar-root-default > li#wp-admin-bar-new-content {
        display: none !important;
    }
}

#cb-sticket-submit {
width: 100%;
    margin-top: 12px;
}

li#toplevel_page_sticket {
	display: none!important;
}

li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form p.cb-sticket-description {
line-height: 1.5;
margin-bottom: 14px;
}

li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table {
    width: 100%;
}

li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table tr td > input {
margin-bottom: 8px;
}

li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table tr td.col-1 {
    width: 28%;
}

li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table tr td.col-2 {
    width: auto;
}

li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table tr td > input, li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table tr td > textarea, li#wp-admin-bar-wp-admin-bar-cb-sticket #cb-ticket-form form table tr td > select {
    width: 100%;
}


@media (max-width: 82px) {

    div li#wp-admin-bar-wp-admin-bar-cb-sticket {
        height: 43px;
        padding-right: 0 !important;
        width: 57px;
    }
    
}

/*form validation style*/
#cb-ticket-form .ciserror {
  border: 1px solid red;
}

/*Site Options Styling*/
body.checkerboard_page_cb_settings form input[type="text"],
body.checkerboard_page_cb_settings form select {
  width: 250px;
}
