@font-face {
    font-family: 'instalogoold';
    src: url('./fonts/Fontspring-DEMO-blue_vinyl_regular_ps_ot.otf');
}

@font-face {
    font-family: 'instalogooldbold';
    src: url('./fonts/Fontspring-DEMO-blue_vinyl_bold_ps_ot.otf');
}

@font-face {
    font-family: 'instalogo';
    src: url('./fonts/Billabong.ttf');
}

@font-face {
    font-family: 'instasans';
    src: url('./fonts/InstagramSans-Regular.ttf');
}

@font-face {
    font-family: 'instasansmedium';
    src: url('./fonts/InstagramSans-Medium.ttf');
}


@font-face {
    font-family: 'instasanslight';
    src: url('./fonts/InstagramSans-Light.ttf');
}

body {

    /* width: 1920px; */
    max-height: 1950px; 
    background-color: #fafafa;
    /* padding: auto; */
    /* margin: 10px auto; */
    overflow: none;
   

}

#instagrammer{

    font-family: instalogo;

}

#maindiv{

    /* background-color: aqua; */
    width: 760px;
    height: auto;
    /* margin-top: auto;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
 */

 /* box-align: center; */
/* margin: 10px auto; */

/* position: relative; */
/* top: 40px; */
margin-top: 110px;


}

#toppart{

    height: 580px;



}

#mobileimage{

    display: grid;
    float: left;
    width: 380px;
    margin-left: 0px;
    /* float: left; */
    height: 580px;
    /* background-color: gray; */

}


#loginform{

    /* background-color: brown; */
    display: grid;
    width: 350px;
    height: 580px;
    /* float: left; */
    float: right;

}

.imgalign{
    
    margin-top: 0px;
    margin-left: 0px;
    height: 579px;

}

#formtop{

    background-color: #ffffff;
    border-color: #dbdbdb;
    border-width: 1px;
    height: 400px;
    border-style: solid;

}

.textinp{

    width: 268px;
    background-color: #fafafa;
    border-color: #dbdbdb;
    border-width: 1px;
    border-style: solid;
    height: 36px;
    border-radius: 3px;
    /* margin-top: 6px; */

}
.textinp.special-placeholder::placeholder {
    font-size: 12px;

}

.buttoninp{

    width: 268px;
    background-color: #4bb4f8;
    color: white;
    border-radius: 8px;
    border: none;
    height: 32px;

}

#a-button{

    /* position: relative; */
    margin-top: 6px;

}

#b-button{

    margin-top: 14px;

}

#forhr-or{

    display: table-row;
    height: 11px;
    width: 350px ;
    /* margin-top: 30px; */
    position: relative;
    top: 10px;
    

}

.thehr{

/* color: #dbdbdb; */
width: 107px;
/* height: 1px; */
border: 1px solid #dbdbdb;
border-width: 0.5%;
/* margin: auto; */



}

.por{

    color: #8e8e8e;
    font-size: 11px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    

}

#hr1{

    display: inline-block;
    float: left;
    position: relative;
    top: 6px;
}

#hr2{

    display: inline-block;
    float: right;
    position: relative;
    top: 6px;

}

#hror{

    display: inline-block;
    float: left;
    margin-left: 15px;
    margin-right: 15px;

}

#fblink{

    text-decoration: none;
    color: #385185;
    font-size: 14px;
    /* font-weight: bold; */
    font-family: 'instasansmedium';
    text-align: center;
}

#flogin{
    
    display: flex;
    height: 16px;
    width: 170px;
    margin-top: 24px;
    margin-bottom: 24px;

}

#forgot{

    text-decoration: none;
    color: #385185;
    font-family: 'instasans';
    font-size: 12px;

}

#instafonts{

    width: 174px;
    margin-top: 46px;
    margin-bottom: 40px;

}

#fgt{

    margin-top: 0px;

}

#signupdiv{

    width: auto;
    height: 62px;
    background-color: #ffffff;
    border: 1px solid #dbdbdb;
    position: relative;
    top: 10px;
    font-size: 16px;
    font-family: 'instasanslight';

}

#signup{

    text-decoration: none;
    color: #0095f6;
    /* font-size: 14px; */
    /* font-weight: bold; */
    /* font-family: 'instasans'; */
    font-weight: 800;
    align-items: center;


}

#noacc{

    color: #000000;
    /* font-size: 14px; */
    

}

.imagelink{

    /* width: 40px; */
    height: 40px;

}

#getapp{

    font-family: calibri light;
    font-size: 18px;

}

#bottomimages{

height: 42px;
align-items: center;

}


.relativeimg{

    position: relative;
    top: -555px;
    left: 110px;
}


select{

    background-color: #fafafa;

    /* opacity: 0; */
    border: none;
}

#bottomlinks {


/* text-align: left; */
font-size: 12px;
color: #8e8e8e;
text-decoration: none;
/* padding: none; */

}

#bottomlinks td{

    overflow-x: auto;
    padding: 2px;
    border-spacing: 3px;
    width: fit-content;

}

#navbar a{

    text-decoration: none;
    color: #8e8e8e;

}

#navbar li{

    display: inline;
    padding: 5px;
    /* border-spacing: 3px; */
    /* width: max-content; */
    font-size: 13px;
    text-align: left;
    margin: auto;
    font-family:  'calibri light';
    list-style: none;
    

}

#navbar ul {

        /* -moz-box-align: left; */
        /* margin-top: 100px; */
        width: 100%;
        /* margin: 0px; */
        padding: 0px;
        font-family: 'instasans';


}

#bottompart{

    width: 100%;
    margin-top: 140px;

    /* text-align: left; */
    font-family: 'instasanslight';
}

.exit{

    font-family:  'calibri light';
    font-size: 13px;
    color: #8e8e8e;

}

.exit select{

    font-family:  'calibri light';
    font-size: 13px;
    color: #8e8e8e;

}

.exit option{
    color: black;
}

.ind{

    text-indent: 10px;
    padding-left: 10px;

}

@media (max-width: 768px) {
    #maindiv {
        width: 90%;
        margin-top: 10px; /* Örnek değer, isteğe bağlı olarak ayarlayabilirsiniz */
    }
    
    #toppart {
        height: auto; /* Yükseklik otomatik olarak ayarlanır */
    }

    #mobileimage {
        display: none; /* Mobilde gizle */
    }

    #loginform {
        width: 90%;
        float: none;
        margin-top: 20px; /* Örnek değer, isteğe bağlı olarak ayarlayabilirsiniz */
    }
}