Resources application initial commit
[snf-cloudcms] / cloudcms / static / cloudcms / css / styles.css
index bcf5830..1a1e853 100644 (file)
@@ -208,6 +208,25 @@ textarea {
 .button:hover {
   background-color: #f89a1c;
 }
+.button.back {
+  text-decoration: none;
+  bottom: 0;
+  float: right;
+  z-index: 500;
+}
+.button.back.right {
+  right: 0;
+}
+.buttons-list {
+  z-index: 300;
+  position: relative;
+}
+.buttons-list .button {
+  margin-left: 10px;
+}
+.buttons-list.fixpos {
+  margin-top: -42px;
+}
 a.button {
   text-align: center !important;
   color: #fff !important;
@@ -451,6 +470,25 @@ table .headerSortUp.purple, table .headerSortDown.purple {
 .button:hover {
   background-color: #f89a1c;
 }
+.button.back {
+  text-decoration: none;
+  bottom: 0;
+  float: right;
+  z-index: 500;
+}
+.button.back.right {
+  right: 0;
+}
+.buttons-list {
+  z-index: 300;
+  position: relative;
+}
+.buttons-list .button {
+  margin-left: 10px;
+}
+.buttons-list.fixpos {
+  margin-top: -42px;
+}
 a.button {
   text-align: center !important;
   color: #fff !important;
@@ -598,6 +636,147 @@ a.button:hover {
 #cboxClose:hover {
   background-position: bottom center;
 }
+.resources .categories ul {
+  zoom: 1;
+}
+.resources .categories ul:before, .resources .categories ul:after {
+  display: table;
+  content: "";
+  zoom: 1;
+}
+.resources .categories ul:after {
+  clear: both;
+}
+.resources .categories ul li {
+  float: left;
+}
+.resources .categories .title {
+  margin-bottom: 7.333333333333333px;
+}
+.resources .categories ul li a {
+  text-decoration: none;
+  color: #000;
+  margin-right: 22px;
+}
+.resources .categories ul li a:hover, .resources .categories ul li a.selected {
+  color: #000 !important;
+}
+.resources .categories ul li a.inactive {
+  opacity: 0.4;
+}
+.resources .list {
+  font-size: 0.9em;
+  line-height: 1em;
+  margin-top: 58.666666666666664px;
+  position: relative;
+}
+.resources .list .resource-wrapper.first .resource {
+  margin-left: 0;
+}
+.resources .list .resource-wrapper {
+  position: relative;
+  width: 200px;
+  margin-left: 22px;
+  margin-bottom: 22px;
+  width: 251px;
+  float: left;
+  overflow: hidden;
+  height: 249.33333333333331px;
+}
+.resources .list .resource-wrapper.first {
+  margin-left: 0;
+}
+.resources .list .resource-wrapper.hidden {
+  display: none;
+}
+.resources .list .resource {
+  border: 1px solid #000;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  *behavior: url(boxsizing.htc);
+  padding: 29.333333333333332px;
+  height: 249.33333333333331px;
+  overflow: hidden;
+}
+.resources .list .resource .date {
+  color: #808080;
+  margin-bottom: 3px;
+}
+.resources .list .resource .description {
+  font-size: 1.1em;
+  position: absolute;
+  height: 210px;
+  -webkit-transition: top 0.35s ease-in-out;
+  -moz-transition: top 0.35s ease-in-out;
+  transition: top 0.35s ease-in-out;
+  -webkit-transition: top 0.35s ease-in-out;
+  -moz-transition: top 0.35s ease-in-out;
+  transition: top 0.35s ease-in-out;
+  top: -210px;
+  width: 100%;
+  margin-left: -29.333333333333332px;
+  padding: 29.333333333333332px;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  *behavior: url(boxsizing.htc);
+  color: #fff;
+}
+.resources .list .resource .title {
+  line-height: 1.4em;
+}
+.resources .list .resource .category {
+  margin-top: 29.333333333333332px;
+  color: #808080;
+}
+.resources .list .resource .category a {
+  color: #808080;
+}
+.resources .list .resource .download {
+  bottom: 0;
+  position: absolute;
+  font-size: 1.1em;
+  width: 100%;
+  text-align: middle;
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  *behavior: url(boxsizing.htc);
+  cursor: pointer;
+}
+.resources .list .resource .download a {
+  display: block;
+  color: #000000;
+  text-decoration: none;
+  padding: 5px;
+  padding-left: 14.666666666666666px;
+}
+.resources .list .resource .download a:hover, .resources .list .resource .download a .hovered {
+  color: #ff5d00;
+}
+.resources .list .resource .download a:hover .download-image, .resources .list .resource .download a .hovered .download-image {
+  background-image: url("../images/resource_down_arrow-active.png");
+}
+.resources .list .resource .download a .download-image {
+  display: block;
+  width: 30px;
+  height: 30px;
+  float: left;
+  margin-top: -7px;
+  margin-right: 10px;
+  background-image: url("../images/resource_down_arrow.png");
+  background-position: 50% 50%;
+  background-repeat: no-repeat;
+}
+.resources .list .resource .download img {
+  margin-right: 10px;
+  vertical-align: middle;
+}
+.resources .list .resource:hover .description, .resources .list .resource .hover .description {
+  top: 0;
+  display: block;
+}
 .border-box {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
@@ -1185,9 +1364,27 @@ form input.submit, form input[type="submit"] {
 form input.submit:hover, form input[type="submit"]:hover {
   background-color: #f89a1c;
 }
+form input.submit.back, form input[type="submit"].back {
+  text-decoration: none;
+  bottom: 0;
+  float: right;
+  z-index: 500;
+}
+form input.submit.back.right, form input[type="submit"].back.right {
+  right: 0;
+}
 form input.submit:hover, form input[type="submit"]:hover {
   background-color: #f89a1c;
 }
+form input.submit.back, form input[type="submit"].back {
+  text-decoration: none;
+  bottom: 0;
+  float: right;
+  z-index: 500;
+}
+form input.submit.back.right, form input[type="submit"].back.right {
+  right: 0;
+}
 form textarea {
   height: 200px;
   width: 350px !important;
@@ -1263,9 +1460,16 @@ div.form-stacked {
   color: #ffffff;
 }
 .messages li.warning {
-  background-color: #ffc40d;
+  background-color: #AF6906;
   color: #000000;
 }
+.messages .warning {
+  color: #ffffff !important;
+}
+.messages .warning a {
+  color: inherit;
+  font-weight: bold;
+}
 .service-desc {
   margin-top: 4em;
 }
@@ -1300,10 +1504,12 @@ table tr.consumed td.consumed {
 .footer {
   zoom: 1;
   color: #b3b3b3;
-  -webkit-transition: color 0.15s linear;
-  transition: color 0.15s linear;
-  -webkit-transition: color 0.15s linear;
-  transition: color 0.15s linear;
+  -webkit-transition: color 0.15s ease-in-out;
+  -moz-transition: color 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out;
+  -webkit-transition: color 0.15s ease-in-out;
+  -moz-transition: color 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out;
 }
 .footer:before, .footer:after {
   display: table;
@@ -1314,10 +1520,12 @@ table tr.consumed td.consumed {
   clear: both;
 }
 .footer a {
-  -webkit-transition: color 0.15s linear;
-  transition: color 0.15s linear;
-  -webkit-transition: color 0.15s linear;
-  transition: color 0.15s linear;
+  -webkit-transition: color 0.15s ease-in-out;
+  -moz-transition: color 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out;
+  -webkit-transition: color 0.15s ease-in-out;
+  -moz-transition: color 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out;
 }
 .footer:hover {
   color: #808080 !important;
@@ -1558,46 +1766,6 @@ table tr.consumed td.consumed {
 .initial_hidden {
   display: none;
 }
-/*resources styles*/
-.resources .categories ul {
-  zoom: 1;
-}
-.resources .categories ul:before, .resources .categories ul:after {
-  display: table;
-  content: "";
-  zoom: 1;
-}
-.resources .categories ul:after {
-  clear: both;
-}
-.resources .categories ul li {
-  float: left;
-}
-.resources .categories .title {
-  margin-bottom: 7.333333333333333px;
-}
-.resources .categories ul li a {
-  text-decoration: none;
-  color: #faaf40;
-  margin-right: 22px;
-}
-.resources .list {
-  margin-top: 58.666666666666664px;
-}
-.resources .list .resource {
-  -moz-box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  box-sizing: border-box;
-  *behavior: url(boxsizing.htc);
-  width: 33%;
-  padding: 29.333333333333332px;
-  float: left;
-  border: 1px solid #faaf40;
-  height: 176px;
-}
-.resources .list .resource .description {
-  display: none;
-}
 /* recaptcha */
 #recaptcha_widget_div {
   margin-top: 10px;
@@ -1608,6 +1776,9 @@ table tr.consumed td.consumed {
   margin-bottom: 10px;
   display: block !important;
 }
+#recaptcha_widget_div th, #recaptcha_widget_div td {
+  line-height: 1;
+}
 .checkbox-widget.checked {
   background-color: #f00;
   background-image: url("../images/checkbox.png");