publications.css 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. .publications-section h1 > span{
  2. margin-top: -55px; /* Size of fixed header */
  3. padding-bottom:55px;
  4. display: block;
  5. }
  6. .publications-section .card {
  7. background: #fff;
  8. border-top: 2px solid #248aaa;
  9. }
  10. .publications-section .card .card-header {
  11. background: none;
  12. border: none;
  13. display: flex;
  14. flex-direction: column;
  15. }
  16. .publications-section .card .card-header .sub-title {
  17. color: #8392a5;
  18. margin-top: 0.4rem;
  19. }
  20. .publications-section .card .sub-title :nth-child(2) {
  21. float: right !important;
  22. }
  23. .publications-section .card .card-body {
  24. padding: 0;
  25. padding-left: 1rem;
  26. padding-right: 1rem;
  27. }
  28. .publications-section .card .card-footer {
  29. background: #fff;
  30. border: none;
  31. padding: 0;
  32. padding-left: 1rem;
  33. padding-right: 1rem;
  34. padding-bottom: 0.3rem;
  35. display: flex;
  36. justify-content: space-between;
  37. flex-wrap: wrap;
  38. }
  39. .publications-section .card .card-footer .tags {
  40. display: flex;
  41. flex-direction: row;
  42. justify-content: flex-start;
  43. align-items: flex-start;
  44. }
  45. .publications-section .card .card-footer .tags .badge {
  46. cursor: auto;
  47. }
  48. .filtr-publications {
  49. padding: 1rem !important;
  50. }
  51. .publications-section .btn-group{
  52. justify-content: center;
  53. }
  54. /* ============= Device specific fixes ======= */
  55. /* Large screens such as TV */
  56. @media only screen and (min-width: 1824px) {
  57. }
  58. /* Extra large devices (large desktops, 1200px and up) */
  59. @media (max-width: 1400px) {
  60. }
  61. @media (max-width: 1200px) {
  62. }
  63. /* IPad Pro */
  64. @media (max-width: 1024px) {
  65. .publications-section {
  66. padding-left: 0;
  67. padding-right: 0;
  68. width: 100%;
  69. }
  70. .publications-section .container {
  71. max-width: 100%;
  72. }
  73. .publicationss-section .filtr-publications {
  74. padding: 0;
  75. }
  76. .publicationss-section .pub-filtr-item {
  77. padding-left: 0.2rem;
  78. padding-right: 0.2rem;
  79. }
  80. }
  81. /* Large devices (desktops, 992px and up) */
  82. @media (max-width: 992px) {
  83. }
  84. /* Medium devices (tablets, 768px and up) */
  85. @media only screen and (max-width: 768px) {
  86. .publications-section {
  87. padding-left: 0;
  88. padding-right: 0;
  89. width: 100%;
  90. }
  91. .publications-section .container {
  92. max-width: 100%;
  93. }
  94. .publications-section .filtr-publications {
  95. padding: 0;
  96. }
  97. .publications-section .pub-filtr-item {
  98. padding-left: 0.2rem;
  99. padding-right: 0.2rem;
  100. flex: 100%;
  101. }
  102. }
  103. /* Small devices (landscape phones, 576px and up) */
  104. @media only screen and (max-width: 576px) {
  105. .publications-section .btn {
  106. margin-top: 0.3125rem;
  107. }
  108. .publications-section .pub-filtr-item {
  109. flex: 100%;
  110. max-width: 100%;
  111. }
  112. .publications-section .card .card-footer .tags {
  113. flex: 100%;
  114. }
  115. }
  116. /* iPhoneX, iPhone 6,7,8 */
  117. @media only screen and (max-width: 375px) {
  118. }
  119. /* Galaxy S5, Moto G4 */
  120. @media only screen and (max-width: 360px) {
  121. }
  122. /* iPhone 5 or before */
  123. @media only screen and (max-width: 320px) {
  124. }