@media only screen and (max-width: 1600px)
{
    nav label.logo{
        padding: 0 2%;
    }
    nav ul li a{
        padding: 0 12px;
    }
}

/************
2. 1440px
************/

@media only screen and (max-width: 1440px)
{
    nav ul li a{
        font-size: 12px;
    }

    .section1{
        height: 100vh;
        padding: 0 25%;
    }

    .section1 .right {
        width: 100%;
        height: 50%;
    }

    .section1 .right .tabs{
        padding-left: 0;
    }
    .section1 .left {
        width: 100%;
        height: 50%;
    }
    .section1 .left .books{
        padding-right: 0 !important;
    }
    .section1 .left .books .list-inline{
        padding-right: 0 !important;
    }

    .section3 {
        height: 100vh;
    }
    .section3 .charts{
        padding: 0 27%;
    }
    .section3 .charts .box-right {
        width: 100%;
        padding-left: 0;
        height: 50%;
    }
    .section3 .charts .box-left {
        width: 100%;
        height: 50%;
        padding-right: 0;
    }
	
}

/************
3. 1380px
************/

@media only screen and (max-width: 1380px)
{
    nav ul{
        padding-left: 0;
    }
    nav ul li a{
        padding: 0 5px;
    }
    .box img {
        width: 250px;
    }
    .container-t nav a {
        padding: 5px 78px;
    }
}

/************
3. 1280px
************/

@media only screen and (max-width: 1280px)
{
    .container-t nav a {
        padding: 5px 74px;
    }
}

/************
4. 1199px
************/

@media only screen and (max-width: 1199px)
{
    nav ul li a{
        font-size: 10px;
    }
    .container-t nav a {
        padding: 5px 69px;
    }
    .container-t nav a:last-of-type {
        padding: 5px 69px;
        padding-left: 40px;
    }
}

/************
4. 1100px
************/

@media only screen and (max-width: 1100px)
{
    .section3 .charts{
        padding: 0 20%;
    }
}

/************
5. 1024px
************/

@media only screen and (max-width: 1024px)
{
    
    nav ul li a{
        font-size: 14px;
    }
}

/************
6. 991px
************/

@media only screen and (max-width: 991px)
{
    .section1{
        padding: 0 15%;
    }

}

/************
7. 959px
************/

@media only screen and (max-width: 959px)
{
    .section2{
        height: 100%;
    }

    .card{
        margin: 10px 0;
    }
	
}

/************
8. 880px
************/

@media only screen and (max-width: 880px)
{
    .section3 .charts{
        padding: 0 15%;
    }
    .nav>li>a {
        padding: 7px 10px !important;
        font-size: 12px;
    }
}

/************
9. 768px
************/

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

/************
10. 767px
************/

@media only screen and (max-width: 767px)
{
    .tab ul li span{
        font-size: 10px;
    }
    .tab ul li span p{
        font-size: 8px;
    }
    .tab ul li span a{
        font-size: 12px;
    }
    .book {
        width: 90px;
        height: 123px;
    }
    .container-t nav a {
        padding: 5px 65px;
    }
    .container-t nav a:first-of-type {
        padding-right: 40px;
    }
    .container-t nav a:last-of-type {
        padding-right: 40px;
    }
}
@media only screen and (max-width: 630px){
    .container-t nav a:last-of-type {
        padding-right: 5px;
        padding-left: 5px;
    }
    .container-t nav a:first-of-type {
        padding-right: 20px;
        padding-left: 20px;
    }
    .container-t nav a:nth-of-type(3) {
        padding-right: 20px;
        padding-left: 20px;
    }
}
@media only screen and (max-width: 580px){
    .container-t nav a:nth-of-type(2) {
        padding-right: 20px;
        padding-left: 20px;
    }
}
@media only screen and (max-width: 540px){
    .container-t nav a {
        width: 90px;
        height: 90px;
    }
    .container-t nav a:nth-of-type(2) {
        padding-right: 10px;
        padding-left: 10px;
    }
    .container-t nav a:nth-of-type(3) {
        padding-right: 10px;
        padding-left: 10px;
    }
    .container-t nav a:first-of-type {
        padding-right: 10px;
        padding-left: 10px;
    }
}
@media only screen and (max-width: 485px){
    .container-t nav a {
        width: 70px;
        height: 70px;
    }
}
@media only screen and (max-width: 380px){
    .container-t nav a {
        width: 60px;
        height: 60px;
    }
}
@media only screen and (max-height: 960px) and (max-width: 1400px) {
    .section3 {
        height: 120vh;
    }
    .card.card2 {
        height: 80px;
    }
}

@media only screen and (max-height: 800px)
{
    .section3 {
        height: 130vh;
    }
    .section2 {
        height: 57vh;
    }
    .card.card2 {
        height: 80px;
    }
}

@media only screen and (max-height: 767px)
{

    .right .tabs{
        padding-top: 0;
    }
    .left .books{
        padding-top: 0 !important;
    }
    .card{
        height: 200px;
    }
    .container-t .profile, .container-t .payment, .container-t .subscription, .container-t .privacy, .container-t .settings {
        padding: 85px;
    }
    .container-t .rightbox a{
        top: 80%;
    }
    .container-t nav a{
        font-size: .8em;
    }
}
@media only screen and (max-height: 667px)
{
    .card{
        height: 150px;
    }
    .container-t .profile, .container-t .payment, .container-t .subscription, .container-t .privacy, .container-t .settings {
        padding: 95px;
    }
    .container-t .rightbox a{
        top: 70%;
    }
    .left .books .list-inline{
        padding-top: 3em;
    }
}
@media only screen and (max-height: 550px)
{
    .section3 {
        height: 170vh;
    }
    .section2 {
        height: 67vh;
    }
}
@media only screen and (max-height: 900px)
{
    .tabs{
        height: 85%;
    }
}
@media only screen and (max-height: 650px)
{
    .section1{
        height: 120vh;
    }
}
@media only screen and (max-height: 600px)
{
    .section3{
        height: 150vh;
    }
    .tab-content div.active {
        height: 55vh !important;
    }
}
@media only screen and (max-height: 550px)
{
    .section1{
        height: 140vh;
    }
}
@media only screen and (max-height: 480px)
{
    .section1{
        height: 160vh;
    }
}
@media only screen and (max-height: 420px)
{
    .section1{
        height: 180vh;
    }
    .section3{
        height: 170vh;
    }
    .tab-content div.active {
        height: 60vh !important;
    }
}
@media only screen and (max-height: 360px)
{
    .section1{
        height: 200vh;
    }
    .section3{
        height: 180vh;
    }
}

/************
11. 575px
************/

@media only screen and (max-width: 575px)
{
    .book {
        width: 70px;
        height: 96px;
    }
    .list-inline>li {
        padding-right: 2px !important;
        padding-left: 2px !important;
    }
}

/************
11. 539px
************/

@media only screen and (max-width: 539px)
{
    .tabs label{
        font-size: 10px;
    }
    .tab ul div.div-tab{
        width: 35%;
    }
    .tab ul li span{
        width: 65%;
    }
}

/************
12. 480px
************/

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

    .tabs label{
        font-size: 8px;
    }
    .book {
        width: 50px;
        height: 69px;
    }

    .nav {
        padding-right: 0;
    }

    .nav>li>a {
        padding: 5px 8px !important;
        font-size: 10px;
    }
	
}

/************
13. 479px
************/

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

}

/************
14. 400px
************/

@media only screen and (max-width: 400px)
{
    nav label.logo img {
        padding: 10px 0;
    }
    .tab ul li span{
        font-size: 8px;
    }
    .tab ul li span p{
        font-size: 6px;
    }
}