body {

    background-image:url('../Images/homebg.png');

    background-position:right bottom;

    background-repeat:no-repeat;

    background-attachment:fixed;

}

#whiteScreen {

    width:100%;

    height:100%;

    position:fixed;

    top:0;

    left:0;

    background-color:#fff;

    z-index:999;

}

#headerImage {

    height:85%;

    min-height:980px;

    background-size:cover;

    background-position:center 0;

    background-repeat:no-repeat;

}

header {

    position:relative;

    background:#00B4AA;

    text-align:right;

    padding-right:160px;

    margin-bottom:50px;

}

header h1 {

    position:absolute;

    color:#fff;

    text-shadow:1px 1px 1px #000;

    font-size:60px;

    line-height:70px;

    left:190px;

    top:auto;

    bottom:40px;

    text-align:left;

    font-weight:normal;

}

header img {

    position:absolute;

    margin-bottom:-6px;

    width:150px;

    left:20px;

    top:-90px;

}

header a {

    display:inline-block;

    padding:10px 10px;

    color:#fff;

    transition:color ease .3s;

}

header a:hover {

    color:#222;

}

#social {

    position:absolute;

    right:20px;

    margin-top:-12px;

    z-index:900;

}

#social a {

    display:inline-block;

    border-radius:50px;

    background:#00B4AA;

    padding:5px;

    border:1px solid #fff;

    transition:border ease .3s;

}

#social a img {

    width:50px;

    height:50px;

    margin-bottom:-6px;

    filter:invert(100%);

    transition:filter ease .3s;

}

#social a:hover {

    border-color:#222;

}

#social a:hover img {

    filter:invert(0);

}



#content {

    padding:20px;

    width:1000px;

    margin-left:auto;

    margin-right:auto;

}



footer {

    margin-top:40px;

    background:#00B4AA;

    text-align:center;

    color:#fff;

    padding:10px 10px 7px 10px;

    font-size:11px;

    line-height:14px;

}



@media (max-width:1200px) {

    #headerImage { height:75%; min-height:350px; }

}



@media (max-width:1100px) {

    #headerImage { height:70%; min-height:320px; }

    #content { width:90%; }

}



@media (max-width:1000px) {

    #headerImage { height:67%; min-height:300px; }

}



@media (max-width:900px) {

    #headerImage { height:65%; min-height:280px; }

    header { padding-right:100px; }

    header h1 { font-size:40px; line-height:45px; left:110px; bottom:40px; }

    header img { width:80px; top:-85px; }

    #social { margin-top:2px; }    

    #social a img { width:24px; height:24px; }

}



@media (max-width:800px) {

    #headerImage { height:63%; min-height:250px; }

}



@media (max-width:700px) {

    #headerImage { height:220px; min-height:auto; }

}



@media (max-width:600px) {

    body { background:transparent; }

    #headerImage { height:180px; }

    header { position:static; padding:10px 0 0 0; text-align:center; }

    header img { width:130px; top:10px; }

    header h1 { position:static; line-height:50px; font-size:35px; left:0; top:90px; text-align:center; width:100%; padding:10px; border-top:1px solid #009988; margin-top:10px; }

    #social { top:22px; }

    #social a { display:block; margin-bottom:5px;}

    #social a img { width:35px; height:35px; }

}