* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}

::selection {
    background: #99a95b; /* WebKit/Blink Browsers */
    color: white;
}






/* KVAR ATT GÖRA:
- Landscape-format
*/

/* MOBILSIDA */
@media only screen and (max-width: 460px) {
body {
height: 100%
}

    /* Övre sektion */
    header {
        width: 100%;
        height: 115px;
        background: whitesmoke;
    }

    header #wrapper {
        width: 250px;
        height: 100%;
        margin: 0 auto 0 auto;
        padding-top: 10px;
    }

    header #wrapper img {
        width: 100%;
        height: auto;
    }

    header h1 {
        display: table;
        color: #808080;
        font-family: 'Lato', sans-serif;
        font-weight: 100;
        font-size: 20px;
        margin: 0px auto 0 auto;
    }



    /* Splash-screen */
    #splash {
        width: 100%;
        height: 350px;
        /*background: #ffeda3; */
		background-image: url("https://epshumaninvest.se/wp-content/uploads/2015/01/IMG_0272.jpg");
        background-size: cover;
        background-position: center;
    }

    /* Om oss */
    #about {
        width: 100%;
        height: 340px;
        background: whitesmoke;
        box-shadow: inset 0px 11px 8px -7px #b1b1b1, inset 0px -11px 8px -7px #b1b1b1; 
    }

    #about h3 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 25px;
        margin-bottom: 10px;
    }
	
	
    #about h1 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 30px;
        margin-bottom: 10px;
    }
	
    #about ul {
        font-family: 'Lato', sans-serif;
        line-height: 22px;
    }

    #about p {
        color: black;
        font-family: 'Lato', sans-serif;
        line-height: 22px;
        font-size: 15px;
    }

    #aboutWrapper {
        width: 90%;
        margin: 0 auto 0 auto;
        padding-top: 10px;
        padding-bottom: 20px;
    }

    #knappOverlay {
        width: 100%;
        height: 335px;
        margin-top: -330px;
        position: absolute;
        z-index: 1;
    }

    #knappOverlay button {
        position: absolute;
        margin-top: 5px;
        font-family: 'Lato', sans-serif;
        font-size: 21px;
        background: #99a95b;
        color: white;
        border-radius: 5px;
        padding: 7px;
        bottom: 0;
        right: 0;
        margin: 0 45px 15px 0;
    }



    /* Navigation */
    .nav {
        width: 100%;
        height: 150px;
        overflow: hidden;
    }

    .navBG {
        width: 100%;
    }

    #arrowsWrapper {
        position: absolute;
        right: 0;
        margin-right: 15px;
    }

    #arrowsWrapper img {
        width: 80px;
        margin-top: 30px;
        margin-bottom: 30px;
    }

    #coverText {
        position: absolute;
        width: 100%;
        height: 750px;
        line-height: 125px;
    }

    #special {
	margin: 0;
	margin-top: -10px;
	margin-bottom: 50px;
        line-height: 38px;
    }

    #coverText a {
        text-decoration: none;
    }

    #coverText h1 {
        padding-left: 30px;
        font-family: 'Lato', sans-serif;
        font-weight: 100;
        color: white;
    }

    #coverText:active {
        color: gray;
    }



    /* Nedre sektion */
    footer {
        width: 100%;
        height: 50px;
        background:  #99a95b;
        position: relative;
        text-align: center;
    }

    #footerWrapper {
        width: 41vw;
        height: 100%;
        margin: 0 auto 0 auto;
        line-height: 50px;
    }

    footer h3 {
        float: left;
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 3vw;
        text-shadow: 1px 1px 1px black;
    }

    #footerWrapper img {
        vertical-align: middle;
        width: 10px;
        margin-top: -5px;
    }



    /* Dölj onödiga element */
    nav {
        display: none;
    }

    aside {
        display: none;
		height: 0;
		width: 0;
    }
	
	#asideHolder {
		display: none;
	}
	
	.fbclass {
		display: none;
	}

    #pcInfo {
        display: none;
    }

    .projektDator {
        display: none;
    }
	
	#sidNav {
		display: none;
	}
	
	#navKnapp {
		display: none;
	}
	
	#pcNav {
		display: none;
	}
	
	#asideWrapper {
		display: none;
	}
	
	#asideBig {
		display: none;
	}
	
	.overflow {
		display: none;
	}
    #footerLinks {
        display: none;
    }
	
	.container {
		display: none;
	}
}










/* KVAR ATT GÖRA:
- Landscape-format
*/

/* TABLETSIDA */
@media screen and (min-width: 460px) and (max-width: 820px) { 

    /* Övre sektion */
    header {
        width: 100%;
        height: 115px;
        background: whitesmoke;
    }

    header #wrapper {
        width: 250px;
        height: 100%;
        padding: 10px 0 0 10px;
        float: left;
    }

    header #wrapper img {
        width: 100%;
        height: auto;
    }

	
	.wpNav ul {
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0;
        list-style: none;
        line-height: 100px;

	}
	
	li.wpNav {
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 30px;
        padding-left: 20px;
        background: -webkit-linear-gradient(#767676, #525252);
        background: linear-gradient(#767676, #525252);
	}
	
	li.wpNav a{ 
		text-decoration: none;
		color: white;
		width: 100%;
		height: 100%;
		padding: 30px 500px 35px 0;
	}
	
	.wpNav:active {
		background: #3b3b3b;
	}


    #navKnapp {
        float: right;
        margin-top: 15px;
        margin-right: 40px;
    }

    nav img {
        height: 80px;
        box-shadow: 1px 2px 3px 1px #acacac;
        border-radius: 20px;
        background: white;
    }

    nav img:active {
        height: 80px;
        box-shadow: inset -2px -2px 12px 0 #747474;
        border-radius: 20px;
        background: #f2f2f2;
    }

    #sidNav {
        box-shadow: inset 7px 0 9px -7px rgba(0,0,0,0.4);
        background: #3b3b3b;
    }

    #sidNav ul {
        list-style: none;
        line-height: 100px;
        box-shadow: 0 4px 4px -2px #2c2c2c;
    }

    #sidNav ul a {
        text-decoration: none;
    }

    #sidNav ul a li {
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 30px;
        padding-left: 20px;
        background: -webkit-linear-gradient(#767676, #525252);
        background: linear-gradient(#767676, #525252);
    }

    #sidNav ul a li:active {
        background: #3b3b3b;
    }

    header h1 {
        display: table;
        color: #808080;
        font-family: 'Lato', sans-serif;
        font-weight: 100;
        font-size: 20px;
        margin: 0 auto 0 auto;
    }



    /* Splash-screen */
    #splash {
        width: 100%;
		background-image: url("https://epshumaninvest.se/wp-content/uploads/2015/01/IMG_0272.jpg");
        height: 350px;
        /*background: #ffeda3; */
        background-size: cover;
        background-position: center;
    }



    /* Om oss */
    #about {
        width: 100%;
        height: 340px;
        background: whitesmoke;
        box-shadow: inset 0px 11px 8px -7px #b1b1b1, inset 0px -11px 8px -7px #b1b1b1; 
        display: table;
        width: 70%;
        float: left;
    }

    #about h1 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 30px;
        margin-bottom: 10px;
    }

    #about p {
        color: black;
        font-family: 'Lato', sans-serif;
        line-height: 22px;
        font-size: 15px;
    }

    #about h3 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 25px;
        margin-bottom: 10px;
    }
	
    #about ul {
        font-family: 'Lato', sans-serif;
        line-height: 22px;
    }

    #aboutWrapper {
        width: 90%;
        margin: 0 auto 0 auto;
        padding-top: 10px;
        padding-bottom: 20px;
    }



    aside {
        width: 30%;
        height: auto;
        background: #99a95b;
        float: left;
    }

    aside {
        width: 30%;
        height: 100%;
        background: #99a95b;
        position: relative;
        float: left;
		overflow: hidden;
    }

    #asideBild {
        width: 90%;
        margin: 0 auto 0 auto;
    }

    #asideBild img {
        width: 100%;
        margin: 10px auto 0 auto;
    }

    #asideWrapper h1 {
        display: table;
        font-family: 'Lato', sans-serif;
        font-size: 21px;
        margin: 10px 0 0 10px;
    }    

    #asideWrapper p {
        display: table;
        font-family: 'Lato', sans-serif;
        font-size: 13px;
        margin: 10px auto 0 auto;
        width: 90%;
    }

    #asideWrapper button {
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        background: #99a95b;
        color: white;
        border-radius: 5px;
        padding: 7px;
        float: right;
        margin: 3px 15px 0 0;
    }

    #asideWrapper button:active {
        background: rgb(105, 116, 63);
    }
	
#aktuellt {
        width: 90%;
        height: auto;
        min-height: 200px;
        background: whitesmoke;
        margin: 15px auto 10px auto;
        border-radius: 5px;
        text-align: center;
    }
    
    #aktuellt h2 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 23px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    #aktuellt p {
        width: 90%;
        margin: 0 auto 0 auto;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        line-height: 22px;
    }
    
    #aktuellt button {
        font-family: 'Lato', sans-serif;
        font-size: 17px;
        background: #99a95b;
        color: white;
        border-radius: 5px;
        padding: 8px;
        margin: 10px 0 10px 0;
        margin-top: 10px;
        transition: all .2s;
    }    
    
    #aktuellt button:hover {
        background: rgb(105, 116, 63);
    }

    /* Nedre sektion */

    footer {
        width: 100%;
        height: 50px;
        background:   #525252;
        position: relative;
        text-align: center;
        float: left;
    }

    #footerWrapper {
        display: table;
        margin: 0 auto 0 auto;
        line-height: 50px;
    }

    footer h3 {
        float: left;
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        text-shadow: 1px 1px 1px black;
    }

    #footerWrapper img {
        vertical-align: middle;
        width: 30px;
        margin-top: 10px;
        margin-left: 5px;
        float: left;
    }



    /* Dölj onödiga element */    
    #knappOverlay {
        display: none;
    }

    #coverText {
        display: none;
    }

    #arrowsWrapper {
        display: none;
    }

    .nav {
        display: none;
    }

    #pcInfo {
        display: none;
    }

    #pcNav {
        display: none;
    }

    #footerLinks {
		display: none;
    }
	
	.container {
		display: none;
	}
}















/* STOR DATORSIDA */
@media screen and (min-width: 1200px) {

    body {
        background: whitesmoke;
        height: 100%;
        position: relative;
    }

    #totalWrapper {
        width: 100%;
        min-height: 100%;
        max-width: 1200px;
        margin: 0 auto 0 auto;
        box-shadow: 8px 0 10px -5px rgba(131, 131, 131, 0.7), -8px 0 10px -5px rgba(131, 131, 131, 0.7);
        position: relative;
        overflow: hidden;
    }


    /* Övre sektion */
    header {
        width: 100%;
        height: 115px;
        background: whitesmoke;
		padding-bottom: 10px;
    }

    header #wrapper {
        width: 250px;
        height: 100%;
        padding: 10px 0 0 20px;
        float: left;
    }

    header #wrapper img {
        width: 100%;
        height: auto;
    }

    header h1 {
        display: table;
        color: #808080;
        font-family: 'Lato', sans-serif;
        font-weight: 100;
        font-size: 20px;
        margin: 0 auto 0 auto;
    }




	#pcNav {
		position: absolute;
		right: 130px;
		line-height: 110px;
		display: inline;
		margin-right: 10px;
	}
	
	#pcNav ul {
        list-style: none;
        margin: 0 auto 0 auto;
	}
	
	.wpNav {
        width: 60%;
        max-width: 700px;
	}
	
	li.wpNav {
		margin-right: 20px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 12px 0 12px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	li.wpNav a{ 
	padding: 12px;
        text-decoration: none;
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 20px;
	}

    .wpNav:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	
	
		/*Projekt*/
	#pcNav #ulNav #projekt {
		height: auto;
		position: relative;
		top: -113px;
		right: 380px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 12px 0 12px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	#pcNav #ulNav #projekt a{ 
		padding: 12px;
        text-decoration: none;
		color: white;
        font-family: 'Lato', sans-serif;
        font-size: 20px;
	}

    #pcNav #ulNav #projekt:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	

       
	
	#dropDown {
		text-align: center;
		line-height: 0px;
		position:absolute;
		z-index: 100;
		left: -20px;
		top: 46px;
		height: 30px;
		display: none;
		margin: 0;
		padding:0;
	}
	
	#dropDown li {
		color: black;
		padding: 5px 0 5px 0;
		text-align: center;
		line-height: 20px;
		background-color: #99a95b;
		display: table;
		width: 180px;
		border-top: 1px solid black;
		border-left: 1px solid black;
		border-right: 1px solid black;
        text-decoration: none;
        font-family: 'Lato', sans-serif;
	}
	
	#liSpecial {
		border-radius: 0 0 5px 5px;
	}
	
	#pcNav #ulNav #projekt ul li a {
		text-align: left;
		padding-left: 0;
        font-size: 15px;
	}
	
	#pcNav #ulNav #projekt ul li:hover {
		background: rgb(105, 116, 63);
	}
	
	/*Om oss*/
	#pcNav #ulNav #omoss {
		height: auto;
		position: relative;
		top: -113px;
		right: 400px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 12px 0 12px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	#pcNav #ulNav #omoss a{ 
		padding: 12px;
        text-decoration: none;
		color: white;
        font-family: 'Lato', sans-serif;
        font-size: 20px;
	}

    #pcNav #ulNav #omoss:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	

       
	
	#aboutDrop {
		text-align: center;
		line-height: 0px;
		position:absolute;
		z-index: 100;
		left: -20px;
		top: 46px;
		height: 30px;
		display: none;
		margin: 0;
		padding:0;
	}
	
	#aboutDrop li {
		color: black;
		padding: 5px 0 5px 0;
		text-align: center;
		line-height: 20px;
		background-color: #99a95b;
		display: table;
		width: 140px;
		border-top: 1px solid black;
		border-left: 1px solid black;
		border-right: 1px solid black;
        text-decoration: none;
        font-family: 'Lato', sans-serif;
	}
	
	
	#pcNav #ulNav #aboutDrop  li a {
		text-align: left;
		padding-left: 0;
        font-size: 15px;
	}
	
	#pcNav #ulNav #aboutDrop li:hover {
		background: rgb(105, 116, 63);
	}
	/* Utbildning */
	#pcNav #ulNav #utbildning {
		height: auto;
		position: relative;
		top: -114px;
		right: -475px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 12px 0 12px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	#pcNav #ulNav #utbildning a{ 
		padding: 12px;
        text-decoration: none;
		color: white;
        font-family: 'Lato', sans-serif;
        font-size: 20px;
	}

    #pcNav #ulNav #utbildning:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	

       
	
	#utbildningDrop {
		text-align: center;
		line-height: 0px;
		position:absolute;
		z-index: 100;
		left: -10px;
		top: 46px;
		height: 30px;
		display: none;
		margin: 0;
		padding:0;
	}
	
	#utbildningDrop li {
		color: black;
		padding: 5px 0 5px 0;
		text-align: center;
		line-height: 20px;
		background-color: #99a95b;
		display: table;
		width: 140px;
		border-top: 1px solid black;
		border-left: 1px solid black;
		border-right: 1px solid black;
        text-decoration: none;
        font-family: 'Lato', sans-serif;
	}
	
	
	#pcNav #ulNav #utbildningDrop  li a {
		text-align: left;
		padding-left: 0;
        font-size: 15px;
	}
	
	#pcNav #ulNav #utbildningDrop li:hover {
		background: rgb(105, 116, 63);
	}


	


    /* Splash-screen */
    #splash {
        background: #535353;
    }
	
    #splashOverlays {
        width: 100%;
        -webkit-filter: blur(10px) brightness(0.5);
        -moz-filter: blur(10px) brightness(0.5);
        -o-filter: blur(10px) brightness(0.5);
        -ms-filter: blur(10px) brightness(0.5);
        filter: blur(10px) brightness(0.5);
        background-image: url(../images/_K6A9717.jpg);
        position: absolute;
        height: 100%;
    }
    
    .bild {
        width: 1000px;
        height: 500px;
    }

    #bild1 {
        background-image: url(../images/_K6A9717.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild2 {
        background-image: url(https://epshumaninvest.se/wp-content/uploads/2015/01/IMG_3293-e1422988270709.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild3 {
        background-image: url(../images/_K6A9826.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild4 {
        background-image: url(https://epshumaninvest.se/wp-content/uploads/2015/01/IMG_0272.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild5 {
        background-image: url(../images/Hastutbildning105.JPG);
        background-size: cover;
        background-position: center;
    }



    .content h1 {
        font-size:48px;
        color: #000;
        text-shadow:0px 1px 1px #f4f4f4;
        text-align:center;
        padding: 60px 0 30px;	
    }

    /* LAYOUT */
    .container {
        margin: 0 auto 0 auto;
        overflow: hidden;
        width: 1000px;
    }

    /* CONTENT SLIDER */
    #content-slider {
        width:100%;
        height:500px;
        margin: 0 auto 0 auto;
    }

    /* SLIDER */
    #slider {
        background: #000;
        height: 500px;
        width:1000px;
        margin: 0 auto 0;
        overflow: visible;
        position: relative;
    }

    #mask {
        overflow: hidden;
        height: 500px;
    }

    #slider ul {
        margin: 0;
        padding: 0;
        position: relative;
    }

    #slider li {
        width: 1000px;
        height: 500px;
        position:absolute;
        left:-1000px;
        list-style:none;
    }

    #slider li.firstanimation {
        -moz-animation:cycle 35s linear infinite;	
        -webkit-animation:cycle 35s linear infinite;		
    }
    #slider li.secondanimation {
        -moz-animation:cycletwo 35s linear infinite;
        -webkit-animation:cycletwo 35s linear infinite;		
    }
    #slider li.thirdanimation {
        -moz-animation:cyclethree 35s linear infinite;
        -webkit-animation:cyclethree 35s linear infinite;		
    }
    #slider li.fourthanimation {
        -moz-animation:cyclefour 35s linear infinite;
        -webkit-animation:cyclefour 35s linear infinite;		
    }
    #slider li.fifthanimation {
        -moz-animation:cyclefive 35s linear infinite;
        -webkit-animation:cyclefive 35s linear infinite;		
    }

    .tooltip {
        background:rgba(0,0,0,0.7);
        width: 350px;
        height: 170px;
        position:relative;
        bottom: 170px;
        left:-350px;
        -moz-transition:all 0.3s ease-in-out;
        -webkit-transition:all 0.3s ease-in-out; 
    }

    .tooltipWrapper {
        padding: 15px 10px 0 20px;
        overflow: hidden;
    }

    .tooltipWrapper h1 {
	margin: 0;
        color: #fff;
        max-height: 25px;
        overflow: hidden;
        font-size: 25px;
        font-weight: 300;
        font-family: 'Lato', sans-serif;
        padding-bottom: 10px;
    }

    .tooltipWrapper p {
        height: 60px;
        color: #bcbcbc;
        overflow: hidden;
        font-size: 14px;
        line-height: 16.5px;
        font-family: 'Lato', sans-serif;
    }



    #slider li#first:hover .tooltip, 
    #slider li#second:hover .tooltip, 
    #slider li#third:hover .tooltip, 
    #slider li#fourth:hover .tooltip, 
    #slider li#fifth:hover .tooltip {
        left:0px;
    }

    #slider:hover li, 
    #slider:hover .progress-bar {
        -moz-animation-play-state:paused;
        -webkit-animation-play-state:paused;
    }

    /* PROGRESS BAR */
    .progress-bar { 
        position: relative;
        top:-5px;
        width: 1000px; 
        height: 5px;
        background: rgba(255, 255, 255, 0.9);
        -moz-animation:fullexpand 35s ease-out infinite;
        -webkit-animation:fullexpand 35s ease-out infinite;
    }



    #about ul {
        font-family: 'Lato', sans-serif;
        line-height: 24px;
    }
    /* Om oss */
    #about {
        height: 100%;
        background: whitesmoke;
        box-shadow: inset 0px 11px 8px -7px #b1b1b1, inset 0px -11px 8px -7px #b1b1b1; 
        width: 70%;
        float: left;
        position: relative;
    }
	
	  #about h3 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 25px;
        margin-bottom: 10px;
    }

    #about h1 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 28px;
        margin-bottom: 10px;
    }
	

    #about p {
        color: black;
        font-family: 'Lato', sans-serif;
        line-height: 24px;
        font-size: 15px;
    }

    #aboutWrapper {
        width: 90%;
        height: 100%;
        position: relative;
        margin: 0 auto 0 auto;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #pcInfo {
        width: 100%;
        padding-top: 20px;
    }

    #pcInfo h1 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 22px;
        margin-bottom: 10px;
    }



    #pcInfo p {
        font-family: 'Lato', sans-serif;
        padding-bottom: 20px;
        line-height: 22px;
    }
	
	#pcInfo ul, li {
		list-style: auto;
	}



    aside {
        width: 30%;
        height: 100%;
        background: #99a95b;
        position: relative;
        float: left;
    }



	#asideBig {
		overflow: hidden
		background-color: #99a95b;
	}
	
	#aktuellt {
        width: 90%;
        height: auto;
        min-height: 200px;
        background: whitesmoke;
        margin: 15px auto 10px auto;
        border-radius: 5px;
        text-align: center;
    }
    
    #aktuellt h2 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 23px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    #aktuellt p {
        width: 90%;
        margin: 0 auto 0 auto;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        line-height: 22px;
    }
    
    #aktuellt button {
        font-family: 'Lato', sans-serif;
        font-size: 17px;
        background: #99a95b;
        color: white;
        border-radius: 5px;
        padding: 8px;
        margin: 10px 0 0 0;
        margin-top: 10px;
        transition: all .2s;
    }    
    
    #aktuellt button:hover {
        background: rgb(105, 116, 63);
    }




    /* Nedre sektion */
    footer {
        width: 100%;
        height: 120px;
        background:   #525252;
        position: relative;
        text-align: center;
        float: left;
    }
    
    #footerLinks {
        margin-top: 30px;
    }
    
    #footerLinks a {
        text-decoration: none;
        color: #bcbcbc;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        margin-left: 10px;
        margin-right: 10px;
        transition: all .1s;
    }
    
    #footerLinks a:hover {
        color: white;
    }

    #footerWrapper {
        display: table;
        margin: 20px auto 0 auto;
        line-height: 50px;
        padding-left: 10px;
        padding-right: 10px;
    }

    footer h3 {
        float: left;
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        text-shadow: 1px 1px 1px black;
    }

    #footerWrapper img {
        vertical-align: middle;
        width: 30px;
        margin-top: 10px;
        margin-left: 5px;
        padding-left: 10px;
        padding-right: 10px;
        float: left;
    }



    /* Dölj onödiga element */    
    #knappOverlay {
        display: none;
    }

    #coverText {
        display: none;
    }

    #arrowsWrapper {
        display: none;
    }

    .nav {
        display: none;
    }
	
	#mobilInfo {
		display: none;
	}

    #sidNav {
        display: none;
    }

    #navKnapp {
        display: none;
    }

    #asideWrapper {
	display: none;
	}

}



/* LITEN DATORSIDA */
@media screen and (min-width: 820px) and (max-width: 1200px) {

    body {
        background: whitesmoke;
        height: 100%;
        position: relative;
    }


    #totalWrapper {
        width: 100%;
        min-height: 100%;
        max-width: 1200px;
        margin: 0 auto 0 auto;
        box-shadow: 8px 0 10px -5px rgba(131, 131, 131, 0.7), -8px 0 10px -5px rgba(131, 131, 131, 0.7);
        position: relative;
        overflow: hidden;
    }


    /* Övre sektion */
    header {
        width: 100%;
        height: 115px;
        background: whitesmoke;
		padding-bottom: 10px;
    }

    header #wrapper {
        width: 250px;
        height: 100%;
        padding: 10px 0 0 20px;
        float: left;
    }

    header #wrapper img {
        width: 100%;
        height: auto;
    }

    header h1 {
        display: table;
        color: #808080;
        font-family: 'Lato', sans-serif;
        font-weight: 100;
        font-size: 20px;
        margin: 0 auto 0 auto;
    }



	#pcNav {
		position: absolute;
		right: 80px;
		float: rigth;
		line-height: 115px;
		margin-right: 15px;
	}
	
	#ulNav{
        list-style: none;
        margin: 0 auto 0 auto;
	}
	
	.wpNav {
        width: 60%;
        max-width: 700px;
	}
	
	li.wpNav {
        display: inline;
        background: #99a95b;
        text-align: center;
        padding: 7px;
        margin-left: 13px;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	li.wpNav a{ 
        text-decoration: none;
        color: white;
        font-family: 'Lato', sans-serif;
		font-size: 12px;
	}

    .wpNav:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	
	#pcNav #ulNav #projekt {
		height: auto;
		position: relative;
		top: -115px;
		right: 225px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 7px 0 7px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	#pcNav #ulNav #projekt a{ 
		padding: 7px;
        text-decoration: none;
		color: white;
        font-family: 'Lato', sans-serif;
        font-size: 12px;
	}

    #pcNav #ulNav #projekt:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	

       
	
	#dropDown {
		text-align: center;
		line-height: 0px;
		position:absolute;
		z-index: 100;
		left: -20px;
		top: 31px;
		height: 30px;
		display: none;
		margin: 0;
		padding:0;
	}
	
	#dropDown li {
		color: black;
		padding: 5px 0 5px 0;
		text-align: center;
		line-height: 20px;
		background-color: #99a95b;
		display: table;
		width: 140px;
		border-top: 1px solid black;
		border-left: 1px solid black;
		border-right: 1px solid black;
        text-decoration: none;
        font-family: 'Lato', sans-serif;
	}
	
	#liSpecial {
		border-radius: 0 0 5px 5px;
	}
	
	#pcNav #ulNav #projekt ul li a {
		text-align: left;
		padding-left: 0;
        font-size: 12px;
	}
	
	#pcNav #ulNav #projekt ul li:hover {
		background: rgb(105, 116, 63);
	}
	
	/*Om oss*/
	#pcNav #ulNav #omoss {
		height: auto;
		position: relative;
		top: -115px;
		right: 240px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 7px 0 7px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	#pcNav #ulNav #omoss a{ 
		padding: 7px;
        text-decoration: none;
		color: white;
        font-family: 'Lato', sans-serif;
        font-size: 12px;
	}

    #pcNav #ulNav #omoss:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	

       
	
	#aboutDrop {
		text-align: center;
		line-height: 0px;
		position:absolute;
		z-index: 100;
		left: -20px;
		top: 31px;
		height: 30px;
		display: none;
		margin: 0;
		padding:0;
	}
	
	#aboutDrop li {
		color: black;
		padding: 5px 0 5px 0;
		text-align: center;
		line-height: 20px;
		background-color: #99a95b;
		display: table;
		width: 140px;
		border-top: 1px solid black;
		border-left: 1px solid black;
		border-right: 1px solid black;
        text-decoration: none;
        font-family: 'Lato', sans-serif;
	}
	
	
	#pcNav #ulNav #aboutDrop  li a {
		text-align: left;
		padding-left: 0;
        font-size: 12px;
	}
	
	#pcNav #ulNav #aboutDrop li:hover {
		background: rgb(105, 116, 63);
	}
	
	/* Utbildning */
	#pcNav #ulNav #utbildning {
		height: auto;
		position: relative;
		top: -116px;
		right: -303px;
        display: inline;
        background: #99a95b;
        text-align: center;
		padding: 7px 0 7px 0;
        border-radius: 5px;
        box-shadow: 1px 1px 2px 2px rgba(0, 0, 0, 0.5);
        transition: all .2s;
	}
	
	#pcNav #ulNav #utbildning a{ 
		padding: 7px;
        text-decoration: none;
		color: white;
        font-family: 'Lato', sans-serif;
        font-size: 12px;
	}

    #pcNav #ulNav #utbildning:hover {
        background: rgb(105, 116, 63);
        box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0);
    }
	

       
	
	#utbildningDrop {
		text-align: center;
		line-height: 0px;
		position:absolute;
		z-index: 100;
		left: -50px;
		top: 31px;
		height: 30px;
		display: none;
		margin: 0;
		padding:0;
	}
	
	#utbildningDrop li {
		color: black;
		padding: 5px 0 5px 0;
		text-align: center;
		line-height: 20px;
		background-color: #99a95b;
		display: table;
		width: 140px;
		border-top: 1px solid black;
		border-left: 1px solid black;
		border-right: 1px solid black;
        text-decoration: none;
        font-family: 'Lato', sans-serif;
	}
	
	
	#pcNav #ulNav #utbildningDrop  li a {
		text-align: left;
		padding-left: 0;
        font-size: 12px;
	}
	
	#pcNav #ulNav #utbildningDrop li:hover {
		background: rgb(105, 116, 63);
	}
	/****************************************************************************************************************************************/



    /* Splash-screen */
    #splash {
        background: #535353;
    }
	
    #splashOverlays {
        width: 100%;
        -webkit-filter: blur(10px) brightness(0.5);
        -moz-filter: blur(10px) brightness(0.5);
        -o-filter: blur(10px) brightness(0.5);
        -ms-filter: blur(10px) brightness(0.5);
        filter: blur(10px) brightness(0.5);
        background-image: url(../images/_K6A9717.jpg);
        position: absolute;
        height: 100%;
    }
    
    .bild {
        width: 100%;
        height: 500px;
    }

    #bild1 {
        background-image: url(../images/_K6A9717.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild2 {
        background-image: url(https://epshumaninvest.se/wp-content/uploads/2015/01/IMG_3293-e1422988270709.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild3 {
        background-image: url(../images/_K6A9826.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild4 {
        background-image: url(https://epshumaninvest.se/wp-content/uploads/2015/01/IMG_0272.jpg);
        background-size: cover;
        background-position: center;
    }

    #bild5 {
        background-image: url(../images/Hastutbildning105.JPG);
        background-size: cover;
        background-position: center;
    }



    .content h1 {
        font-size: 48px;
        color: #000;
        text-shadow:0px 1px 1px #f4f4f4;
        text-align:center;
        padding: 60px 0 30px;	
    }

    /* LAYOUT */
    .container {
        margin: 0 auto 0 auto;
        overflow: hidden;
        width: 80%;
    }

    /* CONTENT SLIDER */
    #content-slider {
        width: 100%;
        margin: 0 auto 0 auto;
    }

    /* SLIDER */
    #slider {
        background: #000;
        box-shadow: 1px 1px 5px rgba(0,0,0,0.7);
        height: 500px;
        width: 100%;
        margin: 0 auto 0;
        overflow: visible;
        position: relative;
    }

    #mask {
        overflow: hidden;
        width: 100%;
        height: 500px;
    }

    #slider ul {
        margin: 0;
        padding: 0;
        position: relative;
    }

    #slider li {
        width: 100%;
        height: 500px;
        position:absolute;
        left:-100%;
        list-style:none;
    }

    #slider li.firstanimation {
        -moz-animation:cycle 35s linear infinite;	
        -webkit-animation:cycle 35s linear infinite;		
    }
    #slider li.secondanimation {
        -moz-animation:cycletwo 35s linear infinite;
        -webkit-animation:cycletwo 35s linear infinite;		
    }
    #slider li.thirdanimation {
        -moz-animation:cyclethree 35s linear infinite;
        -webkit-animation:cyclethree 35s linear infinite;		
    }
    #slider li.fourthanimation {
        -moz-animation:cyclefour 35s linear infinite;
        -webkit-animation:cyclefour 35s linear infinite;		
    }
    #slider li.fifthanimation {
        -moz-animation:cyclefive 35s linear infinite;
        -webkit-animation:cyclefive 35s linear infinite;		
    }

    .tooltip {
        background:rgba(0,0,0,0.7);
        width: 350px;
        height: 170px;
        position:relative;
        bottom: 170px;
        left:-350px;
        -moz-transition:all 0.3s ease-in-out;
        -webkit-transition:all 0.3s ease-in-out; 
    }

    .tooltipWrapper {
        padding: 15px 10px 0 20px;
        overflow: hidden;
    }

    .tooltipWrapper h1 {
		margin: 0;
        color: #fff;
        max-height: 25px;
        overflow: hidden;
        font-size: 25px;
        font-weight: 300;
        font-family: 'Lato', sans-serif;
        padding-bottom: 15px;
    }

    .tooltipWrapper p {
        height: 55px;
        color: #bcbcbc;
        overflow: hidden;
        font-size: 14px;
        line-height: 16.5px;
        font-family: 'Lato', sans-serif;
    }



    #slider li#first:hover .tooltip, 
    #slider li#second:hover .tooltip, 
    #slider li#third:hover .tooltip, 
    #slider li#fourth:hover .tooltip, 
    #slider li#fifth:hover .tooltip {
        left:0px;
    }

    #slider:hover li, 
    #slider:hover .progress-bar {
        -moz-animation-play-state:paused;
        -webkit-animation-play-state:paused;
    }

    /* PROGRESS BAR */
    .progress-bar { 
        position: relative;
        top:-5px;
        width: 100%; 
        height: 5px;
        background: rgba(255, 255, 255, 0.9);
        -moz-animation:fullexpand 35s ease-out infinite;
        -webkit-animation:fullexpand 35s ease-out infinite;
    }



    /* Om oss */
    #about ul {
        font-family: 'Lato', sans-serif;
        line-height: 24px;
    }
	
    #about ul {
        font-family: 'Lato', sans-serif;
        line-height: 24px;
    }
    /* Om oss */
    #about {
        height: 100%;
        background: whitesmoke;
        box-shadow: inset 0px 11px 8px -7px #b1b1b1, inset 0px -11px 8px -7px #b1b1b1; 
        width: 70%;
        float: left;
        position: relative;
    }
	
	#about h3 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 22px;
        margin-bottom: 10px;
    }

    #about h1 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 22px;
        margin-bottom: 10px;
    }
	

    #about p {
        color: black;
        font-family: 'Lato', sans-serif;
        line-height: 22px;
        font-size: 15px;
    }

    #aboutWrapper {
        width: 90%;
        height: 100%;
        position: relative;
        margin: 0 auto 0 auto;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    #pcInfo {
        width: 100%;
        padding-top: 20px;
    }

    #pcInfo h1 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 22px;
        margin-bottom: 10px;
    }

    #pcInfo ul {
        padding-bottom: 20px;
    }

    #pcInfo ul li {
        font-family: 'Lato', sans-serif;
        line-height: 22px;
        font-size: 15px;
    }

    #pcInfo p {
        font-family: 'Lato', sans-serif;
        padding-bottom: 20px;
        line-height: 22px;
    }



    aside {
        width: 30%;
        height: 100%;
        background: #99a95b;
        position: relative;
        float: left;
		overflow: hidden;
    }

    #asideWrapper {
        width: 90%;
        height: auto;
        background: whitesmoke;
        margin: 10px auto 0 auto;
        padding-bottom: 45px;
        border-radius: 5px;
    }

    #asideBild {
        width: 90%;
        margin: 0 auto 0 auto;
    }

    #asideBild img {
        width: 100%;
        margin: 10px auto 0 auto;
    }

    #asideWrapper h1 {
        display: table;
        font-family: 'Lato', sans-serif;
        font-size: 21px;
        margin: 10px 0 0 10px;
    }    

    #asideWrapper p {
        display: table;
        font-family: 'Lato', sans-serif;
        font-size: 13px;
        margin: 10px auto 0 auto;
        width: 90%;
    }

    #asideWrapper button {
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        background: #99a95b;
        color: white;
        border-radius: 5px;
        padding: 7px;
        float: right;
        margin: 3px 15px 0 0;
    }

    #asideWrapper button:active {
        background: rgb(105, 116, 63);
    }
	
	#aktuellt {
        width: 90%;
        height: auto;
        min-height: 200px;
        background: whitesmoke;
        margin: 15px auto 10px auto;
        border-radius: 5px;
        text-align: center;
    }
    
    #aktuellt h2 {
        color: #99a95b;
        font-family: 'Lato', sans-serif;
        font-size: 23px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    
    #aktuellt p {
        width: 90%;
        margin: 0 auto 0 auto;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        line-height: 22px;
    }
    
    #aktuellt button {
        font-family: 'Lato', sans-serif;
        font-size: 17px;
        background: #99a95b;
        color: white;
        border-radius: 5px;
        padding: 8px;
        margin: 10px 0 20px 0;
        transition: all .2s;
    }    
    
    #aktuellt button:hover {
        background: rgb(105, 116, 63);
    }




    /* Nedre sektion */
    footer {
        width: 100%;
        height: 120px;
        background:   #525252;
        position: relative;
        text-align: center;
        float: left;
    }
    
    #footerLinks {
        margin-top: 30px;
    }
    
    #footerLinks a {
        text-decoration: none;
        color: #bcbcbc;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        margin-left: 10px;
        margin-right: 10px;
        transition: all .1s;
    }
    
    #footerLinks a:hover {
        color: white;
    }

    #footerWrapper {
        display: table;
        margin: 20px auto 0 auto;
        line-height: 50px;
        padding-left: 10px;
        padding-right: 10px;
    }

    footer h3 {
        float: left;
        color: white;
        font-family: 'Lato', sans-serif;
        font-size: 15px;
        text-shadow: 1px 1px 1px black;
    }

    #footerWrapper img {
        vertical-align: middle;
        width: 30px;
        margin-top: 10px;
        margin-left: 5px;
        padding-left: 10px;
        padding-right: 10px;
        float: left;
    }



    /* Dölj onödiga element */    
    #knappOverlay {
        display: none;
    }

    #coverText {
        display: none;
    }

    #arrowsWrapper {
        display: none;
    }

    .nav {
        display: none;
    }

    #sidNav {
        display: none;
    }
	
	#mobilInfo {
		display: none;
	}

    #navKnapp {
        display: none;
    }

    #asideWrapper {
	display: none;
	}

}







/* SPARA FÖR JOBBFLIK
#otherInfo {
width: 100%;
padding-top: 10px;
box-shadow: inset 0px 11px 8px -7px #b1b1b1, inset 0px -11px 8px -7px #b1b1b1; 
}

#otherInfo h1 {
color: #99a95b;
font-family: 'Lato', sans-serif;
font-size: 25px;
margin-bottom: 10px;
}

#otherWrapper {
width: 85%;
margin: 0 auto 0 auto;
padding-top: 10px;
}

#otherInfo ul {
padding-bottom: 20px;
}

#otherInfo ul li {
font-family: 'Lato', sans-serif;
line-height: 24px
}

#otherInfo p {
font-family: 'Lato', sans-serif;
padding-bottom: 20px;
line-height: 22px;
}

*/