@import url(http://fonts.googleapis.com/css?family=Fjalla+One);

*{
    font-family: Georgia,"Times New Roman", Serif;
    font-size:14px;
    line-height:1.5em;
    color:#444;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body{
    margin: 0 auto;
    padding:2em;
    min-width:320px;
}

h1, h2, .headline p {
    font-family: 'Fjalla One', "Calibri", Helvetica, Arial, sans-serif;
    margin:0;
}

p:not([class]) {
    text-align: justify;
}

.headline {
    height:150px;
    background:#444;
}


h1{
    
    margin-bottom:0;
    padding:10px;

    font-size:3em;
    line-height:1em;
    vertical-align: baseline;
    
    color:#fff;

}

.headline p {
    color:#fff;
    padding:5px;
}

h2{
    font-size:2em;
    margin:.5em 0 .5em 0;
    border-bottom:1px solid;
}

.profile-list, .profile-list li{
    margin:0;
    padding:0;
}

.profile-list li{
    margin-bottom:.5em;
    list-style-type: square;
}

.social-list{
    padding:0;
    margin:1em 0;
    border-top:1px solid;
}

.social-list li{
    margin:1em 0;
    list-style: none;
}

.social-list li a{
    padding:10px 0;
}


.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}

a{
    color:#0579aa;
}

a:focus {
    outline: thin dotted;
}

a:active,
a:hover {
    outline: 0;
}

img {
    border: 0;
}


.organizations{
    display:block;
    margin:1.5em 0;
    padding-top:1em;
    border-top:1px solid;
}

.logo-list{
    padding:0;
}

.logo-list li{
    float:left;
    width:25%;

    list-style: none;
    text-align: center;
}

.logo-list li:nth-child(5) {  
  clear: left;
}

.logo{
    display:block;
    margin:1em auto;
}
    

i {
    background-image: url(../images/spritesheet_v5.png);
    background-repeat: no-repeat;
    display: block;
}



.sprite-embed {
    width: 72px;
    height: 28px;
    background-position: -102px -250px;
}

.sprite-dubizzle {
    width: 75px;
    height: 39px;
    background-position: -173px -186px;
}

.sprite-transguard-group {
    width: 50px;
    height: 50px;
    background-position: -343px -10px;
}

.sprite-explorer {
    width: 72px;
    height: 45px;
    background-position: -10px -250px;
}

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


    .profile-pic{
        float:right;
        width:121px;
        height:150px;
        border-left:2em solid #fff;

        background-image: url('../images/olly-lewis-v3.jpg');
        background-size: cover;
        background-position: -40px;


    }



}


@media screen and (min-width: 640px) {

    *{
        font-size:18px;
    }

    .headline{
        height:300px;
    }

    .profile-pic{
        width:242px;
        height:300px;
    }

    .headline{
        text-align: left;
    }

    .sprite-embed {
        width: 143px;
        height: 57px;
        background-position: -173px -109px;
    }
    
    .sprite-dubizzle {
        width: 150px;
        height: 79px;
        background-position: -173px -10px;
    }
    
    .sprite-transguard-group {
        width: 110px;
        height: 110px;
        background-position: -10px -120px;
    }
    
    .sprite-explorer {
        width: 143px;
        height: 90px;
        background-position: -10px -10px;
    }


}

@media screen and (min-width: 760px) {
    *{
        font-size:24px;
    }

    body{
        max-width:760px;
    }

    .headline{
       height:470px;
    }

    .profile-pic{

        width:300px;
        height:470px;

    }

}

@media screen and (min-width: 800px) {
    li.email{
        float:left;
    }

    li.linkedin{
        float:right;
    }

}