/*
	Theme Name: TWB
	Media Queries
*/

/* MEDIA QUERIES */

/* xtra small Devices */
@media (max-width: 479px)  {
	header .logo-wrap .logo {
	    padding:10px 0px 10px 0px;
	    color: #9DB4C0;
	    font-weight: 700;
	    font-size: 16px;
	}
    .section {
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .post {
        padding-left: 0px;
        padding-right: 0px;
    }
    .footer-nav {
        padding-top: 15px;
        padding-bottom: 5px;
        background-color: #405e49;
        font-size: 16px;
    }
    
    .footer-nav .quick-links li {
        padding-bottom: 15px;
    }
    
    /* HERO STYLES */
    .hero {
        background:url('../images/hero.jpg');
        background-position: center 0px;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-color: #ffffff;
        width:100%;
        color:#ffffff;
        position: relative;
        overflow: hidden;
    }

    .hero:before, .hero:after {
        border-bottom: none;
        bottom: 0;
        content: "";
        position: absolute;
    }

    .hero:before {
        border-right: none;
        left: 0;
    }

    .hero::after {
        border-left: none;
        right: 0;
    }

    .hero-text { 
        padding-top: 175px;
        padding-bottom: 75px;
    }

    .hero-a {
        font-size: 16px;
        padding: 15px;

    }

    /* END HERO */ 
    
    .free-case-eval .title {
        font-size: 36px;
    }
    .free-case-eval .phone a {
        font-size: 36px;
    }
}

/* Smaller Devices */
@media (min-width: 480px) and (max-width: 767px)  {
    .section {
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 15px;
        padding-right: 15px;
    }
    .footer-nav {
        padding-top: 15px;
        padding-bottom: 5px;
        background-color: #405e49;
        font-size: 16px;
    }
    .practice-areas .area {
        padding-top: 35px;
        padding-bottom: 35px;
    }
    
    /* HERO STYLES */
    .hero {
        background:url('../images/hero.jpg');
        background-position: center 0px;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-color: #ffffff;
        width:100%;
        color:#ffffff;
        position: relative;
        overflow: hidden;
    }

    .hero:before, .hero:after {
        border-bottom: none;
        bottom: 0;
        content: "";
        position: absolute;
    }

    .hero:before {
        border-right: none;
        left: 0;
    }

    .hero::after {
        border-left: none;
        right: 0;
    }

    .hero-text { 
        padding-top: 175px;
        padding-bottom: 75px;
    }

    .hero-a {
        font-size: 18px;
        padding: 15px;

    }

    /* END HERO */ 
    
}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px)  {
	.practice .area {
		padding: 50px 10px;
		font-size: 17px;
		min-height: 175px;
	}
    
    .section {
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 15px;
        padding-right: 15px;
    }
    .footer-nav {
        padding-top: 15px;
        padding-bottom: 5px;
        background-color: #405e49;
    }
    /* HERO STYLES */
    .hero {
        background:url('../images/hero.jpg');
        background-position: center 0px;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-color: #ffffff;
        width:100%;
        color:#ffffff;
        position: relative;
        overflow: hidden;
    }

    .hero:before, .hero:after {
        border-bottom: none;
        bottom: 0;
        content: "";
        position: absolute;
    }

    .hero:before {
        border-right: none;
        left: 0;
    }

    .hero::after {
        border-left: none;
        right: 0;
    }

    .hero-text { 
        padding-top: 275px;
        padding-bottom: 100px;
    }

    .hero-a {
        font-size: 28px;
        padding: 15px;

    }

    /* END HERO */  
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) { 
	.practice .area {
		padding: 50px 15px;
		font-size: 18px;
	}
    
    .section {
        padding-top: 50px;
        padding-bottom: 50px;
        padding-left: 15px;
        padding-right: 15px;
    }
    .footer-nav {
        padding-top: 15px;
        padding-bottom: 5px;
        background-color: #405e49;
    }
    
    /* HERO STYLES */
    .hero {
        background:url('../images/hero.jpg');
        background-position: center 0px;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-color: #ffffff;
        width:100%;
        color:#ffffff;
        position: relative;
        overflow: hidden;
    }

    .hero:before, .hero:after {
        border-bottom: none;
        bottom: 0;
        content: "";
        position: absolute;
    }

    .hero:before {
        border-right: none;
        left: 0;
    }

    .hero::after {
        border-left: none;
        right: 0;
    }

    .hero-text { 
        padding-top: 275px;
        padding-bottom: 100px;
    }

    .hero-a {
        font-size: 36px;
        padding: 15px;

    }

    /* END HERO */

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

}

@media only screen and (min-width : 1199px) {
    /* Make Navigation Toggle on Desktop Hover */
    .dropdown:hover .dropdown-menu {
        display: block;
    }
}

/* Medium queries for navbar/header */
@media (min-width: 1200px) and (max-width: 1300px) { 
	.main-nav-wrap {
	}

	.main-nav {
    	font-size:16px;
	}
	
    .main-nav li {
    	padding-right: 5px;
	}
    
	.main-nav a, .main-nav a:visited {
    	padding: 15px 5px 15px 5px;
	}
	
	header .phone-number-wrap {
    	margin-top: 15px;
	}


	header .logo-wrap .logo {
	    padding:10px 0px 10px 0px;
	    color: #9DB4C0;
	    font-weight: 700;
	    font-size: 18px;
	}
    
    .practice-areas .area {
        font-size: 24px;
    }
    
    header .logo-wrap .right .phone-number-wrap .phone-call-action {
        font-size: 14px;
        margin-bottom: -5px;
    }

    header .logo-wrap .right .phone-number-wrap .phone-number {
        font-size: 32px;
        font-weight: 700;
        padding-right: 15px;

    }

    header .logo-wrap .right .phone-number-wrap-outer {
        margin-top: 0px;
        padding-bottom: 17px;
        margin-right: -10px;
    }  

}

@media (min-width: 1301px) and (max-width: 1500px) { 
	.main-nav-wrap {
	}

	.main-nav {
    	font-size:18px;
	}
	
    .main-nav li {
    	padding-right: 5px;
	}
    
	.main-nav a, .main-nav a:visited {
    	padding: 15px 5px 15px 5px;
	}
	
	header .phone-number-wrap {
    	margin-top: 15px;
	}

	header .phone-number {
    	font-size: 24px;
	}
	header .logo-wrap .logo {
	    padding:10px 0px 10px 0px;
	    color: #9DB4C0;
	    font-weight: 700;
	    font-size: 18px;
	}
    
    .practice-areas .area {
        font-size: 24px;
    }
    
    header .logo-wrap .right .phone-number-wrap .phone-call-action {
        font-size: 16px;
        margin-bottom: -5px;
    }

    header .logo-wrap .right .phone-number-wrap .phone-number {
        font-size: 40px;
        font-weight: 700;
        padding-right: 15px;

    }

    header .logo-wrap .right .phone-number-wrap-outer {
        margin-top: 0px;
        padding-bottom: 17px;
        margin-right: -10px;
    }   
}

@media (min-width: 1501px) and (max-width: 1600px) { 
	.main-nav-wrap {
	}

	.main-nav {
    	font-size:18px;
	}

	.main-nav a, .main-nav a:visited {
    	padding: 15px 5px 15px 5px;
	}
		
	header .phone-number-wrap {
    	margin-top: 5px;
	}

	header .phone-number {
    	font-size: 29px;
	}

	header .logo-wrap .logo {
	    padding:10px 0px 10px 0px;
	    color: #9DB4C0;
	    font-weight: 700;
	    font-size: 18px;
	}
    
    header .logo-wrap .right .phone-number-wrap .phone-call-action {
        font-size: 18px;
        margin-bottom: -5px;
    }

    header .logo-wrap .right .phone-number-wrap .phone-number {
        font-size: 46px;
        font-weight: 700;
        padding-right: 15px;

    }

    header .logo-wrap .right .phone-number-wrap-outer {
        margin-top: 0px;
        padding-bottom: 16px;
        margin-right: -10px;
    }
}

@media (min-width: 1601px) and (max-width: 1850px) { 
	.main-nav-wrap {
    	
	}

	.main-nav {
    	font-size:19px;
	}

	.main-nav a, .main-nav a:visited {
    	padding: 15px 5px 15px 5px;
	}
    
    header .logo-wrap .right .phone-number-wrap .phone-call-action {
        font-size: 18px;
        margin-bottom: -5px;
    }

    header .logo-wrap .right .phone-number-wrap .phone-number {
        font-size: 48px;
        font-weight: 700;
        padding-right: 15px;

    }

    header .logo-wrap .right .phone-number-wrap-outer {
        margin-top: 0px;
        padding-bottom: 13px;
        margin-right: -10px;
    }
    
}

@media (max-width: 1920px) { 
    .hero {
        background:url('../images/hero-mid.jpg');
        background-position: center 0px;
        background-size: cover;
        background-repeat: no-repeat;
        background-attachment: scroll;
        background-color: #ffffff;
        width:100%;
        color:#ffffff;
        position: relative;
        overflow: hidden;
    }
}

/* END FOR NAVBAR/HEADER */