/*----------------------------------------------------1681px to 1920px------------------------------------------------------*/

@media only screen and (max-width: 1920px) {
    
    .caption {
        top: 0%;
        left: 0%;
        transform: translate(0%, -370%);
    }
    .work_intro h3 {width: 20%;}
    .work_intro ul {width: 15%;}
}


/*----------------------------------------------------1281px to 1680px------------------------------------------------------*/

@media only screen and (max-width: 1680px) {
    
    .row {padding: 0 3%;}
    .caption {
        top: 0%;
        left: 0%;
        transform: translate(0%, -260%);
    }
    .work_intro h3 {width: 22%;}
    .work_intro ul {width: 15%;}
}

/*----------------------------------------------------1025px to 1280px------------------------------------------------------*/

@media only screen and (max-width: 1280px) {
    
    .row {padding: 0 3%;}
    
    .primary_nav {
        list-style: none;
        text-align: left;
        margin-left: -15px;
    }
    
    .primary_nav li a:link,
    .primary_nav li a:visited {
        margin-right: 20px;
    }
    
    .work_intro h3 {width: 25%;}
    .work_intro ul {width: 20%;}
}

/*----------------------------------------------------769px to 1024px------------------------------------------------------*/

@media only screen and (max-width: 1024px) {
    
    body {font-size: 18px;}
    
    header {
        height: 250px;
        padding-top: 0px;
    }
    .workheader {height: 0px;}
    .profile img {
        width: 24%;
        border: 8px solid #fff;
        border-radius: 200px;
        -webkit-transform: translate(0%, -50%);
        transform: translate(0%, -50%)
    }
    
    .row {
        padding: 0 5%;
        width: 100%
    }
        
    .top_band {
        top: 0;
        left: 0;
        margin-bottom: 0;
    }
    
    .caption {
        top: 0%;
        left: 0%;
        transform: translate(0%, -155%);
        font-size: 125%;
        margin-bottom: -20%;
        margin-left: 10%;
        margin-right: 10%;
    }
    
    .work_samp1 img,
    .work_samp2 img,
    .work_samp3 img,
    .work_samp4 img,
    .work_samp5 img,
    .work_samp6 img,
    .work_samp7 img,
    .work_samp8 img,
    .work_samp9 img,
    .work_samp10 img,
    .work_samp11 img,
    .work_samp12 img {
        opacity: 0.15;
        width: 100%;
        height: auto;
        -webkit-transform: scale(1.45);
        transform: scale(1.45);
        -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
        transition: opacity 0.3s, -webkit-transform 0.3s;
        transition: transform 0.3s, opacity 0.3s;
        transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s;
    }

   .work_samp1 img:hover {
       -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp2 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp3 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp4 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp5 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp6 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp7 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp8 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp9 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp10 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp11 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .work_samp12 img:hover {
        -webkit-transform: scale(1.30);
        transform: scale(1.30);
    }

    .colspan_1of3 {
        margin-bottom: 70px;
    }
    
    .about {
        padding-bottom: 50px;
    }

    .about1 {
        padding-right: 15px;
    }

    .about2 {
        padding-left: 15px;
    }

    .section2 {
        padding-bottom: 0px;
    } 
    
    .experience_header {
        margin-bottom: 40px;
    }
    
    footer {
        height: 100px;
    }
    
    .bottom {
        height: 100px;
    }
}

/*----------------------------------------------------481px to 768px------------------------------------------------------*/

@media only screen and (max-width: 768px) {    

    .row {padding 0, 5%;}
    
    h1 {
        font-size: 255%;
        line-height: 50px;
    }
    
    h3 {font-size: 100%}
    
    header {
        height: 150px;
        padding-top: 0px;
    }

    .primary_nav {display: none;}
    
    .menu {
        display: inline-block;
        margin-top: 20px;
        margin-left: 3%;
    }
    
    .profile img {
        width: 30%;
        border: 7px solid #fff;
        border-radius: 200px;
        -webkit-transform: translate(0%, -50%);
        transform: translate(0%, -50%)
    }
    
    .name {
        float:;
        display: block;
        width: 100%;
        margin-top: 70px;
        text-align: center;
    }
    
    .dr_butn {
        text-align: center;
        padding-top: 15px;
        padding-bottom: 40px;
        width: 100%;            
    }
    
    .colspan_1of3 {
        width: 100%;
        margin-top: 10px;
        margin-bottom: 30px;
    }
    
    .download_resume:link,
    .download_resume:visited {
        width: 100%;
        text-align: center;
        background-color: #fd9131;
        color: #fff;
        border: 2px solid #fd9131;
    }
    
    .about {
        padding-top: 10px;    
        padding-bottom: 10px;
    }
    
    .experience_header {
        width: 100%;
        padding: 0 15%;
        text-align: center;
        margin-bottom: 30px;
    }
    
    .col1 {
        width: 100%;
        padding: 0 15px;
        padding-bottom: 20px;
        border-bottom: 1px solid #dddddd;
    }
    
    .col2 {
        width: 100%;
        padding: 0 15px;
        padding-bottom: 20px;
        border-bottom: 1px solid #d9d9d9;
    }
    
    .col3 {
        width: 100%;
        padding: 0 15px;
        padding-bottom: 20px;
        border-bottom: 1px solid #cccccc;
    }
    
    .col4 {
        width: 100%;padding: 0 15px;
        padding-bottom: 0px;
    }
    
     .caption {
        top: 0%;
        left: 0%;
        transform: translate(0%, -115%);
        font-size: 100%;
        line-height: 25px;
        font-weight: 400;
        margin-bottom: -20%;
        margin-left: 0%;
        margin-right: 0%;
    }
    
    .work_samp1 img,
    .work_samp2 img,
    .work_samp3 img,
    .work_samp4 img,
    .work_samp5 img,
    .work_samp6 img,
    .work_samp7 img,
    .work_samp8 img,
    .work_samp9 img,
    .work_samp10 img,
    .work_samp11 img,
    .work_samp12 img {
        opacity: 0.15;
        width: 100%;
        height: auto;
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
        -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
        transition: opacity 0.3s, -webkit-transform 0.3s;
        transition: transform 0.3s, opacity 0.3s;
        transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s;
    }

        .work_samp1 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp2 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp3 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp4 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp5 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp6 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp7 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp8 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp9 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp10 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp11 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }

    .work_samp12 img:hover {
        -webkit-transform: scale(1.75);
        transform: scale(1.75);
    }
    
    footer {height: 80px;}
    
    .bottom {height: 80px;}
    
    .f1 {
        padding-top: 5%;
        padding-right: 10%;
    }

    .f2 {
        text-align: center;
        padding-top: 5%;
    }

    .f3 {
        padding-top: 5%;
        padding-left: 10%

    }
}

/*----------------------------------------------------320px to 480px------------------------------------------------------*/

@media only screen and (min-width: 320px) and (max-width: 480px) {
    
    section {padding: 30px 0;}
    
    h1 {
        font-size: 200%;
        line-height: 40px;
    }
    
    h3 {font-size: 80%}
    
    header {
        height: 120px;
        padding-top: 0px;
    }
    
    .row_max {width: 100%;}
    
    .row {padding: 0 6%;}
    
    .profile img {
        width: 40%;
        border: 6px solid #fff;
        border-radius: 100px;
        -webkit-transform: translate(0%, 0%);
        transform: translate(0%, -50%)
    }
    
    .name {margin-top: 50px;}
    
    .colspan_1of3 {
        width: 100%;
        margin-top: 10px;
        margin-bottom: 30px;
    }

   .dr_butn {
        text-align: center;
        padding-top: 15px;
        padding-bottom: 30px;
        width: 100%;            
    }
    
    .download_resume:link,
    .download_resume:visited {
        width: 100%;
        text-align: center;
        background-color: #fd9131;
        color: #fff;
        border: 2px solid #fd9131;
    }
    
    .about {padding-bottom: 30px;}
    
    .about1 {
        padding-right: 0px;
        width: 100%;
    }

    .about2 {
        padding-left: 0px;
        width: 100%;
    }
    
    .work_samp1,
    .work_samp2,
    .work_samp3,
    .work_samp4,
    .work_samp5,
    .work_samp6,
    .work_samp7,
    .work_samp8,
    .work_samp9,
    .work_samp10,
    .work_samp11,
    .work_samp12 {
        width: 50%;
        transform: scale(1.0);
    }
    
    .caption {
        -webkit-transform: translate(0%, -185%);
        transform: translate(0%, -185%);
        font-size: 130%;
        font-weight: 300;
    }
    
}

