*{
  margin: 0;
  font-family: sans-serif
}
body{
  background: whitesmoke;
  background-repeat: no-repeat;
  height: 80vh;
}
h2 {
  margin: 0 auto;
  text-align: center;
  margin-top: 30px;
  margin-bottom: 20px;
  color:white;
  background: #000040;
  width:200px;
  padding: 5px;
  border-radius: 30px;
  
  
}
h3{
  text-align: center;
  margin-bottom: 5px;
  margin-top: 10px;
  color:brown;
}
#body-bg{
  /*background: url('studio.jpg');
  background: rgba(200,200,255, 0.7);*/
  
}
#bg-1{
  
  height: 80vh;
  width:70%;
  background: rgba(255,222,222,0.5);
  position:absolute;
  z-index: -100;
  left:50%;
  transform: translateX(-50%);
  display: none
  
}
#studio{
  display: none;
  width:70%;
  position:absolute;
  z-index: -101;
  top:135px;
  margin: 0 auto;
  height: 83vh;
  left:50%;
  transform: translateX(-50%);
}
#holyten-img{
  width:200px;
  position:absolute;
  right:50px;
}
header{
  width:90%;
  margin: 0 auto;
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  background: white;
  /*border-bottom: 2px solid black;*/
  padding: 20px;
  box-shadow: 1px 1px 30px #333333;
}
header h1{
  font-size: 35.0px;
  
}
#tlt-logo{
  width:100px;
  border: 5px solid black;
  border-radius: 50px;
  border-left: none;
  border-right: none;
}
#title-text{
  text-align: center;
  margin-top: 10px;
}
#contacts{
  padding-left: 5px;
  
  /*border-left: 2px solid black;*/
}
#contacts img{
  width:20px;
  height: 20px;
  margin-top:-15px;
  display: block;
  /*border: solid blue*/
  
}
#contacts p{
  /*display: inline;*/
  margin-top:5px;
  margin-left: 8px;
 /* border: solid red;*/
  height: 20px;
}
#contacts div{
 /* border: solid green;*/
  display: flex;
  margin-bottom: 3px;
  /*height: 40px;*/
  
}
#mid-body{
  width:80%;
  margin: 0 auto;
  box-shadow: 1px 1px 5px darkgray;
}
#categories{
  padding-bottom: 20px;
  padding-top: 20px;
}
#categories table{
  margin: 0 auto;
  
}
#categories th {
  color:white;
  background: #404090;
  padding: 10px;
}
#categories td{
  background: lavender;
  padding: 10px;
}
#sizes{
  width:80%;
  margin: 0 auto;
  box-shadow: 1px 1px 5px darkgray;
  display: flex;
  justify-content: space-evenly;
  
  margin: 0 auto;
}
#size-ref{
  background: white;
  box-shadow: 1px 1px 10px black;
  padding: 10px;
  border-radius: 20px;
}

#size-ref img{
  width:100px;
}
#size-ref2{
  
}
#size-ref2 img{
  width:300px;
}
.co-logo{
  width:80px;
}
.socials-logo{
  width:20px;
  padding-top: 15px;
}
/**** tables ****/
#sizes table{
  background: white;
  padding: 10px;
  box-shadow: 1px 1px 5px darkgray;
}
#sizes th{
  color:white;
  background: #404090;
  padding: 10px;
}
#sizes td{
  background: lavender;
  width:100px;
  text-align: center;
  padding: 10px;
}
#pencil-prices td{
  background: lavender;
}
#pencil-prices thead{
  background: #404090;
}
#oil-prices{
  background: white;
}
#oil-prices thead{
  background: #404090;
}
#oil-prices td{
  background: lavender
}
/*******/
#prices{
  box-shadow: 1px 1px 5px darkgray;
  display: flex;
  justify-content: space-evenly;
  width:80%;
  margin: 0 auto;
  padding-bottom: 10px;
}
#payments{
  width:320px;
  box-shadow: 1px 1px 5px darkgray;
}
#payments ul{
  padding-right: 8px;
}
#payments li{
  margin-bottom: 10px;
}
#prices td{
  width:100px;
  padding: 10px;
  text-align: center;
}
#prices th{
  padding: 10px;
  color:white;
  font-size: 25.0px;
}
#delivery{
  width:420px;
  box-shadow: 1px 1px 5px darkgray;
}
#framing-h2{
  width:350px;
}
#bottom{
  display: flex;
  width:80%;
  justify-content: space-between;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 50px;
}
.not-available{
  color:red;
  font-weight: bold;
  font-style: italic;
}
.logo-align{
  width:250px;
  margin: 0 auto;
}
.logo-align2{
  width:50%;
  margin: 0 auto;
}
table{
  border: 2px solid blue
}
section{
  border: 1px solid blue;
  background: rgba(255,255,255, 1);
}
#body-bg{
  background: none;
  border: none;
}