You are here

Home » API reference » Open Atrium Home 7.2

oa_home_default.css in Open Atrium Home 7.2 

body.front {
  background: #E5EBE6;
  padding: 0;
  margin: 0;
}

body.front #main-wrapper #main,
body.front.panels-ipe #main-wrapper #main {
  background: #E5EBE6;
  padding: 0;
}

body.front #main-wrapper {
  background-color: transparent;
}

body.front #contextual-tabs {
  display: none;
}

body.front #main,
body.front.panels-ipe #main  {
  padding: 0;
  margin: 0;
  width: 100%;
}

body.front #main .container {
  width: 100%;
  margin: 0;
}

body.front #panels-ipe-control-container .panels-ipe-button-container {
  display: none;
}

body.front #footer {
  margin-top: 0px;
  overflow: visible;
}

body.front #push {
}

body.front .content .pane-oa-home-default {
  padding: 0;
  /* needed to keep the sprout background behind the content */
  position: relative;
  z-index: 1;
}

body.front .content .pane-oa-home-default:after {
  display: none !important;
}

body.front #block-system-help {
  display: none;
}

.pane-oa-home-default h2 {
  font-weight: normal;
  color: #442266;
  font-size: 50px;
  line-height: normal;
}

.pane-oa-home-default .big-wrapper {
}

.pane-oa-home-default .hero,
.pane-oa-home-default .modules {
  width: 1055px;
  margin: 0 auto;
  position: relative;
}

.panel-display .oa-responsive-desktop.oa-responsive-region-bottom.oa-responsive-expand.oa-responsive-fixed {
  z-index: 0;
}

.pane-oa-home-default .block .content {
  padding: 20px 30px;
  color: #282F36;
}

.pane-oa-home-default .hero h1 {
   color: #282F36;
    font-size: 60px;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 20px 0 0;
    padding: 0;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.22);
  line-height: normal;
}

.pane-oa-home-default .hero h1 span {
  color: #6CBE22;
}

.pane-oa-home-default .hero h2 {
  color: #282F36;
  font-weight: 400;
  padding: 0;
  margin: 10px 0 10px 0;
  font-size: 39px;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.44);
  text-align: center;
  line-height: normal;
}

.pane-oa-home-default .hero h2 span {
  color: #6CBE22;
}

.pane-oa-home-default .hero .btn-lg {
  font-size: 24px;
  padding: 15px 25px;
}

.pane-oa-home-default .hero .create-btn {
  text-align: center;
  font-weight: 100;
  padding: 30px 0 30px 0;
  margin: 22px 0 0 0;
  font-size: 22px;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.44);
  letter-spacing: 0.03em;
  line-height: normal;
}

.pane-oa-home-default .modules .entry-placeholder,
.pane-oa-home-default .modules .block {
  text-align: center;
  box-sizing: border-box;
  /* background: url(images/bg-module.png); */
  width: 31%;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  float: left;
  min-height: 420px;
  margin-left: 1%;
  margin-right: 1%;
}

.pane-oa-home-default .modules .entry,
.pane-oa-home-default .modules .block {
  text-align: center;
  box-sizing: border-box;
   /* background: url(images/bg-module.png); */
  background: white;
   width: 31%;
   -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  float: left;
  min-height: 420px;
  margin-left: 1%;
  margin-right: 1%;
  border: 1px solid #ccc;
  }

.pane-oa-home-default .modules .entry-last {
}

.pane-oa-home-default .module-header,
.pane-oa-home-default .modules .block h2 {
  /* background: url(images/bg-module.png); */
  background: #008EB0;
  -webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
text-align: center;
}

.pane-oa-home-default .module-header h4,
.pane-oa-home-default .modules .block h2 {
  color: #FFF;
  text-transform: uppercase;
  padding: 20px 0;
  font-size: 20px;
  margin: 0;
  letter-spacing: 0.1em;
  line-height: normal;
  font-weight: 300;
}

.pane-oa-home-default .modules .entry a.icon {
  width: 148px;
  height: 148px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  margin-top: 15px;
}

.pane-oa-home-default .module-content {
  padding: 20px 30px;
  font-weight: normal;
  color: #282F36;
  background-color: transparent;
  text-align: center;
}

.pane-oa-home-default .module-content p {
  margin: 30px 0 0 0;
  font-size: 16px;
}

.pane-oa-home-default .module-content p a {
  font-weight: 700;
  color: #282F36;
  text-decoration: none;
}

.pane-oa-home-default .form-actions {
  background-color: transparent;
}

.pane-oa-home-default .form-actions input {
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 0.04em;
}

@media only screen and (max-width: 767px) {
  .pane-oa-home-default .modules .entry-placeholder {
    display: none;
  }
  .pane-oa-home-default .modules .entry,
  .pane-oa-home-default .modules .block {
    width: 94%;
    margin-left: 3%;
    margin-right: 3%;
    margin-bottom: 1em;
    min-height: 200px;
  }
  .pane-oa-home-default .module-content p {
    text-align: center;
  }
  body.front #footer {
    margin-top: 10px;
  }
  body.front #footer .top.panel-panel,
  body.front #footer .header.panel-panel {
    display: none;
  }
}

@media only screen and (max-width: 980px) {
  .pane-oa-home-default .hero {
    width: 100%;
  }
  .pane-oa-home-default .hero-left-graphic,
  .pane-oa-home-default .hero-right-graphic,
  .pane-oa-home-default .hero h1,
  .subfooter {
    display: none;
  }
  .hero,
  .entry,
  .entry-placeholder {
  }
  .pane-oa-home-default .modules {
    width: 100%;
  }
  body.front #main-wrapper {
   background: transparent;
  }
}

@media only screen and (min-width: 981px) {
}

File

oa_home_default.css
View source 
  1. body.front {

  2.   background: #E5EBE6;

  3.   padding: 0;

  4.   margin: 0;

  5. }

  6. 

  7. body.front #main-wrapper #main,

  8. body.front.panels-ipe #main-wrapper #main {

  9.   background: #E5EBE6;

  10.   padding: 0;

  11. }

  12. 

  13. body.front #main-wrapper {

  14.   background-color: transparent;

  15. }

  16. 

  17. body.front #contextual-tabs {

  18.   display: none;

  19. }

  20. 

  21. body.front #main,

  22. body.front.panels-ipe #main  {

  23.   padding: 0;

  24.   margin: 0;

  25.   width: 100%;

  26. }

  27. 

  28. body.front #main .container {

  29.   width: 100%;

  30.   margin: 0;

  31. }

  32. 

  33. body.front #panels-ipe-control-container .panels-ipe-button-container {

  34.   display: none;

  35. }

  36. 

  37. body.front #footer {

  38.   margin-top: 0px;

  39.   overflow: visible;

  40. }

  41. 

  42. body.front #push {

  43. }

  44. 

  45. body.front .content .pane-oa-home-default {

  46.   padding: 0;

  47.   /* needed to keep the sprout background behind the content */

  48.   position: relative;

  49.   z-index: 1;

  50. }

  51. 

  52. body.front .content .pane-oa-home-default:after {

  53.   display: none !important;

  54. }

  55. 

  56. body.front #block-system-help {

  57.   display: none;

  58. }

  59. 

  60. .pane-oa-home-default h2 {

  61.   font-weight: normal;

  62.   color: #442266;

  63.   font-size: 50px;

  64.   line-height: normal;

  65. }

  66. 

  67. .pane-oa-home-default .big-wrapper {

  68. }

  69. 

  70. .pane-oa-home-default .hero,

  71. .pane-oa-home-default .modules {

  72.   width: 1055px;

  73.   margin: 0 auto;

  74.   position: relative;

  75. }

  76. 

  77. .panel-display .oa-responsive-desktop.oa-responsive-region-bottom.oa-responsive-expand.oa-responsive-fixed {

  78.   z-index: 0;

  79. }

  80. 

  81. .pane-oa-home-default .block .content {

  82.   padding: 20px 30px;

  83.   color: #282F36;

  84. }

  85. 

  86. .pane-oa-home-default .hero h1 {

  87.    color: #282F36;

  88.     font-size: 60px;

  89.     font-weight: normal;

  90.     text-transform: uppercase;

  91.     letter-spacing: 0.04em;

  92.     margin: 20px 0 0;

  93.     padding: 0;

  94.     text-align: center;

  95.     text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.22);

  96.   line-height: normal;

  97. }

  98. 

  99. .pane-oa-home-default .hero h1 span {

  100.   color: #6CBE22;

  101. }

  102. 

  103. .pane-oa-home-default .hero h2 {

  104.   color: #282F36;

  105.   font-weight: 400;

  106.   padding: 0;

  107.   margin: 10px 0 10px 0;

  108.   font-size: 39px;

  109.   text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.44);

  110.   text-align: center;

  111.   line-height: normal;

  112. }

  113. 

  114. .pane-oa-home-default .hero h2 span {

  115.   color: #6CBE22;

  116. }

  117. 

  118. .pane-oa-home-default .hero .btn-lg {

  119.   font-size: 24px;

  120.   padding: 15px 25px;

  121. }

  122. 

  123. .pane-oa-home-default .hero .create-btn {

  124.   text-align: center;

  125.   font-weight: 100;

  126.   padding: 30px 0 30px 0;

  127.   margin: 22px 0 0 0;

  128.   font-size: 22px;

  129.   text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.44);

  130.   letter-spacing: 0.03em;

  131.   line-height: normal;

  132. }

  133. 

  134. .pane-oa-home-default .modules .entry-placeholder,

  135. .pane-oa-home-default .modules .block {

  136.   text-align: center;

  137.   box-sizing: border-box;

  138.   /* background: url(images/bg-module.png); */

  139.   width: 31%;

  140.   -webkit-border-radius: 5px;

  141.   -moz-border-radius: 5px;

  142.   border-radius: 5px;

  143.   float: left;

  144.   min-height: 420px;

  145.   margin-left: 1%;

  146.   margin-right: 1%;

  147. }

  148. 

  149. .pane-oa-home-default .modules .entry,

  150. .pane-oa-home-default .modules .block {

  151.   text-align: center;

  152.   box-sizing: border-box;

  153.    /* background: url(images/bg-module.png); */

  154.   background: white;

  155.    width: 31%;

  156.    -webkit-border-radius: 5px;

  157.   -moz-border-radius: 5px;

  158.   border-radius: 5px;

  159.   float: left;

  160.   min-height: 420px;

  161.   margin-left: 1%;

  162.   margin-right: 1%;

  163.   border: 1px solid #ccc;

  164.   }

  165. 

  166. .pane-oa-home-default .modules .entry-last {

  167. }

  168. 

  169. .pane-oa-home-default .module-header,

  170. .pane-oa-home-default .modules .block h2 {

  171.   /* background: url(images/bg-module.png); */

  172.   background: #008EB0;

  173.   -webkit-border-top-left-radius: 5px;

  174. -webkit-border-top-right-radius: 5px;

  175. -moz-border-radius-topleft: 5px;

  176. -moz-border-radius-topright: 5px;

  177. border-top-left-radius: 5px;

  178. border-top-right-radius: 5px;

  179. text-align: center;

  180. }

  181. 

  182. .pane-oa-home-default .module-header h4,

  183. .pane-oa-home-default .modules .block h2 {

  184.   color: #FFF;

  185.   text-transform: uppercase;

  186.   padding: 20px 0;

  187.   font-size: 20px;

  188.   margin: 0;

  189.   letter-spacing: 0.1em;

  190.   line-height: normal;

  191.   font-weight: 300;

  192. }

  193. 

  194. .pane-oa-home-default .modules .entry a.icon {

  195.   width: 148px;

  196.   height: 148px;

  197.   margin-left: auto;

  198.   margin-right: auto;

  199.   display: block;

  200.   margin-top: 15px;

  201. }

  202. 

  203. .pane-oa-home-default .module-content {

  204.   padding: 20px 30px;

  205.   font-weight: normal;

  206.   color: #282F36;

  207.   background-color: transparent;

  208.   text-align: center;

  209. }

  210. 

  211. .pane-oa-home-default .module-content p {

  212.   margin: 30px 0 0 0;

  213.   font-size: 16px;

  214. }

  215. 

  216. .pane-oa-home-default .module-content p a {

  217.   font-weight: 700;

  218.   color: #282F36;

  219.   text-decoration: none;

  220. }

  221. 

  222. .pane-oa-home-default .form-actions {

  223.   background-color: transparent;

  224. }

  225. 

  226. .pane-oa-home-default .form-actions input {

  227.   text-transform: uppercase;

  228.   font-size: 16px;

  229.   letter-spacing: 0.04em;

  230. }

  231. 

  232. @media only screen and (max-width: 767px) {

  233.   .pane-oa-home-default .modules .entry-placeholder {

  234.     display: none;

  235.   }

  236.   .pane-oa-home-default .modules .entry,

  237.   .pane-oa-home-default .modules .block {

  238.     width: 94%;

  239.     margin-left: 3%;

  240.     margin-right: 3%;

  241.     margin-bottom: 1em;

  242.     min-height: 200px;

  243.   }

  244.   .pane-oa-home-default .module-content p {

  245.     text-align: center;

  246.   }

  247.   body.front #footer {

  248.     margin-top: 10px;

  249.   }

  250.   body.front #footer .top.panel-panel,

  251.   body.front #footer .header.panel-panel {

  252.     display: none;

  253.   }

  254. }

  255. 

  256. @media only screen and (max-width: 980px) {

  257.   .pane-oa-home-default .hero {

  258.     width: 100%;

  259.   }

  260.   .pane-oa-home-default .hero-left-graphic,

  261.   .pane-oa-home-default .hero-right-graphic,

  262.   .pane-oa-home-default .hero h1,

  263.   .subfooter {

  264.     display: none;

  265.   }

  266.   .hero,

  267.   .entry,

  268.   .entry-placeholder {

  269.   }

  270.   .pane-oa-home-default .modules {

  271.     width: 100%;

  272.   }

  273.   body.front #main-wrapper {

  274.    background: transparent;

  275.   }

  276. }

  277. 

  278. @media only screen and (min-width: 981px) {

  279. }