styles.css 22 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096
  1. @charset "utf-8";
  2. /* CSS Document */
  3. body,
  4. #cpanel_body {
  5. font-weight: lighter;
  6. color: #D7D7D7;
  7. min-height:200%;
  8. background-size:cover, no-repeat;
  9. background-blend-mode: multiply;
  10. background:url(img/bg.jpg) rgba(0, 0, 0, 0.7); /* You can also set your own URL */
  11. }
  12. a,
  13. .body-content a,
  14. .btn-link {
  15. color: #F85A16;
  16. }
  17. a:hover,
  18. .body-content a:hover,
  19. .btn-link:hover {
  20. color: #888; /* color - 4f5860 dd370a */
  21. text-decoration: none;
  22. }
  23. a:focus,
  24. input[type=file]:focus,
  25. input[type=radio]:focus,
  26. input[type=checkbox]:focus {
  27. color:#F85A16;
  28. text-decoration:none;
  29. outline: 1px dotted #F85A16;
  30. }
  31. /* Validation Stuff */
  32. .cjt-pagenotice-container .cjt-notice-info .bd,
  33. .cjt-pagenotice-container .cjt-notice-success .bd,
  34. .cjt-pagenotice-container .cjt-notice-warn .bd,
  35. .validation_errors_div,
  36. div.cjt_status_bar_success,
  37. .alert-danger,
  38. .alert-warning,
  39. .alert-info,
  40. .alert-success {
  41. border: 0;
  42. }
  43. .alert-message {
  44. color:#D7D7D7;
  45. }
  46. .alert-danger .alert-message {
  47. color:#333333;
  48. }
  49. .alert-warning {
  50. background:#222222;
  51. }
  52. .alert {
  53. border: 1px solid #444444!important;
  54. }
  55. ul.validation_errors_ul>li.validation_errors_li {
  56. color: #313131;
  57. }
  58. #content .btn-primary,
  59. .yui-dialog .btn-primary, .body-content .btn-info, .body-content .btn-warning, #content .btn-info, form input[value="Go"] {
  60. background: #FF6C2C;
  61. border-color: #dd370a;
  62. -webkit-box-shadow: inset 0 0px #dd370a;
  63. box-shadow: inset 0 0px #dd370a;
  64. color: #fff;
  65. border-width: 1px;
  66. }
  67. .btn-default[disabled],
  68. .btn-default[disabled]:hover,
  69. .btn-default[disabled]:focus,
  70. .btn-default[disabled]:active,
  71. .btn-default[disabled].active,
  72. form input[value="Go"]:hover,
  73. form input[value="Go"]:focus,
  74. form input[value="Go"]:active,
  75. .btn-default,
  76. .button-group button {
  77. -webkit-box-shadow: inset 0 0px #dd370a;
  78. box-shadow: inset 0 0px #dd370a;
  79. border-width: 1px;
  80. }
  81. form input[value="Go"] {
  82. display: inline-block;
  83. margin-bottom: 0;
  84. font-weight: 400;
  85. border-radius: 2px;
  86. padding: 6px 12px;
  87. white-space: nowrap;
  88. font-size: 14px;
  89. line-height: 1.42857143;
  90. }
  91. .well {
  92. background-color: transparent;
  93. border-color: transparent;
  94. }
  95. .body-content iframe[name=phpinfo] {
  96. width:100%;
  97. }
  98. .alert-message a {
  99. text-decoration:none;
  100. }
  101. #main {
  102. padding-left: 15px;
  103. }
  104. .container-fluid {
  105. padding-left:15px;
  106. }
  107. #-group .ng-pristine {
  108. padding: 20px 25px;
  109. }
  110. #-group .ng-pristine input[name="domain"], #-group .ng-pristine select[name="ext"] {
  111. float:left;
  112. width: 74%;
  113. height: 34px;
  114. padding: 6px 12px;
  115. margin-right:3px;
  116. font-size: 14px;
  117. line-height: 1.42857143;
  118. color: #eeeeee;
  119. background-color: #444;
  120. border: 1px solid #555;
  121. background-image: none;
  122. border-radius: 4px;
  123. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  124. box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  125. -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  126. transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  127. }
  128. #-group .ng-pristine input[name="domain"]:hover, #-group .ng-pristine select[name="ext"]:hover {
  129. background-color: #555;
  130. border-color: #666;
  131. }
  132. #-group .ng-pristine input[name="domain"]:focus, #-group .ng-pristine select[name="ext"]:focus {
  133. border-color: #FF6C2C;
  134. outline: 0;
  135. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  136. box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  137. }
  138. #-group .ng-pristine select[name="ext"] {
  139. width:12%;
  140. }
  141. .input-group-addon {
  142. background-color:#2c2c2c;
  143. color:#D7D7D7;
  144. border-color:#444444;
  145. }
  146. hr {
  147. border-color:#444444;
  148. }
  149. #Search, form input[name="domain"], form select[name="ext"], form input[name="DomainName"], form select[name="domain_selector"], td input[name="email"], td select[name="d_name"], td input[name="destination"], td select[name="day"], td select[name="domain_name"], td input[name="source"] {
  150. width: auto;
  151. height: 34px;
  152. padding: 6px 12px;
  153. margin-right:3px;
  154. font-size: 14px;
  155. line-height: 1.42857143;
  156. color: #eeeeee;
  157. background-color: #444!important;
  158. border: 1px solid #555;
  159. background-image: none;
  160. border-radius: 4px;
  161. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  162. box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  163. -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  164. transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  165. }
  166. #Search:hover, form input[name="domain"]:hover, form select[name="ext"]:hover, form input[name="DomainName"]:hover, form select[name="domain_selector"]:hover, td input[name="email"]:hover, td select[name="d_name"]:hover, td input[name="destination"]:hover, td select[name="day"]:hover, select[name="domain_name"]:hover, td input[name="source"]:hover {
  167. background-color: #555;
  168. border-color: #666;
  169. }
  170. #Search:focus, form input[name="domain"]:focus, form select[name="ext"]:focus, form input[name="DomainName"]:focus, form select[name="domain_selector"]:focus, td input[name="email"]:focus, td select[name="d_name"]:focus, td input[name="destination"]:focus, td select[name="day"]:focus, select[name="domain_name"]:focus, td input[name="source"]:focus {
  171. border-color: #FF6C2C;
  172. outline: 0;
  173. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  174. box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  175. }
  176. #content .btn-danger {
  177. color: #FFFFFF!important;
  178. margin-bottom: 3px;
  179. }
  180. /*----- FORM TEMPLATE -----*/
  181. #content .btn-primary:hover,
  182. #content .btn-primary:focus,
  183. #content .btn-primary:active,
  184. #content .btn-primary.active,
  185. #content .open .dropdown-toggle.btn-primary,
  186. .yui-dialog .btn-primary:hover,
  187. .yui-dialog .btn-primary:focus,
  188. .yui-dialog .btn-primary:active,
  189. .yui-dialog .btn-primary.active,
  190. .yui-dialog .open .dropdown-toggle.btn-primary{
  191. background: #dd370a;
  192. color: #fff;
  193. }
  194. .form-control:focus {
  195. border-color: #FF6C2C;
  196. outline: 0;
  197. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  198. box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  199. }
  200. .dt_module {
  201. padding: 15px 30px;
  202. background-color: #313131;
  203. }
  204. .form-group {
  205. margin-bottom: 0;
  206. }
  207. .form-group label {
  208. font-weight: lighter;
  209. }
  210. .table>thead>tr>th {
  211. background-color: #444;
  212. }
  213. .table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th {
  214. background-color: #2c2c2c;
  215. }
  216. .table-hover>tbody>tr:hover>td, .table-hover>tbody>tr:hover>th {
  217. background-color: #2c2c2c;
  218. }
  219. .stripe-even, .row-odd {
  220. background-color: #2c2c2c;
  221. }
  222. .stripe-odd, .row-even {
  223. background-color: #262626;
  224. }
  225. input,
  226. select,
  227. textarea,
  228. .form-control {
  229. background-color: #444;
  230. border-color: #555;
  231. color: #eee;
  232. }
  233. .callout-info,
  234. .cjt-pagenotice-container .bd,
  235. .iniInfoBlock{
  236. color: #1d1d1d;
  237. }
  238. .yui-panel, .modal-content {
  239. background-color: #313131;
  240. }
  241. .yui-panel .hd, .yui-panel .ft,
  242. .modal-header, .modal-footer {
  243. border-color: #1d1d1d;
  244. }
  245. .close {
  246. color: #ddd;
  247. }
  248. .nav-tabs>li.active>a,
  249. .nav-tabs>li.active>a:hover,
  250. .nav-tabs>li.active>a:focus {
  251. background-color: #444;
  252. border-color: #444;
  253. color: #eee;
  254. }
  255. .nav-tabs>li>a:hover {
  256. background-color: #444;
  257. border-color: #444;
  258. }
  259. .tab-content,
  260. .nav-tabs{
  261. border-color: #444;
  262. }
  263. /***************************** RECYCLABLE CODE *****************************/
  264. #lnkHeaderHome:after,
  265. input#txtQuickFind,
  266. #btnUserPref,
  267. #lnkHeaderNotifications,
  268. #lnkHeaderLogout,
  269. a,
  270. .widget-heading .close,
  271. .panel, .widget,
  272. .group-header-indicator,
  273. .item,
  274. .itemTextWrapper a,
  275. .itemTextWrapper,
  276. #quickLinks a,
  277. #quickjump.form-control,
  278. .widget-heading .group-header, .widget-header .group-header,
  279. footer .navbar-nav > li > a,
  280. .btn-link,
  281. .btn-primary,
  282. #lnkHeaderHome,
  283. #lnkHeaderHome::before,
  284. .dropdown-menu>li>a,
  285. .itemContentWrapper,
  286. .itemImageWrapper,
  287. .item .itemImageWrapper {
  288. -webkit-transition: all 300ms ease;
  289. -moz-transition: all 300ms ease;
  290. -ms-transition: all 300ms ease;
  291. -o-transition: all 300ms ease;
  292. transition: all 300ms ease;
  293. }
  294. #lblUserNameTxt,
  295. #lblLogout,
  296. #caretImg,
  297. #lnkFooterHome,
  298. #quickLinks ul li:first-child {
  299. display: none;
  300. }
  301. /***************************** HEADER *****************************/
  302. header .navbar,
  303. .navbar-preferences, header .navbar, header .navbar .container .navbar-header, header .navbar .container .navbar-header .navbar-preferences,
  304. #lnkHeaderHome, .cp-nav-toggle, #btnUserPref, .link-buttons, #lnkHeaderHome, .cp-nav-toggle {
  305. height: 50px;
  306. }
  307. footer {
  308. border-top: 0px solid #d9e0e2;
  309. }
  310. footer .navbar {
  311. margin: 0;
  312. }
  313. footer .navbar-nav>li>a {
  314. padding-top: 15px;
  315. padding-bottom: 15px;
  316. font-size: 12px;
  317. color: #D7D7D7;
  318. }
  319. footer .navbar-nav>li>a:hover {
  320. background-color: transparent;
  321. color: #FF6C2C;
  322. text-decoration: none;
  323. }
  324. #txtCpanelVersion {
  325. bottom: 0;
  326. color: #D7D7D7;
  327. }
  328. #txtCpanelVersion:before {
  329. content: "cPanel, Inc. © 2016 All Rights Reserved / v.";
  330. font-size: 11px;
  331. }
  332. /***************************** CONTENT BODY *****************************/
  333. /*----- INDEX BODY -----*/
  334. #content {
  335. margin: 40px 20px 5px 20px;
  336. }
  337. #jump-search {
  338. margin: 20px 20px 5px 0;
  339. }
  340. #quickjump {
  341. box-shadow: inset 0 0px 0px rgba(255,255,255,.7);
  342. padding-top: 12px;
  343. padding-bottom: 12px;
  344. height: inherit;
  345. background: url('img/search-icon.png') no-repeat transparent 99% 10px;
  346. }
  347. #quickjump.form-control {
  348. background-color: #444;
  349. border: 1px solid #555;
  350. }
  351. #quickjump.form-control:hover {
  352. background-color: #555;
  353. border-color: #666;
  354. }
  355. #quickjump.form-control:focus {
  356. border-color: #FF6C2C;
  357. outline: 0;
  358. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  359. box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(255,108,44,.6);
  360. }
  361. #boxes {
  362. margin-right: 20px;
  363. }
  364. #featureShowcaseSection {
  365. margin-right: 20px;
  366. margin-bottom: 35px;
  367. }
  368. .panel,
  369. .widget {
  370. background-color: #222;
  371. margin-top: 20px;
  372. box-shadow: none;
  373. border: 1px solid #1d1d1d;
  374. border-radius: 3px;
  375. }
  376. .panel:hover,
  377. .widget:hover {
  378. background-color: #262626;
  379. border-color: #191919;
  380. }
  381. .panel-heading {
  382. border-top-right-radius: inherit;
  383. border-top-left-radius: inherit;
  384. border-bottom-right-radius: 0;
  385. border-bottom-left-radius: 0;
  386. }
  387. .widget-heading,
  388. .widget-header {
  389. border-top: 0px solid #262626;
  390. border-bottom: 1px solid #1d1d1d;
  391. border-left: 0;
  392. border-right: 0;
  393. line-height: 20px;
  394. color: #e0e0e0;
  395. background-color: transparent;
  396. text-transform: capitalize;
  397. font-size: 22px;
  398. padding: 20px 25px;
  399. }
  400. .widget-heading:hover .group-header,
  401. .widget-header:hover .group-header {
  402. color: #F85A16;
  403. }
  404. .widget-heading .close,
  405. .widget-header .close {
  406. color: #d9e0e2;
  407. }
  408. .widget-heading .close:hover,
  409. .widget-header close:hover {
  410. color: #4f5860;
  411. }
  412. .group-header-indicator {
  413. font-size: 14px;
  414. margin-top: 5px;
  415. color: #444;
  416. }
  417. .group-header-indicator:hover {
  418. color: #555;
  419. }
  420. .widget-body,
  421. .panel-body {
  422. background-color: transparent;
  423. }
  424. .item {
  425. background-color: #262626;
  426. height: inherit;
  427. margin: 10px 0 5px 15px;
  428. width: 230px;
  429. border: 1px solid #333;
  430. border-radius: 2px;
  431. -webkit-border-radius: 2px;
  432. overflow: hidden;
  433. }
  434. .item:hover {
  435. background-color: #292929;
  436. border-color: #444;
  437. }
  438. #content .item:hover .itemTextWrapper,
  439. #content .item:hover .itemTextWrapper a {
  440. color: #F85A16;
  441. }
  442. .itemImageWrapper{
  443. margin: 10px 0 10px 10px;
  444. }
  445. .itemTextWrapper,
  446. a.itemTexWrapper {
  447. width: 74%;
  448. padding: 0;
  449. margin-left: -4px;
  450. }
  451. #content .itemTextWrapper a,
  452. #content a.itemTextWrapper {
  453. padding: 15px 0 15px 15px;
  454. color: #e0e0e0;
  455. }
  456. #content .itemTextWrapper a:hover,
  457. #content a.itemTextWrapper:hover {
  458. color: #FF6C2C;
  459. text-decoration: none;
  460. }
  461. @font-face {
  462. font-family: "BalooDa2";
  463. src: url("fonts/BalooDa2r.ttf");
  464. }
  465. html {
  466. font-family: 'BalooDa2';
  467. font-weight:normal;
  468. font-style:normal;
  469. }
  470. /*----- SIDEBAR BODY -----*/
  471. .table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
  472. padding:8px;
  473. border-top: 1px solid #1d1d1d;
  474. }
  475. /*.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
  476. border-top: 1px solid #1d1d1d;
  477. padding: 15px 25px;
  478. }*/
  479. .table>tbody>tr>td.danger, .table>tbody>tr.danger>td,
  480. .table>tbody>tr>td.warning, .table>tbody>tr.warning>td{
  481. background-color: inherit;
  482. }
  483. .table>tbody>td.warning, .table>tbody>tr.warning,
  484. .table>tbody>td.danger, .table>tbody>tr.danger {
  485. border-left:0;
  486. }
  487. .app-stat-upgrade a {
  488. background-color: inherit;
  489. color: #777;
  490. }
  491. .app-stat-upgrade a:hover {
  492. color: #F85A16;
  493. }
  494. .app-stat-upgrade i {
  495. margin-top: 35px;
  496. }
  497. .progress {
  498. background-color: #444;
  499. border-radius: 6px;
  500. height: 6px;
  501. -webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.1);
  502. box-shadow: inset 0 0px 0px rgba(0,0,0,.1);
  503. }
  504. .dashboard-item .progress {
  505. margin: 5px 0 15px 0;
  506. }
  507. .dashboard-item .panel-body {
  508. padding: 15px 25px;
  509. }
  510. /*----- PAGE BODY -----*/
  511. h1, .h1,
  512. h2, .h2,
  513. h3, .h3,
  514. h4, .h4,
  515. h5, .h5,
  516. h6, .h6 {
  517. font-weight: lighter;
  518. }
  519. h1.page-header {
  520. border-bottom: 0;
  521. font-weight: lighter;
  522. border-left: 4px solid #F85A16;
  523. padding: 0 0 0 .5em;
  524. margin-top: 1em;
  525. color: #e0e0e0;
  526. }
  527. .page-icon {
  528. display:none;
  529. }
  530. .body-content h2 {
  531. border-bottom: 1px solid #262626;
  532. padding-bottom: .75em;
  533. margin-bottom: 1em;
  534. font-size: 24px;
  535. }
  536. .body-content .section,
  537. .edge,
  538. .directory-list, /* Directory Privacy */
  539. #postgres_main, /* Postgres Database Wizard*/
  540. #hilight-box, /* Apache SpamAssassin */
  541. .sa-box /* Apache SpamAssassin */ {
  542. background-color: #262626;
  543. padding: 15px;
  544. margin: 2em 0 2em 0;
  545. border: 1px solid #262626;
  546. -webkit-border-radius: 3px;
  547. border-radius: 3px;
  548. overflow: auto;
  549. }
  550. .body-content .section .section, /* Backup, Default Address */
  551. .body-content .section .formbox h2 /* MySQL Databases */ {
  552. border: 0;
  553. padding: 0;
  554. margin: 0;
  555. overflow: visible;
  556. }
  557. .body-content .section .formbox h2 /* MySQL Databases */ {
  558. font-size: 22px;
  559. padding-bottom: .75em;
  560. }
  561. .body-content .form-group {
  562. margin-bottom: 2em;
  563. }
  564. .body-content .control-label {
  565. padding-left: 0;
  566. }
  567. /* Site Publisher page */
  568. .panel-primary>.panel-heading {
  569. background-color: #262626;
  570. }
  571. .panel-default>.panel-heading {
  572. color: #666;
  573. border-color: #262626;
  574. background-color: #262626;
  575. }
  576. .panel-default {
  577. border-color: #444;
  578. }
  579. .panel-primary,
  580. .panel-primary>.panel-heading+.panel-collapse .panel-body {
  581. border-color: #262626;
  582. }
  583. /* /Site Publisher page */
  584. .tab-content /* MultiPHP INI Editor */ {
  585. padding: 15px;
  586. border: 1px solid #ddd;
  587. background-color: #262626;
  588. border-top: 0;
  589. }
  590. .stats-bar-text {
  591. text-transform: capitalize;
  592. }
  593. .search-panel {
  594. margin-bottom: 2em;
  595. }
  596. /*----- NAV MAIN -----*/
  597. header .navbar-header .navbar-brand .brand-name {
  598. font-weight: lighter;
  599. letter-spacing: -1px;
  600. font-size: 30px;
  601. }
  602. #lnkHeaderHome {
  603. color: #222;
  604. opacity: .85;
  605. }
  606. #lnkHeaderHome:hover {
  607. opacity: 1;
  608. }
  609. .navbar-cpanel {
  610. background-color: #262626;
  611. border-bottom: 1px solid #191919;
  612. box-shadow: none;
  613. }
  614. input#txtQuickFind {
  615. height:48px;
  616. width: 50px;
  617. border-left: 1px solid #191919;
  618. border-top: 0;
  619. border-right: 0;
  620. border-bottom: 0;
  621. border-radius: 0;
  622. background: url('img/search-iconSM.png') no-repeat transparent 20px 19px;
  623. color: #4f5860;
  624. text-indent: 35px;
  625. margin: 0;
  626. -webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.075);
  627. box-shadow: inset 0 0px 0px rgba(0,0,0,.075);
  628. margin-right: -4px;
  629. opacity: 1;
  630. }
  631. input:hover#txtQuickFind,
  632. input:focus#txtQuickFind {
  633. width: 175px;
  634. background-color: #1d1d1d;
  635. }
  636. input:focus#txtQuickFind {
  637. box-shadow: none;
  638. }
  639. #btnUserPref,
  640. #lnkHeaderLogout,
  641. #lnkHeaderNotifications {
  642. border-left: 1px solid #191919;
  643. border-right: 0;
  644. border-top: 0;
  645. border-bottom: 0;
  646. border-radius: 0;
  647. background-color: transparent;
  648. color: #777;
  649. }
  650. #btnUserPref,
  651. #lnkHeaderLogout,
  652. #lnkHeaderNotifications {
  653. min-width: 50px;
  654. }
  655. .navbar .fa-lg {
  656. font-size: 12px;
  657. position: relative;
  658. top: -1px;
  659. }
  660. .navbar .badge {
  661. font-size: 10px;
  662. font-weight: lighter;
  663. }
  664. #lnkHeaderLogout {
  665. padding-top: 7px;
  666. }
  667. #btnUserPref:hover, #btnUserPref:active, #btnUserPref:focus,
  668. #lnkHeaderLogout:hover, #lnkHeaderLogout:active, #lnkHeaderLogout:focus,
  669. #lnkHeaderNotifications:hover, #lnkHeaderNotifications:active, #lnkHeaderNotifications:focus {
  670. color: #FF6C2C;
  671. background-color: inherit;
  672. }
  673. .dropdown-menu {
  674. -webkit-box-shadow: 0 2px 3px rgba(0,0,0,.4);
  675. box-shadow: 0 2px 3px rgba(0,0,0,.4);
  676. border: 1px solid #191919;
  677. background-color: #262626
  678. }
  679. .dropdown-menu>li>a,
  680. .navbar-preferences .dropdown-menu>li>a {
  681. border-bottom: 1px dotted #191919;
  682. color: #D7D7D7;
  683. font-weight:lighter;
  684. padding: 10px 15px;
  685. }
  686. .dropdown-menu>li>a:hover,
  687. .dropdown-menu>.active>a,
  688. .dropdown-menu>.active>a:hover,
  689. .dropdown-menu>.active>a:focus {
  690. color: #F85A16;
  691. background-color: #1d1d1d;
  692. }
  693. .dropdown-menu>li:last-child>a {
  694. border-bottom: 0px dotted rgba(0,0,0,.1);
  695. }
  696. .btn-group.open .dropdown-toggle {
  697. -webkit-box-shadow: inset 0 0px 0px rgba(0,0,0,.125);
  698. box-shadow: inset 0 0px 0px rgba(0,0,0,.125);
  699. }
  700. .btn:focus, .btn:active:focus, .btn.active:focus {
  701. outline: 0;
  702. }
  703. /*----- NAV SIDEBAR -----*/
  704. #sidebar {
  705. background-color: #262626;
  706. box-shadow: none;
  707. border-color: #191919;
  708. border-top: 0;
  709. width: auto!important;
  710. }
  711. #sidebar a {
  712. border-bottom: 1px solid #191919;
  713. padding: 16px;
  714. }
  715. #sidebar a:hover,
  716. #sidebar a:active,
  717. #sidebar a:focus {
  718. color: #F85A16;
  719. }
  720. #sidebar a.active {
  721. color: #e0e0e0;
  722. border-left: 4px solid #F85A16;
  723. padding-left: 12px;
  724. background-color:#1d1d1d;
  725. box-shadow: 2px 0px 0px 0 #1d1d1d;
  726. }
  727. #sidebar .fa-2x {
  728. font-size: 18px;
  729. }
  730. #sidebar a#lnkMenu {
  731. padding: 19px 17px 13px 16px;
  732. }
  733. #sidebar a#lnkMenu.active {
  734. padding: 19px 17px 13px 12px;
  735. }
  736. #sidebar a:nth-child(2) img {
  737. filter:contrast(1%) brightness(180%);
  738. -moz-filter:contrast(1%) brightness(180%);
  739. -ms-filter:contrast(1%) brightness(180%);
  740. -o-filter:contrast(1%) brightness(180%);
  741. -webkit-filter:contrast(1%) brightness(180%);
  742. }
  743. .icon-cloudflare_performance, .icon-cloudflare_analytics, .icon-attracta_seotools {
  744. filter:contrast(1%) brightness(180%);
  745. -moz-filter:contrast(1%) brightness(180%);
  746. -ms-filter:contrast(1%) brightness(180%);
  747. -o-filter:contrast(1%) brightness(180%);
  748. -webkit-filter:contrast(1%) brightness(180%);
  749. }
  750. /****************************
  751. *** LG ***
  752. ****************************/
  753. @media (min-width: 992px) and (max-width: 1199px) {
  754. /*----- NAV SECTION -----*/
  755. /*----- BODY INDEX -----*/
  756. .item {
  757. width: 47%;
  758. }
  759. .itemTextWrapper {
  760. width: 77%;
  761. }
  762. #quickjump {
  763. background-position: 98% 10px;
  764. }
  765. #-group .ng-pristine input[name="domain"] {
  766. width:69%;
  767. }
  768. }
  769. /****************************
  770. *** MD ***
  771. ****************************/
  772. @media (min-width: 769px) and (max-width: 991px) {
  773. /*----- NAV SECTION -----*/
  774. /* Sidebar nav */
  775. #sidebar {
  776. top: 50px;
  777. }
  778. /*----- BODY INDEX -----*/
  779. html[dir="ltr"] #content {
  780. margin: 40px 10px 5px 10px
  781. }
  782. #quickjump {
  783. background-position: 97% 10px;
  784. }
  785. .item {
  786. width: 30.5%;
  787. }
  788. .itemImageWrapper {
  789. padding: 8px 0;
  790. }
  791. .itemTextWrapper {
  792. width: 65%;
  793. }
  794. #stats {
  795. margin-left: 15px;
  796. width:95%;
  797. }
  798. #-group .ng-pristine input[name="domain"] {
  799. width:70%;
  800. }
  801. }
  802. /****************************
  803. *** SM ***
  804. ****************************/
  805. @media (max-width: 768px) {
  806. /*----- NAV SECTION -----*/
  807. #lnkHeaderHome {
  808. margin-left:50px;
  809. }
  810. #btnSideBarToggle {
  811. background-color: #F85A16;
  812. }
  813. .cp-nav-toggle {
  814. padding: 0 15px;
  815. }
  816. .cp-icon-bar {
  817. background-color: #fff;
  818. width: 20px;
  819. }
  820. .navbar .fa-lg {
  821. margin-top: 22px;
  822. }
  823. #lnkHeaderLogout {
  824. padding-top: 10px;
  825. }
  826. #jump-search {
  827. padding: 1em;
  828. background-color: #262626;
  829. margin-top: 3;
  830. margin-bottom: 0;
  831. border: 1px solid #333;
  832. }
  833. #quickjump {
  834. border-radius: 0;
  835. background-color: #fff;
  836. border: 1px solid #eee;
  837. -webkit-box-shadow: inset 0 0px 3px rgba(0,0,0,.15);
  838. box-shadow: inset 0 0px 3px rgba(0,0,0,.15);
  839. background-position: 96% 10px;
  840. }
  841. /* Sidebar nav */
  842. #sidebar {
  843. top: 50px;
  844. }
  845. #sidebar a.active {
  846. box-shadow: 0px 0px 0px 0 #303030;
  847. }
  848. /*----- BODY INDEX -----*/
  849. /* content */
  850. html[dir="ltr"] #content,
  851. html[dir="ltr"] #stats {
  852. padding-left: 15px;
  853. }
  854. html[dir="ltr"] #content {
  855. margin: 40px 5px 5px 5px;
  856. }
  857. #boxes,
  858. #jump-search,
  859. #featureShowcaseSection {
  860. margin-right: 0;
  861. }
  862. .dashboard-item .panel-body,
  863. .panel-body {
  864. padding: 10px;
  865. }
  866. .item {
  867. width: 47%;
  868. margin: 0px 1.5% 15px 1.5%;
  869. max-height: 138px;
  870. }
  871. .itemContentWrapper {
  872. border-color: #F85A16;
  873. }
  874. .itemImageWrapper {
  875. margin: 20px auto 0;
  876. display: block;
  877. }
  878. .itemTextWrapper {
  879. width: 100%;
  880. font-size: 13px;
  881. text-align: center;
  882. margin-bottom: 20px;
  883. margin-left: 0;
  884. }
  885. #content .itemTextWrapper a,
  886. #content a.itemTextWrapper {
  887. padding: 15px;
  888. display: block;
  889. }
  890. /* DETAIL / ACTION */
  891. h1.page-header .page-icon {
  892. display: none;
  893. }
  894. /* FOOTER */
  895. html[dir="ltr"] footer {
  896. padding-left: 15px;
  897. }
  898. html[dir="ltr"] footer .navbar-brand {
  899. text-align: center;
  900. margin-left: 0;
  901. width:100%;
  902. }
  903. footer .navbar {
  904. width:98%;
  905. }
  906. footer .nav.navbar-nav {
  907. float: inherit;
  908. }
  909. .navbar-nav{
  910. margin: 0;
  911. }
  912. footer .nav.navbar-nav li:first-child {
  913. display: none;
  914. }
  915. footer .nav > li {
  916. display: inline-block;
  917. width: 49%;
  918. text-align: center;
  919. }
  920. footer .nav > li {
  921. display: inline-block;
  922. }
  923. #lnkPoweredByCpanel {
  924. padding: 0 10px 10px;
  925. }
  926. #txtCpanelVersion {
  927. width: 100%;
  928. padding-bottom: 50px;
  929. }
  930. #-group .ng-pristine input[name="domain"] {
  931. width:60%;
  932. }
  933. }
  934. /****************************
  935. *** XS ***
  936. ****************************/
  937. @media (max-width: 480px) {
  938. /* NAV SECTION */
  939. #btnUserPref,
  940. #lnkHeaderLogout,
  941. #lnkHeaderNotifications {
  942. min-width: 25px;
  943. padding-left: 12px;
  944. padding-right: 12px;
  945. }
  946. /* BODY INDEX */
  947. #quickjump {
  948. background-position: 95% 10px;
  949. }
  950. .widget-heading {
  951. padding: 10px;
  952. white-space: nowrap;
  953. overflow:hidden;
  954. }
  955. .itemTextWrapper {
  956. font-size: 14px;
  957. }
  958. html[dir="ltr"] footer {
  959. padding-left: 0;
  960. }
  961. footer .navbar {
  962. width: 100%;
  963. }
  964. .navbar-nav{
  965. margin: 0;
  966. }
  967. footer sub, footer sup {
  968. line-height: inherit;
  969. }
  970. #-group .ng-pristine input[name="domain"] {
  971. width:50%;
  972. }
  973. #-group .ng-pristine select[name="ext"] {
  974. width:100%;
  975. }
  976. }
  977. /****************************
  978. *** XS ***
  979. ****************************/
  980. @media (max-width: 479px) {
  981. #-group .ng-pristine input[name="domain"] {
  982. width:100%;
  983. }
  984. #-group .ng-pristine select[name="ext"] {
  985. width:100%;
  986. }
  987. .widget-heading .group-header {
  988. overflow: hidden;
  989. max-width: 190px;
  990. display: inline-block;
  991. }
  992. }