/* =========================
   GLOBAL RESET
========================= */

*{

    margin:0;
    padding:0;
    box-sizing:border-box;
	font-family: 'Manrope', sans-serif;

}


html,
body{

    width:100%;
    min-height:100%;

}


html{

    overflow-x:hidden;

}



body{



    background:#013330;

    color:#CCE7FF;

    overflow-x:hidden;

}





/* =========================
   TRADEBOOK GLOBAL LOGO
========================= */


.tradebook-logo{

    position:fixed;


    top:40px;

    left:60px;


    z-index:99999;

    font-size:32px;


    line-height:.85;


    font-weight:900;


    letter-spacing:-1.8px;


    color:var(--text-main);


    display:flex;


    flex-direction:column;


    align-items:flex-start;


    text-decoration:none;


}



.tradebook-logo span{

    color:var(--accent);

}







/* =========================
   MOBILE LOGO
========================= */


@media(max-width:600px){


    .tradebook-logo{


        top:25px;


        left:25px;


        font-size:25px;


        letter-spacing:-1.2px;


    }


}







/* =========================
   VERY SMALL MOBILE
========================= */


@media(max-width:360px){


    .tradebook-logo{


        left:18px;


        font-size:23px;


    }


}









/* =========================
   INDEX HEADER
========================= */


.main-header{


    width:100%;


    height:90px;


    position:relative;


}







/* =========================
   INDEX BUTTONS
========================= */


.auth-buttons{


    position:absolute;


    top:40px;


    right:60px;


    display:flex;


    align-items:center;


    gap:15px;


}





.auth-buttons a{


    text-decoration:none;


    padding:12px 28px;


    border:1px solid #333;


    border-radius:10px;


    color:#CCE7FF;


    font-size:14px;


    font-weight:700;


    transition:.25s;


}





.auth-buttons a:hover{


    border-color:#2563EB;


    color:#2563EB;


}






.auth-buttons a:last-child{


    background:#000;


    border-color:#333;


}





.auth-buttons a:last-child:hover{


    background:#111;


    color:#2563EB;


    border-color:#2563EB;


}







/* =========================
   MOBILE HEADER
========================= */


@media(max-width:600px){


    .main-header{


        height:80px;


    }




    .auth-buttons{


        top:25px;


        right:20px;


        gap:7px;


    }




    .auth-buttons a{


        padding:8px 12px;


        font-size:12px;


        border-radius:8px;


    }


}





@media(max-width:360px){


    .auth-buttons{


        right:15px;


        gap:5px;


    }



    .auth-buttons a{


        padding:7px 10px;


        font-size:11px;


    }


}