/* Main font */@font-face {    font-family: 'franchiseregular';    src: url('../font/franchise-bold-webfont.eot');    src: url('../font/franchise-bold-webfont.eot?#iefix') format('embedded-opentype'),         url('../font/franchise-bold-webfont.woff') format('woff'),         url('../font/franchise-bold-webfont.ttf') format('truetype'),         url('../font/franchise-bold-webfont.svg#franchiseregular') format('svg');    font-weight: normal;    font-style: normal;}@font-face {    font-family: 'labtop_secundoregular';    src: url('../font/labtsec_-webfont.eot');    src: url('../font/labtsec_-webfont.eot?#iefix') format('embedded-opentype'),         url('../font/labtsec_-webfont.woff') format('woff'),         url('../font/labtsec_-webfont.ttf') format('truetype'),         url('../font/labtsec_-webfont.svg#labtop_secundoregular') format('svg');    font-weight: normal;    font-style: normal;}@font-face {    font-family: 'labtop_secundobold';    src: url('../font/labtsecb-webfont.eot');    src: url('../font/labtsecb-webfont.eot?#iefix') format('embedded-opentype'),         url('../font/labtsecb-webfont.woff') format('woff'),         url('../font/labtsecb-webfont.ttf') format('truetype'),         url('../font/labtsecb-webfont.svg#labtop_secundobold') format('svg');    font-weight: normal;    font-style: normal;}@font-face {    font-family: 'sosa';    src: url('../font/sosa-regular-webfont.eot');    src: url('../font/sosa-regular-webfont.eot?#iefix') format('embedded-opentype'),         url('../font/sosa-regular-webfont.woff') format('woff'),         url('../font/sosa-regular-webfont.ttf') format('truetype'),         url('../font/sosa-regular-webfont.svg#sosa') format('svg');    font-weight: normal;    font-style: normal;}/* Menu font*/[class^="icon-"], [class*=" icon-"] {    font-family: "sosa";    speak: none;    font-style: normal;    font-weight: normal;    font-variant: normal;    text-transform: none;    line-height: 1;    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}/* Reset */body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}td,tr{vertical-align:top;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400;}ol,ul{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400;}q:before,q:after{content:"";}fieldset,img,abbr,acronym{border:0;}header,nav,section,article,aside,footer {display: block}/* Clearfix */.clear {clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}.clearfix:before,.clearfix:after {content: "\0020"; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}.clearfix:after {clear: both;}.clearfix {zoom: 1;}/* General */body {    font: normal 62.5%/1.4 "Dosis", sans-serif;        color: #333;    -webkit-text-size-adjust: 100%;    -ms-text-size-adjust: 100%;}h1, h2 {    font: 5em "Labtop_secundobold", sans-serif;    font-weight: 800;    text-transform: uppercase;    padding: 1.5em 0 .5em;    letter-spacing: 0.04em;}    h1 span {        display: none;    }h3 {    font: normal 2.6em "Dosis", sans-serif;    padding: 0;}a {    color: #ffffff;    outline: none;}p {    font-size: 1.6em;}strong {    font-weight: bold;}em {    font-style: italic;}/* loading page */.loading {  position: fixed;  top: 0;  width: 100%;  height: 100%;  background: #e6c8c8;  z-index: 1032;  opacity: 1;  transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);}.loading.hide {  display: none;}.loading .loading-container {  z-index: 1033;  display: block;  position: relative;  text-align: center;  top: 50%;  left: 50%;  -webkit-transform: translate(-50%, -50%);  -moz-transform: translate(-50%, -50%);  -o-transform: translate(-50%, -50%);  -ms-transform: translate(-50%, -50%);  transform: translate(-50%, -50%);}.loading .loading-container .loader {  width: 300px;}.loading .loading-container p {  font-size: 30px;  margin-bottom: 30px;}/* Layout */.section {    height: 100vh;    min-height: 600px;}.nowrap {    white-space: nowrap;}#hello-section {    background-color: #f3f5f1;    background-image: url('../i/Jonny-Ag-Design-Logo.jpg');    background-size: cover;    background-repeat: no-repeat;    background-position: center right;    position: relative;}    #hello-section table {        height: 100%;        width: 75%;        max-width: 1081px;        margin: 0 auto;    }        #hello-section table td {            text-align: center;            vertical-align: middle;        }    #hello-section img {           width: 100vw;            height: 100%;            object-fit: cover;    }    #hello-section h1 {        padding: 0;    }        #hello-section h1 .vertical,        #hello-section h1 .ie {            display: none;        }    #hello-section p {        position: absolute;        bottom: 20%;        left: 50%;    }@media screen and (max-width: 768px) {    #hello-section {    background-color: #f3f5f1;    background-image: url('../i/Jonny-Ag-Design-Logo.jpg');    background-size: cover;    background-repeat: no-repeat;    background-position: center right 30%;    position: relative;}}    @media screen and (min-width: 2000px) {    #hello-section {    background-color: #f3f5f1;    background-image: url('../i/Jonny-Ag-Design-Logo-lg.jpg');    background-size: cover;    background-repeat: no-repeat;    background-position: center bottom;    position: relative;}    }#about-section {    height: 100%;    background-color: #ca3024;	color:#fff;}    #about-section table {        height: 100%;        width: 70%;        margin: 0 auto;    }        #about-section table td {            text-align: center;            vertical-align: middle;        }		#about-section h2 {        color: #fff;        font-size: 7.2em;        padding: 0;    }#about-section h3 a {	font-size: 0.7em;	vertical-align: middle;	color: rgba(255,255,255,1.00);	  -webkit-transition: all 0.7s ease 0s;  -moz-transition: all 0.7s ease 0s;  -ms-transition: all 0.7s ease 0s;  -o-transition: all 0.7s ease 0s;  transition: all 0.7s ease 0s;}#about-section h3 a:hover {	color: rgba(255,255,255,0.5);}#work-section {    height: 100%;    background-color: #c5c0b9;    position: relative;}    #work-section h2, p, a {        text-align: center;    }    #work-section .slides {        position: absolute;        top: 0;        height: 100%;        width: 100%;    }    #work-section .slide {        position: relative;    }        #work-section .slide .screenshots {            position: absolute;            top: 50%;            margin-top: -200px;            width: 100%;            font-size: 1.6em;            text-align: center;        }        #work-section .slide  h3 {            position: absolute;            width: 100%;            text-align: center;            bottom: 10%;            font-size: 2.6em;        }            #work-section .slide  h3 a {                color: #333;				  -webkit-transition: all 0.7s ease 0s;  -moz-transition: all 0.7s ease 0s;  -ms-transition: all 0.7s ease 0s;  -o-transition: all 0.7s ease 0s;  transition: all 0.7s ease 0s;            }            #work-section .slide h3 a:hover {                color: #eb0900;            }    #work-section .controlArrow {        bottom: 40px;    }    #work-section .fullPage-slidesNav {        bottom: 4%;    }	    #previous-slide {        position: absolute;        display: block;        bottom: 40px;        z-index: 100;        left: 5%;        padding: 0 20px;        margin-left: -20px;    }    #next-slide {        position: absolute;        display: block;        bottom: 40px;        z-index: 100;        right: 5%;        padding: 0 20px;        margin-right: -20px;    }	#contact-section {    height: 100%;    background-color: #ca3024;    color: #fff;}#contact-section h2, p, a {        text-align: left;    }    #contact-section .left {        float: left;        width: 40%;        height: 100%;    }        #contact-section .left .container {            height: 100%;            width: 80%;            margin: 0 auto;            position: relative;			text-align: left;        }            #contact-section .left .container .region,            #contact-section .left .container .country-name {                display: none;            }            #contact-section .left .container td {                vertical-align: bottom;            }                #contact-section .left .container td .icon, #contact-section .left .container td a {                    line-height: 1;					opacity:1;					text-decoration:none;					-webkit-transition: all 0.2s;					transition: all 0.2s;                }				#contact-section .left .container td a:hover {                    text-decoration:underline;                }                #contact-section .left .container td .icon .icon-mail:before {                    content: "É";                }				#contact-section .left .container td .icon .icon-fb:before {                    content: "\v";                }				            #contact-section .left .container .social {                position: absolute;                left: 0;                            }                #contact-section .left .container .social a {                    text-decoration: none;                    color: #fff;					-webkit-transition: color 0.2s;					transition: color 0.2s;                }                #contact-section .left .container .social a {                    margin-right: 15px;                }				#contact-section .left .container .social a:hover {					color:#000;				}                #contact-section .left .container .social .icon-twitter-:before {                    content: "\t";                }                #contact-section .left .container .social .icon-facebook-:before {                    content: "\v";                }    #contact-section .right {		background: #ca3024; /* Old browsers */background: -moz-linear-gradient(left, #ca3024 0%, #c5c0b9 100%); /* FF3.6-15 */background: -webkit-linear-gradient(left, #ca3024 0%,#c5c0b9 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to right, #ca3024 0%,#c5c0b9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ca3024', endColorstr='#c5c0b9',GradientType=1 ); /* IE6-9 */        float: left;        width: 60%;        height: 100%;        z-index: 9;    }        #contact-section .right-mobile {        display: none;    }        #contact-section .right-overlay {        float: left;        background-color: #f7faf6;        opacity: .2;        filter: alpha(opacity=20);        position: absolute; top: 0; right: 0;        width: 60%;        height: 100%;        z-index: 10;    }    #goodbye-section {    height: 100%;    background-color: #000;    position: relative;    color: #fff;}    #goodbye-section table {        height: 100%;        width: 100%;    }        #goodbye-section table td {            text-align: center;            vertical-align: middle;        }    #goodbye-section h2 {        color: #fff;        font-size: 7.2em;        padding: 0;    }    #goodbye-section img {        width: 539px;    }    #goodbye-section p {        position: absolute;        width: 100%;        text-align: center;        bottom: 2em;    }    #goodbye-section a {        color: #fff;    }#menu {    position: fixed;    right: 0;    top: 50%;    margin-top: -150px;    font-size: 3.5em;    z-index: 20;}    #menu.bright a {        color: #ca3024;    }    #menu.dark a {        color: #000;    }    #menu a {        display: block;        padding: 9px 24px;        margin: 5px;        text-decoration: none;        -webkit-transition:color 0.2s ease-in;        -moz-transition:color 0.2s ease-in;        -o-transition:color 0.2s ease-in;        transition:color 0.2s ease-in;    }        #menu a span {            display: inline;			font-family:'Dosis', sans-serif;			font-size:0.5em;        }		#menu a span:hover {            opacity:0.5;        }    #menu li .icon-hello:before {        content: "Ç";		opacity: 0.5;    }    #menu li.active .icon-hello:before {        content: "Ç";		opacity: 1;    }    #menu li .icon-about:before {        content: "i";		opacity: 0.5;    }    #menu li.active .icon-about:before {        content: "i";		opacity: 1;    }    #menu li .icon-work:before {        content: "7";		opacity: 0.5;    }    #menu li.active .icon-work:before {        content: "7";		opacity: 1;    }    #menu li .icon-contact:before {        content: "É";		opacity: 0.5;    }    #menu li.active .icon-contact:before {        content: "Ö";		opacity: 1;    }    #menu li .icon-goodbye:before {        content: "å";		opacity: 0.5;    }    #menu li.active .icon-goodbye:before {        content: "å";		opacity: 1;    }.icon-phone:before {    content: "\e60c";}/* Media queries */@media all and (max-width: 1023px) {   #hello-section img {        width: 100%;    }@media only screen and (orientation : portrait) {            #hello-section img {            margin-bottom: 25px;        }}@media all and (max-width: 767px) {    body,    html {        min-width: 320px;    }    h1, h2 {        font-size: 3.5em;        padding-top: 1em;    }    h3 {        font-size: 2.1em;	    }    p {        font-size: 1.4em;	    }    .section {        min-height: 410px !important;    }    #hello-section table td {        padding-bottom: 45px;    }    #hello-section img {        width: 100%;    }    #hello-section h1 .horizontal {        display: none;    }    #hello-section h1 .vertical {        display: inline;	    }        #about-section table {        width: 95%;    }        #about-section table td {            padding-bottom: 70px;        }            #about-section table td p {                display: inline;            }            #about-section table td p.last {                display: block;                margin-top: 1em;            }    #about-section img {		width:300px;		height:104px;			}	#about-section span.nowrap {        white-space: normal;    }    #work-section .fullPage-slidesNav {        top: 75%;        bottom: initial;    }    #work-section .slide h3 {        top: 70%;        bottom: initial;	font-size: 1.5em;    }    #work-section .slide .screenshots {        /*top: 18%;        margin-top: 0;*/    }        #work-section .slide .screenshots img {            width: 70%;            height: initial;        }				.controlArrow {    position: absolute;    top: 25%;		}		    #contact-section .left {        height: 50%;        width: 100%;    }        #contact-section .left .container {            width: 95%;        }            #contact-section .left .container .social {                position: initial;                font-size: 3em;                margin-top: 0.5em;		text-align: center;            }    	#contact-section .right {		background: #ca3024; /* Old browsers */background: -moz-linear-gradient(top, #ca3024 0%, #c5c0b9 100%); /* FF3.6-15 */background: -webkit-linear-gradient(top, #ca3024 0%,#c5c0b9 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom, #ca3024 0%,#c5c0b9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ca3024', endColorstr='#c5c0b9',GradientType=0 ); /* IE6-9 */		width: 100%;       height: 50%;		           }    #contact-section .right-overlay {        height: 50%;        width: 100%;        top:50%;           }    #contact-section h2 {        text-align: center;    }		    #goodbye-section h2 {        font-size: 4em;    }    #goodbye-section img {        width: 320px;    }    #contact-section .left .container .social a {        margin-right: 0;    }    #goodbye-section p {        bottom: 100px;    }    #goodbye-section a {        display: none;    }    #menu {        bottom: 0 !important;        top: auto;        left: 50%;        margin-left: -148px;    }        #menu li {            float: left;        }            #menu li a {                padding: 9px 7px;            }			#menu a span {            display: none;			}}/* Smartphones (landscape) ----------- */@media only screen and (min-width : 321px) {}@media all and (max-width: 480px) {        #hello-section img {	width: 100%;	    }             }