728ee1df3c
Conflicts: mediagoblin/templates/mediagoblin/base.html -- resolved by using the original file and manually adding pieces from my commit
1072 lines
16 KiB
CSS
1072 lines
16 KiB
CSS
/* @font-face */
|
|
|
|
@font-face {
|
|
font-family: 'Lato';
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
src: local('Lato Bold'), local('Lato-Bold'), url('../fonts/Lato-Bold.ttf') format('truetype');
|
|
}
|
|
@font-face {
|
|
font-family: 'Lato';
|
|
font-style: italic;
|
|
font-weight: 400;
|
|
src: local('Lato Italic'), local('Lato-Italic'), url('../fonts/Lato-Italic.ttf') format('truetype');
|
|
}
|
|
@font-face {
|
|
font-family: 'Lato';
|
|
font-style: italic;
|
|
font-weight: 700;
|
|
src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url('../fonts/Lato-BoldItalic.ttf') format('truetype');
|
|
}
|
|
@font-face {
|
|
font-family: 'Lato';
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/Lato-Regular.ttf') format('truetype');
|
|
}
|
|
|
|
html, body {
|
|
background-color: #161616;
|
|
color: #C3C3C3;
|
|
padding: 0;
|
|
margin: 0px;
|
|
height: 100%;
|
|
font: 16px 'Lato', 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
|
|
}
|
|
|
|
form {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
/* text styles */
|
|
|
|
h1,h2,h3,p {
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
h1,h2,h3 {
|
|
font-weight: bold;
|
|
}
|
|
|
|
h1 {
|
|
margin-top: 15px;
|
|
color: #fff;
|
|
font-size: 1.875em;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.375em;
|
|
margin-top: 20px;
|
|
color: #fff;
|
|
}
|
|
|
|
h3 {
|
|
border-bottom: 1px solid #333;
|
|
font-size: 1.125em;
|
|
}
|
|
|
|
p {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
a {
|
|
color: #86D4B1;
|
|
}
|
|
|
|
a.highlight {
|
|
color: #fff;
|
|
}
|
|
|
|
.header_right a {
|
|
text-decoration: none;
|
|
color: #fff;
|
|
}
|
|
|
|
em {
|
|
font-style: italic;
|
|
}
|
|
|
|
strong {
|
|
font-weight: bold;
|
|
}
|
|
|
|
ul {
|
|
list-style: disc inside;
|
|
}
|
|
|
|
ol {
|
|
list-style: decimal inside;
|
|
}
|
|
|
|
label {
|
|
font-weight: normal;
|
|
}
|
|
|
|
input, textarea {
|
|
font-size:1em;
|
|
font-family:'Lato', sans-serif;
|
|
}
|
|
|
|
/* website structure */
|
|
|
|
#wrap {
|
|
min-height: 100%;
|
|
height: auto;
|
|
|
|
/* This must be equal to the footer height + 5px */
|
|
margin-bottom: -35px;
|
|
}
|
|
|
|
#wrap:after {
|
|
content: "";
|
|
display: block;
|
|
}
|
|
|
|
footer, #wrap:after {
|
|
height: 30px;
|
|
}
|
|
|
|
header {
|
|
width: 100%;
|
|
padding: 0;
|
|
margin-bottom: 42px;
|
|
border-bottom: 1px solid #333;
|
|
}
|
|
|
|
.header_left {
|
|
width: 47%;
|
|
margin: 0 0 0 8px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.header_right {
|
|
width: 47%;
|
|
margin: 8px 8px 4px 0;
|
|
display: inline-block;
|
|
float: right;
|
|
text-align: right;
|
|
line-height: 1.6em;
|
|
}
|
|
|
|
#header_dropdown {
|
|
margin-bottom: 20px;
|
|
padding: 0px 10px 0px 10px;
|
|
}
|
|
|
|
#header_dropdown li {
|
|
margin: 4px 0;
|
|
list-style: none;
|
|
}
|
|
|
|
#header_dropdown p {
|
|
margin-top: 12px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.dropdown_title {
|
|
font-size: 20px;
|
|
}
|
|
|
|
a.logo {
|
|
color: #fff;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.status_icon {
|
|
border-radius: 2px;
|
|
padding: 4px;
|
|
margin: 0px 4px;
|
|
}
|
|
|
|
.num_queued {
|
|
background: #56446F;
|
|
}
|
|
|
|
.num_failed {
|
|
background: #87453B;
|
|
}
|
|
|
|
.status_icon a {
|
|
display: inline-block;
|
|
color: #C3C3C3;
|
|
}
|
|
|
|
.logo img {
|
|
vertical-align: middle;
|
|
margin: 6px 8px 6px 0;
|
|
}
|
|
|
|
.welcomeimage {
|
|
float: right;
|
|
}
|
|
|
|
.fine_print {
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
.mediagoblin_content {
|
|
width: 100%;
|
|
padding-bottom: 74px;
|
|
}
|
|
|
|
footer {
|
|
width: 100%;
|
|
border-top: 1px solid #333;
|
|
padding: 8px 0;
|
|
text-align: center;
|
|
font-size: 0.875em;
|
|
clear: both;
|
|
}
|
|
|
|
.thumb_gallery {
|
|
margin-left: 10px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.profile_showcase .thumb_gallery {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
|
|
.media_image_container {
|
|
}
|
|
|
|
.media_image {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.media_other_container {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.media_pane {
|
|
/* in place for possible future wide view */
|
|
/* border-bottom: 1px solid #333333;*/
|
|
}
|
|
|
|
.media_sidebar {
|
|
/* in place for possible future wide view */
|
|
/* border-left: 1px solid #333333;*/
|
|
/* padding-left: 1em;*/
|
|
/* padding-top: 1em;*/
|
|
}
|
|
|
|
.media_comments {
|
|
padding-top: 1em;
|
|
}
|
|
|
|
/* common website elements */
|
|
|
|
.button_action, .button_action_highlight, .button_form {
|
|
display: inline-block;
|
|
color: #c3c3c3;
|
|
background-color: #363636;
|
|
border: 1px solid;
|
|
border-color: #464646 #2B2B2B #252525;
|
|
border-radius: 4px;
|
|
padding: 3px 8px;
|
|
font-size: 16px;
|
|
text-decoration: none;
|
|
font-style: normal;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.button_action_highlight, .button_form {
|
|
background-color: #86D4B1;
|
|
border-color: #A2DEC3 #6CAA8E #5C9179;
|
|
color: #283F35;
|
|
}
|
|
|
|
.button_info {
|
|
background-color: #508BB5;
|
|
border-color: #5899C7 #437699 #427496;
|
|
color: #C3C3C3;
|
|
}
|
|
|
|
.button_warning {
|
|
background-color: #8A2D2D;
|
|
border-color: #913030 #451717 #431212;
|
|
color: #C3C3C3;
|
|
}
|
|
|
|
.button_form {
|
|
min-width: 99px;
|
|
margin: 10px 0px 10px 15px;
|
|
text-align: center;
|
|
font-family: 'Lato', sans-serif;
|
|
}
|
|
|
|
.pagination {
|
|
text-align: center;
|
|
}
|
|
|
|
.pagination_arrow {
|
|
margin: 5px;
|
|
}
|
|
|
|
.empty_space {
|
|
background-image: url("../images/empty_back.png");
|
|
font-style: italic;
|
|
text-align: center;
|
|
height: 160px;
|
|
padding-top: 70px;
|
|
}
|
|
|
|
.no_background {
|
|
background-image: none;
|
|
height: 0;
|
|
padding-top: 0;
|
|
display: inline-block;
|
|
}
|
|
|
|
.right_align {
|
|
float: right;
|
|
}
|
|
|
|
.left_align {
|
|
float: right;
|
|
}
|
|
|
|
.pull-right {
|
|
float: right !important;
|
|
}
|
|
.pull-left {
|
|
float: left !important;
|
|
}
|
|
|
|
.clear {
|
|
clear: both;
|
|
display: block;
|
|
overflow: hidden;
|
|
visibility: hidden;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
.media_sidebar h3 {
|
|
font-size: 1em;
|
|
margin: 0 0 5px;
|
|
border: none;
|
|
}
|
|
|
|
.media_sidebar p {
|
|
margin-left: 8px;
|
|
}
|
|
|
|
.alpha {
|
|
margin-left:0;
|
|
}
|
|
|
|
.omega {
|
|
margin-right:0;
|
|
}
|
|
|
|
.head {
|
|
margin-top:0;
|
|
}
|
|
|
|
.foot {
|
|
margin-bottom:0;
|
|
}
|
|
|
|
/* forms */
|
|
|
|
.form_box,.form_box_xl {
|
|
background-color: #222;
|
|
border-top: 6px solid #D49086;
|
|
padding: 3% 5%;
|
|
display: block;
|
|
float: none;
|
|
width: 90%;
|
|
max-width: 340px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.form_box_xl {
|
|
max-width: 460px;
|
|
}
|
|
|
|
.blog_form_box_xl {
|
|
background-color: #222;
|
|
border-top: 6px solid #D49086;
|
|
padding: 3% 5%;
|
|
display: block;
|
|
float: none;
|
|
width: 90%;
|
|
max-width: 800px;
|
|
min-height: 500px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.b_listing_title {
|
|
height: 30px;
|
|
width: 100%;
|
|
padding: 0px;
|
|
background-color: #86D4B1;
|
|
text-transform:capitalize;
|
|
text-decoration: none;
|
|
#border-radius: 4px;
|
|
}
|
|
|
|
.b_listing_title > a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.b_list_owner {
|
|
height: 100px;
|
|
width: 100%;
|
|
padding: 0em;
|
|
margin-right: auto;
|
|
background-color: #DDA0DD;
|
|
#border-radius: 4px;
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.b_list_des {
|
|
text-align:justify;
|
|
}
|
|
|
|
|
|
.edit_box {
|
|
border-top: 6px dashed #D49086
|
|
}
|
|
|
|
/*.form_field_input input,*/ .form_field_input textarea {
|
|
width: 100%;
|
|
}
|
|
|
|
.blog_form_field_input input, .blog_form_field_input textarea {
|
|
width: 100%;
|
|
}
|
|
|
|
.form_field_input {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.form_field_label {
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
.form_field_label {
|
|
font-size:1.125em;
|
|
}
|
|
|
|
.form_field_description {
|
|
font-style: italic;
|
|
}
|
|
|
|
.form_field_error {
|
|
background-color: #87453b;
|
|
color: #fff;
|
|
border: none;
|
|
padding: 9px;
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.form_submit_buttons {
|
|
text-align: right;
|
|
}
|
|
|
|
.subform {
|
|
margin: 2em;
|
|
}
|
|
|
|
#password_boolean {
|
|
margin-top: 4px;
|
|
width: 20px;
|
|
}
|
|
|
|
.boolean {
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
textarea#description, textarea#bio {
|
|
resize: vertical;
|
|
height: 100px;
|
|
}
|
|
|
|
.delete {
|
|
margin-top: 36px;
|
|
display: block;
|
|
text-align: center;
|
|
}
|
|
|
|
/* comments */
|
|
|
|
.comment_wrapper, .report_wrapper {
|
|
margin-top: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.comment_wrapper p, .report_wrapper p {
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.comment_author, .report_author {
|
|
padding-top: 4px;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
a.comment_authorlink, a.report_authorlink {
|
|
text-decoration: none;
|
|
padding-right: 5px;
|
|
font-weight: bold;
|
|
padding-left: 2px;
|
|
}
|
|
|
|
a.comment_authorlink:hover, a.report_authorlink:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
a.comment_whenlink, a.report_whenlink {
|
|
text-decoration: none;
|
|
}
|
|
|
|
a.comment_whenlink:hover, a.report_whenlink:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.comment_content, .report_content {
|
|
margin-left: 8px;
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.comment_active {
|
|
box-shadow: 0px 0px 15px 15px #378566;
|
|
background: #378566;
|
|
color: #f7f7f7;
|
|
}
|
|
|
|
textarea#comment_content {
|
|
resize: vertical;
|
|
width: 100%;
|
|
height: 90px;
|
|
border: none;
|
|
background-color: #f1f1f1;
|
|
padding: 3px;
|
|
}
|
|
|
|
#form_comment .form_field_input {
|
|
padding-right: 6px;
|
|
}
|
|
|
|
|
|
a.report_authorlink, a.report_whenlink {
|
|
color: #D486B1;
|
|
}
|
|
|
|
ul#action_to_resolve {list-style:none; margin-left:10px;}
|
|
|
|
/* media galleries */
|
|
|
|
.media_thumbnail {
|
|
float: left;
|
|
padding: 0px;
|
|
width: 180px;
|
|
overflow: hidden;
|
|
margin: 0px 3px 10px;
|
|
text-align: center;
|
|
font-size: 0.875em;
|
|
background-color: #222;
|
|
border-radius: 0 0 5px 5px;
|
|
padding: 0 0 6px;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
border-color: #0D0D0D;
|
|
border-style: solid;
|
|
border-width: 1px 1px 2px;
|
|
}
|
|
|
|
.media_thumbnail a {
|
|
color: #eee;
|
|
text-decoration: none;
|
|
display: block;
|
|
}
|
|
|
|
.media_thumbnail a.remove {
|
|
color: #86D4B1;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
a.thumb_entry_title {
|
|
padding: 8px;
|
|
}
|
|
|
|
/* For now, this is commented out since our thumbnails are actually 180px high.
|
|
*
|
|
* .media_thumbnail img {
|
|
* max-height: 135px;
|
|
* }
|
|
*/
|
|
|
|
.thumb_entry_last {
|
|
margin-right: 0px;
|
|
}
|
|
|
|
/* media detail */
|
|
|
|
h2.media_title {
|
|
margin-bottom: 0px;
|
|
display: inline-block;
|
|
}
|
|
|
|
p.context {
|
|
display: inline-block;
|
|
padding-top: 4px;
|
|
}
|
|
|
|
p.media_specs {
|
|
font-size: 0.9em;
|
|
border-top: 1px solid #222;
|
|
padding: 10px 0px;
|
|
color: #888;
|
|
}
|
|
|
|
.no_html5 {
|
|
background: black;
|
|
color: white;
|
|
text-align: center;
|
|
height: 160px;
|
|
padding: 130px 10px 20px 10px;
|
|
}
|
|
|
|
a img.media_image {
|
|
cursor: -webkit-zoom-in;
|
|
cursor: -moz-zoom-in;
|
|
cursor: zoom-in;
|
|
}
|
|
/* icons */
|
|
|
|
img.media_icon {
|
|
margin: 0 4px;
|
|
vertical-align: sub;
|
|
}
|
|
|
|
/* EXIF information */
|
|
|
|
#exif_content {
|
|
padding-bottom: 20px;
|
|
}
|
|
|
|
#exif_camera_information {
|
|
margin-bottom: 20px;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
#exif_additional_info_button {
|
|
margin-left: 8px;
|
|
}
|
|
|
|
#exif_additional_info {
|
|
display: none;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
#exif_additional_info table {
|
|
font-size: 11px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
#exif_additional_info td {
|
|
vertical-align: top;
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
#exif_content .col1 {
|
|
padding-right: 20px;
|
|
}
|
|
|
|
#exif_additional_info table tr {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
/* navigation */
|
|
|
|
.navigation {
|
|
}
|
|
|
|
.navigation_button {
|
|
width: 48%;
|
|
display: inline-block;
|
|
text-align: center;
|
|
background-color: #1d1d1d;
|
|
border: 1px solid;
|
|
border-color: #2c2c2c #232323 #1a1a1a;
|
|
border-radius: 4px;
|
|
text-decoration: none;
|
|
padding: 4px 0 8px;
|
|
margin: 0 0 6px;
|
|
}
|
|
|
|
.navigation_left {
|
|
margin-right: 3px;
|
|
}
|
|
|
|
/* messages */
|
|
|
|
ul.mediagoblin_messages {
|
|
list-style: none inside;
|
|
color: #f7f7f7;
|
|
padding: 0;
|
|
}
|
|
|
|
.mediagoblin_messages li {
|
|
margin: 5px 0;
|
|
padding: 8px;
|
|
text-align: center;
|
|
}
|
|
|
|
.message_success {
|
|
background-color: #378566;
|
|
}
|
|
|
|
.message_warning {
|
|
background-color: #87453b;
|
|
}
|
|
|
|
.message_error {
|
|
background-color: #87453b;
|
|
}
|
|
|
|
.message_info {
|
|
background-color: #378566;
|
|
}
|
|
|
|
.message_debug {
|
|
background-color: #f7f7f7;
|
|
color: #272727;
|
|
}
|
|
|
|
ul.mediaentry_tags {
|
|
list-style-type: none;
|
|
}
|
|
|
|
ul.mediaentry_tags li {
|
|
display: inline;
|
|
margin: 0px 5px 0px 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
|
|
/* media processing panel */
|
|
|
|
table.media_panel {
|
|
width: 100%;
|
|
}
|
|
|
|
table.media_panel th {
|
|
font-weight: bold;
|
|
padding-bottom: 4px;
|
|
text-align: left;
|
|
}
|
|
.thumb-overlay-status {
|
|
position: absolute;
|
|
margin: auto;
|
|
top: 0; bottom: 0; left: 0; right: 0;
|
|
width: 180px;
|
|
height: 20px;
|
|
display: inline;
|
|
text-align: center;
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
|
|
.thumb-processing {
|
|
color: black;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.thumb-failed {
|
|
color: red;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.thumb-wrapper {
|
|
position: relative;
|
|
/* for proportional thumb resizing */
|
|
width: auto;
|
|
height: auto;
|
|
display: inline-block;
|
|
}
|
|
|
|
.thumb-wrapper img {
|
|
max-height: 180px;
|
|
max-width: 180px;
|
|
}
|
|
.media_panel td {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* moderator panels */
|
|
|
|
table.admin_panel {
|
|
width: 100%
|
|
}
|
|
|
|
table.admin_side_panel {
|
|
width: 90%;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
table.admin_panel th, table.admin_side_panel th {
|
|
font-weight: bold;
|
|
padding-bottom: 4px;
|
|
text-align: left;
|
|
color: #fff;
|
|
}
|
|
|
|
table td.user_with_privilege {
|
|
font-weight: bold;
|
|
color: #86D4B1;
|
|
}
|
|
|
|
table td.user_without_privilege {
|
|
font-weight: bold;
|
|
color: #D486B1;
|
|
}
|
|
|
|
.return_to_panel {
|
|
text-align:right;
|
|
float: right;
|
|
font-size:1.2em
|
|
}
|
|
|
|
/* Delete panel */
|
|
|
|
.delete_checkbox_box {
|
|
margin-top: 10px;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
/* code of conduct */
|
|
|
|
#code_of_conduct_list {
|
|
margin-left:25px;
|
|
margin-bottom: 10px;
|
|
}
|
|
#code_of_conduct_list li {
|
|
margin:5px 0 15px 25px;
|
|
}
|
|
#code_of_conduct_list strong{
|
|
color:#fff;
|
|
}
|
|
|
|
.nested_sublist {
|
|
margin: 5px 0 10px 25px;
|
|
font-size:80%;
|
|
}
|
|
.nested_sublist li {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
/* ASCII art and code */
|
|
|
|
@font-face {
|
|
font-family: Inconsolata;
|
|
src: local('Inconsolata'), url('../fonts/Inconsolata.otf') format('opentype')
|
|
}
|
|
|
|
pre, code {
|
|
font-family: Inconsolata, monospace;
|
|
line-height: 1em;
|
|
}
|
|
|
|
pre {
|
|
overflow: auto;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.comment_wrapper pre {
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.ascii-wrapper pre {
|
|
/* but it should not affect the ASCII art */
|
|
margin: 0;
|
|
}
|
|
|
|
/* Media queries and other responsivisivity */
|
|
/* initial GMG max 940 */
|
|
@media screen and (max-width: 960px) {
|
|
|
|
img.media_image {
|
|
max-width: 100%;
|
|
/* display: inline;*/
|
|
}
|
|
|
|
.media_thumbnail {
|
|
/* width: 21%;*/
|
|
}
|
|
|
|
.profile_sidebar {
|
|
width: 100%;
|
|
margin: 0px;
|
|
}
|
|
|
|
.profile_showcase {
|
|
width: 100%;
|
|
margin: 0px;
|
|
}
|
|
|
|
.navigation {
|
|
float: none;
|
|
}
|
|
|
|
.navigation_button {
|
|
float: right;
|
|
padding: 10px 0 14px;
|
|
}
|
|
|
|
.navigation_left {
|
|
margin-right: 0;
|
|
float: left;
|
|
}
|
|
|
|
.button_action, .button_action_highlight, .button_form {
|
|
padding: 5px 14px;
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
}
|
|
/* desktop resolutions */
|
|
@media screen and (min-width: 960px) {
|
|
.container .three.columns.media_thumbnail {
|
|
width:180px;
|
|
margin-left:3px;
|
|
margin-right:3px;
|
|
}
|
|
#thingy_view {
|
|
width:640px;
|
|
height:640px;
|
|
}
|
|
}
|
|
|
|
/* Tablet Portrait size to standard 960 (devices and browsers) */
|
|
@media only screen and (min-width: 768px) and (max-width: 959px) {
|
|
.container .three.columns.media_thumbnail {
|
|
width:147px;
|
|
margin-left:2px;
|
|
margin-right:2px;
|
|
}
|
|
.media_thumbnail.thumb_entry img {
|
|
max-width:100%;
|
|
}
|
|
.thumb_gallery {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
.navigation_button {
|
|
}
|
|
#thingy_view {
|
|
width:508px;
|
|
height:508px;
|
|
}
|
|
}
|
|
|
|
/* All Mobile Sizes (devices and browser) */
|
|
@media screen and (max-width: 767px) {
|
|
.thumb_row {
|
|
margin-bottom: 0;
|
|
}
|
|
.thumb_gallery {
|
|
margin-left: 0;
|
|
margin-right: 0;
|
|
}
|
|
h1,h2,h3,p {
|
|
margin-bottom: 10px !important;
|
|
}
|
|
|
|
header {
|
|
text-align: center;
|
|
}
|
|
|
|
.header_right {
|
|
text-align: center;
|
|
}
|
|
|
|
.welcomeimage {
|
|
float: none;
|
|
display: inherit;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-top: 1em;
|
|
}
|
|
|
|
.media_sidebar {
|
|
border-left: none;
|
|
padding-left: 0;
|
|
padding-top: 1em;
|
|
margin-top: 1em;
|
|
}
|
|
|
|
.media_comments {
|
|
border-bottom: 1px solid #333333;
|
|
}
|
|
}
|
|
|
|
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
|
|
@media only screen and (min-width: 480px) and (max-width: 767px) {
|
|
#thingy_view {
|
|
width:420px;
|
|
height:420px;
|
|
}
|
|
}
|
|
|
|
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
|
|
@media only screen and (max-width: 479px) {
|
|
#thingy_view {
|
|
width:300px;
|
|
height:300px;
|
|
}
|
|
}
|
|
|
|
p.verifier {
|
|
text-align:center;
|
|
font-size:50px;
|
|
none repeat scroll 0% 0% rgb(221, 221, 221);
|
|
padding: 1em 0px;
|
|
}
|
|
|
|
/* for the media metadata editing table */
|
|
table.metadata_editor {
|
|
margin: 10px auto;
|
|
width: 800px;
|
|
}
|
|
|
|
table.metadata_editor tr td {
|
|
width:350px;
|
|
}
|
|
table.metadata_editor tr td.form_field_input input {
|
|
width:350px;
|
|
}
|
|
|
|
.application {
|
|
min-height: 30px;
|
|
margin-left: 70px;
|
|
}
|
|
|
|
.application-icon {
|
|
position: absolute;
|
|
left: 12px;
|
|
width: 50px;
|
|
height: 50px;
|
|
}
|
|
|
|
.application-button {
|
|
float: right;
|
|
}
|