@font-face {
  font-family: 'Inter';
  font-weight: 100 900;
  font-display: swap;
  font-style: normal;
  font-named-instance: 'Regular';
  src: url("inter-roman.var.woff2") format("woff2");
}
@font-face {
  font-family: 'Inter';
  font-weight: 100 900;
  font-display: swap;
  font-style: italic;
  font-named-instance: 'Italic';
  src: url("inter-italic.var.woff2") format("woff2");
}

* {
  margin: 0;
  padding: 0;
}

:root {
  --color-black: #222;
  --color-white: #fff;
  --color-grey: #777;
  --color-light: #efefef;
  --color-text: var(--color-black);
  --color-text-grey: var(--color-grey);
  --color-background: var(--color-white);
  --color-code-light-grey:  #cacbd1;
  --color-code-comment:     #a9aaad;
  --color-code-white:       #c5c9c6;
  --color-code-red:         #d16464;
  --color-code-orange:      #de935f;
  --color-code-yellow:      #f0c674;
  --color-code-green:       #a7bd68;
  --color-code-aqua:        #8abeb7;
  --color-code-blue:        #7e9abf;
  --color-code-purple:      #b294bb;
  --font-family-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --font-family-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
}

html {
  font-family: var(--font-family-sans);
  color: var(--color-text);
  background: var(--color-background);

}

img {
  width: 100%;
  border-radius: 4px;
}

body {
    font-family: 'Inter', arial, helvetica, sans-serif;
    font-size: 2vmin;
	letter-spacing: -0.006em;
	line-height: 2.8vmin;
    margin: 14px 21px;
}

#mainwrap{
max-width:1440px;
left:0;
right:0;
margin-left: auto;
margin-right: auto;
}

a {
  color: var(--color-text);
  text-decoration: underline 1px dotted #777;
  text-underline-offset: 0.1em;
   -webkit-text-decoration-line:  underline !important;
   -webkit-text-decoration-thickness: 1px !important;
   -webkit-text-decoration-style: dotted !important;
   -webkit-text-decoration-color: #777 !important;
   
}

header {
padding: 0.25% 0 0;
height: 160px;
background-color: ;
border-top: 1px dotted #777;
}

header a {
}

h1 {
font-size: 1.5em;
font-weight: 314;
padding: 0;
margin: 0;
letter-spacing: -0.0125em;
word-spacing: -0.025em;
}

.logo {
position: absolute;
}

nav {
width: 50%;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
}

img.rounded {
  object-fit: cover;
  height: auto;
  width: 99%;
  margin-left:auto;
  margin-right:auto;
  left:0;
  right:0; 
}

.subheada{
font-size: 10px;
margin-bottom: 1em;
letter-spacing: 0.04rem;
border-top: 1px dotted #777;
font-weight: 450;
}


/* new title style */

.subhead{
    font-size: 6vmin;
    margin-bottom: 1em;
    /* letter-spacing: 0.04rem; */
    border-top: 1px dotted #777;
    font-weight: 250;
    padding-top: 14px;
    /* width: 60%; */
    padding-right: 12%;
    line-height: 6.5vmin;
    word-spacing: -0.125vmin;}

/* end new title style */


.menu li {
display: block;
margin-right: 1em;
list-style: none;
}

#half {
width:50%;
float: left;
}

#footer{
height: 150px;
width: 100%;
float: left;

}

#col1, #col2 {
width: 47%;
padding-right: 3%;
position: relative;
float: left;
}

#col-grid ul, .project-list ul{
-moz-column-count: 2;
column-count: 2;
-moz-column-gap: 3%;
column-gap: 3%;
}

#col-grid li, .project-list li {
display: inline-block;
width: 100%;
padding-right: 2%;
margin-bottom: 1em;
}

#col-grid li img, .project-list li img{
width: 100%;
height: auto;
}

/* projects 2 col */


/* end projects 2 col */


figure a  {
text-decoration: none;
-webkit-text-decoration-line:  none !important;  
}

.shortdesc {
opacity: 0.4;
}

.hometext {
margin-bottom: 2em;
}

.homenews strong {
    border-radius: 4px;
    padding: 0px 5px;
    font-weight: normal;
    margin-right: 1%;
    display: block;
    width: fit-content;
    margin-bottom: 1%;
    border: 1px solid #777;
    font-size: 10px;
	letter-spacing: 0.01em;
	line-height: 14px;
    font-weight: 500;
}


/* interior page */

.wrap{
width: 50%;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
}

.subtext{
margin-bottom: 3em;
}

.content li {
list-style: none;
margin-bottom: 2em;
}

.video video{
max-width:100%;
}




/* captions */

.card {
    padding: 10px 0px 15px;
    height: fit-content;
}


figcaption a {
text-decoration: none;
}

figcaptiona {
font-size: 1.4vmin;
letter-spacing: 0.02em;
line-height: 2vmin;
border: 0;
padding: 1em 0;
}

figcaption {
border: 0;
padding: 1em 0;
}




@media only screen and (max-width: 1100px) {

#col-grid li, .project-list li {
width: 100%;
}

#col-grid ul, .project-list ul{
-moz-column-count: 1;
column-count: 1;
}

}

@media only screen and (max-width: 900px) {


#col1, #col2 {
    width: 95%;
    }


}

@media only screen and (max-width: 700px) {

#half {
    width: 100%;
    }
    
    #col1, #col2 {
    width: 100%;
    }
    
nav{
    left: 50%;
    width: auto;
    position: relative;
    right: auto;
}

.wrap {
    width: 100%;
}

body {
    font-family: 'Inter', arial, helvetica, sans-serif;
    font-size: 3vmin;
	letter-spacing: -0.006em;
	line-height: 4vmin;
	}
}
