/**

Interracial Intimacies: SEX AND RACE IN TORONTO (1910 to 1950)
Version 2

**/

/* extra small devices (less than 576px) */

/* global */
body { background-color: #333333 ; }

/* layout */
.container-sm { max-width: 1500px ; }

/* navigation */
.navigation-inner { background-color: #640303 ; padding: 1rem 0 ; }

/* navigation - links */
.navigation-inner a:link,
.navigation-inner a:active,
.navigation-inner a:visited { font-family: "Open Sans", Tahoma, sans-serif ; font-size: 1em ; font-weight: bold ; color: #e7b33f !important ; }
.navigation-inner a:hover { color: #ffffff !important ; text-decoration: none ; }
.navigation-inner a:link.first { border-left: 0 ; }
.navigation-inner li.active a:link { color: #ffffff !important ; }

/* content */
.content-inner { background-color: #ffffff ; }

/* content - page - text */
.content-inner h1,
.content-inner h2,
.content-inner h3,
.content-inner h4 { font-family: Georgia, "Palatino Linotype", "Book Antiqua", Palatino ; color: #640303 ; }
.content-inner p,
.content-inner li { font-family: "Open Sans", Tahoma, sans-serif ; color: #333333 ; }
.content-inner .highlight { color: #640303 ; }
.content-inner a:link,
.content-inner a:active,
.content-inner a:visited { color: #640303 !important ; transition: 0.5s ; transition-timing-function: ease-in-out ; }
.content-inner a:hover { color: #e7b33f !important ; transition: 0.5s ; transition-timing-function: ease-in-out ; }

/* content - page - front - text */
.page-front .content-inner .front-titles { padding: 5rem 0 ; text-align: center ; }
.page-front .content-inner .front-titles .front-titles-first { font-family: "Vidaloka", "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 15vw ; color: #333333 ; font-weight: 200 ; line-height: 90% ; }
/* .page-front .content-inner .front-titles .front-titles-first { font-family: "Vidaloka", "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 15vw ; color: #333333 ; font-weight: 200 ; line-height: 90% ; color: purple ; } */
.page-front .content-inner .front-titles .front-titles-second { font-family: "Vidaloka", "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 14vw ; color: #333333 ; font-weight: 200 ; line-height: 90% ; }
.page-front .content-inner .front-titles .front-titles-third { font-family: Georgia, "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 6vw ; color: #640303 ; text-align: center ; font-weight: 200 ; line-height: 110% ; }

/* content - page - front - circles */
.page-front .content-inner .circle-wrapper { padding: 1rem 0 ; }
.page-front .content-inner .circle { text-align: center ; }
.page-front .content-inner .circle-historian { margin: 0 auto ; width: 170px ; height: 170px ; border-radius: 50% ; padding: 2.25rem 1rem ; background-color: #640303 ; border: 4px solid #e7b33f ; box-shadow: 0 0 0 10px #640303 ; text-align: center ; }
.page-front .content-inner .circle-archives { margin: 0 auto ; width: 170px ; height: 170px ; border-radius: 50% ; padding: 4rem 0 ; background-color: #640303 ; border: 4px solid #e7b33f ; box-shadow: 0 0 0 10px #640303 ; text-align: center ; }
.page-front .content-inner .circle-resources { margin: 0 auto ; width: 170px ; height: 170px ; border-radius: 50% ; padding: 3.2rem 1rem ; background-color: #640303 ; border: 4px solid #e7b33f ; box-shadow: 0 0 0 10px #640303 ; text-align: center ; }

/* content - page - front - circles - links*/
.page-front .content-inner .circle a:link,
.page-front .content-inner .circle a:active,
.page-front .content-inner .circle a:visited { font-family: "Open Sans", Tahoma, sans-serif ; font-size: 1.25em ; font-weight: bold ; color: #e7b33f !important ; transition: 0.5s ; transition-timing-function: ease-in-out ; }
.page-front .content-inner .circle a:hover { color: #ffffff !important ; text-decoration: none ; transition: 0.5s !important ; transition-timing-function: ease-in-out !important ; }

/* content - page - front - sidebar - image */
.page-front .content-inner .sidebar-image { text-align: center ; padding: 3rem ; }
.page-front .content-inner .sidebar-image img { width: 275px ; height: auto ; transform: rotate(4deg) ; -ms-transform: rotate(4deg) ; -webkit-transform: rotate(4deg) ; -webkit-backface-visibility: hidden ; -webkit-box-shadow: 1px 1px 15px 2px #d1d1d1 ; box-shadow: 1px 1px 15px 2px #d1d1d1 ; }

/* content - page - about*/
.page-about .content-inner { padding: 2rem ; }

/* content - page - how */
.page-how .content-inner { padding: 2rem ; }

/* content - page - how - timeline */

/* content - page - team */
.page-team .content-inner { padding: 2rem ; }

/* content - page - teaching */
.page-teaching .content-inner { padding: 2rem ; }

/* content - page - contact */
.page-contact .content-inner { padding: 2rem ; }

/* content - page - archives */
.page-archives .content-inner { padding: 2rem ; }
.page-archives .content-inner .audio-player { margin: 0.5rem 0 ; padding: 0.5rem 1rem ; background-color: #999999 ; border-radius: 15px ; }

/* content - page - archives - cards  */
.page-archives .content-inner .archives-card { padding: 0.75rem 0.75rem 0 0.75rem ; width: 100% ; height: auto ; background-color: #640303 ; }
.page-archives .content-inner .archives-card img { width: 100% ; height: auto ; border: 4px solid #e7b33f ; }
.page-archives .content-inner .archives-card p { padding: 0.75rem 0 ; text-align: center ; }
.page-archives .content-inner .archives-card a:link,
.page-archives .content-inner .archives-card a:active,
.page-archives .content-inner .archives-card a:visited { font-family: "Open Sans", Tahoma, sans-serif ; font-size: 1.25em ; font-weight: bold ; color: #ffffff !important ; transition: 0.5s ; transition-timing-function: ease-in-out ; }
.page-archives .content-inner .archives-card a:hover { color: #e7b33f !important ; text-decoration: none ; transition: 0.5s !important ; transition-timing-function: ease-in-out !important ; }

/* content - page - sidebar - titles */
.content-inner .sidebar-titles { text-align: center ; margin-bottom: 2em ; }
.content-inner .sidebar-titles .sidebar-titles-first { font-family: "Vidaloka", "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 9vw ; color: #333333 ; font-weight: 200 ; line-height: 90% ; }
/*.content-inner .sidebar-titles .sidebar-titles-first { font-family: "Vidaloka", "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 9vw ; color: #333333 ; font-weight: 200 ; line-height: 90% ; color: purple ; } */
.content-inner .sidebar-titles .sidebar-titles-second { font-family: "Vidaloka", "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 8vw ; color: #333333 ; font-weight: 200 ; line-height: 90% ; }
.content-inner .sidebar-titles .sidebar-titles-third { font-family: Georgia, "Palatino Linotype", "Book Antiqua", Palatino ; font-size: 5vw ; color: #640303 ; text-align: center ; font-weight: 200 ; line-height: 110% ; }

/* content - page - sidebar - image */
.content-inner .sidebar-image { text-align: center ; padding: 3rem 1rem ; }
.content-inner .sidebar-image img { width: 275px ; height: auto ; transform: rotate(4deg) ; -ms-transform: rotate(4deg) ; -webkit-transform: rotate(4deg) ; -webkit-backface-visibility: hidden ; -webkit-box-shadow: 1px 1px 15px 2px #d1d1d1 ; box-shadow: 1px 1px 15px 2px #d1d1d1 ; }
.content-inner .sidebar-image p { padding-right: 115px ; transform: rotate(4deg) ; -ms-transform: rotate(4deg) ; -webkit-transform: rotate(4deg) ; -webkit-backface-visibility: hidden ; }

/* footer */
.footer-inner { background-color: #ffffff ; text-align: center ; padding-top: 2rem ; padding-bottom: 2rem ; }

/* footer - logos */
.footer-inner .logo { width: auto ; height: 45px ; padding: 5px 25px ; }

/* small devices (576px and up) */
@media (min-width: 576px) {

/* content - page - front - text */	
.page-front .content-inner .front-titles .front-titles-first { font-size: 14vw ; }
/* .page-front .content-inner .front-titles .front-titles-first { font-size: 14vw ; color: pink ; } */
.page-front .content-inner .front-titles .front-titles-second { font-size: 12vw ; }
.page-front .content-inner .front-titles .front-titles-third { font-size: 5vw ; }

/* content - page - sidebar - titles */
.content-inner .sidebar-titles { text-align: center ; margin-bottom: 2em ; }
.content-inner .sidebar-titles .sidebar-titles-first { font-size: 10vw ; }
/* .content-inner .sidebar-titles .sidebar-titles-first { font-size: 10vw ; color: pink ; } */
.content-inner .sidebar-titles .sidebar-titles-second { font-size: 9vw ; }
.content-inner .sidebar-titles .sidebar-titles-third { font-size: 5vw ; }

}

/* medium devices (768px and up) */
@media (min-width: 768px) {

/* content - page - front - text */	
.page-front .content-inner .front-titles .front-titles-first { font-size: 8vw ; }
/* .page-front .content-inner .front-titles .front-titles-first { font-size: 8vw ; color: green ; } */
.page-front .content-inner .front-titles .front-titles-second { font-size: 6vw ; }
.page-front .content-inner .front-titles .front-titles-third { font-size: 4vw ; }

/* content - page - front - circles */
.page-front .content-inner .circle-historian { width: 145px ; height: 145px ; padding: 2.25rem 1rem ; }
.page-front .content-inner .circle-archives { width: 145px ; height: 145px ; padding: 3.6rem 0 ; }
.page-front .content-inner .circle-resources { width: 145px ; height: 145px ; padding: 2.9rem 1rem ; }

/* content - page - front - circles - links */
.page-front .content-inner .circle a:link,
.page-front .content-inner .circle a:active,
.page-front .content-inner .circle a:visited { font-size: 1.0em ; }

/* content - page - sidebar - titles */
.content-inner .sidebar-titles { text-align: center ; margin-bottom: 2em ; }
.content-inner .sidebar-titles .sidebar-titles-first { font-size: 6vw ; }
/* .content-inner .sidebar-titles .sidebar-titles-first { font-size: 6vw ; color: green ; } */
.content-inner .sidebar-titles .sidebar-titles-second { font-size: 5vw ; }
.content-inner .sidebar-titles .sidebar-titles-third { font-size: 2vw ; }

}

/* large devices (992px and up) */
@media (min-width: 992px) {

/* content - page - front - text */	
.page-front .content-inner .front-titles .front-titles-first { font-size: 8vw ; }
/* .page-front .content-inner .front-titles .front-titles-first { font-size: 8vw ; color: blue ; } */
.page-front .content-inner .front-titles .front-titles-second { font-size: 6vw ; }
.page-front .content-inner .front-titles .front-titles-third { font-size: 4vw ; }

/* content - page - front - circles */
.page-front .content-inner .circle-historian { width: 150px ; height: 150px ; padding: 2.25rem 1rem ; }
.page-front .content-inner .circle-archives { width: 150px ; height: 150px ; padding: 3.6rem 0 ; }
.page-front .content-inner .circle-resources { width: 150px ; height: 150px ; padding: 2.9rem 1rem ; }

/* content - page - front - circles - links */
.page-front .content-inner .circle a:link,
.page-front .content-inner .circle a:active,
.page-front .content-inner .circle a:visited { font-size: 1.0em ; }

/* content - page - sidebar - titles */
.content-inner .sidebar-titles { text-align: center ; margin-bottom: 2em ; }
.content-inner .sidebar-titles .sidebar-titles-first { font-size: 6vw ; }
/* .content-inner .sidebar-titles .sidebar-titles-first { font-size: 6vw ; color: blue ; } */
.content-inner .sidebar-titles .sidebar-titles-second { font-size: 5vw ; }
.content-inner .sidebar-titles .sidebar-titles-third { font-size: 2vw ; }

}

/* extra large devices (1200px and up) */
@media (min-width: 1200px) {

/* content - page - front - text */	
.page-front .content-inner .front-titles .front-titles-first { font-size: 7vw ; }
/*.page-front .content-inner .front-titles .front-titles-first { font-size: 7vw ; color: orange ; } */
.page-front .content-inner .front-titles .front-titles-second { font-size: 5vw ; }
.page-front .content-inner .front-titles .front-titles-third { font-size: 2vw ; }

/* content - page - front - circles */
.page-front .content-inner .circle-wrapper { padding: 1rem 0 ; }
.page-front .content-inner .circle { text-align: center ; }
.page-front .content-inner .circle-historian { margin: 0 auto ; width: 170px ; height: 170px ; border-radius: 50% ; padding: 2.25rem 1rem ; background-color: #640303 ; border: 4px solid #e7b33f ; box-shadow: 0 0 0 10px #640303 ; text-align: center ; }
.page-front .content-inner .circle-archives { margin: 0 auto ; width: 170px ; height: 170px ; border-radius: 50% ; padding: 4rem 0 ; background-color: #640303 ; border: 4px solid #e7b33f ; box-shadow: 0 0 0 10px #640303 ; text-align: center ; }
.page-front .content-inner .circle-resources { margin: 0 auto ; width: 170px ; height: 170px ; border-radius: 50% ; padding: 3.2rem 1rem ; background-color: #640303 ; border: 4px solid #e7b33f ; box-shadow: 0 0 0 10px #640303 ; text-align: center ; }

/* content - page - front - circles - links*/
.page-front .content-inner .circle a:link,
.page-front .content-inner .circle a:active,
.page-front .content-inner .circle a:visited { font-family: "Open Sans", Tahoma, sans-serif ; font-size: 1.25em ; font-weight: bold ; color: #e7b33f !important ; transition: 0.5s ; transition-timing-function: ease-in-out ; }
.page-front .content-inner .circle a:hover { color: #ffffff !important ; text-decoration: none ; transition: 0.5s !important ; transition-timing-function: ease-in-out !important ; }

/* content - page - sidebar - titles */
.content-inner .sidebar-titles { text-align: center ; margin-bottom: 2em ; }
.content-inner .sidebar-titles .sidebar-titles-first { font-size: 5em ; }
/* .content-inner .sidebar-titles .sidebar-titles-first { font-size: 5em ; color: orange ; } */
.content-inner .sidebar-titles .sidebar-titles-second { font-size: 4em ; }
.content-inner .sidebar-titles .sidebar-titles-third { font-size: 2em ; }

}
