VELTRON.NET/css/Veltron-MC.css

/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

#sitecanvas {
  max-width:1020px ;
  border-radius: 20px;
  margin:0 auto;
  box-shadow: 0 3px 3px 0 #32311933, 0 3px 6px 0 #32311933;
  background-color:#30232a;
}

@font-face {
  font-family: 'futuracyrillicbold';
  src: url('https://www.veltron.net/fonts/futuracyrillicbold-webfont.woff');
}

@font-face {
  font-family: 'minecraftten';
  src: url('https://www.veltron.net/fonts/MinecraftTen.woff');
}

:root {
  --HeaderFontSize: 36px; /* global scope */
}

body {
  background-color: white;
  background-image: url('https://www.veltron.net/images/Veltron-MC/1/TempBG.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center; 
  background-attachment: fixed;
  color: black;
  font-family: Arial;
}

#pagecontent {
    display: block;
    font-size:17px ;
    line-height: 1.2;
    padding:20px 50px;
    background-color: white;
  }
  
img {
    max-width: 100%;
    max-height: 100%;
}

h1 {
  font-family: 'minecraftten';
}

h2 {
  font-family: 'minecraftten';
  font-size: 30px;
  line-height: 0.5;
}

#sitemenu{
  font-size: 30px;
  padding: 10px 0px;
  color: White;
  font-family: 'FuturaCyrillicBold';
  }
  
.nav {
  display:flex;
  justify-content: space-evenly;
  margin-left: 0;
  text-align: center;
  margin-top: 0;
  margin-bottom: 5px;
  overflow: hidden;
}

.nav a {
    font-family: inherit;
    display: flex;
    padding-right: 13px;
    padding-left: 13px;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: white;
}

.nav a:hover{
  text-decoration:none  ;
  color: #a999a2;
}
  
#menulist{
  transition: all 0.2s;
}

.joinbutton{
  max-height: 44px;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  max-width: 200px;
  max-height:38px;
  padding-right: 13px;
  padding-left: 13px;
  border: none;
  outline: none;
  color: white;
  font-size:inherit;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.nav a:hover, .dropdown:hover .dropbtn {
  color: #a999a2;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #a999a2;
  font-size:24px;
  font-family: Verdana;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  background-color: white;
}

.dropdown-content a:hover {
  background-color: black;
  color:white;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.welcomeFlex {
  display:flex;
  padding: 0px 0px 30px 0px;
  border-bottom: 1px solid grey;
}

.welcomeFlex p {
  padding-right: 50px;
}

.welcomeFlex img {
  border-radius: 6px;
  max-width: 25%;
  max-height: 25%;
  box-shadow: 0 3px 3px 0 #32311933, 0 3px 6px 0 #32311933;
  height: auto 
}

.mainFlex {
  display:flex;
  padding: 0px 0px 0px 0px;
}

.mainFlex2 {  
  display:flex;
  padding: 30px 20px 20px 0px;
  border-bottom: 1px solid grey;
}

.welcomeFlex h1 {
  line-height:0.1;
  padding: 0px 0px 20px 0px;
}

.mainFlex p {
  padding-right: 50px;
  
}

.mainFlex h3{
  font-family:'minecraftten';
  font-size: 20px;
  line-height: 0.5;
}

.mainFlex2 button{
  width: 135px;
  height: 35px;
  border: none;
  outline: none;
  color: white;
  padding: 0px 0px 0px 0px;
  font-size:18px;
  background-color: #30232a;
  font-family: 'FuturaCyrillicBold';
  margin: 0;
}

.mainFlex2 img{
  border-radius:8px;
  max-height:240px;
  max-width:240px;
}

.newsPeek{
  display:block;
  width: 200px;
  border:2px solid;
  padding: 0.01em 16px;
  border-color:black;
  border-radius: 8px;
  justify-content:flex-end;
}

.newsPeek img{
  margin: 16px 0px;
  max-width: 100%;
  max-height: 100%;
}

.newsPeek h3{
  font-family:'FuturaCyrillicBold';
  line-height: 0.5;
}

.imgFlex {
  display:flex;
  padding: 30px 0px 0px 0px;
  justify-content:space-between;
}

.imgFlex div{
  padding: 10px;
  flex-shrink:1;
}

.imgFlex img{
  border-radius:10px;
  width: 100%;
  height: auto  
}



.join-btn {
  width: 135px;
  height: 35px;
  border: none;
  outline: none;
  color: white;
  font-size:18px;
  background-color: #30232a;
  font-family: 'FuturaCyrillicBold';
  cursor: pointer;
}