
/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* IMPORT GOOGLE WEB FONTS */

@import url("//fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900&amp;subset=latin,latin-ext");

/* GLOBAL */
/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* IMPORT GOOGLE WEB FONTS */

@import url("//fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900&amp;subset=latin,latin-ext");

/* GLOBAL */
body { background: #fff; color: #333; font-family: 'Roboto', Optima, Segoe,
 "Segoe UI", Candara, Calibri, Arial, sans-serif; font-size: 15px; font-style: normal; font-weight: normal; margin: 0; position: relative; webkit-font-smoothing: antialiased;}
.row.no-gutter { margin:0 auto;}
.row.no-gutter [class*='col-']:not(:first-child), .row.no-gutter [class*='col-']:not(:last-child) { padding-left: 0; padding-right: 0; }
.clientalert .btn-xs, .admin-masquerade-notice, input,button,select,textarea, .navbar-main, #top-nav a.quick-nav { font-family: 'Roboto', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif;}
h1,h2,h3,h4,h5,h6 {font-family: 'Roboto', Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; font-weight:300;}
hr { border: solid #dedede; border-width: 1px 0 0; clear: both; height: 0; margin:0 auto; margin-top:12px; margin-bottom:12px; width:100%; }
img {  max-width: 100%;  height: auto; -ms-interpolation-mode: bicubic; display: inline-block;  vertical-align: middle;}
  a { color: #555; outline: 0; text-decoration: none; }
a:hover, a:active, a:focus { outline: 0; text-decoration: none; color:#444; }
.spacing-20 {padding-top:20px;}
.center-block{float:none!important;}
.btn {  border: none;    border-radius: 5px;   display: block;    position:relative; padding: 8px;    display: inline-block;  font-size: 13px!important;    font-weight: 500;    text-transform: uppercase;    letter-spacing: 0;    overflow: hidden;   outline: none;    cursor: pointer;    text-decoration: none;    text-align: center;    vertical-align: middle; color: #fff; 
background: #;}
.btn.btn-default {background: #FF7F00  ;}
.btn.btn-primary {background:#FF7F00 ;}
.btn.btn-info {background: #444  ;}
.btn.btn-success {background:#FF7F00 ;}
.btn.btn-warning {background:#444  ;}
.btn.btn-danger {background:#444;}
p { font-family: inherit; font-size: 15px; line-height: 1.45; margin: 0 0 17px 0;  font-weight: 300;}
.page-subheader {border:none!important; margin-top:35px;}
.page-subheader h2 {font-size:22px; font-weight:700; color:#fff; margin:0 0 35px; padding:15px 0; background:#9A9DAC; letter-spacing: -.07; text-transform: uppercase; position: relative; text-align: center; border:0!important;}
.page-subheader h2:after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(222, 98, 98, 0); border-top-color: #9A9DAC; border-width: 10px; margin-left: -10px; }

.main-content {min-height: 400px;}




/* TOP BAR */
#adminmasquarade {background:#464B63; text-align: center;}
.admin-masquerade-notice { margin: 0!important; max-width:100%!important;text-align: center!important; color:#fff!important; font-size: 13px!important;}
.admin-masquerade-notice a { color:#ccc!important;}

#thetopbar { padding:5px 0; border:0; margin:0; background: #009DE0;}
#top-nav a.quick-nav {color:#f4f4f4!important;}
.badge {background: #!important;}
.list-group-item.active .badge {color:#fff!important; background: #444!important;}
#thetopbar .badge {#fff!important; font-size:11px!important; margin-left:4px;}


.top-list {  padding: 0; margin:0; list-style: none;  overflow: hidden;  }
.top-list > li {  list-style: none;    float: left;  padding:3px 10px 0;  color:#fff; font-size:11px;  }
.top-list > li:first-child { padding-left:0;  }
.top-list > li i{ padding-right:8px; }
.top-list > li a { color:#fff; }
.top-list > li a:hover { color:#ccc; text-decoration:none; }

/* HEADER */
 #header{ width: 100%; padding:0!important; border:0!important; border-radius:0!important; margin:0!important;background: #444 ! important; box-shadow:0 1px 6px rgba(0, 0, 0, 0.0), 0 1px 4px rgba(0, 0, 0, 0.0)!important;  transition: all 450ms cubic-bezier(0.0, 0, 0.0, 0) 0ms!important; 
 -webkit-transition: all 450ms cubic-bezier(0.0, 0, 0.0, 0) 0ms!important;}
  .logo {padding-top:10px;}


/* Navigation  ---------------------- */
  nav#desktop-menu {  padding: 0; float:right; text-align: left; }
  /*** ESSENTIAL STYLES ***/
  .sf-menu, .sf-menu * {  margin: 0;  padding: 0;  list-style: none;}
  .sf-menu li {  position: relative;}
  .sf-menu ul {  position: absolute;  display: none;  top: 100%;  left: 0;  z-index: 99;}
  .sf-menu > li {  float: left;}
  .sf-menu li:hover > ul, .sf-menu li.sfHover > ul {  display: block;}
  .sf-menu a {  display: block;  position: relative;}
  .sf-menu ul ul {  top: 0;  left: 100%;}

 /*** SKIN ***/
  .sf-menu {  float: left;  margin: 0;}
  .sf-menu ul {  min-width: 12em; *width: 12em; box-shadow: 0 2px 2px 0 rgba(0,0,0,.0),0 3px 1px -2px rgba (0,0,0,.6),0 1px 5px 0 rgba(0,0,0,.0);}
  /* 1st level */
  .sf-menu li {  white-space: nowrap;   *white-space: normal;}
  .sf-menu li a {color: #ffffff;  font-weight: 600;  padding:22px;  font-size: 14px;  letter-spacing: 0px;  text-transform: uppercase; transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;  -webkit-transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;}
  .sf-menu li:hover a, .sf-menu li.sfHover a, .sf-menu li.current a  { color: #fff;  background: #FF7F00    url(../images/menutopo.png1) no-repeat center 0px; }
  .sf-menu li:last-child ul {  left: auto;  right: 0%; }

 /* 2nd level */
  .sf-menu ul li, .sf-menu li.current ul li{background:#fff!important; }
  .sf-menu ul li a {border-bottom: 0; background:#444!important; font-size: 12px; padding: 16px 20px; color: #fff!important;}


  .sf-menu ul li:hover a, .sf-menu ul li.sfHover a  { background: #555!important; color: #6f6f6f;  -webkit-transition: none;  transition: none;}

  /* 3rd level */
  .sf-menu ul li.sfHover li a {background:#fff!important; }

.sf-menu ul li li:hover a, .sf-menu ul li li.sfHover a  { background: #E0E0E0!important; color: #424242!important;  -webkit-transition: none;  transition: none;}
  /* styling for both css and generated arrows */
  .sf-arrows .sf-with-ul {  padding-right: 2.5em;  *padding-right: 1em; }
  .sf-arrows .sf-with-ul:after {  content: '';  position: absolute;  top: 50%;  right: 1em;  margin-top: -3px;  height: 0;  width: 0;  border: 5px solid transparent;  border-top-color: #fff; }
  .sf-arrows > li > .sf-with-ul:focus:after, .sf-arrows > li:hover > .sf-with-ul:after, .sf-arrows > .sfHover > .sf-with-ul:after {  border-top-color: #6f6f6f; }
  .sf-arrows ul .sf-with-ul:after {  margin-top: -5px;  margin-right: -3px;  border-color: transparent;  border-left-color: #6f6f6f;  }
  .sf-arrows ul li > .sf-with-ul:focus:after, .sf-arrows ul li:hover > .sf-with-ul:after, .sf-arrows ul .sfHover > .sf-with-ul:after {  border-left-color: #fff;}
  .slicknav_menu {  display:none;}

.navbar-main {	background: #444 url(../images/vai2.pn) no-repeat center 0px; #FF7F00!important;}ul.navbar-nav li a {padding:10px 18px!important;

 font-weight:300; text-transform: uppercase; font-size:13px;}
ul.navbar-nav li a:hover, ul.navbar-nav li a:focus {background: #666!important; color:#f9f9f9!important;}
ul.navbar-nav li ul li a {padding:5px 8px!important; font-weight:300; text-transform: uppercase; font-size:13px;}
ul.navbar-nav li ul li a:hover {background: #666!important; color: #fff!important;}

/* DATATABLES */
.dataTables_wrapper .dataTables_filter label .form-control {line-height:25px;}
.table-container table td, .dataTables_paginate   {font-size:14px!important;}
span.label {border-radius: 5px!important; font-weight: 300}
.dataTables_length select {font-size: 14px; padding: 0 8px!important; width: 100%; height:auto!important; line-height:15px!important;}
.dataTables_wrapper .dataTables_info {background: #444;}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { background-color: #444;  border-color:#444;}
td button[type="submit"] {width:auto!important; display:table; margin:0 auto; float:none!important; font-size:13px; font-weight:300; padding:4px; height:auto!important;}

/* MEDIA QUERIES  */

 /* For IE Edge (Spartan)  ----------------------- */
   @supports (-ms-accelerator:true) {
    .header{ padding:0 0 1px 0;}
    .sf-menu ul { top: 101%; }
  }
  /* End For IE Edge (Spartan)  ----------------------- */

@media only screen and (max-width: 767px) {
.top-list {display:none;}
 #navigation {display:none;}
    .slicknav_menu {display:block; font-size:13px; font-weight:500; background:#29303C;}
    .slicknav_btn {font-size:16px; background:#8F4099; border-radius:100%; width:34px; height:34px; padding:11px 0 0 8px; }
    .slicknav_nav a {text-transform: uppercase; font-size:13px; font-weight:500;}
    .slicknav_nav a:hover {-webkit-border-radius: 0!important; -moz-border-radius: 0!important; border-radius:0!important; background:#373f4b!important; color: #fff; }
button.navbar-toggle {display:table; margin:0 auto; text-align: center; float:none!important; margin-top:10px; margin-bottom:10px;}
ul.navbar-nav li a {padding:5px 18px!important; font-weight:300; text-transform: uppercase; font-size:13px;}
ul.navbar-nav li a:hover, ul.navbar-nav li a:focus {background: #444!important; color:#fff!important;}
ul.navbar-nav li ul li a {padding:5px 18px!important; font-weight:300; text-transform: uppercase; font-size:13px; color:#5a5a5a!important;}
ul.navbar-nav li ul li a:hover {background: #F0F1F5!important; color: #5a5a5a!important;}
.logo img {text-align:center; display:table; margin:0 auto; max-width:60%; padding-bottom:15px;}
.captchaimage {  text-align: center;}
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .top-list {display:none;}
    .main-content {min-height: 50px;}
.logo {margin-top:7px;}
    .sf-menu li a {padding:25px 10px; }
ul.navbar-nav li a {padding:5px 18px!important; font-weight:300; text-transform: uppercase; font-size:13px;}
ul.navbar-nav li a:hover, ul.navbar-nav li a:focus {background: #444!important; color:#fff!important;}
ul.navbar-nav li ul li a {padding:5px 18px!important; font-weight:300; text-transform: uppercase; font-size:13px; color:#5a5a5a!important;}
ul.navbar-nav li ul li a:hover {background: #F0F1F5!important; color: #5a5a5a!important;}
button.navbar-toggle {display:table; margin:0 auto; text-align: center; float:none!important; margin-top:10px; margin-bottom:10px;}
.login-form input[type="text"]#inputCaptcha { max-width:100%;}
}

@media (min-width:1300px){
.container{width:1280px}
}

/*page titles*/

.page_title1 {
	position: relative;
	float: left;
	width: 100%;
	color: #fff;
	text-align: center;
		padding: 70px 90px 70px 80px;

	background: #FF7F00     url(../images/menupaginas.jpg2) no-repeat center 0px;
}
.page_title1 h1 {
	color: #fff;
	font-size: 48px;
	font-weight: 700;
	line-height: 45px;
	text-transform: uppercase;
}
.page_title1 h1 em {
	color: #fff;
	font-weight: 400;
	display: block;
	font-size: 18px;
	font-style: normal;
	text-transform: none;
}


/* small buttons */


.but_smal22.light {
	color: #444 ;
	background: none;
	border: 2px solid #fff ;

background-color: #fff ;
}
.but_smal22.light:hover {
	color: #fff;
	background-color: #444  ;
	border: 2px solid #444 ;
}

  


-----------------------------------------------------------------------


.client-home-panels .custom-domain-register {
    overflow: hidden;
    position: relative;
    background: #444   !important;
    border: none;
    padding: 25px 5px;
}
.custom-domain-register form .input-group {
    display: flow-root;
    flex-wrap: wrap;
    margin: 20px;
}
.custom-domain-register form .input-group .form-control{
    border-radius: 4px;
}
.custom-domain-register form .input-group-btn {
    padding-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex-direction: row-reverse;
}
.custom-domain-register form .input-group-btn .btn{
    flex: 1;
    height: 48px;
    padding: 8px 24px;
    font-size: 14px;
    line-height: 28px;
    border-radius: 4px;
    color: #FF7F00  ;
    background-color: #e3effc;
    border-color: #e3effc;
    font-weight: 500;
}
.custom-domain-register form .input-group-btn .btn:focus{
    outline: none;
    border: 0;
}
.custom-domain-register form .input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle){
    border-radius: 4px;
}
.custom-domain-register form .input-group-btn .btn-success{
    margin-left: 10px;
    color: #fff;
    background-color: #064992;
    border-color: #064992;
}
tr.masspay-invoice-detail td{
    font-size: 12px;
}
.panel>.list-group .ticket-details-children .title, .list-group-item .badge{
    color: hsla(0,0%,100%,.64);
}
.list-group-item>i.far.fa-circle{
    display: none ;
}


------------------------------------------------------------------





.status-custom, .status{
    border: none !important;
    background: transparent;
    font-size: 11px;
    font-weight: 500;
}
.table-list>tbody>tr:nth-child(even)>td:focus{
    outline: none;
}
.dataTables_wrapper table.table-list{
    margin-bottom: 0 !important;
    border-bottom: 1px solid #e6e8ec;
}
table.dataTable tbody tr td{
    padding: 8px;
}
.table-list>tbody>tr:nth-child(even)>td {
    background-color: transparent;
}
table.dataTable tbody tr td img{
    width: 20px;
}
table.dataTable tbody tr td i{
    font-size: 13px;
}
.panel-sidebar>.panel-heading, .panel-sidebar .panel-heading{
    background-color: #fff;
    border-color: #ff8239;

}
.client-home-panels .panel>.panel-heading{
    background-color: #fff;
    padding: 15px;

}
.client-home-panels .panel>.panel-heading .panel-title{
    font-size: 15px;
    color: #404040;
}

.panel-sidebar .list-group-item, .panel-sidebar .panel-body, .list-group-tab-nav{
    color: #fff;
    background: #FF7F00  ;
    border: 1px solid hsla(0,0%,100%,.24);
    font-size: 14px;
    line-height: 26px;
}
.panel-sidebar a.list-group-item:hover, .list-group-tab-nav a.list-group-item.disabled:hover{
    background-color: #FF7F00;
    color: #fff;
}

.panel-sidebar .list-group-item i:not(.fa-circle):not(.fa-dot-circle):not(.no-transform){
    display: none;
}
.search-form-wrap{
    background: #f5f5f5;
    padding: 40px;
    border: 1px solid #e6e8ec;
    border-radius: 6px;
    margin-bottom: 20px;
}
.ticket-number{
    font-weight: 500;
    color: #5f5b5b;
    font-size: 13px;
    font-style: normal;
}
tbody .mass-pay-single{
    display: block;
    border: 1px solid #e6e8ec;
}
.status-panel .panel-body
{
    font-size: 14px;
    line-height: 28px;
}
.status-panel .panel-body span{
    background: transparent;
}

.panel-info>.panel-heading{
    color: #000;
    background-color: #f5f5f5;
    border-color: #e6e8ec;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    font-size: 15px;
}
.status-panel.panel-info{
    border-color: #e6e8ec;
    box-shadow: none;
}
.status-panel .panel-footer{
    background: transparent;
    display: flex;
    justify-content: space-between;
}
.status-panel .panel-footer span{
    color: #8c8c8c;
}
.status-panel .panel-footer span strong{
    font-weight: 500 !important;
}

.mass-pay-table tbody{
    border: 1px solid #e6e8ec;
}
.table.mass-pay-table >thead>tr>th{
    border-bottom: none;
}
.table.mass-pay-table .bg-info{
    background-color: #f5f5f5;
}
.forgot-link{
    float: right;
}
.ticket-departments {
    border: 1px solid #e6e8ec;
    background: #fff;
    border-radius: 6px;
    margin-top: 20px;

}
.ticket-departments>a {
    display: flex;
    padding: 18px 16px;
}
.ticket-departments>a:hover{
    background-color: #fafafa;
}

a .department-info {
    padding-left: 12px;
}
a .department-info p{
    color: #7c8088 !important;
    margin-bottom: 0;
}
.department-info span{
    font-size: 15px;
    display: flex;
    align-items: center;
    font-weight: 500;
    margin-bottom: 10px;
}
