styles.css 22 KB

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