/*
* ----------------------------------------------------------------------------------------
Author       : Mohamed Alaa 
Template Name: Divcon – Personal Responsive Template 
Version      : 1.0
* ----------------------------------------------------------------------------------------
*/


/* Medium Layout: 1280px. */

@media only screen and (min-width: 992px) and (max-width: 1200px) {
    /* Home Page */
    .about .container-pragraph{
        margin: 0 9%;
    }
}


/* Tablet Layout: 768px. */

@media only screen and (min-width: 767px) and (max-width: 991px) {
    
    /* About Page */
    .about .container-pragraph{
        margin: 0;
    }
}


/* Mobile Layout: 767px. */

@media only screen and (max-width: 767px) {
    /* Navbar */
    .navbar-nav {
        background: #333;
        margin-top: 0;
    }
    .nav > li {
      text-align: center;
    }
    .navbar-default .navbar-nav  li:last-of-type{
        padding-right: 0px;
    }
    .navbar-default .navbar-nav > .active > a,
    .navbar-default .navbar-nav > .active > a:hover,
    .navbar-default .navbar-nav > .active > a:focus {
        color: #0ff;
        border-bottom: none;
    }   
    
    /* Homepage */
    .container h1{
      font-size: 36px;
    }  

    .about .container-pragraph{
        margin: 5px;
    }
    
    /* Service */
    .service .row .col-xs-12{
        text-align: center;
    }   
}


/* Wide Mobile Layout: Form 767 To 480px. */

@media only screen and (min-width: 480px) and (max-width: 767px) {}


/* Wide Mobile Layout: 480px. */

@media  (max-width: 480px) {
    /* About Page */
    .about .container-pragraph{
        margin: 0;
    }
}


/* Mobile Layout: 320px. */

@media (max-width: 320px) {
    
    /* Service */
     .service .container h2:after {
        padding-right: 46%;
    }
    
    /* Portfolio */    
    .portfolio .container h2:after {
        padding-right: 62%;
    }
    
    /* Contact */
    .contact h2:after {
        padding-right: 65%;
    }
    
    /* General */
    .about .container  h2 ,
    .service .container h2 ,
    .portfolio .container h2,
    .contact .row h2{
        font-size: 1.5em;
        letter-spacing: 10px;
    }
}