
body{
  	background-color:#435165;
  	margin:0;
}html{
  position:relative;
  min-height:100%;
}

body{
  background-image:linear-gradient(
    rgba(5,5,5,0.274),
    rgba(165,164,170,0.664)
  );
  background-color:#435165;
  width:100%;
  height:auto;
  margin-bottom:60px;
  font-family:"Garamond","Times New Roman",Times,serif;
  
}

nav .navbar{
  border-radius:0px 0px 25px 25px;
  box-shadow:0px 0px 4px blue;
}

.footer{
  position:absolute;
  bottom:0;
  width:100%;
  height:60px;
  
  line-height:60px;
  
  background-color:#f5f5f5;
}

/* Custom page CSS
-------------------------------------------------- */


body .container{
  width:auto;
  padding:0 15px;
  background-color:#fff;
  padding:20px;
}

.card-deck{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  grid-gap:0.5rem;
}

.card-as-link .card{
  background-image:linear-gradient(
    rgb(255,255,255),
    rgb(255,255,255),
    rgba(166,190,255,0.657)
  );
}

.card-as-link:hover{
  text-decoration:none;
}

a .card-as-link{
  color:#000;
}

a .card-as-link:hover{
  color:#000;
  text-decoration:none;
}

p .card-as-link{
  color:inherit;
}

p .card-as-link:hover{
  color:inherit;
  text-decoration:none;
}

.grow{
  transition:all 0.2s ease-in-out;
}

.grow:hover{
  transform:scale(1.3);
  z-index:1000;
  
}

.grow2{
  transition:all var(--transition) ease-in-out;
}

.grow2:hover{
  transform:scale(var(--growth));
  z-index:1000;
}


.show{
  display:block;
}


.btn{
  cursor:pointer;
}


.btn.active{
  background-color:#666;
  color:white;
}

a :hover{
  text-decoration:none !important;
}

.btn-primary{
  background-color:#0051ff;
}
html{
  position:relative;
  height:100%;
  min-height:100%;
}
body{
  background-attachment:fixed;
  background-color:#000000;
  background-image:url("https://polyphony.app/scherzo/embed/E_933a34ab5c0c4aa22911b578c2e02364a7fde6a3");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  min-height:100vh;
  height:100%;
  font-family:"Garamond","Times New Roman",Times,serif;
  display:grid;
  grid-template-columns:auto;
  grid-template-rows:auto 1fr auto;
  transition:background-image 3s;
}
p{
  font-size:22px;
}
.large-background{
  background-attachment:fixed;
  background-image:url('https://polyphony.app/scherzo/embed/E_cb66bb0274fcf067d393cd89671f6eb4e7ec200b');
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  min-height:100vh;
  height:100%;
  transition:background-image 3s;
}
header{
  display:grid;
  grid-area:1/1/2/2;
}
.body{
  grid-area:2 / 1 / 3 / 2;
  display:grid;
  grid-template-columns:auto auto auto;
  grid-auto-rows:auto;
  align-content:center;
  width:100%;
  margin-left:0px;
  margin-right:0px;
  padding-left:0px;
  padding-right:0px;
}
footer{
  grid-area:3 / 1 / 4 / 2;
  display:grid;
}
.main{
  padding:15px;
  display:grid;
  grid-template-columns:auto auto;
  padding:20px;
  margin-left:4vw;
  margin-right:4vw;
  padding-top:0px;
}
.wrapper{
  display:grid;
  padding:0;
  margin:0;
  
  
  
}
.media-wrapper{
  display:grid;
  padding:15px;
}
.grid-item{width:20%;}
.grid-item--width2{width:50%;}
.content{
  
  padding:45px;
  margin:15px;
  background-color:#ffffff;
  width:100%;
  font-size:1.0rem;
  
  
  
}
.compcard{
  /* margin-left:auto;
  margin-right:auto;*/
  display:grid;
}
a.compcard{
  color:inherit !important;
}
a.compcard:hover{
  text-decoration:none !important;
}
.compcard-title{
  font-size:1.1vw;
  padding-top:8vh;
  
}
.compcard-subtitle{
  font-size:1vw !important;
}
.compcard-header{
  grid-area:1 / 1 / 2 / 2;
  display:grid;
  width:2vw;
  height:1vw;
  margin-top:1vw;
  margin-left:auto;
  margin-right:auto;
}
.compcard-body{
  grid-area:2 / 1 / 3 / 2;
  display:grid;
  padding-left:0.5vw !important;
  padding-right:0.5vw !important;
  border:0px !important;
}
.compcard-footer{
  font-size:1.1vw !important;
  background-color:transparent;
  border:0px !important;
  grid-area:3 / 1 / 4 / 2;
  display:grid;
}
.card.compcard{
  background-image:linear-gradient(
    rgb(255,255,255),
    rgb(255,255,255),
    rgba(166,190,255,0.657)
  );
  font-size:20px;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  width:14vw;
  height:18vw;
  margin:15px;
  display:grid;
  grid-template-columns:auto;
  grid-template-rows:auto 1fr auto;
}
.news-card{
  max-height:250px;
}
.floating-header{
  color:white;
  font-size:3rem;
}

.grow{
  transition:all var(--transition) ease-in-out;
}
.btn{
  margin:10px;
  font-size:inherit;
  text-align:center;
}
.btn-primary{
  background-color:rgb(99,11,131);
}
.btn-primary:hover{
  background-color:rgb(122,39,153);
}
.btn-twitter{
  background-color:#1DA1F2;
  color:white;
}
.btn-youtube{
  background-color:#FF0000;
  color:white;
}
.btn-facebook{
  background-color:#4267B2;
  color:white;
}
.btn-instagram{
  background-color:#E1306C;
  color:white;
}
.grow:hover{
  transform:scale(var(--growth));
  z-index:1000;
}
.sidebar{
  padding:5px;
  font-size:16px;
}
.button-sidebar{
  margin:0px;
}
ul.sidebar-menu{
  list-style-type:none;
}
.mobile-only{
  display:none;
}
.media-wrapper-constant{
  display:grid;
  padding:15px;
}
@media screen and (max-width:800px){
  body{
		background-position:center center !important;
		background-size:cover !important;
}
  .navbar{
    width:100vw;
}
  p{
    font-size:4vw;
}
  h1{
    font-size:10vw !important;
}
  .media-wrapper{
    padding:0px !important;
    grid-template-columns:100% !important;
    grid-area:auto / auto/auto/auto !important;
}
  .media-wrapper-constant{
    padding:10px !important;
    grid-area:auto / auto/auto/auto !important;
}
  .centered{
    padding:10px !important;
    grid-template-columns:10% 80% 10% !important;
    grid-area:auto / auto/auto/auto !important;
}
  .body{
    grid-template-columns:100% !important;
    grid-auto-rows:auto !important;
    width:100vw !important;
}
  .main{
    grid-template-columns:100% !important;
    padding:0px 0px 0px 0px !important;
    margin:0px 0px 0px 0px !important;
    width:100vw !important;
}
  .content{
    
    padding-right:20px;
    padding-left:20px;
    margin-right:20px;
    margin-left:20px;
    width:90vw !important;
}
  .card.compcard{
    background-image:linear-gradient(
      rgb(255,255,255),
      rgb(255,255,255),
      rgba(166,190,255,0.657)
    );
    font-size:20px;
    width:70vw;
    height:40vh;
    margin:15px;
    display:grid;
    grid-template-columns:auto;
    grid-template-rows:auto 1fr auto;
}
  .compcard-title{
    font-size:6vw !important;
}
  .compcard-subtitle{
    font-size:6vw !important;
}
  .compcard-header{
    margin-top:2vh;
    width:16vw;
    height:8vw;
}
  .compcard-body{
    margin-top:8vh;
    font-size:60vw !important;
}
  .compcard-footer{
    font-size:6vw !important;
    display:grid;
}
  .sidebar-btns{
    grid-template-columns:50% 50% !important;
    font-size:1rem;
}
  .content.media-wrapper{
    grid-template-columns:100% !important;
}
  .no-mobile{
    display:none;
}
  .mobile-only{
    display:flex;
}
}
