/*----Site Reset-----*/
@import url('https://fonts.googleapis.com/css?family=Montserrat');

* {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

/*-----HTML tags------*/

html{
    box-sizing:border-box;
}

html,body {
    font-family:Montserrat, sans-serif;
    font-size:15px;
    line-height:1.5;
}


header {
    background-color:white;
    width:100%;
    color:white;

}

main {
    margin-top:15vh;
}


article {
    display:block;
}

h1 {
    font-size:36px;
    display: inline;

}

h2 {
    font-size:30px;

}

h3 {
    font-size:24px;
    display: inline;

}

h4 {
    font-size: 22px;

}

h5 {
    font-size:20px;
}

h6 {
    font-size:16px;
}

h1,h2,h3,h4,h5,h6{
    font-family: "Montserrat",Arial,sans-serif;
    font-weight: 400;
    margin: 10px 0;
}


p {
    font-size: 18px;
    max-width: 800px;
}

a{  
    text-decoration: none;  
    font-size: 20px;
    padding: 20px;
    margin: 10px;
    width: 400px;
    display: inline-block;
    background: #fffafb;
    color: #e5151e;
    box-shadow: 3px 3px 4px grey;

}

li{
    display:inline-block;
    
}

details > summary {
    padding: 2px 6px;
    width: 15em;
    border: none;
    box-shadow: 3px 3px 4px grey;
    height: 57px;
    margin: 3vh 0;

}

summary::-webkit-details-marker {
  display: none
}
summary:after {
    background: #F26E74;
    content: "+";
    color: #fff;
    float: left;
    font-size: 2em;
    font-weight: bold;
    margin: 5px;
    padding: 0;
    text-align: center;
    width: 45px;
}

details[open] summary:after {
  content: "-";
}

summary h3 {
    position: relative;
    top: 9px;
}

p a {
    all: initial;
    background-color:#f26e74;
    color:#fffafb;
    font-size: 18px;
    font: inherit;

}

p a:hover {
    cursor: pointer;
}


/*-----Class-----*/

.Panel {
    margin-top: 8vh;
    margin-bottom: 8vh;
    padding: 0.01em 6vw;

}

#nav-bar {
  background-color: #333;
  position: fixed;
  top: 0;
  width: 100%;
  margin-top:0;
  padding-left: 2vw;

}

#nav-bar a {
    float:right;
    margin:0;
    border:none; 
    background: #f26e74;
    color: #fffafb;
    width: 20vw;
    box-shadow: none;
}

#nav-bar h1 {
    font-size: 3em;
}

#nav-bar h3 {
    font-size: 1em;
}

.Dark_pink {
    color: #F26E74;
}

.Light_pink {
    color: #f69da1;
}

.Indent_paragraph li {
    display:block;
}

.Button:hover {
    background-color: #F26E74;
    color:#fffafb;

}


/******Article*******/
article li {
    margin-left: 50px;
}

.Indent_paragraph {
    margin-left: 50px;
}

.Highlight {
    background-color: #f69da1;
}

main figure img{
    max-width:1000px;
    width:100%;
    

}


/*****layoutclasses*****/

.responsiveimg {
    max-width:none;
}

.maxwidth800 {
    max-width:800px;

}

.center {
    margin:auto;
}

.border {
    border:solid 2px #333;
}

.W1920 {
    max-width:1920px;
}

.W1023 {
    max-width:1023px;
}

.W412 {
    max-width:412px;
}
/******Mediarule*******/
@media screen and (max-width: 688px) {

    #nav-bar h3 {
        display:none;
    }

    main {
        margin-top: 5vh;
    }

    a{
        width: 50vw;
    }
}