Flask application repository for Banner Repeater's DAAP (Digital Archive of Artists Publishing).
SPARQL queries by Lozana Rossenova, CSS and JS by Joana Chicau, python and Jinja by Julie Boschat-Thorez.
See https://daap.network
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
846 lines
16 KiB
846 lines
16 KiB
|
|
/************ FONTS ************/
|
|
|
|
@font-face {
|
|
font-family: 'Roboto Condensed Bold';
|
|
src: url('webfonts/Roboto_Condensed/RobotoCondensed-Bold.ttf') format('truetype');
|
|
font-weight: bold;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'Roboto Condensed';
|
|
src: url('webfonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
|
|
@font-face {
|
|
font-family: 'Roboto Regular';
|
|
src: url('webfonts/Roboto_Regular/Roboto-Regular.ttf') format('truetype');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
/***************** EMERGENCY BUTTON AND MOCKUPS****************/
|
|
div#backend-data-button{
|
|
background-color: #1B42D8;
|
|
width: 250px;
|
|
height: 55px;
|
|
border-radius: 6px;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-top: 20px;
|
|
}
|
|
div#container-backend-data-button a{
|
|
text-decoration: none;
|
|
}
|
|
div#backend-data-button span{
|
|
color: #FFFFFF;
|
|
text-decoration: none;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
div#container-backend-data-button{
|
|
height: 100px;
|
|
width: 100%;
|
|
border-bottom: 1px solid black;
|
|
height: 70px;
|
|
}
|
|
|
|
img.artwork-mockuppage{
|
|
width: 80%;
|
|
padding: 0 10%;
|
|
}
|
|
|
|
|
|
/************ LAYOUT ************/
|
|
:root {
|
|
--black: #000000;
|
|
--blue-blue: #1b42d8;
|
|
--white: #fdfdfd;
|
|
--brown-grey: #7f7f7f;
|
|
--very-light-pink: #e9e9e9;
|
|
}
|
|
|
|
html {
|
|
margin:0;
|
|
padding:0;
|
|
height: 100vh;
|
|
width: 100vw;
|
|
font-family: 'Roboto', sans-serif;
|
|
font-size: 16px;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
*, *:before, *:after {
|
|
-webkit-box-sizing: inherit;
|
|
-moz-box-sizing: inherit;
|
|
box-sizing: inherit; }
|
|
|
|
|
|
body {
|
|
font-family: Roboto;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
font-style: normal;
|
|
line-height: 1.63;
|
|
letter-spacing: normal;
|
|
color: var(--black);
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
|
|
/*Header*/
|
|
div#header{
|
|
width: 100%;
|
|
background-color: #FFFFFF;
|
|
height: 134px;
|
|
border-bottom: 3px solid #000;
|
|
}
|
|
div#header-top{
|
|
display: grid;
|
|
grid-template-columns: 5% 67.5% 27.5%;
|
|
grid-template-rows: 100%;
|
|
grid-column-gap: 0px;
|
|
grid-row-gap: 0px;
|
|
align-items: center;
|
|
border-bottom: 1px solid #000;
|
|
}
|
|
|
|
div#animatedlogo{
|
|
grid-area: 1 / 1 / 2 / 2;
|
|
}
|
|
div#animatedlogo img{
|
|
height: 43px;
|
|
justify-self: center;
|
|
}
|
|
div#header-title{
|
|
grid-area: 1 / 2 / 2 / 3;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: bold;
|
|
font-size: 18px;
|
|
}
|
|
div#header-title a:link, div#header-title a:visited {
|
|
text-decoration: none;
|
|
color: #000000;
|
|
}
|
|
div#header-keyword-search{
|
|
grid-area: 1 / 3 / 2 / 4;
|
|
}
|
|
|
|
div#header-keyword-search span {
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
padding: 2px 10px;
|
|
}
|
|
|
|
div#header-top div#header-keyword-search input[type=text]{
|
|
background-color: #e9e9e9;
|
|
color: #7f7f7f;
|
|
font-size: 18px;
|
|
line-height: 38px;
|
|
letter-spacing: 1px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
width: 257px;
|
|
height: 43px;
|
|
border: none;
|
|
padding: 2px 2px 2px 12px;
|
|
}
|
|
|
|
div#header-top, div#navigation{
|
|
width: 100%;
|
|
height: 67px;
|
|
}
|
|
|
|
div#navigation{
|
|
display: grid;
|
|
grid-template-columns: 8% repeat(2, 12%) 1fr repeat(2, 10%) 12.5%;
|
|
grid-template-rows: 100%;
|
|
grid-column-gap: 0px;
|
|
grid-row-gap: 0px;
|
|
padding-left: 5%;
|
|
align-items: center;
|
|
|
|
}
|
|
div#navigation a{
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
text-decoration: none;
|
|
color: black;
|
|
font-size: 18px;
|
|
line-height: 26px;
|
|
height: 67px;
|
|
|
|
}
|
|
|
|
div#nav-about {
|
|
grid-area: 1 / 1 / 2 / 2;
|
|
}
|
|
div#nav-browse-archive { grid-area: 1 / 2 / 2 / 3; }
|
|
div#nav-browse-category { grid-area: 1 / 3 / 2 / 4;
|
|
color: lightgrey;}
|
|
div#nav-search { grid-area: 1 / 4 / 2 / 5; }
|
|
div#nav-tutorials { grid-area: 1 / 5 / 2 / 6;
|
|
justify-self: end;
|
|
color: lightgrey;}
|
|
div#nav-upload { grid-area: 1 / 6 / 2 / 7;
|
|
justify-self: center;
|
|
color: lightgrey;}
|
|
div#nav-login { grid-area: 1 / 7 / 2 / 8; }
|
|
|
|
|
|
/*Footer*/
|
|
div#footer{
|
|
padding: 55px 0px;
|
|
/*max-height: 229px;*/
|
|
width: 100%;
|
|
bottom: 0;
|
|
background-color: black;
|
|
color:white;
|
|
display: grid;
|
|
grid-template-columns: 20% 40% 15% 25%;
|
|
grid-template-rows: 20% 80%;
|
|
grid-column-gap: 0px;
|
|
grid-row-gap: 0px;
|
|
}
|
|
|
|
div#footer-title-br{
|
|
grid-area: 1 / 1 / 2 / 2;
|
|
padding-left: 30%;
|
|
}
|
|
div#footer-title-others{
|
|
grid-area: 1 / 2 / 2 / 3;
|
|
}
|
|
div#footer-title-socials{
|
|
grid-area: 1 / 3 / 2 / 4;
|
|
}
|
|
|
|
div#footer-title-contact{
|
|
grid-area: 1 / 4 / 2 / 5;
|
|
}
|
|
|
|
div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p, div#footer-title-socials p{
|
|
text-transform: uppercase;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
font-stretch: condensed;
|
|
font-style: normal;
|
|
line-height: 1.5;
|
|
letter-spacing: 1.5px;
|
|
color: var(--brown-grey);
|
|
}
|
|
|
|
div#footer-img-br{
|
|
grid-area: 2 / 1 / 3 / 2;
|
|
padding-left: 30%;
|
|
}
|
|
div#footer-img-br img{
|
|
width: 90px;
|
|
height: 90px;
|
|
padding-top: 20px;
|
|
}
|
|
div#footer-img-others{
|
|
display: flex;
|
|
grid-area: 2 / 2 / 3 / 3;
|
|
padding-top: 5%;
|
|
}
|
|
div#footer-img-lottery{
|
|
padding-left: 10%;
|
|
}
|
|
div#footer-img-lottery img{
|
|
width: 124px;
|
|
height: 81px;
|
|
}
|
|
div#footer-img-wiki img{
|
|
width: 56px;
|
|
height: 56px;
|
|
}
|
|
div#footer-socials-links{
|
|
grid-area: 2 / 3 / 3 / 4;
|
|
}
|
|
div#footer-socials-links p{
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
div#footer-socials-links a{
|
|
text-decoration: none;
|
|
color:#FFFFFF;
|
|
font-family: 'Roboto Regular', sans-serif;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
font-style: normal;
|
|
line-height: 1.63;
|
|
letter-spacing: normal;
|
|
}
|
|
|
|
div#footer-contact{
|
|
grid-area: 2 / 4 / 3 / 5;
|
|
padding-top: 5%;
|
|
}
|
|
div#contactform{
|
|
background-color: #1B42D8;
|
|
width: 250px;
|
|
height: 55px;
|
|
border-radius: 6px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
div#footer-contact a{
|
|
text-decoration: none;
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
}
|
|
|
|
|
|
|
|
div#footer div#footer-top div#footer-top-left,
|
|
div#footer div#footer-top div#footer-top-right{
|
|
display: inline-flex;
|
|
border:lime 1px solid;
|
|
}
|
|
div#footer div#footer-left{
|
|
left: 0px;
|
|
width: 30%;
|
|
/*display: contents;*/
|
|
}
|
|
div#footer div#footer-right{
|
|
right: 0px;
|
|
width: 30%;
|
|
float: right;
|
|
/*position: absolute;*/
|
|
}
|
|
|
|
|
|
div#footer div#footer-left div,
|
|
div#footer div#footer-right div{
|
|
display: inline-block;
|
|
border:cyan 1px solid;
|
|
}
|
|
|
|
|
|
input#newslettersubs{
|
|
background-color: #000000;
|
|
color:#FFFFFF;
|
|
border-radius: 6px;
|
|
height: 48px;
|
|
border: solid 1px;
|
|
|
|
}
|
|
input.submitemail{
|
|
background-color: #1B42D8;
|
|
color: #FFFFFF;
|
|
border:none;
|
|
border-radius: 6px;
|
|
height: 50px;
|
|
width: 50px;
|
|
}
|
|
|
|
|
|
/*Titles all pages*/
|
|
|
|
/*div#home-recent-title, div#browsethearchive-title, div#artistsindex-title, div#publishersindex-title, div#selfpublishedindex-title, div#zinesindex-title, */
|
|
div.pagetitle{
|
|
margin: 60px 80px 30px 80px;
|
|
font-size: 25px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1.88px;
|
|
line-height: 35px;
|
|
}
|
|
|
|
/******************************************************/
|
|
/************ BROWSING SEARCHING INDEXING ************/
|
|
/****************************************************/
|
|
|
|
|
|
/************ INDEXES ************/
|
|
table, th, td {
|
|
border-bottom: 1px solid black;
|
|
border-collapse: collapse;
|
|
text-align: left;
|
|
}
|
|
#artistsindex-table_wrapper{ overflow-x:auto; }
|
|
#artistsindex-table, #publishersindex-table, #zinesindex-table, #selfpublishedindex-table {
|
|
width: 100%; }
|
|
|
|
thead tr th:first-child { padding: 0px 0px 0px 80px }
|
|
thead tr th:last-child { padding: 0px 80px 0px 0px }
|
|
|
|
tr { padding: 10px 80px 10px 80px; }
|
|
th { padding: 22px; }
|
|
.idnumber { padding: 0px 0px 0px 80px }
|
|
.label { font-weight: bold;}
|
|
.altaliases {}
|
|
.description { padding: 0px 80px 0px 0px }
|
|
|
|
thead tr th{
|
|
text-transform: uppercase;
|
|
color:#7f7f7f;
|
|
font-size: 16px;
|
|
letter-spacing: 1.5px;
|
|
line-height: 24px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: normal;
|
|
border-bottom: black 3px solid;
|
|
}
|
|
|
|
tbody tr th{
|
|
font-size: 18px;
|
|
line-height: 26px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: normal;
|
|
}
|
|
|
|
tbody tr th a{
|
|
text-decoration: none;
|
|
color: #000000;
|
|
}
|
|
|
|
|
|
.dataTables_paginate {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-content: baseline;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-top: 42px;
|
|
margin-bottom: 52px;
|
|
font-family: Roboto Condensed;
|
|
font-size: 14px;
|
|
line-height: 48px;
|
|
font-weight: bold;
|
|
font-stretch: condensed;
|
|
min-height: 48px;
|
|
max-width: 376px;
|
|
}
|
|
|
|
.dataTables_paginate span {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-around;
|
|
width: 100%;
|
|
}
|
|
|
|
a.current {
|
|
height: 36px;
|
|
width: 36px;
|
|
border-radius: 6px;
|
|
background-color: #1B42D8;
|
|
margin: auto;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-content: baseline;
|
|
line-height: 36px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
/************ TEXT STYLES************/
|
|
.title {
|
|
width: 200px;
|
|
height: 26px;
|
|
font-family: Roboto Condensed;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
font-stretch: condensed;
|
|
font-style: normal;
|
|
line-height: 1.44;
|
|
letter-spacing: 0.9px;
|
|
color: var(--black);
|
|
}
|
|
.date {
|
|
font-family: Roboto Regular;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
font-stretch: normal;
|
|
font-style: normal;
|
|
line-height: 1.63;
|
|
letter-spacing: normal;
|
|
color: var(--black);
|
|
}
|
|
|
|
/************ BUTTONS ************/
|
|
|
|
.primary-button {
|
|
max-width: 365px;
|
|
min-height: 48px;
|
|
font-family: Roboto;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
font-stretch: condensed;
|
|
font-style: normal;
|
|
line-height: normal;
|
|
letter-spacing: 1.5px;
|
|
text-align: center;
|
|
color: #ffffff;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.secondary-button {
|
|
width: 365px;
|
|
height: 48px;
|
|
font-family: Roboto;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
font-stretch: condensed;
|
|
font-style: normal;
|
|
line-height: normal;
|
|
letter-spacing: 1.5px;
|
|
text-align: center;
|
|
color: var(--blue-blue);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.artwork-button {
|
|
width: 76px;
|
|
height: 24px;
|
|
font-family: Roboto;
|
|
font-size: 16px;
|
|
font-weight: normal;
|
|
font-stretch: condensed;
|
|
font-style: normal;
|
|
line-height: 1.5;
|
|
letter-spacing: 1.5px;
|
|
text-align: center;
|
|
color: var(--black);
|
|
cursor: pointer;
|
|
}
|
|
|
|
/************ HOME ************/
|
|
|
|
/*Top div*/
|
|
|
|
div#home-top-div{
|
|
height: 661px;
|
|
border:blue solid 1px;
|
|
}
|
|
|
|
img.home-recent-imgs{
|
|
width: 100%;
|
|
}
|
|
|
|
div.home-recent-items{
|
|
padding:10px;
|
|
font-size: 16px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
margin: 0 auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-content: center;
|
|
/*justify-content: space-between;*/
|
|
height: 100%;
|
|
}
|
|
|
|
div.home-recent-items a{
|
|
font-size: 18px;
|
|
line-height: 26px;
|
|
font-family: 'Roboto Condensed Bold', sans-serif;
|
|
color: #000000;
|
|
text-decoration: none;
|
|
}
|
|
|
|
div.home-recent-items-top{
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin: auto;
|
|
}
|
|
|
|
div.home-recent-items-bottom{
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-shrink: 0;
|
|
flex-basis: 100px;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
div#home-recent-grid{
|
|
width: 100%;
|
|
padding: 0px 80px;
|
|
display: grid;
|
|
text-align: center;
|
|
grid-gap: 2rem;
|
|
}
|
|
|
|
div#show-button-wrapper{
|
|
width: 100%;
|
|
}
|
|
div.home-show-wrapper{
|
|
width: 100%;
|
|
margin: 60px 0px;
|
|
}
|
|
|
|
span.home-show{
|
|
display: flex;
|
|
margin: auto;
|
|
background-color: #1b42d8;
|
|
border-radius: 6px;
|
|
color: #FFFFFF;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
height: 48px;
|
|
width: 365px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
@media (min-width: 600px) {
|
|
#home-recent-grid { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
@media (min-width: 1000px) {
|
|
#home-recent-grid { grid-template-columns: repeat(4, 1fr); }
|
|
}
|
|
@media (min-width: 1400px) {
|
|
#home-recent-grid { grid-template-columns: repeat(6, 1fr);
|
|
}
|
|
}
|
|
|
|
|
|
/************ BROWSE THE ARCHIVE ************/
|
|
|
|
img.browsethearchive-imgs{
|
|
width: 200px;
|
|
|
|
}
|
|
|
|
div.browsethearchive-items{
|
|
display: inline-block;
|
|
padding:10px;
|
|
font-size: 16px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
color: #7f7f7f;
|
|
margin: 0 auto;
|
|
}
|
|
div.browsethearchive-items a{
|
|
font-size: 20px;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
color: #000000
|
|
}
|
|
div#browsethearchive-grid{
|
|
max-width: 90%;
|
|
margin: 0 auto 60px auto;
|
|
display: grid;
|
|
grid-gap: 2rem;
|
|
/*border: 1px solid blue;*/
|
|
text-align: center;
|
|
}
|
|
|
|
.current {
|
|
background-color: #1b42d8;
|
|
}
|
|
#browsethearchive-pagin li.current a{
|
|
color: #FFFFFF;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
}
|
|
|
|
#browsethearchive-pagin li a{
|
|
color: #000000;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
}
|
|
|
|
ul#browsethearchive-pagin{
|
|
display: inline-flex;
|
|
}
|
|
|
|
#browsethearchive-pagin li {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 36px;
|
|
height: 36px;
|
|
border-radius: 6px;
|
|
}
|
|
div#browsethearchive-pagination{
|
|
width: 100%;
|
|
background-color: #e9e9e9;
|
|
border-top: black solid 3px;
|
|
height: 139px;
|
|
text-align: center;
|
|
}
|
|
|
|
@media (min-width: 300px) {
|
|
#browsethearchive-grid { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
|
|
@media (min-width: 700px) {
|
|
#browsethearchive-grid { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
|
|
@media (min-width: 1200px) {
|
|
#browsethearchive-grid { grid-template-columns: repeat(4, 1fr); }
|
|
}
|
|
|
|
@media (min-width: 1600px) {
|
|
#browsethearchive-grid { grid-template-columns: repeat(6, 1fr); }
|
|
}
|
|
|
|
|
|
|
|
/************ BROWSE BY CATEGORY ************/
|
|
|
|
div#browsebycategory-listcategories{
|
|
margin: 0px 80px 60px 80px;
|
|
}
|
|
div.browsebycategory-categories{
|
|
margin: 22px 0px;
|
|
padding: 16px;
|
|
border-radius: 6px;
|
|
background-color: var(--blue-blue);
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
div.browsebycategory-categories a {
|
|
font-family: Roboto Condensed;
|
|
color: #ffffff;
|
|
text-decoration: none;
|
|
margin: auto;
|
|
display: inline-block;
|
|
}
|
|
|
|
|
|
/************ SEARCH TOOLS ************/
|
|
|
|
|
|
|
|
/*********************************************/
|
|
/************ PERSON AND ARTWORK ************/
|
|
/*******************************************/
|
|
|
|
|
|
|
|
/************ PERSON ************/
|
|
/*div#person_creatorof{
|
|
border: blue 1px solid;
|
|
width: 100%;
|
|
height: 150px;
|
|
background-color: grey;
|
|
}
|
|
div.person_creatorof-item{
|
|
border: lime 1px solid;
|
|
width: 150px;
|
|
height: 150px;
|
|
display: inline-block;
|
|
vertical-align:middle;
|
|
|
|
}
|
|
img.person_creatorof-imgs{
|
|
max-height:75px;
|
|
max-width: 75px;*/
|
|
}
|
|
/************ ARTWORK ************/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/*************************************/
|
|
/************ WIKI PAGES ************/
|
|
/***********************************/
|
|
|
|
/************ ABOUT ************/
|
|
|
|
div#about-content{
|
|
padding-left: 81px;
|
|
padding-right: 81px;
|
|
|
|
}
|
|
div#about-content-top{
|
|
padding: 2% 5%;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
margin-bottom: 60px;
|
|
grid-gap: 2%;
|
|
}
|
|
|
|
div#about-content-top-left{
|
|
grid-column: 1/span 2;
|
|
font-size: 32px;
|
|
font-weight: normal;
|
|
font-stretch: condensed;
|
|
font-style: normal;
|
|
line-height: 50px;
|
|
color: blue;
|
|
padding-right: 10%;
|
|
align-self: center;
|
|
|
|
}
|
|
div#about-content-top-right{
|
|
grid-column: 3/span 2;
|
|
padding-right: 10%;
|
|
}
|
|
div#about-content-top-right img{
|
|
width: 100%;
|
|
}
|
|
|
|
div#about-content-bottom{
|
|
grid-column: 1/ span 4;
|
|
padding: 0 15%;
|
|
padding-bottom: 5%;
|
|
margin-bottom: 200px;
|
|
|
|
}
|
|
|
|
div.about-paragraph-subtitle{
|
|
font-size: 30px;
|
|
line-height: 30px;
|
|
padding-top: 1.5rem;
|
|
}
|
|
|
|
div.about-paragraph p, ul {
|
|
font-size: 20px;
|
|
line-height: 28px;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
|
|
div.about-paragraph a{
|
|
font-family: 'Roboto Condensed', sans-serif;
|
|
text-decoration: none;
|
|
color: blue;
|
|
}
|
|
|
|
|
|
/************ TUTORIALS ************/
|
|
|
|
div#tutorials-intro{
|
|
text-align: center;
|
|
padding-top: 5em;
|
|
}
|
|
div#tutorials-intro h3, div#tutorials-intro p {
|
|
text-align: center;
|
|
width: 50%;
|
|
margin: auto;
|
|
}
|
|
|
|
/************ UPLOAD ************/
|
|
|
|
div#upload-intro{
|
|
text-align: center;
|
|
padding-top: 5em;
|
|
}
|
|
div#upload-intro h3, div#upload-intro p {
|
|
text-align: center;
|
|
width: 50%;
|
|
margin: auto;
|
|
}
|
|
|