body{
    /* background: url(https://images.unsplash.com/photo-1474524955719-b9f87c50ce47?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=c83ef66968ed8c6a5c1ac1111ee78c1e&auto=format&fit=crop&w=1052&q=80); */
    /* background-color: rgb(44,62,80); */
    /* background-size: cover; */
    font-family: Lato;
    /* background-position: center; */
    color: white;
    height: 50%;
    margin: 0;
    padding: 0;
}

html{
    height: 100%;
    width: 100%;
}

nav{
    /* margin-top: 5%; */
}

hr{
    border-color: white;
    border-top: 3px dashed #f8f8f8;
    border-bottom: 1px solid rgba(0,0,0,0.2);
}

h1{
    font-weight: 700;
    font-size: 5em;
    text-shadow: 0px 4px 3px grey;
}

h2{
    padding-top: 2.5%;
    font-size: 2.5rem;
    font-weight: bold;
}

h3{
    padding-bottom: 5%;
}

h5{
    margin-top: 5%;
}

#content{
    text-align: center;
    padding-top: 5%;
}

.frame{
    padding-top: 5%;
}

.img-responsive{
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    /* margin-top: 5%; */
    /* padding-top: 5%; */
    border: 3px solid white;
}

.img-round-square {width:30%;height:30%;-moz-border-radius:50%;-webkit-border-radius:50%;-o-border-radius:50%;border-radius:50%}
.img-round-square:hover {-moz-border-radius:0%;-webkit-border-radius:0%;-o-border-radius:0%;border-radius:0%}

.img-round-square{
    transition:all .2s ease-in-out;
    -webkit-transition:all .2s ease-in-out;
    -moz-transition:all .2s ease-in-out;
    -ms-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
}

.img-round-square:hover{
    transition:all .4s ease-in-out;
    -webkit-transition:all .4s ease-in-out;
    -moz-transition:all .4s ease-in-out;
    -ms-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
}

#main{
    background-color: rgb(44,62,80);
}

#about{
    background-color: white;
    color: rgb(44,62,80);
    text-align: center;
    padding-bottom: 10%;
    text-transform: uppercase;
}

#projects{
    background-color: rgb(44,62,80);
    text-align: center;
    padding-bottom: 10%;
    text-transform: uppercase;
}

#cv{
    background-color: white;
    color: rgb(44,62,80);
    text-align: center;
    padding-bottom: 5%;
    text-transform: uppercase;
}

#contacts{
    background-color: rgb(44,62,80);
    text-align: center;
    padding-bottom: 6%;
    text-transform: uppercase;
}

#copyright{
    background-color: rgb(36,50,64);
    color: white;
    text-align: center;
    padding-bottom: 2.5%;
    padding-top: 2.5%;
    /* text-transform: uppercase; */
}

hr.star-primary {
    padding: 0;
    border: none;
    border-top: solid 5px;
    text-align: center;
    max-width: 250px;
    margin: 25px auto 25px;
  }

  .img-thumbnail{
    margin:1.66%;
  }

  .btn{
      color:  rgb(36,50,64);
      border-color:  rgb(36,50,64);
      margin-top: 3%;
  }

  .container2{
      margin-top: 5%;
  }


  .btn-social {
    display: inline-block;
    height: 50px;
    width: 50px;
    border: 2px solid white;
    border-radius: 100%;
    text-align: center;
    font-size: 20px;
    line-height: 45px;
  }

  .btn-outline {
    color: white;
    font-size: 20px;
    border: solid 2px white;
    background: transparent;
    transition: all 0.3s ease-in-out;
  }

.btn-outline:hover,
.btn-outline:focus,
.btn-outline:active,
.btn-outline.active {
color: #18BC9C;
background: white;
border: solid 2px white;
}

ul{
    padding-left: 0;
}

li{
    margin-left: 2%;
    margin-right: 2%;
    display: inline;
    list-style-type: none;
}

.cont{
    margin-top: 3%;
}

.portfolio-item {
    position: relative;
    width: 50%;
    padding-left: 1%;
    padding-right: 1%;
  }
  
  .img-thumbnail {
    display: block;
    width: 100%;
    height: 95%;
  }
  
  .overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin-top: 1.5%;
    margin-left: 5.5%;
    width:92%;height:95%;-moz-border-radius:2%;-webkit-border-radius:2%;-o-border-radius:2%;border-radius:2%;
    opacity: 0;
    transition: .5s ease;
    background-color: white;
  }

  .search_icon{
      margin-top: 20%;
      color: rgb(36,50,64);
      text-decoration: none;
  }

  a {
    color: rgb(36,50,64);
    text-decoration: none;
}

    a:hover 
    {
        color:rgb(36,50,64);
        text-decoration:none; 
        cursor:pointer;  
    }
  
  .portfolio-item:hover .overlay {
    opacity: 0.8;
  }

  #cal{
      /* height: 63.5%; */
  }


  .img-thumbnail2{
    height: 85%;
  }

  .overlay2{
      height: 85%;
  }