@import url(https://fonts.googleapis.com/css?family=Roboto:400,200,100italic,300,300ita‌​lic,400italic,500,500italic,700,700italic,900italic,900);
html, html * {
  font-family: Roboto;
}

.font-light{
  font-weight: 200;
}

.navbar{
  min-height: 80px;
}

.mg{
    margin-top:80px;
    background: linear-gradient(180deg,#83a33f,#37826f);
}

.m-title{
  color:white;
  font-weight: 200;
}

.mt-1{
  margin-top: 10px !important;
}
.mt-2{
  margin-top: 20px !important;
}
.mt-3{
  margin-top: 30px !important;
}
.pt-1{
  padding-top: 10px !important;
}
.pt-2{
  padding-top: 20px !important;
}
.pt-5{
  padding-top: 50px !important;
}

.txt-center{
  text-align: center;
}
.txt-left{
  text-align: left;
}

#navlist li
{
display: inline;
list-style-type: none;
padding-right: 20px;
}

.triangolo {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 12.5px 21.7px 12.5px;
  border-color: transparent transparent #007bff transparent;
  line-height: 0px;
  _border-color: #000000 #000000 #007bff #000000;
  _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
}

/* PARTICLES */
#particles-js {
    position: absolute;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    opacity: 0.48;
}
/* PARTICLES */
#particles-js canvas{
	max-height:470px;
		z-index: -1;
}

.parallax {
    /* The image used */
    background-image: url("../img/locationimages/linz-1.jpg");

    /* Set a specific height */
    height: 250px;

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#logo-1 {
animation-delay: .05s;
}
#logo-2 {
animation-delay: .10s;
}
#logo-3 {
animation-delay: .15s;
}
#logo-4 {
animation-delay: .20s;
}
#logo-5 {
animation-delay: .25s;
}

/* The alert message box */
.alert {
    padding: 5px;
    background-color: #f44336; /* Red */
    color: white;
    margin-bottom: 15px;
}

/* The close button */
.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

table {
    font-size: 12px;
    margin-left:auto;
    margin-right:auto;
    border-collapse: collapse;
}
table th {
    font-size: 14px;
    font-weight: bold;
    border: 1px solid #999999;
    padding: 0px 5px;
}
table td {
    border: 1px solid #999999;
    padding: 5px 5px;
}

/* New button for summer school page */
.styled {
    border: 0;
    line-height: 2.5;
    padding: 0 20px;
    font-size: 1.2rem;
    text-align: center;
    color: #fff;
    text-shadow: 1px 1px 1px #000;
    border-radius: 10px;
    background-color: rgba(220, 0, 0, 1);
    background-image: linear-gradient(to top left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2) 30%, rgba(0, 0, 0, 0));
    box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);
}

.styled:hover {
    background-color: rgba(255, 0, 0, 1);
}

.styled:active {
    box-shadow: inset -2px -2px 3px rgba(255, 255, 255, 0.6), inset 2px 2px 3px rgba(0, 0, 0, 0.6);
}

.wrapper {
    text-align: center;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 80%;
}
