span.showdropdown {
    display: block;
    text-align: center;
    border: 1px solid #ccc;
    margin-top: 20px;
    padding: 8px;
    border-radius: 4px;
    cursor: pointer;
    text-indent: -9999px;
    position: relative;
    width: 30%;
}

span.showdropdown:before {
    width: 20px;
    height: 20px;
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: block;
    background-size: contain;
    opacity: 0.5;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='284.929px' height='284.929px' viewBox='0 0 284.929 284.929' style='enable-background:new 0 0 284.929 284.929;' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M282.082,76.511l-14.274-14.273c-1.902-1.906-4.093-2.856-6.57-2.856c-2.471,0-4.661,0.95-6.563,2.856L142.466,174.441 L30.262,62.241c-1.903-1.906-4.093-2.856-6.567-2.856c-2.475,0-4.665,0.95-6.567,2.856L2.856,76.515C0.95,78.417,0,80.607,0,83.082 c0,2.473,0.953,4.663,2.856,6.565l133.043,133.046c1.902,1.903,4.093,2.854,6.567,2.854s4.661-0.951,6.562-2.854L282.082,89.647 c1.902-1.903,2.847-4.093,2.847-6.565C284.929,80.607,283.984,78.417,282.082,76.511z'/%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E%0A");

}

span.showdropdown.btnAct:before {
    transform: rotate(180deg);
}
.newBox {
    display: none;
}

.newBox.showBox {
    display: block;
    padding:20px;
}


.digital_ticket .tickets .ticket {
padding-bottom: 9px;
position: relative;
}

.digital_ticket .tickets .ticket .content .actions {
position: absolute;
right: 0;
float: none;
top: 7px;
}
/* .digital_ticket .tickets .ticket .content .actions a.reply{
background:none;
background: none;
padding-left: 0;
font-size: 16px;
} */
.digital_ticket .tickets .ticket .content {
padding-right: 0;
padding-left: 0px;
}

.list-view .pager {
margin-bottom: 10px;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}

textarea,
input[type="text"],
input[type="button"],
input[type="submit"] {
-webkit-appearance: none;
border-radius: 0;
}

input[type="checkbox"] {
padding: 2px !important;
}



@media only screen and (max-width: 1024px) {
.showmenu{
    display: block;
    text-align: center;
    margin-bottom: 10px;
    background: #1b66a4;
    color: #fff;
    margin-top: 20px;
    padding: 8px;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
}
ul#navmenu a:hover {
    background: #398bce !important;
    color: white !important;
}
ul#navmenu ul{
    width: 100%;
}
ul#navmenu ul li a {
    background: #398bce !important;
    color: white !important;
    font-weight: normal;
    border-bottom: none;
}

.header_left {
    position: absolute;
    font-size: 25px;
    left: 10px;
}

*,
::after,
::before {
    box-sizing: border-box;
}

ul#navmenu {
    width: auto;
    display: flex;
    flex-wrap: wrap;
    height: auto;
    display: none;
}
ul#navmenu a.havechild{
    position: relative;
}
ul#navmenu a.havechild:before{
    width: 10px;
    height: 10px;
    top: 6px;
    content: '';
    position: absolute;
    right: 10px;
    display: block;
    background-size: contain;
    opacity: 0.5;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='284.929px' height='284.929px' viewBox='0 0 284.929 284.929' style='enable-background:new 0 0 284.929 284.929;' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M282.082,76.511l-14.274-14.273c-1.902-1.906-4.093-2.856-6.57-2.856c-2.471,0-4.661,0.95-6.563,2.856L142.466,174.441 L30.262,62.241c-1.903-1.906-4.093-2.856-6.567-2.856c-2.475,0-4.665,0.95-6.567,2.856L2.856,76.515C0.95,78.417,0,80.607,0,83.082 c0,2.473,0.953,4.663,2.856,6.565l133.043,133.046c1.902,1.903,4.093,2.854,6.567,2.854s4.661-0.951,6.562-2.854L282.082,89.647 c1.902-1.903,2.847-4.093,2.847-6.565C284.929,80.607,283.984,78.417,282.082,76.511z'/%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E%0A");

}
ul#navmenu.showBox{
    display: flex;
    margin-top:-10px;
    margin-bottom: 10px;
}

ul#navmenu>li {
    float: none;
    height: auto;
    flex: 0 0 16.666%;
    max-width: 16.6666%;
}
ul#navmenu ul.showChild{
    display: block;
    width: 100%;
}

div.form {
    padding: 0;
}

div.form h1 {
    display: flex;
    flex-wrap: wrap;
    /* justify-content: space-between;*/
}

div.form h1 a {
    margin-bottom: 3px;
    margin-left: 3px;
    max-width: 22%;
    flex: 0 0 20%;
    display: block;
    font-size: 13px !important;
    letter-spacing: 0;
}

.digital_ticket .button-group {
    float: none;
    margin-top: 20px;
}

.digital_ticket header h1 {
    float: none;
}

.digital_ticket {
    width: auto;
}

#main {
    min-width: inherit;
}

#wrap {
    width: auto;
    padding: 0;
}

div.search-form {
    position: relative;
    height: 53px;
}

div.form .buttons {
    padding-left: 0 !important;
    position: absolute;
    right: 10px;
    top: 10px;
}

div.wide.form label {
    text-align: left;
    width: auto;
    float: none;
}

.collapse form input[type="text"],
.collapse form textarea,
.collapse .content-area input[type="text"],
.collapse .content-area textarea {
    float: none !important;
    width: 100% !important;
    margin: 0;
    padding: 10px;
    font-size: 15px;
    box-sizing: border-box;

}

#content .hm_issuse_search form {
    padding-bottom: 18px !important;
}

.portlet-content {
    margin: 0;
    padding: 7px 10px;
}

.simple_form.new_reply {
    overflow: auto;
}

.simple_form.new_reply #submit_ajax {
    padding: 10px;
}

.digital_ticket .tickets .ticket .post_reply h4 {
    margin-left: 0;
    margin-bottom: 10px;
    background: none;
    margin: 0;
    padding-left: 10px;
    display: none;
}

.collapse form,
.collapse .content-area,
.styled-form form,
.styled-form .content-area {}

#submit_ajax {
    width: 100% !important;
}

.digital_ticket .tickets .ticket .replies .reply {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.digital_ticket .tickets .ticket .replies .reply.received .author {
    float: none;
    display: block;
    order: 0;
    width: auto;
    text-align: left;
}

.digital_ticket .tickets .ticket .replies .reply.received .message {
    float: none;
    width: auto;
    order: 1;
    padding: 0;
}

.btn_delete_one_detail {
    margin-left: 0;
    margin-top: 10px;
    float: none;
}

.login_page #main {
    min-width: inherit;
}

.login_page #tab-frame {
    min-height: inherit;
}

.login_page #wrap {
    width: auto;
}

.digital_ticket .tickets .ticket .content .actions {
    position: static;
    display: block;
}

.digital_ticket .tickets .ticket .content .title {
    font-size: 14px;
    float: none;
    width: auto;
}

.digital_ticket .tickets .ticket .content .actions a {
    float: none;
    display: inline-block;
}

.row.buttons.padding-fix {
    position: static !important;
    width: 100%;
}
span.showdropdown {
    width:100%;
}
.newBox .js-btn-punish {
    width: 100% !important;
    padding: 10px !important;
}
}

@media only screen and (max-width: 768px) {

ul#navmenu>li {

    flex: 0 0 25%;
    max-width: 25%;
}

div.form h1 a {
    max-width: 27%;
    flex: 0 0 27%;
}

.digital_ticket .tickets .ticket .content .title {
    width: auto;
    float: none;
    display: block;
}

.digital_ticket .tickets .ticket .content .created_at {
    display: block;
    float: none;
    clear: none;
    margin-bottom: 5px;
}

.digital_ticket .tickets .ticket .content .created_at span.label {
    display: inline-block;
}

#content {
    padding: 10px;
}

/*.collapse fieldset{
width: 100%;
}*/
.collapse fieldset>table td {
    display: block;
}

.collapse fieldset>table {
    display: block;
    padding-left: 0;
}

.collapse fieldset {
    padding: 10px;
    width: auto;
}

form.button_to.w-200.padding_0 {
    width: 100% !important;
    margin-top: 10px;
}

input.padding_0.padding_5.btn.btn_closed_tickets {
    width: 100% !important;
    padding: 6px !important;
    min-height: 35px !important;
    font-size: 15px;
}

.simple_form.new_reply fieldset .row {
    position: relative;
    margin-bottom: 10px;
}

.simple_form.new_reply fieldset .row br {
    display: none;
}

img.ui-datepicker-trigger {
    position: absolute;
    right: 0;
    top: 5px;
}

.simple_form.new_reply fieldset .row .remove_row_item {
    position: absolute;
    right: -14px;
    top: 6px;
}

.materials_table {
    margin-top: 10px;
}

#new_ticket input.button {
    width: 100% !important;
}

#new_ticket .row.w-350 {
    width: 100% !important;
}

#new_ticket .styled-select {
    float: none;
    margin: 6px 0px;
    display: block;
}

select#GasIssueTickets_problem {
    width: 100% !important;
    float: none;
    padding: 10px;
    display: block;
}

.unique_wrap_autocomplete.w-650 {
    width: 100% !important;
}

div#new_ticket .portlet-content {
    padding: 1px 0px 7px 0px;
}

.digital_ticket #new_ticket #ticket_topic_field {
    display: block;
    float: none;
}

div#new_ticket .row {
    position: relative;
}

.digital_ticket #new_ticket textarea {
    margin-top: 10px;
}

#new_ticket .collapse form,
.collapse .content-area,
.styled-form form,
.styled-form .content-area {
    padding-top: 0
}

.login_page div.form .row label {
    width: 100%;
}

.login_page .row_align.rememberMe.padding-fix {
    padding-left: 0 !important;
}

.login_page .form .gas_login {
    width: 100%;
}


.newBox form {
    background: none;
}



}

@media only screen and (max-width: 575px) {
ul#navmenu>li {
    flex: 0 0 33.333%;
    max-width: 33.333%;
}

div.form h1 a {
    max-width: 40%;
    flex: 0 0 40%;
}

.digital_ticket header h1 {
    font-size: 16px !important;
}

.digital_ticket header .button {
    padding: 7px;
    font-size: 13px;
    border: none;
    margin-left: 4px !important;
    margin-right: 0 !important;
    float: none !important;
    display: inline-block;
}

h2.section-header,
h3.section-divider {
    font-size: 16px;
    margin: 0;
}

.pager ul.yiiPager li a {
    display: block !important;
}

.pager ul.yiiPager li {
    display: inline-block !important;
    margin-bottom: 4px;
}

.digital_ticket .tickets .ticket .content .actions a,
.digital_ticket .tickets .ticket .content .actions input[type="submit"] {
    font-size: 14px;
    /* background-size: 20px;
    padding-left: 36px; */
    background: none !important;
    padding-left: 0;
    padding: 0;
    border: 1px solid #ccc;
    padding: 2px 6px;
    margin-right: 5px;
    margin-top:2px;
}

.w-350.tb_file {
    width: 100% !important;
}

.item_l.w-400 {
    width: auto !important;
}

.tb_file .input_file {
    width: 100% !important;
}
}

/* update 02262025 */
.item_c.item_custom0226 {}

.item_c.item_custom0226 .btn_cancel {
font-size: 15px !important;
display: inline-block;
min-width: 120px;
line-height: 1.5;
margin: 3px 0px;
}

.dropdown-custom {
max-width: 100%;
min-width: 120px;
}

.dropdown {
position: relative;
display: inline-block;
}

.dropdown-menu a {
min-width: 100% !important;
line-height: 1.5;
padding: 3px 8px;
float: none !important;
float: left;
display: block;
background: #018BD3;
color: #fff;
font: bold 10px / 22px Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
height: auto !important;
font-size: 10px !important;
height: 100%;
text-align: left;
}

.dropdown-menu a:hover {
background: #0d406b;
}

.dropdown-menu li {
margin-bottom: 2px;
}

.dropdown-menu {
display: none;
position: absolute;
top: 110%;
left: 0;
list-style: none;
padding: 0;
margin: 0;
color: black;
min-width: 200px;
z-index: 100;
}

.dropdown-custom {}

@media only screen and (max-width: 575px) {
.form.item_c.item_custom0226 {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.item_c.item_custom0226.form a,
.item_c.item_custom0226.form .dropdown.dropdown-custom {
width: 32.33%;
max-width: 32.33%;
min-width: inherit;
}

.item_c.item_custom0226.form .drop-menu.btn_cancel {
    width: 100%;
max-width: 100%;
}
.dropdown-menu {
left: inherit;
right: 0;
}
}

@media only screen and (max-width: 768px) {
    div#header{display:none}
}

@media only screen and (max-width: 575px) { 
    #top-nav-right ul{
        display: flex;
                align-items: center;
                width: 100%;
                position: absolute;
                left: 0;
                top: 0;
                justify-content: center
      }
      #top-nav-right ul li {
        padding: 0px 6px 0px 0px;
    
      }
}