/** Width between 1200x to 0
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-width: 1200px) {

}

/** Width between 992px to 1199px
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-width: 992px) and (max-width: 1199px) {
  .cv-box{
    height:700px;
    width:800px;
    }
  .services-block{
    height:12vh;
    width:20vw;
    margin:10px;
    background: rgba(255,255,255,1);
    overflow:hidden;
}
.filler{
width:100%;
height:1px;
background:rgba(0,0,0,0);
margin-bottom: 2vh;
}
#last-modified {
    position: relative;
    left: 85%;
}
}

/** Width between 768px to 991px
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-width: 768px) and (max-width: 991px) {
.cv-box{
height:700px;
width:600px;
}

/* Services */
.services-block{
    height:15vh;
    width:25vw;
    margin:10px;
    background: rgba(255,255,255,1);
    overflow:hidden;
}
  /* Navbar */
  #last-modified{
    position:absolute;
    left:75%;
    top:19%;
}
  nav {
    padding: 10px 15px;
  }
  .nav-menu {
    margin-top: 40px;
    display: none;
    float: none;
    width: 100%;
    background:#fff;
  }
  .nav-menu li {
    float: none;
    width: 100%;
    text-align: center;
    border-top: 1px solid #f7f7f7;
    line-height: 45px;
    margin-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .responsive {
    float: right;
    padding-top: 15px;
    display: block;
  }
  /* About */
  .progress.skill
    {
    width:90%;
    }

  .head-info .header-content .cmaster h1 {
    font-size: 32px;
  }
  #about .div-img-bg {
    padding: 0;
  }
  #about .div-img-bg .about-img img {
    margin-top: 0%;
    margin-left: calc(0% - 0px);
    height:100%;
  }
  #about .about-descr .p-heading {
    font-size: 20px;
  }
  #about .about-descr .separator {
    max-width: 100%;
    margin-bottom: 0;
  }
  /* portfolio */
  #portfolio .portfolio-list .nav li {
    float: none;
    margin: 20px;
    display: inline-block;
  }
  /* journal */
  #journal .journal-block .journal-info {
    margin-bottom: 30px;
  }
  /* Contact */
  .contact-contact {
    margin-bottom: 50px;
  }
  /* Footer */
  #footer .socials-media ul li {
    margin-right: 0;
    margin-left: 0;
    float: none;
    display: inline-block;
  }
}

/** Width between 767px to 0
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 767px) {
/* Services */
.cv-box{
height:700px;
width:500px;
}

#last-modified{
    display:none;
}
.services-block{
    height:16vh;
    width:20vw;
    margin:8px;
    background: rgba(255,255,255,1);
    overflow:hidden;
}

.filler{
width:100%;
height:1px;
background:rgba(0,0,0,0);
margin-bottom:4vh;
}
  /* Navbar */
  nav {
    padding: 20px 15px;
  }
  .nav-menu {
    margin-top: 40px;
    display: none;
    float: none;
    width: 100%;
  }
  .nav-menu li {
    float: none;
    width: 100%;
    text-align: center;
    border-top: 1px solid #f7f7f7;
    line-height: 45px;
    margin-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .responsive {
    float: right;
    padding-top: 15px;
    display: block;
  }
  /* About */
  .progress.skill
    {
    width:90%;
    }
  .head-info .header-content h1 {
    font-size: 32px;
  }
  #about .div-img-bg {
    padding: 0;
  }
  #about .div-img-bg .about-img img {
    margin-top: 0%;
    margin-left: calc(0% - 0px);
  }
  #about .about-descr .p-heading {
    font-size: 20px;
  }
  #about .about-descr .separator {
    max-width: 100%;
    margin-bottom: 0;
  }
  /* portfolio */
  #portfolio .portfolio-list .nav li {
    float: none;
    margin: 20px;
    display: inline-block;
  }
  /* journal */
  #journal .journal-block .journal-info {
    margin-bottom: 30px;
  }
  /* Contact */
  .contact-contact {
    margin-bottom: 30px;
  }
  /* Footer */
  #footer .socials-media ul li {
    margin-right: 0;
    margin-left: 0;
    float: none;
    display: inline-block;
  }
}

/** Width between 600px to 0
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 600px) {

.cv-box{
height:600px;
width:400px;
}
/* Services */
#last-modified{
display:none;
}
.services-block{
    height:16vh;
    width:23vw;
    margin:10px;
    background: rgba(255,255,255,1);
    overflow:hidden;
}

.filler{
width:100%;
height:1px;
background:rgba(0,0,0,0);
margin-bottom:4vh;
}
  /* Navbar */
  #last-modified{
    display:none;
}
  nav {
    padding: 20px 15px;
  }
  .nav-menu {
    margin-top: 40px;
    display: none;
    float: none;
    width: 100%;
    background: #fff;
  }
  .nav-menu li {
    float: none;
    width: 100%;
    text-align: center;
    border-top: 1px solid #f7f7f7;
    line-height: 45px;
    margin-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .responsive {
    float: right;
    padding-top: 15px;
    display: block;
  }
  /* About */
  .progress.skill
    {
    width:90%;
    }
  .head-info .header-content h1 {
    font-size: 32px;
  }
  #about .div-img-bg {
    padding: 0;
  }
  #about .div-img-bg .about-img img {
    margin-top: 0%;
    margin-left: calc(0% - 0px);
  }
  #about .about-descr .p-heading {
    font-size: 20px;
  }
  #about .about-descr .separator {
    max-width: 100%;
    margin-bottom: 0;
  }
  /* portfolio */
  #portfolio .portfolio-list .nav li {
    float: none;
    margin: 10px;
    display: inline-block;
  }
  /* journal */
  #journal .journal-block .journal-info {
    margin-bottom: 30px;
  }
  /* Contact */
  .contact-contact {
    margin-bottom: 30px;
  }
  /* Footer */
  #footer .socials-media ul li {
    margin-right: 0;
    margin-left: 0;
    float: none;
    display: inline-block;
  }
}

/** Width between 480px to 0
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 480px) {
.cv-box{
height:500px;
width:350px;
}
/* Services */
.services-block{
    height:18vh;
    width:35vw;
    margin:10px;
    background: rgba(255,255,255,1);
    overflow:hidden;
    margin-left:23vw;
}
.group{
background:rgba(192, 196, 193,0.7);
margin:2px;
display:flex;
flex-flow:row wrap;
text-align:center;
}
.sm{
height:500px;
overflow:auto;
}
.filler{
width:100%;
height:1px;
background:rgba(0,0,0,0);
margin-bottom:5vh;
}
  /* Navbar */
  #last-modified{
    display:none;
}
  nav {
    padding: 20px 15px;
  }
  .nav-menu {
    margin-top: 40px;
    display: none;
    float: none;
    width: 100%;
    background: #fff;
  }
  .nav-menu li {
    float: none;
    width: 100%;
    text-align: center;
    border-top: 1px solid #f7f7f7;
    line-height: 45px;
    margin-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .responsive {
    float: right;
    padding-top: 15px;
    display: block;
  }
  /* About */
  .progress.skill
    {
    width:90%;
    }
  .head-info .header-content h1 {
    font-size: 32px;
  }
  #about .div-img-bg {
    padding: 0;
  }
  #about .div-img-bg .about-img img {
    margin-top: 0%;
    margin-left: calc(0% - 0px);
  }
  #about .about-descr .p-heading {
    font-size: 20px;
  }
  #about .about-descr .separator {
    max-width: 100%;
    margin-bottom: 0;
  }
  /* portfolio */
  #portfolio .portfolio-list .nav li {
    float: none;
    margin: 20px;
  }
  /* journal */
  #journal .journal-block .journal-info {
    margin-bottom: 30px;
  }
  /* Contact */
  .contact-contact {
    margin-bottom: 30px;
  }
  /* Footer */
  #footer .socials-media ul li {
    margin-right: 0;
    margin-left: 0;
    float: none;
    display: inline-block;
  }

  /*contact*/
  .social a{
        font-size: 1.8rem;
        padding-top:3rem;
        padding-left:3rem;
        padding-right:3rem;
    }

}

/** Width between 320px to 0
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 320px) {
.cv-box{
height:400px;
width:280px;
}
/* Services */
.services-block{
    height:14vh;
    width:40vw;
    margin-left:18vw;
    background: rgba(255,255,255,1);
    overflow:hidden;
}
.group{
background:rgba(192, 196, 193,0.7);
margin:2px;
display:flex;
flex-flow:row wrap;
text-align:center;
}
.sm{
height:500px;
overflow:auto;
}
.filler{
width:100%;
height:1px;
background:rgba(0,0,0,0);
margin-bottom:25px;
}
  /* Navbar */
  #last-modified{
    display:none;
}
  nav {
    padding: 20px 15px;
  }
  .nav-menu {
    margin-top: 40px;
    display: none;
    float: none;
    width: 100%;
    background: #fff;
  }
  .nav-menu li {
    float: none;
    width: 100%;
    text-align: center;
    border-top: 1px solid #f7f7f7;
    line-height: 45px;
    margin-left: 0;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .responsive {
    float: right;
    padding-top: 15px;
    display: block;
  }

  /* ------------------------------------------------------------------
  -----------------------------About ----------------------------------
  ---------------------------------------------------------------------*/

  .head-info .header-content h1 {
    font-size: 32px;
  }
  #about .div-img-bg {
    padding: 0;
  }
  #about .div-img-bg .about-img img {
    margin-top: 0%;
    margin-left: calc(0% - 0px);
  }
  #about .about-descr .p-heading {
    font-size: 20px;
  }
  #about .about-descr .separator {
    max-width: 100%;
    margin-bottom: 0;
  }

  .progress.skill
    {
    width:90%;
    }
  /* ------------------------------------------------------------------
  -----------------------------Protfolio ----------------------------------
  ---------------------------------------------------------------------*/
  #portfolio .portfolio-list .nav li {
    float: none;
    margin: 20px;
  }
  /* journal */
  #journal .journal-block .journal-info {
    margin-bottom: 30px;
  }
  /* Contact */
  .contact-contact {
    margin-bottom: 30px;
  }
  /* Footer */
  #footer .socials-media ul li {
    margin-right: 0;
    margin-left: 0;
    float: none;
    display: inline-block;
  }
  /* Single page */
  .entry-comments-body span {
    display: inline-block;
    margin-right: 0;
  }
  /*------------------------- Contact-----------------------*/

    /*contact*/
  .social a{
        font-size: 1.3rem;
        padding-top:3rem;
        padding-left:3rem;
        padding-right:3rem;
    }
}