@import url('https://fonts.googleapis.com/css?family=Titillium+Web:400,600&display=swap');
body {
    width: 100%;
    height: 100%;
     margin: 0;
    padding: 0;
}
img.navbar-brand {
    transition: 1.5s;
    margin: 2%;
}
img.navbar-brand:hover {
    transition: 1.5s;
    transform: rotate(360deg);
}
ul.navbar-nav {
    margin-right: 2% !important;
    margin-top: -4%;
}
.nav-link {
    padding: .05rem !important;
}
a.nav-link {
    font-size: 1.5rem;
    font-family: "Titillium Web";
    font-weight: 600;
    color: black !important;
}
a.second-linka:hover {
    border-bottom: 3px solid #FFD700;
}
a.linka:hover {
    border-bottom: 3px solid #FFD700;
}
li.first {
     position: absolute;
    margin-left: -45%;
}
li.second {
    margin-left:-37%;
    position: absolute;
}
li.third {
    margin-left: -11%;
    position: absolute;
}
li.nav-item.fif {
    margin-left: -25%;
    position: absolute;
}
li.fourth {
    margin-top: -1%;
    margin-left: -4%;
    position: absolute;
}
li.fifth {
    margin-left: -25%;
    position: absolute;
}
li.fourth p {
    cursor: pointer;
    font-family: "Titillium Web";
     font-weight: 600;
}
li.fourth p:hover {
    color: #FFD700;
}
div.post-square {
   width: 70%;
}
div.column {
    padding: 5%;
} 
h1.blog-header {
    font-family: "Titillium Web";
    color: #FFD700;
    text-align: center;
    font-weight: 600;
    margin-top: 3%;
}
h2, h4 {
    font-weight: 600;
    font-family: "Titillium Web";
}

p.date-post {
    color: #FFD700;
}
a.page {
    font-size: 1.2rem;
}
.card {
    transition: 1s;
    border: 1px solid #FFD700 !important;
    display: block;
    margin: 0 auto;
    width: 85%;
    margin-top: 10%;
    -webkit-box-shadow: 10px 10px 15px 2px #000000; 
box-shadow: 10px 10px 15px 2px #000000;
}
div.card:hover {
    transition: 2s;
    width: 90%;
    position: relative;
     -webkit-box-shadow: 10px 10px 15px 5px #000000; 
     box-shadow: 10px 10px 15px 5px #000000;
}
.btn-primary {
    background-color: #FFD700 !important;
    border-color: #FFD700 !important;
    color: black !important;
}
a.btn-primary {
    display: block;
    margin: 0 auto;
    font-size: 1.4rem !important;
    padding: .1rem 0 .1rem 0;
     font-family: "Titillium Web";
}
.copy {
    display: block;
    margin-top: 10%;
    margin-left: 41%;
    font-family: "Titillium Web";
}
@media only screen and (max-width: 425px) {
li.first{
    display: block;
     text-align: center;
    margin: 5% 0 0 8%;
     position: static;
}
li.second {
     display: block;
     text-align: center;
   margin: 5% 0 0 8%;
    position: static;
}
li.third {
     display: block;
    text-align: center;
    margin: 5% 0 0 8%;
     position: static;
 }
li.fourth {
    display: block;
    margin: 5% 0 0 8%;
    text-align: center;
    position: static;
    font-size: 1.5rem;
}
li.fifth {
    display: block;
    margin: 5% 0 0 8%;
    text-align: center;
    position: static;
    font-size: 1.5rem;
}
div#header {
    margin-left: 15%;
}
img.imgs {
      margin-left: 11%;
      margin-top: 10%;
}
div#header2 {
    margin-left: 13%;
     margin-top: 10%;
}
h3.blog-header {
    margin-top: 7%;
}
h5 {
    display: inline-block;
    width: 310px;
} 
a.post-title {
    margin-top: 10%;
}
div#header4 {
    margin-left: 0%;
}
h3.contact-header {
     margin-top: 7%;
    margin-left: 3%;
}
    a.btn.btn-warning {
        margin-left: 0px !important;
    }
div.icons {
     margin-left: 15%;
}
.copy {
    display: block;
    margin-left: 25%;
    font-family: "Titillium Web";
}
}
@media only screen and (max-width: 375px) {
    li.first{
    margin: 5% 0 0 6%;
}
li.second {
   margin: 5% 0 0 5%;
}
li.third {
    margin: 5% 0 0 5%;
 }
li.fourth {
    display: block;
    margin: 5% 0 0 5%;
    text-align: center;
    position: static;
}

div#header {
    margin-left: 11%;
}
img.imgs {
      margin-left: 6%;
      margin-top: 10%;
}
div#header2 {
    margin-left: 10%;
     margin-top: 10%;
}
h3.blog-header {
    margin-top: 7%;
}
h5 {
    display: inline-block;
    width: 290px;
} 
a.post-title {
    margin-top: 10%;
}
div#header4 {
    margin-left: -2%;
}
h3.contact-header {
     margin-top: 10%;
    margin-right: -7% !important;
}
a.btn.btn-warning {
        margin-left: 10px !important;
    }
div.icons {
     margin-left: 10%;
    margin-right: -10%;
    padding: 1%;
}
.copy {
    display: block;
    margin-left: 22%;
    font-family: "Titillium Web";
}
}
@media only screen and (max-width: 320px) {
    li.first{
    margin: 10% 0 0 6%;
}
li.second {
   margin: 5% 0 0 5%;
}
li.third {
    margin: 5% 0 0 5%;
 }
li.fourth {
    display: block;
    margin: 5% 0 0 5%;
    text-align: center;
    position: static;
}

div#header {
    margin-left: 7%;
}
img.imgs {
      margin-left: 2%;
      margin-top: 10%;
}
div#header2 {
    margin-left: 5%;
     margin-top: 10%;
    width: 300px;
}
h3.blog-header {
    margin-top: 7%;
    margin-left: 9%;
}
h5 {
    display: inline-block;
    width: 290px;
} 
a.post-title {
    margin-top: 10%;
}
div#header4 {
    margin-left: -9%;
}
h3.contact-header {
     margin-top: 10%;
    margin-right: -19% !important;
}
a.btn.btn-warning {
        margin-left: 30px !important;
    }
div.icons {
     margin-left: 6%;
    margin-right: -20%;
    padding: 1%;
}
.copy {
    display: block;
    margin-left: 17%;
    font-family: "Titillium Web";
}
}
