@font-face {
    font-family: 'Bebas Neue';
    src: url('../font/BebasNeueRegular.eot');
    src: url('../font/BebasNeueRegular.eot?#iefix') format('embedded-opentype'),
    url('../font/BebasNeueRegular.woff') format('woff'),
    url('../font/BebasNeueRegular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bebas Neue Book';
    src: url('../font/BebasNeueBook.eot');
    src: url('../font/BebasNeueBook.eot?#iefix') format('embedded-opentype'),
    url('../font/BebasNeueBook.woff') format('woff'),
    url('../font/BebasNeueBook.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Nexa';
    src: url('../font/NexaBold.eot');
    src: url('../font/NexaBold.eot?#iefix') format('embedded-opentype'),
    url('../font/NexaBold.woff') format('woff'),
    url('../font/NexaBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Nexa';
    src: url('../font/NexaLight.eot');
    src: url('../font/NexaLight.eot?#iefix') format('embedded-opentype'),
    url('../font/NexaLight.woff') format('woff'),
    url('../font/NexaLight.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}


@font-face {
    font-family: 'Proxima Nova Rg';
    src: url('../font/ProximaNova-Regular.eot');
    src: local('Proxima Nova Regular'), local('ProximaNova-Regular'),
    url('../font/ProximaNova-Regular.eot?#iefix') format('embedded-opentype'),
    url('../font/ProximaNova-Regular.woff') format('woff'),
    url('../font/ProximaNova-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Proxima Nova Rg';
    src: url('../font/ProximaNova-Bold.eot');
    src: local('Proxima Nova Bold'), local('ProximaNova-Bold'),
    url('../font/ProximaNova-Bold.eot?#iefix') format('embedded-opentype'),
    url('../font/ProximaNova-Bold.woff') format('woff'),
    url('../font/ProximaNova-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}


.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

body {
    margin: 0;
    padding: 0;
    background-color: #f1f1f1;
}

.sites .container,
.misc .container {
    min-width: 320px;
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    padding-top: 20px;
    display: flex;
    flex-wrap: wrap;
}

.sites_h2,
.misc_h2 {
    width: 100%;
    margin-bottom: 40px;
    text-align: center;
    font-size: 35px;
}

.sites_div,
.misc_div {
    width: 300px;
    height: 150px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 20px 40px 20px;
    background-size: cover;
    position: relative;
}

.sites_div:hover {
    opacity: 0.7;
}

.bicycle {
    background-image: url("../img/bicycle.jpg");
    font-size: 30px;
    color: #4d4959;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.bicycle_text,
.svg-animation_text {
    background-color: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
}

.brandly {
    background-image: url("../img/brandly.jpg");
    font-family: "Bebas Neue", sans-serif;
}

.brandly-first {
    color: rgba(220, 0, 0, 0.8);
    font-size: 48px;
    font-family: "Bebas Neue Book";
}

.brandly-last {
    color: rgba(220, 0, 0, 0.8);
    font-size: 36px;
    padding-top: 4px;
}

.jwood {
    background-image: url("../img/j-wood.jpg");
    font-family: "Nexa";
    font-weight: 300;
    color: #ffffff;
    font-size: 20px;
}

.jwood_bold {
    font-family: "Nexa";
    font-weight: bold;
}

.magmagazine {
    font-family: "Georgia", serif;
    background-color: #e0e0e0;
    color: #282828;
    font-size: 30px;
    font-weight: bold;
}

.oneluke {
    background: url("../img/oneluke.png"), linear-gradient(to right top, #2c9998, #6fb88d);
    font-family: 'Raleway', sans-serif;
    color: #fefefe;
    font-weight: 100;
    font-size: 36px;
}

.oneluke:hover {
    background-image: url("../img/oneluke.png");
}

.dronezone {
    font-family: 'Proxima Nova Rg';
    font-size: 36px;
    line-height: 24px;
    font-weight: bold;
    color: #ffffff;
    padding-bottom: 10px;
    background-image: url("../img/dronezone.jpg");
}

.dronezone_light {
    font-family: 'Proxima Nova Lt';
}

.themodernist {
    background-color: #290000;
    color: #ffffff;
    font-size: 28px;
    line-height: 28px;
    font-family: 'Georgia', serif;
}

.sedona {
    background-image: url("../img/sedona.jpg");
    font-family: 'PT Sans', sans-serif;
    font-size: 50px;
    font-weight: bold;
    color: #ffffff;
}

.lookshop {
    background: #fff;
}

.musician {
    background-color: #a69e98;
    background-image: url('../img/musician.png');
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50%;
}

.pink {
    background-color: #1e2834;
    background-image: url("data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJIAAAAoCAYAAAAVKqOdAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAAB3RJTUUH4gUfFg0iL6c4+wAADphJREFUeNrtnHt0VNW9xz/nzEwyM0kIEAIhkTeBiMZG8YEoxWoVH7RUWrCWa9XaVZftlV6vFrFX46P1xcOKXu1FbX3gi2KxIK1eW6vcgoCiQKIgAipiiZICAkkmk3ns+8dvH87MMO9MJiJ+1zrr7DN7n3322ee3f+89hlKKFBgP/BwYA/QEDgD/ATyT6sYuRC2wCBgEtAGbgYeBR7txTEc0zCR1BnAX8BpwIdAf8AB9gQndPO46YCTgBnoDpwK/B5YixP4V8gwjCUe6AbhDl8PAK8AWIADcB3zQjeMuBq4F+gHlwDexCeh/gW8DHd04viMOiQhpELABKAV2AZcCL+XigSoY4rP7FtK69j3MAicA4UCIwiH9qfzlZZhedzbdDgMeB07T15cAT+ZzIo90JCKkm4DbAAVMAl7IxcNUIMg/b3mY5keWYroLwDB0BYT9HZSefRKDHrweR4k3m+4HAOsRUfdX4Jw8z+URjUQ60lh93gr8JVcPa9uwhX898SLOniWYXjemp1AObyHOXiXs//tbbP/ZLMItbdl0vwN4UZfr+EpXyiuccX4rAb6my2uBUK4epgJBDIdpc6IYmMUeWle/S6BpN4XVXlrf3Mi/HvszRmGB3SgYwlXZh37TL8L0FsZ2sRKYhuhNRwOr8jmZjUdflEnza4GHECs4a9RuWpjPV0yIeIR0LFChy//I6dMMIyERHWxS6AJT2vg/2snuZ17GUeQ5WK9QEAzTsrqRwfNvwNWvd+TtqxDCdyD6Ul4JKQOMA+YAexFr87BHPNH2dcT0DyMrvNtgOJ04ir2YxZ6Dh6PYi6NnMS2r36Xp7idib9kEfKTLZ3Tn2BO9EqK7/be+vg3hoEXdPbDOIh5Hsiyf7cD73T3AhAPvWcze55fT81vj6PGN0dbPfuBtxIqrQ9wELfkaU+2mhanEWz1wS8R1FWJdPg9MTtbvFx2xHKkIOF6X3wLau3uACWEYgKLpzsdRHYHImhX6XInoSXlFio/+EDAd+ERftyFcaUaW/X1hEEtIo5BVAvBGdw8uAZzA/wCVprsQ36aPaH54SWT9KkQsG4jHO+9I8vGbgPuRkBPAPcDNiHV8SB+HCxHBoYQ0DvkAAO909+AS4GLgSsTzjul10zRrAQf+b51V/w7iCgD4RncNMgURLAP+gHCoTO/9QiKWkCz/URvwbncPLg76YOsYPwaON0yxBD+95xmUPwDgw14ExwNZeTdzgSQE0QFchE3w6dzzhYYZU67R5few5Xi3QQWCqEAQRGm+DBFbQ3W1G4n/3Wl6Coe0vrnRaH7soAN+sz4PAEZ05ztkQhiHKxFBtNVWAQzU5dcRPSOfKCAm0OoeMZCCwf2Njo8/neko8f5XHB9UL2AmMNZ0F0zb/cRLn/S55HxMr3uNrjcRPWl9nt8lCoczgaSLSI50IuLVBkkdSYYKJJXk54iouQm4AhiNEESmcAFPElb9zCIProoygCJv3Yjq4c/d4ez1nfE3qkDw28rfsSaKmMLh7eFW3/Rwq29ScPe+T7zHDcf0FAKsQUQcekxfoYsRyZEs/agd8cXEw4nA1cBEJDgaD5uQpLf7gc/THMeVwBRM4+NQS9t1bY1bKR5Texlwd0FV38ZBD/zily0rG17YefujL7Zv3r7GKHCdoEJhn+kuOKfy2mnvO3r3ILDjM3pMGGN5zncg4q0OW1xng5HAs7qfeAgh3G4r8DEiepeSOqw0C7gK+CmwIEGbK4C5QCPiY2rOcOyliGQpAE4B9sRpMwpRDz5EDK1MwmGnAk8A+4BxKKWs4zUl2KCUckT8jlKqSCk1TykVUIci3m9KKbVFKTU5sp8DrzewrvICGmqmWsexDTVTn22omRpqqJmqGmqmqg3DJ7/SOOr7Z+9dtsJQSj0f0d/CtoYt3oaRU77TMHKKWld5wQO7HlmCUuoSpVRtzHhRSj2k79ujlCqPU5/OUa8yR5NS6sIU/X6g2z6VpM1rEX2+HOebpDpOjbj/9ARtropoMzCDvk9WSn2u7/MrpUot0dYXOE6XV8VQZiWSATAd4WAdwGLgPxHz+ji9YifplWZxs+HAH4E70S4FzzFD6XHmiYT2t0qLsBqsgqERRIhYw+kcGNx7YJivcZsCHtQr8xRgrqt/uTJLvEvD7f6F7ppBt/ee+s06JA/pVSS5LRLL9bkXtpM1U3giylcmOOYhXOVT3a5Cz8/MJP060nh2ZJuzgV9nOPZ0npENRgMvIxwvhIR49lmi7QRkwiFaP+qDpGZYRPY6cA3xnZUbELbuQBLh5iHW1kyE+G529Chi4L3X8OEVt9O6diOO0uJlzuLiZcHd+24yXM7bEDFyqeF0dHiOGQKSV3QQgV17CLf4UIHQxeWXTVSOEu8PESItQz7eBOxA7WokZFKI5J2/3MkJfChFfQFiWf4ayT64ExF7OUkI1PP4BhJO6S7UIvRQinzTacBzYHMCK77WgYRGLMzHJqKngLNI7fEOIRHtc7BXaT1wPoCzrJShC26hevEsqv80m+GL76ZwaNXcsM+/DrhVjwEVTCKuDUM5SotAOOAv9K8leoxl+no7tsc4Hx7uDoTYzsK2Pmdm391BrEJ0GJDNDSPz8C7xYOlT5cQQEdiEZE30tohBfxc7kPg3hMtkEntbpfuwrKf70FFuR4mXopNH4a4eQEFV+U8r63/UZjgc3wq3+N4L+/yE29qTExKgAiEQF8Uc4Ff65yEI0QIEgTd1uZbExkGu0YitQJ+eg+fuQb6DD+EEixFOn0+MJJqIphBBRCCEVIadyLYK+QAAP9PnVmT7UTYJbq8DN+ryMOBHMfWnAPeXnF53ffWfZvkGz5/J4PkzGfp4PcVjj0vYqWGaOPuURv50C7ZI+zGin4GtJ/WJeMd84O/67IgYS2ewHrHwQDhDPrddDUeIqAKbiJbGNjIRRbSPvn5Vn49GzEGQ1dWZcMkDiGkM8pEjfVff19d3eWqHnVR6/lhKJ4yh9ILTKKgqP7QnpQi3tePs2wtPbdT3CSM6GUhI5FxdXonsegHJs8oXIlNXSrPuJRqPYetp30OMna7GEERnrkKIaDJxiAhszy/Ix7BiVGcgFppC9I7OwI/NGUYB1RF1dfq8ldROUIwCF67+fehx1kk4e/eIrX4J+EyXLZ1vG7KFCmw/WT4wMKKcqf8nGa7G1mFnIUZEV6EK4UQWEU0C/pyosROb84A4EtsRk9+ahFxkAaxEtgg59WAOIGzfioNZFlZSuIcfRc3y32K6XPGq9yEiYIJ+6Q2ImB6g62tzOctJ4NDvCqLfNOawb4srrEX0lUWIRPlnjt+hClnYQxDdbDIprE8nortAdNDWwi5gfw4G9lFEeVic+u1p9WIYmIVJIzBWNN2DbW1aKCM/uBU4WZd/Rw43T2h8jFhML2IT0xnkbkNoBcKJLN3BQRpZpk5EkZ6GEJKpX/w0hCrNVB2kicgA8Go9GR7gPD2GXE221U8b4jfq0BMRous3AoxHfEeWqrAVyX7sCvwVMWKs592LrYx3BuUIEY1EOJED8Y8tJgXncyKbH2M3QD4JBMMtvrlmsUcBqFD44H4zs8iD4czIcVoVUb4Z2zm4AzgKW/x0FtZztiH/V5BLzI/zWymycmuJDlZvRPxoXZkvfhfC+S5E4nZvIAp5tuiNxM5GIUQ0EdH1HkUIbAmiBvni3exM0OnTB5avW7ljxv2tzvKeyjBMVDBIaH8b4UCAwb+9nqLRGcVCx+izwnZSgoi0oxC3u6Hrs4UbW5xt60Q/ifCTNNrsQdJnZ5Of/x64HPnwI5Fw0nqyT5lZjK0TnYdtINUhWR6jkcX0w3g3HySksM/PgdfexlFahKtf2V+a5jxZ0bGzeVmw+fOLQO209qSF2ztik+1ToQA7DrYRO+kMYB0iRo/R5xWZdByDCdjWUm734wmShUg2IxwhNk7Z1diHKMJrECflYiRDY08WfVlEdA7R32EGQkzjESNiPbJYouD0b/uE1rc30/zIUnzvfoBZ6MIs8hD2+esdJd7TUdyBBE5DKDAcGc/Tv2Er2AuIts4WAf+OyOJr6BwhTdfnILmLb0Xiyi7oMxfYiHCmRQgxPIWIpUwRj4jAdkKuRRbqLMQSjYqDmu9PvJYd192Hf8sOHCVeDJdzfNjfscJwOq7SguZS4E0VCk8Kt7YbmAaGy0maGIYohCAWYOyu0n9EDGgSSfZ2pcBPgDN1eZGe3CMJz2FziXOxw0SZYDKJF3Iz8n0sBfxZYjz2JmGF6XXLVmkAw3AZphlFKeHWdsxCl79ixjQ14oU5eL9WTRoYhESq++rrGzjUOaeA6xDflQNR7M7OcAKmIEl0ICz9hiwm8cuAGdh6TT1wQYb3p1p867G5cm9iYn6mtc8+An9DlOM5AGGf/9Gek8adUL1k9jv9rp4603PssNFpcKSp+qUsJ+C9JN7j3oCIziDQA3HB34id9psIZQibfRbRw9oQN0Z6PqkvH0LIorKMmVxkHsRiATbnq0WsPCCx1QYwW3UEzvLUDL5uwOzpXzfdBa8ifqV65OMtQYhgH8JNKhDH2MVEp208Tuq40NOI1fWIPv8KEalPI6LvA4StFiEhlgnAD7DdBh2IItgVutHhhGaEmF4hu9z5dGAp32cirod64LZkhLRLBYITC4dW7THdBU2I7+dcxJF4uT7aEc+3A2F3kextP+KQm5vmAH+P6FG/QeTvcD3IeoRY/frZsZyqEYlBLU/zOV92rEA+9r1d1H8ICbavQZT7W4G3knuuDWNnuNUHEvg8D4k6R5rWbkQHKsMmos8Rlncy6RORhWX6vluJ3jxYqp8TSUTbkP8YGkPXEZEv5pzrfjs62SYR5iHc3EIiUzvyvTJ5TjN2jhTAD1KbX9F7yf6IiLSxiIOqCtFrQsBuhOBWEmcvewbYi+QXPYgkhh2N/KNuoR54ExJIXkl2/pJM8DtEZHfGLREPVyOL8p4kbW5EQhLz0urxUFyOrUAnymp9DtF1PiTaUZwO1iPE9D3gnv8HW1uQIu+z0KkAAAAASUVORK5CYII=");
    background-repeat: no-repeat;
    background-size: 50%;
    background-position: 50% 45%;
}

.adaptive {
    position: relative;
    overflow: hidden;
}

.adaptive:after {
    position: absolute;
    width: 100%;
    height: 30px;
    content: "ADAPTIVE";
    background: rgba(0, 0, 0, 0.3);
    left: -35%;
    top: 15%;
    font-size: 15px;
    font-family: 'PT Sans';
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding: 7px 10px 0 0;
    transform: rotate(-45deg);
}

.misc {
    margin-top: 20px;
}

.svg-animation {
    font-size: 40px;
    font-family: 'PT Sans';
    font-weight: bold;
    color: rgba(220, 0, 0, 0.8);
    background-image: url("../img/risperidone.png");
}