/***Fonts***/



@font-face {

    font-family: 'venus-rising';

    font-weight: 400;

    font-style: normal;

    src: url('../fonts/venus-rising.woff')  format('woff');

    src: url('../fonts/venus-rising.ttf') format('truetype');

}



@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:300&display=swap');



/***Global layout***/



html {

    height: 100%;

    box-sizing: border-box;

}



*,

*:before,

*:after {

    box-sizing: inherit;

    outline:0;

}



/* loader */

#preloader {

    background: #000;

    bottom: 0;

    height: 100%;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

    width: 100%;

    z-index: 999;

}



#loaderInner, .loaderInner {

    background: url(../img/spinner.gif) center center no-repeat;

    height: 90px;

    left: 50%;

    margin: -45px 0 0 -45px;

    position: absolute;

    top: 50%;

    width: 90px;

}



body {

    width:100%;

    min-height: 100%;

    margin:0;

    font-family:Josefin Sans, sans-serif;

    color:white;

    overflow-x:hidden;

    position:relative;

    min-height: 100%;

    background:url(../img/bg.jpg) no-repeat top center;

    background-size:cover;

    display: flex;

    justify-content: center;

    align-items: center;

}



h1 {

    font-family: venus-rising;

    font-weight:400;

    font-size:20px;

    letter-spacing:0.8em;

    margin:0;

    text-shadow: 2px 2px 5px #000;

    margin-left:-10px;

}



h2 {

    font-weight:300;

    font-size:17px;

    letter-spacing:0.22em;

    line-height:28px;

    margin:0;

    text-align:center;

}



.main-img {

    position:relative;

    z-index:2;

    margin-top:-70px;

}



.nahled {

    display:none;

}



.mobile-img {

    display:none;

}



.logo {

    background:url(../img/logo.png) no-repeat center top;

    height:108px;

    width:325px;

    text-align:center;

    margin-left:auto;

    margin-right:auto;

    padding-top: 43px;

    margin-top:-130px;

    position:relative;

    z-index:3;

}



.social img {

    margin: 0 14px;

    transition:transform 0.3s;

}



.social img:hover {

    transform:scale(0.95);

}



.social {

    margin-top:30px;

    width:441px;

    margin-left:auto;

    margin-right:auto;

    margin-bottom:30px;

}



@media (max-width:1600px) {

    .main-img {

        width:1100px;

    }



}





@media (max-width:1200px) {

    .main-img {

        width:100%;

    }



}



@media (max-width:1024px) {

    .main-img {

        display:none;

    }



    .mobile-img {

        display:block;

        width:100%;

    }



    .logo {

        margin-top:-50px;

    }



}



@media (max-width:500px) {

    .social {

        text-align:center;

        width:100%;

        margin-top:20px;

        margin-bottom:20px;

    }



    .social img {

        margin: 0 8px;

        transition: transform 0.3s;

        width: 40px;

    }



    .logo {

        width:100%;

        margin-top:-20px;

        height:80px;

        background-size:contain;

        padding-top: 32px;

    }



    h1 {

        margin:0;

        font-size:17px;

    }



    h2 {

        font-size:15px;

    }



}