Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
 
 
 
 
 

1562 строки
33 KiB

  1. @media (min-width: 971px) {
  2. .container{
  3. width: 970px;
  4. }
  5. }
  6. html, body {
  7. height: 100%;
  8. background-color: #F6F7FB; /*#F5F7FA;*/
  9. }
  10. .wrapper {
  11. min-height: 100%;
  12. height: auto !important;
  13. height: 100%;
  14. margin: 0 auto -4em;
  15. }
  16. .alert-warning {
  17. color: #AD5909;
  18. background-color: #FFC792;
  19. border: #AD5909;
  20. }
  21. #main_auth {
  22. padding-top: 20px;
  23. }
  24. span.primary-color {
  25. color: #048dbf;
  26. }
  27. #main_auth div.panel-success>.panel-heading {
  28. background-color: #048dbf;
  29. border-color: #048dbf;
  30. }
  31. body#native #footer,
  32. #native .browsersupport {
  33. display: none;
  34. }
  35. .browsersupport h6 {
  36. font-size: 85%;
  37. }
  38. .browsersupport small {
  39. color: #CCD1D9;
  40. font-size: 75%;
  41. }
  42. .label,
  43. .label-default {
  44. background-color: #aab9bd;
  45. }
  46. .has-success .input-group-addon,
  47. .label-success,
  48. .btn-success,
  49. .btn-success.active,
  50. .btn-success:hover
  51. {
  52. background-color: #5cb85c;
  53. border-color: #4cae4c;
  54. }
  55. .span-premium {
  56. color: #CCAC00;
  57. }
  58. .panel-premium>.panel-heading,
  59. .label-premium,
  60. .btn-premium,
  61. .btn-premium:hover,
  62. .btn-premium:active
  63. {
  64. background-color: #CCAC00;
  65. border-color: #CCAC00;
  66. }
  67. .panel-premium>.panel-heading {
  68. color: white;
  69. }
  70. .span.premium-star {
  71. color: #CCAC00;;
  72. }
  73. .btn-premium:focus,
  74. .btn-premium:active,
  75. .btn-premium:hover {
  76. background-color: #DDBC00;
  77. border-color: #DDBC00;
  78. }
  79. .label-primary,
  80. .btn-primary.active,
  81. .btn-primary {
  82. background-color: #048dbf;
  83. border-color: #048dbf;
  84. }
  85. .btn-primary:hover {
  86. background-color: #0f90a4;
  87. border-color: #0f90a4;
  88. }
  89. .panel-danger>.panel-heading,
  90. .label-danger,
  91. .btn-danger,
  92. .btn-danger.active {
  93. background-color: #f35142;
  94. }
  95. .panel-primary>.panel-heading {
  96. background-color: #048dbf;
  97. border-color: #048dbf;
  98. }
  99. .panel-title a {
  100. font-weight: bold;
  101. color: #434a54!important;
  102. }
  103. .panel-title a.collapsed {
  104. font-weight: inherit!important;
  105. color: inherit!important;
  106. }
  107. .table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {
  108. border-top: none;
  109. }
  110. .table>thead>tr>th {
  111. border-bottom-width: 1px;
  112. }
  113. a {
  114. color: #048dbf;
  115. }
  116. a:hover {
  117. color: #0f90a4;
  118. }
  119. label.for-custom-radio {
  120. display: block;
  121. }
  122. .radiochecklabel, .checkboxlabel {
  123. display: block;
  124. position: relative;
  125. padding: 9px 0px 0px 40px;
  126. z-index: 9;
  127. font-weight: normal;
  128. }
  129. .radio-inline.radiochecklabel, .checkbox-inline.checkboxlabel {
  130. display: inline-block;
  131. margin-left: -10px;
  132. margin-right: 20px;
  133. }
  134. .radiocheck, .checkbox {
  135. visibility: hidden;
  136. position: absolute;
  137. }
  138. .radiochecklabel .check, .checkboxlabel .check {
  139. display: block;
  140. position: absolute;
  141. border: 3px solid #e8ebed;
  142. border-radius: 100%;
  143. height: 20px;
  144. width: 20px;
  145. top: 10px;
  146. left: 10px;
  147. z-index: 5;
  148. }
  149. .radiochecklabel:hover .check {
  150. border: 3px solid #048dbf;
  151. }
  152. .radiochecklabel .check:before, .checkboxlabel .check:before {
  153. display: block;
  154. position: absolute;
  155. content: ' ';
  156. border-radius: 100%;
  157. height: 6px;
  158. width: 6px;
  159. top: 4px;
  160. left: 4px;
  161. margin: auto;
  162. }
  163. input[type=radio]:checked ~ .check {
  164. border: 3px solid #048dbf;
  165. }
  166. input[type=radio]:checked ~ .check::before {
  167. background: #048dbf;
  168. }
  169. /* Checkbox bits */
  170. input[type=checkbox]:checked ~ .check {
  171. border: 3px solid #048dbf;
  172. }
  173. input[type=checkbox]:checked ~ .check::before {
  174. background: #048dbf;
  175. }
  176. .checkboxlabel .check {
  177. border-radius: 3px;
  178. }
  179. .checkboxlabel .check:before {
  180. border-radius: 3px;
  181. }
  182. .checkboxlabel:hover .check {
  183. border: 3px solid #048dbf;
  184. }
  185. /*** start: Slim plugin ****************************************************************/
  186. .slim-teamemblem {
  187. width: 150px;
  188. height: 150px;
  189. margin: auto;
  190. }
  191. .slim-profilepic {
  192. width: 150px;
  193. height: 150px;
  194. margin: auto;
  195. border-radius: 50%;
  196. }
  197. .slim-btn {
  198. background-color: rgba( 9, 104, 119, 0.9 );
  199. }
  200. .slim-image-editor .slim-editor-btn-group button {
  201. background-color : rgba( 9, 104, 119, 1 );
  202. border-radius: 0;
  203. }
  204. .slim-editor-btn .slim-btn-cancel .slim-btn-cancel {
  205. background-color : #f35142;
  206. }
  207. /*** start: Offcanvas Menu Styles ******************************************************/
  208. /* Important styles */
  209. #sidenavtoggle {
  210. display: inline-block;
  211. width: 28px;
  212. height: 30px;
  213. margin: 10px 20px 10px 10px;
  214. }
  215. #sidenavtoggle span:after,
  216. #sidenavtoggle span:before {
  217. content: "";
  218. position: absolute;
  219. left: 0;
  220. top: -9px;
  221. }
  222. #sidenavtoggle span:after{
  223. top: 9px;
  224. }
  225. #sidenavtoggle span {
  226. position: relative;
  227. display: inline-block;
  228. }
  229. #sidenavtoggle span,
  230. #sidenavtoggle span:after,
  231. #sidenavtoggle span:before {
  232. width: 100%;
  233. height: 5px;
  234. background-color: #FFFFFF;
  235. transition: all 0.3s;
  236. backface-visibility: hidden;
  237. border-radius: 2px;
  238. }
  239. /* on activation */
  240. #sidenavtoggle.on span {
  241. background-color: transparent;
  242. }
  243. #sidenavtoggle.on span:before {
  244. transform: rotate(45deg) translate(5px, 5px);
  245. }
  246. #sidenavtoggle.on span:after {
  247. transform: rotate(-45deg) translate(7px, -8px);
  248. }
  249. #sidenavtoggle.on {
  250. opacity: 1;
  251. }
  252. @media (min-width: 0) {
  253. .navbar-toggle {
  254. display: block; /* force showing the toggle */
  255. }
  256. }
  257. @media (min-width: 971px) {
  258. body {
  259. padding: 0;
  260. }
  261. .navbar {
  262. /*right: auto;*/
  263. background: none;
  264. border: none;
  265. }
  266. }
  267. #offcanvasmenu {
  268. z-index: 10001;
  269. }
  270. #offcanvasmenu, .navmenu {
  271. width: 200px;
  272. }
  273. #offcanvasmenu, .navmenu-default, #offcanvasmenu .navmenu-nav>li>button {
  274. color: #fff;
  275. background-color: #048dbf;
  276. margin-left: 4px;
  277. }
  278. #offcanvasmenu .navmenu-tbbrand {
  279. color: #048dbf;
  280. background-color: #ffffff;
  281. font-size: 14px;
  282. }
  283. #offcanvasmenu i.icon {
  284. font-size: 2.0em;
  285. }
  286. /*** end: Offcanvas Menu Styles ******************************************************/
  287. /*** start: Breadcrumb ******************************************************/
  288. #breadcrumb {
  289. display: none;
  290. }
  291. /*** end: Breadcrumb ********************************************************/
  292. /*** start: Breadcrumb ******************************************************/
  293. #main_navigation {
  294. margin-bottom: 0;
  295. -webkit-box-shadow: 0 4px 10px -6px #222;
  296. -moz-box-shadow: 0 4px 10px -6px #222;
  297. box-shadow: 0 4px 10px -6px #222;
  298. }
  299. /*** end: Breadcrumb ********************************************************/
  300. /*** start: Main Nav Tab Styles ******************************************************/
  301. @font-face {
  302. font-weight: normal;
  303. font-style: normal;
  304. font-family: 'stroke7pixeden';
  305. src:url('../fonts/stroke7pixeden/stroke7pixeden.eot?u58ytb');
  306. src:url('../fonts/stroke7pixeden/stroke7pixeden.eot?#iefixu58ytb') format('embedded-opentype'),
  307. url('../fonts/stroke7pixeden/stroke7pixeden.woff?u58ytb') format('woff'),
  308. url('../fonts/stroke7pixeden/stroke7pixeden.ttf?u58ytb') format('truetype'),
  309. url('../fonts/stroke7pixeden/stroke7pixeden.svg?u58ytb#stroke7pixeden') format('svg');
  310. }
  311. .tabs {
  312. position: relative;
  313. overflow: hidden;
  314. margin: 0 auto;
  315. width: 100%;
  316. font-weight: 300;
  317. font-size: 1.25em;
  318. }
  319. .tabs nav {
  320. text-align: center;
  321. }
  322. .tabs nav ul {
  323. position: relative;
  324. display: -ms-flexbox;
  325. display: -webkit-flex;
  326. display: -moz-flex;
  327. display: -ms-flex;
  328. display: flex;
  329. margin: 0 auto;
  330. padding: 0;
  331. max-width: 1200px;
  332. list-style: none;
  333. -ms-box-orient: horizontal;
  334. -ms-box-pack: center;
  335. -webkit-flex-flow: row wrap;
  336. -moz-flex-flow: row wrap;
  337. -ms-flex-flow: row wrap;
  338. flex-flow: row wrap;
  339. -webkit-justify-content: center;
  340. -moz-justify-content: center;
  341. -ms-justify-content: center;
  342. justify-content: center;
  343. }
  344. .tabs nav ul li {
  345. position: relative;
  346. z-index: 1;
  347. display: block;
  348. margin: 0;
  349. text-align: center;
  350. -webkit-flex: 1;
  351. -moz-flex: 1;
  352. -ms-flex: 1;
  353. flex: 1;
  354. }
  355. .tabs nav a {
  356. position: relative;
  357. display: block;
  358. overflow: hidden;
  359. text-overflow: ellipsis;
  360. white-space: nowrap;
  361. line-height: 2.5;
  362. color: #048dbf;
  363. }
  364. .tabs nav a span {
  365. vertical-align: middle;
  366. font-size: 0.75em;
  367. }
  368. .tabs nav li.tab-current a {
  369. color: #048dbf;
  370. }
  371. .tabs nav a:focus {
  372. outline: none;
  373. }
  374. /* Icons */
  375. .icon::before {
  376. z-index: 10;
  377. display: inline-block;
  378. margin: 0 0.4em 0 0;
  379. vertical-align: middle;
  380. text-transform: none;
  381. font-weight: normal;
  382. font-variant: normal;
  383. font-size: 2em;
  384. font-family: "Pe-icon-7-stroke";
  385. /*font-family: 'stroke7pixeden';*/
  386. line-height: 1;
  387. speak: none;
  388. -webkit-backface-visibility: hidden;
  389. -webkit-font-smoothing: antialiased;
  390. -moz-osx-font-smoothing: grayscale;
  391. }
  392. .icon-upload::before {
  393. content: "\e68a";
  394. }
  395. .icon-tools::before {
  396. content: "\e60a";
  397. }
  398. .icon-plane::before {
  399. content: "\e625";
  400. }
  401. .icon-joy::before {
  402. content: "\e6a4";
  403. }
  404. .icon-plug::before {
  405. content: "\e69a";
  406. }
  407. .icon-home::before {
  408. content: "\e648";
  409. }
  410. .icon-gift::before {
  411. content: "\e652";
  412. }
  413. .icon-display::before {
  414. content: "\e65e";
  415. }
  416. .icon-date::before {
  417. content: "\e660";
  418. }
  419. .icon-config::before {
  420. content: "\e666";
  421. }
  422. .icon-coffee::before {
  423. content: "\e669";
  424. }
  425. .icon-camera::before {
  426. content: "\e66f";
  427. }
  428. .icon-box::before {
  429. content: "\e674";
  430. }
  431. .tabs nav a.icon span.badge {
  432. margin-left: 10px;
  433. }
  434. @media screen and (max-width: 58em) {
  435. .tabs nav a.icon span {
  436. display: none;
  437. }
  438. .tabs nav a.icon span.badge {
  439. display: inline-block;
  440. margin-left: 0;
  441. }
  442. .tabs nav a:before {
  443. margin-right: 0;
  444. }
  445. }
  446. .tabs-style-underline nav {
  447. background: #fff;
  448. }
  449. .tabs-style-underline nav a {
  450. padding: 0.25em 0 0.5em;
  451. border-left: 1px solid #e7ecea;
  452. -webkit-transition: color 0.2s;
  453. transition: color 0.2s;
  454. }
  455. .tabs-style-underline nav li:last-child a {
  456. border-right: 1px solid #e7ecea;
  457. }
  458. .tabs-style-underline nav li a::after {
  459. position: absolute;
  460. bottom: 0;
  461. left: 0;
  462. width: 100%;
  463. height: 6px;
  464. background: #048dbf;
  465. content: '';
  466. -webkit-transition: -webkit-transform 0.3s;
  467. transition: transform 0.3s;
  468. -webkit-transform: translate3d(0,150%,0);
  469. transform: translate3d(0,150%,0);
  470. }
  471. .tabs-style-underline nav li.tab-current a::after {
  472. -webkit-transform: translate3d(0,0,0);
  473. transform: translate3d(0,0,0);
  474. }
  475. .tabs-style-underline nav a span {
  476. font-weight: 600;
  477. }
  478. /*** end: Main Nav Tab Styles ******************************************************/
  479. /*** start: Main Page ******************************************************/
  480. #main {
  481. margin-top: 126px;
  482. }
  483. #main div.header_navigation {
  484. background-color: #048dbf;
  485. min-height: 46px;
  486. }
  487. #team-select {
  488. color: #fff;
  489. text-align: right;
  490. height: 44px;
  491. padding-top: 14px;
  492. padding-right:16px;
  493. width: 240px;
  494. white-space: nowrap;
  495. overflow: hidden;
  496. text-overflow: ellipsis;
  497. }
  498. @media only screen and (max-width: 640px) {
  499. #team-select {
  500. width: 140px;
  501. }
  502. }
  503. #team-select a {
  504. color: #fff;
  505. font-weight: bold;
  506. }
  507. /*** start: Page Loader *********************************************************************/
  508. #page-loader {
  509. width: 100%;
  510. height: 100%;
  511. position: absolute;
  512. top: 0;
  513. left: 0;
  514. background-color: #F5F7FA;
  515. z-index: 100;
  516. display: none;
  517. /*
  518. align-items: center;
  519. justify-content: center;
  520. */
  521. opacity: 1;
  522. }
  523. .page-fade-animation {
  524. -webkit-transition: opacity 1s ease-in-out;
  525. -moz-transition: opacity 1s ease-in-out;
  526. -o-transition: opacity 1s ease-in-out;
  527. transition: opacity 1s ease-in-out;
  528. pointer-events: none;
  529. }
  530. .spinner {
  531. -webkit-animation: rotator 1.4s linear infinite;
  532. animation: rotator 1.4s linear infinite;
  533. }
  534. @-webkit-keyframes rotator {
  535. 0% {
  536. -webkit-transform: rotate(0deg);
  537. transform: rotate(0deg);
  538. }
  539. 100% {
  540. -webkit-transform: rotate(270deg);
  541. transform: rotate(270deg);
  542. }
  543. }
  544. @keyframes rotator {
  545. 0% {
  546. -webkit-transform: rotate(0deg);
  547. transform: rotate(0deg);
  548. }
  549. 100% {
  550. -webkit-transform: rotate(270deg);
  551. transform: rotate(270deg);
  552. }
  553. }
  554. .path {
  555. stroke-dasharray: 187;
  556. stroke-dashoffset: 0;
  557. -webkit-transform-origin: center;
  558. -ms-transform-origin: center;
  559. transform-origin: center;
  560. -webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
  561. animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
  562. }
  563. @-webkit-keyframes colors {
  564. 0% {
  565. stroke: #656D78;
  566. }
  567. 25% {
  568. stroke: #FFCE54;
  569. }
  570. 50% {
  571. stroke: #ED5565;
  572. }
  573. 75% {
  574. stroke: #EC87C0;
  575. }
  576. 100% {
  577. stroke: #656D78;
  578. }
  579. }
  580. @keyframes colors {
  581. 0% {
  582. stroke: #656D78;
  583. }
  584. 25% {
  585. stroke: #FFCE54;
  586. }
  587. 50% {
  588. stroke: #ED5565;
  589. }
  590. 75% {
  591. stroke: #EC87C0;
  592. }
  593. 100% {
  594. stroke: #656D78;
  595. }
  596. }
  597. @-webkit-keyframes dash {
  598. 0% {
  599. stroke-dashoffset: 187;
  600. }
  601. 50% {
  602. stroke-dashoffset: 46.75;
  603. -webkit-transform: rotate(135deg);
  604. transform: rotate(135deg);
  605. }
  606. 100% {
  607. stroke-dashoffset: 187;
  608. -webkit-transform: rotate(450deg);
  609. transform: rotate(450deg);
  610. }
  611. }
  612. @keyframes dash {
  613. 0% {
  614. stroke-dashoffset: 187;
  615. }
  616. 50% {
  617. stroke-dashoffset: 46.75;
  618. -webkit-transform: rotate(135deg);
  619. transform: rotate(135deg);
  620. }
  621. 100% {
  622. stroke-dashoffset: 187;
  623. -webkit-transform: rotate(450deg);
  624. transform: rotate(450deg);
  625. }
  626. }
  627. /*** end: Page Loader *********************************************************************/
  628. #main .content-row {
  629. position: relative;
  630. overflow: hidden;
  631. }
  632. #content {
  633. position: relative;
  634. -webkit-transition: all 1s ease;
  635. -moz-transition: all 1s ease;
  636. -o-transition: all 1s ease;
  637. -ms-transition: all 1s ease;
  638. transition: all 1s ease;
  639. margin-bottom: 56px;
  640. }
  641. #content .panel-trainer_options {
  642. margin-top: 30px;
  643. }
  644. #main .page h3 {
  645. font-size: 20px;
  646. margin-top: 8px;
  647. font-weight: 500;
  648. }
  649. #main .page h4 {
  650. font-size: 16px;
  651. font-weight: 600;
  652. }
  653. #main .page {
  654. padding-left: 16px;
  655. padding-right: 16px;
  656. }
  657. #main .page ol.breadcrumb {
  658. margin-top: 16px;
  659. }
  660. #main .page ol.breadcrumb li a {
  661. background-color: #CCD1D9;
  662. border-color: #CCD1D9;
  663. }
  664. #main .page .breadcrumb-arrow li a:before,
  665. #main .page .breadcrumb-arrow li a:after {
  666. border-left-color: #CCD1D9;
  667. }
  668. #main .page .breadcrumb-arrow li span {
  669. color: #656D78;
  670. }
  671. #main .page label.inline {
  672. display: inline-block;
  673. }
  674. #main .page label.radio {
  675. position:relative;
  676. font-weight: normal;
  677. }
  678. #main .page label.radio span{
  679. position:relative;
  680. padding-left:20px;
  681. }
  682. #main .page label.radio span:after{
  683. content:'';
  684. width:15px;
  685. height:15px;
  686. border:2px solid;
  687. position:absolute;
  688. left:0;
  689. top:1px;
  690. border-radius:100%;
  691. -ms-border-radius:100%;
  692. -moz-border-radius:100%;
  693. -webkit-border-radius:100%;
  694. box-sizing:border-box;
  695. -ms-box-sizing:border-box;
  696. -moz-box-sizing:border-box;
  697. -webkit-box-sizing:border-box;
  698. }
  699. #main .page label.radio input[type="radio"]{
  700. cursor: pointer;
  701. position:absolute;
  702. width:100%;
  703. height:100%;
  704. z-index: 1;
  705. opacity: 0;
  706. filter: alpha(opacity=0);
  707. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
  708. }
  709. #main .page label.radio input[type="radio"]:checked + span{
  710. }
  711. #main .page label.radio input[type="radio"]:checked + span:before{
  712. content:'';
  713. width:5px;
  714. height:5px;
  715. position:absolute;
  716. background:#434A54;
  717. left:5px;
  718. top:6px;
  719. border-radius:100%;
  720. -ms-border-radius:100%;
  721. -moz-border-radius:100%;
  722. -webkit-border-radius:100%;
  723. }
  724. @media (max-width: 990px) {
  725. #content .col-sm-12 {
  726. padding-bottom: 16px;
  727. }
  728. #content .col-sm-12.no-extra-bottom-margin {
  729. padding-bottom: 0px;
  730. }
  731. }
  732. #main .table tbody>tr>td{
  733. vertical-align: middle;
  734. }
  735. #appointment-table-old-appointment-small,
  736. #appointment-table-old-appointment {
  737. margin-top: 16px;
  738. }
  739. .table-responsive {
  740. border: none;
  741. }
  742. .table-appointment-detail {
  743. background-color: white;
  744. border-color: #e6e9ed;
  745. border: none;
  746. }
  747. .table-appointment-detail tr td:nth-child(1) {
  748. width: 1px;
  749. font-weight: bold;
  750. }
  751. #main .table-appointment-detail tbody tr td.valign-top {
  752. vertical-align: top;
  753. }
  754. .table-appointment-attendees tr th:nth-child(4),
  755. .table-appointment-attendees tr td:nth-child(5){
  756. text-align: center;
  757. }
  758. .table-appointment-attendees tr td:nth-child(1),
  759. .table-appointment-attendees tr td:nth-child(4),
  760. .table-appointment-attendees tr td:nth-child(5) {
  761. width: 1px;
  762. white-space: nowrap;
  763. }
  764. @media only screen and (max-width: 800px) {
  765. .table-appointment-attendees tr th:nth-child(1),
  766. .table-appointment-attendees tr td:nth-child(1),
  767. .table-appointment-attendees tr th:nth-child(3),
  768. .table-appointment-attendees tr td:nth-child(3) {
  769. width: 1px;
  770. white-space: nowrap;
  771. }
  772. .table-appointment-attendees tr th:nth-child(3),
  773. .table-appointment-attendees tr td:nth-child(3) {
  774. text-align: center;
  775. }
  776. }
  777. h4 span.label {
  778. padding-top: .3em;
  779. }
  780. #appointment_edit_attendees tr td[data-title="Status"] span.label{
  781. cursor: pointer;
  782. }
  783. #appointment_edit_attendees tr td:nth-child(3) {
  784. width: 100px;
  785. min-width: 100px;
  786. max-width: 170px;
  787. }
  788. #main table.table-appointment tbody td:nth-child(1) {
  789. width: 1px;
  790. white-space: nowrap;
  791. }
  792. #content table.table-appointment tbody td:nth-child(4) {
  793. width: 170px;
  794. min-width: 170px;
  795. max-width: 170px;
  796. }
  797. /*
  798. #main table. thead th:nth-child(4),
  799. .table-striped tbody tr td {
  800. text-align: center;
  801. width: 170px;
  802. min-width: 170px;
  803. max-width: 170px;
  804. color: red;
  805. }
  806. */
  807. #news_badge {
  808. font-size: 10px;
  809. }
  810. .create-chat {
  811. margin-left: -15px;
  812. margin-right: -15px;
  813. }
  814. /* No More Tables */
  815. @media only screen and (max-width: 800px) {
  816. /* Force table to not be like tables anymore */
  817. #content .no-more-tables table,
  818. #content .no-more-tables thead,
  819. #content .no-more-tables tbody,
  820. #content .no-more-tables th,
  821. #content .no-more-tables td,
  822. #content .no-more-tables tr {
  823. display: block;
  824. }
  825. /* Hide table headers (but not display: none;, for accessibility) */
  826. #content .no-more-tables thead tr {
  827. position: absolute;
  828. top: -9999px;
  829. left: -9999px;
  830. }
  831. #content .no-more-tables tr { border: 1px solid #ccc; }
  832. #content .no-more-tables td {
  833. /* Behave like a "row" */
  834. border: none;
  835. border-bottom: 1px solid #eee;
  836. position: relative;
  837. padding-left: 50%;
  838. white-space: normal;
  839. text-align:left;
  840. }
  841. #content .no-more-tables td:before {
  842. /* Now like a table header */
  843. position: absolute;
  844. /* Top/left values mimic padding */
  845. top: 6px;
  846. left: 6px;
  847. width: 45%;
  848. padding-right: 10px;
  849. white-space: nowrap;
  850. text-align:left;
  851. font-weight: bold;
  852. }
  853. /*
  854. Label the data
  855. */
  856. #content .no-more-tables td:before { content: attr(data-title); }
  857. }
  858. .profile-name {
  859. text-align: center;
  860. font-size: 22px;
  861. }
  862. .panel,
  863. .well {
  864. margin-bottom: 10px;
  865. }
  866. .panel.panel-pricetable {
  867. margin-bottom: 32px;
  868. }
  869. .team-name {
  870. text-align: center;
  871. font-size: 22px;
  872. padding-top: 8px;
  873. padding-bottom: 16px;
  874. }
  875. .profile-role {
  876. text-align: center;
  877. font-size: 18px;
  878. padding-bottom: 16px;
  879. }
  880. .team-emblem-size {
  881. width: 150px;
  882. }
  883. .profile-pic-size {
  884. width: 150px;
  885. }
  886. .profile-list-body {
  887. overflow: hidden;
  888. padding-left: 16px;
  889. font-size: 12px;
  890. }
  891. .profile-list-body a.profile-list-name {
  892. /*font-weight: bold;*/
  893. font-size: 14px;
  894. }
  895. .profile-list-body hr.profile-list-divider {
  896. margin:4px auto;
  897. }
  898. .profile-list-body .faded {
  899. color: #aab9bd;
  900. font-size: 10px;
  901. }
  902. .profile-list-body i.comment {
  903. font-size: 12px;
  904. }
  905. .profile-pic-size-list {
  906. width: 40px;
  907. padding: 0;
  908. }
  909. .panel-body.profile-list {
  910. padding: 8px;
  911. }
  912. .panel-body.profile-list span.attendee-iterator {
  913. position: absolute;
  914. font-size: 10px;
  915. bottom: 0px;
  916. right: -8px;
  917. }
  918. .profile-pic-size-offcanvas {
  919. width: 100px;
  920. }
  921. .profile-image {
  922. padding: 16px;
  923. }
  924. .team-image img,
  925. .profile-image img {
  926. display: block;
  927. margin: auto;
  928. }
  929. .table-premium-features thead tr th:nth-child(2),
  930. .table-premium-features tfoot tr td:nth-child(2),
  931. .table-premium-features thead tr th:nth-child(3),
  932. .table-premium-features tfoot tr td:nth-child(3) {
  933. font-size: 20px;
  934. color: white;
  935. font-weight: normal;
  936. background-color: #048dbf;
  937. padding: 12px 12px;
  938. }
  939. .table-premium-features thead tr th:nth-child(3),
  940. .table-premium-features tfoot tr td:nth-child(3) {
  941. background-color: #CAAA00;
  942. }
  943. .table-premium-features thead tr th:nth-child(2),
  944. .table-premium-features tbody tr td:nth-child(2),
  945. .table-premium-features tfoot tr td:nth-child(2),
  946. .table-premium-features thead tr th:nth-child(3),
  947. .table-premium-features tbody tr td:nth-child(3),
  948. .table-premium-features tfoot tr td:nth-child(3) {
  949. text-align: center;
  950. }
  951. .text-danger,
  952. .table-premium-features i.fa.fa-times {
  953. color: #f35142;
  954. }
  955. .table-premium-features i.fa.fa-check {
  956. color: #5cb85c;
  957. }
  958. .table-team-profile tbody tr td,
  959. .table-player-profile tbody tr td {
  960. padding: 5px 20px;
  961. }
  962. .table-team-profile tbody tr:first-child td,
  963. .table-player-profile tbody tr:first-child td {
  964. border: none;
  965. }
  966. .table-team-profile tbody tr td:nth-child(1),
  967. .table-player-profile tbody tr td:nth-child(1) {
  968. width: 1px;
  969. white-space: nowrap;
  970. }
  971. .specialContentBig .table-team-buddies thead tr th:nth-child(3),
  972. .specialContentBig .table-team-buddies tbody tr td:nth-child(3),
  973. .specialContentBig .table-team-buddies thead tr th:nth-child(4),
  974. .specialContentBig .table-team-buddies tbody tr td:nth-child(4),
  975. .specialContentBig .table-team-buddies thead tr th:nth-child(5),
  976. .specialContentBig .table-team-buddies tbody tr td:nth-child(5) {
  977. width: 1px;
  978. white-space: nowrap;
  979. text-align: center;
  980. }
  981. .specialContentSmall .table-team-buddies thead tr th:nth-child(1),
  982. .specialContentSmall .table-team-buddies tbody tr td:nth-child(1) {
  983. width: 1px;
  984. }
  985. .specialContentBig .table-team-invites thead tr th:nth-child(4),
  986. .specialContentBig .table-team-invites tbody tr td:nth-child(4),
  987. .specialContentSmall .table-team-invites thead tr th:nth-child(2),
  988. .specialContentSmall .table-team-invites tbody tr td:nth-child(2) {
  989. width: 1px;
  990. white-space: nowrap;
  991. text-align: center;
  992. }
  993. /** start: SPECIAL CONTENT **/
  994. #content .specialContentBig {
  995. display: block;
  996. }
  997. #content .specialContentSmall {
  998. display: none;
  999. }
  1000. @media only screen and (max-width: 800px) {
  1001. #content .specialContentBig {
  1002. display: none;
  1003. }
  1004. #content .specialContentSmall {
  1005. display: block;
  1006. }
  1007. }
  1008. .specialContentBig table.table-appointment thead th:nth-child(4),
  1009. .specialContentBig table.table-appointment tbody td:nth-child(4) {
  1010. text-align: center;
  1011. }
  1012. .specialContentSmall table.table-appointment {
  1013. table-layout: fixed;
  1014. }
  1015. .specialContentSmall table.table-appointment thead th:nth-child(1),
  1016. .specialContentSmall table.table-appointment tbody td:nth-child(1) {
  1017. width: 50px;
  1018. /*max-width: 0;*/
  1019. }
  1020. .specialContentSmall table.table-appointment thead th:nth-child(2),
  1021. .specialContentSmall table.table-appointment tbody td:nth-child(2) {
  1022. /*max-width: 0;*/
  1023. overflow: hidden;
  1024. text-overflow: ellipsis;
  1025. white-space: nowrap;
  1026. }
  1027. .specialContentSmall table.table-appointment thead th:nth-child(3),
  1028. .specialContentSmall table.table-appointment tbody td:nth-child(3) {
  1029. width: 94px;
  1030. max-width: 94px;
  1031. min-width: 94px;
  1032. text-align: center;
  1033. }
  1034. .specialContentBig .table-stats-one thead tr th:nth-child(1),
  1035. .specialContentBig .table-stats-one tbody tr td:nth-child(1),
  1036. .specialContentBig .table-stats-one thead tr th:nth-child(3),
  1037. .specialContentBig .table-stats-one tbody tr td:nth-child(3),
  1038. .specialContentBig .table-stats-one thead tr th:nth-child(4),
  1039. .specialContentBig .table-stats-one tbody tr td:nth-child(4),
  1040. .specialContentBig .table-stats-one thead tr th:nth-child(5),
  1041. .specialContentBig .table-stats-one tbody tr td:nth-child(5) {
  1042. text-align: center;
  1043. width: 1px;
  1044. white-space: nowrap;
  1045. }
  1046. .specialContentSmall .table-stats-one thead tr th:nth-child(1),
  1047. .specialContentSmall .table-stats-one tbody tr td:nth-child(1),
  1048. .specialContentSmall .table-stats-one thead tr th:nth-child(3),
  1049. .specialContentSmall .table-stats-one tbody tr td:nth-child(3) {
  1050. text-align: center;
  1051. width: 1px;
  1052. white-space: nowrap;
  1053. }
  1054. /** end: SPECIAL CONTENT **/
  1055. /*** end: Main Page ******************************************************/
  1056. #footer {
  1057. margin-top: 40px;
  1058. height: 80px;
  1059. padding: 20px;
  1060. border-top: 1px dashed #CCD1D9;
  1061. background-color: #E6E9ED;
  1062. }
  1063. #footer a {
  1064. font-size: 85%;
  1065. }
  1066. .button-container {
  1067. margin-bottom: 15px;
  1068. }
  1069. button.coach-help {
  1070. padding: 0;
  1071. color: #048dbf;
  1072. }
  1073. /** start: easyAutocomplete ***********************************************************/
  1074. .easy-autocomplete-container {
  1075. z-index: 10!important;
  1076. }
  1077. /** end: easyAutocomplete **************************************************************/
  1078. .chatbox {
  1079. background-color: #E6E9ED;
  1080. height: 56px;
  1081. padding: 10px;
  1082. margin-bottom: 0;
  1083. -webkit-box-shadow: 0 4px 10px 2px #222;
  1084. -moz-box-shadow: 0 4px 10px 2px #222;
  1085. box-shadow: 0 4px 10px 2px #222;
  1086. }
  1087. /** start: stats **************************************************************************/
  1088. .stats.stats-head {
  1089. text-align: center;
  1090. font-size: 12px;
  1091. line-height: 32px;
  1092. border-bottom: 1px solid #E5E6EA;
  1093. overflow: hidden;
  1094. }
  1095. .stats.stats-number {
  1096. text-align: center;
  1097. font-size: 20px;
  1098. line-height: 48px;
  1099. }
  1100. .stats.stats-other {
  1101. margin-top: 32px;
  1102. text-align: center;
  1103. font-size: 14px;
  1104. line-height: 20px;
  1105. }
  1106. .stats.stats-footer {
  1107. text-align: center;
  1108. font-size: 12px;
  1109. font-weight: bold;
  1110. /*color: #048DBF;*/
  1111. overflow: hidden;
  1112. /*white-space: nowrap;*/
  1113. }
  1114. .stats .stats-color-success {
  1115. color: #5cb85c;
  1116. }
  1117. .stats .stats-color-error {
  1118. color: #f35142;
  1119. }
  1120. .stats-quote {
  1121. text-align: center;
  1122. font-style : italic;
  1123. font-size: 12px;
  1124. color: #048dbf;
  1125. padding: 18px;
  1126. }
  1127. .stats.stats-footer .progress {
  1128. height: 4px;
  1129. margin-top: 6px;
  1130. margin-left: 8px;
  1131. margin-right: 8px;
  1132. }
  1133. .stats.stats-profile-image {
  1134. text-align: center;
  1135. }
  1136. .stats.stats-team-image {
  1137. text-align: center;
  1138. }
  1139. .stats.stats-profile-image .profile-image-small,
  1140. .stats.stats-team-image .team-emblem-small {
  1141. padding: 0;
  1142. margin: 6px auto 12px;
  1143. border: none;
  1144. max-height: 64px;
  1145. }
  1146. table.table-stats-ranking tbody tr.highlighted td {
  1147. font-weight: bold;
  1148. }
  1149. table.table-stats-ranking thead tr th:nth-child(1),
  1150. table.table-stats-ranking tbody tr td:nth-child(1) {
  1151. white-space: nowrap;
  1152. overflow: hidden;
  1153. }
  1154. table.table-stats-ranking thead tr th:nth-child(1),
  1155. table.table-stats-ranking tbody tr td:nth-child(1),
  1156. table.table-stats-ranking thead tr th:nth-child(3),
  1157. table.table-stats-ranking tbody tr td:nth-child(3),
  1158. table.table-stats-ranking thead tr th:nth-child(4),
  1159. table.table-stats-ranking tbody tr td:nth-child(4),
  1160. table.table-stats-ranking thead tr th:nth-child(5),
  1161. table.table-stats-ranking tbody tr td:nth-child(5),
  1162. table.table-stats-ranking thead tr th:nth-child(6),
  1163. table.table-stats-ranking tbody tr td:nth-child(6) {
  1164. text-align: center;
  1165. width: 1px;
  1166. white-space: nowrap;
  1167. }
  1168. .label-pricing {
  1169. display: block;
  1170. padding: 10px 16px;
  1171. font-size: 18px;
  1172. line-height: 1.33;
  1173. border-radius: 6px;
  1174. }
  1175. /** end: stats **************************************************************************/
  1176. .lead {
  1177. font-size: 21px;
  1178. font-weight: bold;
  1179. margin-bottom: 0;
  1180. }
  1181. .well.well-lg.well-tbuddy {
  1182. background-color: #048dbf;
  1183. color: white;
  1184. }
  1185. .well.well-lg.well-tbuddy > span.label {
  1186. background-color: white;
  1187. color: #048dbf;
  1188. }
  1189. .nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
  1190. background-color: #048dbf!important;
  1191. color: white;
  1192. }
  1193. .btn-primary[disabled],
  1194. .nav-pills>li.active>a,
  1195. .nav-pills>li.active>a:focus,
  1196. .nav-pills>li.active>a:hover {
  1197. background-color: #048dbf;
  1198. }
  1199. .nav-pills>li>a {
  1200. color: #048dbf;
  1201. }
  1202. .nav-pills>li.active.premium>a,
  1203. .nav-pills>li.active.premium>a:focus,
  1204. .nav-pills>li.active.premium>a:hover {
  1205. background-color: #DDBC00;
  1206. border-color: #DDBC00;
  1207. }
  1208. .checkbox2 {
  1209. padding-left: 20px; }
  1210. .checkbox2 label {
  1211. display: inline-block;
  1212. position: relative;
  1213. padding-left: 5px; }
  1214. .checkbox2 label::before {
  1215. content: "";
  1216. display: inline-block;
  1217. position: absolute;
  1218. width: 17px;
  1219. height: 17px;
  1220. left: 0;
  1221. margin-left: -20px;
  1222. border: 1px solid #cccccc;
  1223. border-radius: 3px;
  1224. background-color: #fff;
  1225. -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  1226. -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  1227. transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }
  1228. .checkbox2 label::after {
  1229. display: inline-block;
  1230. position: absolute;
  1231. width: 16px;
  1232. height: 16px;
  1233. left: 0;
  1234. top: 0;
  1235. margin-left: -20px;
  1236. padding-left: 3px;
  1237. padding-top: 1px;
  1238. font-size: 11px;
  1239. color: #555555; }
  1240. .checkbox2 input[type="checkbox"] {
  1241. opacity: 0; }
  1242. .checkbox2 input[type="checkbox"]:focus + label::before {
  1243. outline: thin dotted;
  1244. outline: 5px auto -webkit-focus-ring-color;
  1245. outline-offset: -2px; }
  1246. .checkbox2 input[type="checkbox"]:checked + label::after {
  1247. font-family: 'FontAwesome';
  1248. content: "\f00c"; }
  1249. .checkbox2 input[type="checkbox"]:disabled + label {
  1250. opacity: 0.65; }
  1251. .checkbox2 input[type="checkbox"]:disabled + label::before {
  1252. background-color: #eeeeee;
  1253. cursor: not-allowed; }
  1254. .checkbox2.checkbox-circle label::before {
  1255. border-radius: 50%; }
  1256. .checkbox2.checkbox-inline {
  1257. margin-top: 0; }
  1258. .checkbox-primary input[type="checkbox"]:checked + label::before {
  1259. background-color: #428bca;
  1260. border-color: #428bca; }
  1261. .checkbox-primary input[type="checkbox"]:checked + label::after {
  1262. color: #fff; }
  1263. .checkbox-danger input[type="checkbox"]:checked + label::before {
  1264. background-color: #d9534f;
  1265. border-color: #d9534f; }
  1266. .checkbox-danger input[type="checkbox"]:checked + label::after {
  1267. color: #fff; }
  1268. .checkbox-info input[type="checkbox"]:checked + label::before {
  1269. background-color: #5bc0de;
  1270. border-color: #5bc0de; }
  1271. .checkbox-info input[type="checkbox"]:checked + label::after {
  1272. color: #fff; }
  1273. .checkbox-warning input[type="checkbox"]:checked + label::before {
  1274. background-color: #f0ad4e;
  1275. border-color: #f0ad4e; }
  1276. .checkbox-warning input[type="checkbox"]:checked + label::after {
  1277. color: #fff; }
  1278. .checkbox-success input[type="checkbox"]:checked + label::before {
  1279. background-color: #5cb85c;
  1280. border-color: #5cb85c; }
  1281. .checkbox-success input[type="checkbox"]:checked + label::after {
  1282. color: #fff; }
  1283. table.table-settings-premium-detail-details tr td {
  1284. padding: 8px 0 8px 0;
  1285. }
  1286. p.settings-premium-detail-billing-address {
  1287. line-height: 24px;
  1288. padding-top: 8px;
  1289. }
  1290. table.table-settings-premium-detail-details tr td:first-child {
  1291. font-weight: bold;
  1292. }
  1293. .invoice-smaller-text {
  1294. font-size: 12px;
  1295. }
  1296. .invoice.invoice-footer {
  1297. font-size: 11px;
  1298. }
  1299. .table-invoice-data {
  1300. margin-top: 10px;
  1301. }
  1302. .table-invoice-data tbody td:nth-child(1) {
  1303. text-align: right;
  1304. }
  1305. .table-invoice-data>tbody>tr>td {
  1306. font-size: 12px;
  1307. padding: 2px 8px;
  1308. }
  1309. .table-invoice thead tr {
  1310. background-color: #048DBF;
  1311. color: white;
  1312. }
  1313. .table-invoice tbody td:nth-child(2),
  1314. .table-invoice thead th:nth-child(2) {
  1315. text-align: right;
  1316. }
  1317. @media print {
  1318. #offcanvasmenu,
  1319. .navbar.navbar-fixed-top,
  1320. ul.nav.nav-tabs,
  1321. #invoice-footer-buttons
  1322. {
  1323. display: none;
  1324. }
  1325. }