@font-face { 
    font-family: SirinStencil;
    src: url('../fonts/SirinStencil-Regular.ttf');
}

@font-face { 
    font-family: chelseamarket;
    src: url('../fonts/chelseamarket.ttf');
}

body { min-width:320px; margin:0; color: white; font-family: 'SirinStencil'; font-weight:300; font-size:20px; background-color: black;}

h1 {font-size:29px; font-family: 'chelseamarket'; padding:0 0 10px 0px; margin:0; letter-spacing: 0px;}

h2 { font-size:29px; font-family: 'chelseamarket'; padding:10px 0px 10px 28px; margin:0; letter-spacing: 0px;
    color:black; background-image: url('../gfx/label1.png'); background-size: 280px 37px; background-position: 0px 12px; background-repeat: no-repeat;
}

h3 { font-size:20px; font-family: 'chelseamarket'; padding:0 0 10px 0px; margin:0; letter-spacing: 0px;}

p { font-size: 20px; }

td { }

a:link { color:white; }

a:visited { color:white;  }

a:hover { color:white;  }

a:active { color:white;  }

ul {
    list-style-type:none; 
    margin-left:30px;
    text-indent:-30px;
    padding:0;}
li {lpadding-bottom:12px;}

.reference1 {
border: 0px solid rgba(255,255,255,0.2);
max-width:calc(100% - 0px); 
overflow:hidden;
text-overflow: ellipsis;
padding-top:10px;
padding-bottom:10px;
padding-left:8px;
padding-right:8px;
line-height:90%;
display:block;
background-color:#0d1d25;
text-decoration:none;
white-space:nowrap;
}

.reference2 {
border: 0px solid rgba(255,255,255,0.2);
max-width:calc(100% - 0px);
overflow:hidden;
text-overflow: ellipsis;
padding-top:10px;
padding-bottom:10px;
padding-left:8px;
padding-right:8px;
line-height:90%;
display:block;
background-color:#0d1d25;
text-decoration:none;
white-space:nowrap;
}

.flexbox {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    justify-content:  flex-start;
    align-content: left;
}

.item
{
padding:2%;
min-width:280px;
flex-basis: 96%;
flex-grow: 1;
flex-shrink: 0;
background-color:#0d1d25;
border: 1px dotted #2b3b4d;
}

.item1
{
padding:2%;
min-width:280px;
flex-basis: 96%;
flex-grow: 1;
flex-shrink: 0;
background-color:#0d1d25;
background-image: linear-gradient(#1b2b3d, #0d1d25);
border: 1px dotted #2b3b4d;
}

.item2
{
padding:2%;
min-width:280px;
flex-basis: 96%;
flex-grow: 1;
flex-shrink: 0;
background-color:#0d1d25;
border: 1px dotted #2b3b4d;
}

.item3
{
padding:2%;
min-width:280px;
flex-basis: 96%;
flex-grow: 1;
flex-shrink: 0;
background-color:#0d1d25;
border: 1px dotted #2b3b4d;
}

@media only screen and (min-width: 560px){
  .item  {flex-basis: 46%;}
  .item1 {flex-basis: 46%;}
  .item2 {flex-basis: 46%;}
  .item3 {flex-basis: 46%;}
}

@media only screen and (min-width: 869px){
  .item2 {background-image: linear-gradient(#1b2b3d, #0d1d25);}
}

@media only screen and (min-width: 1363px){
  .item3 {background-image: linear-gradient(#1b2b3d, #0d1d25);}
}

@media only screen and (min-width: 840px){
  .item  {flex-basis: 28.333%;}
  .item1 {flex-basis: 28.333%;}
  .item2 {flex-basis: 28.333%;}
  .item3 {flex-basis: 28.333%;}
}


.responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
overflow: hidden;
}

@media all and (min-width: 440px) {
  .item {
    min-width:400px;
	width:400px;
  }
  .item1 {
    min-width:400px;
	width:400px;
  }
  .item2 {
    min-width:400px;
	width:400px;
  }
  .item3 {
    min-width:400px;
	width:400px;
  }
  body{min-width:440px;}
}