/*
Theme Name: Raumposition
Author: Emanuel Pesendorfer
Author URI: http://emanuel-pesendorfer.at/
Description: www.raumposition.at
Version: 1.0
License: GNU General Public License
License URI: license.txt
*/

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
:focus {/* remember to define focus styles! */
	outline: 0;
	color: #1982d1;
	}

html, body{
    height: 101%;
    color: #000;
    scroll-behavior: smooth;
}
	
.addClear:after{
	content: ".";
	visibility: hidden;
	display: block;
	clear: both;
	height: 1px;
}

a:link{color: #181818; text-decoration: none;}
a:visited{color: #181818;}
a:hover{color: #181818; text-decoration: underline;}
a:active {color: #181818;} 

em{font-style: italic !important;}
strong{font-weight: bold;}
small{font-size: 60%;}

.left{float: left;}
.right{float: right;}

html, button, input, select, textarea,
.pure-g [class *= "pure-u"] {
    /* Set your content font stack here: */
    font-family: Radikal-Light, sans-serif; 
    font-size: 14px;
    line-height: 130%;
    color: #181818;
}
.wrapper{
    padding: 40px 30px 30px;
}

.center{
    max-width: 1335px;
    margin: 0 auto; 
}

/* NAVIGATION */
header nav li{
    float: left;
    list-style-type: none;
    margin: 64px 0 0 0;
}
header nav li a{
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 23px 0 0;
    padding: 5px 0 2px 0;
    text-decoration: none !important;
}
header nav li a:hover, .current-menu-item a{border-bottom: 1px solid #000;}

.mobileNavCurrent{display: none;}

/* CONTENT */

main{
    color: #000;
    margin: 18px auto 15px auto !important;
    background: linear-gradient(to bottom,  #e4d3dc 0%, #cadaf1 100%); 
}

.content>ul{
    padding: 10px 40px;
    margin-bottom: 25px;
}
.content>ul li{
    margin-bottom: 10px;
}
.content>ul a, .content>p a{
    text-decoration: underline;
}
.content>h2{
    margin: 30px 0 15px 0;
    text-transform: uppercase;
}
.content .pixelmate-dse{
    display: inline-block;
    padding: 20px;
    background: #fff;
    border-radius: 5px;
    width: auto;
}

.pixelmate-dse-table th{
   text-align: left;
   padding: 10px;
   color: #666;
}

.pixelmate-dse-table td{
   padding: 5px 10px;
}

/* BACKGORUNDS */

.leistungen main{
    background: linear-gradient(180deg, #D3E7B2 0%, #B5D5C7 100%);
}
.projekte main{ 
    background: linear-gradient(180deg, #C5DBD2 0%, #D1C9E1 100%);
}
.publikationen main{ 
    background: linear-gradient(180deg, #D1C9E1 0%, #E3EBF0 100%);  
}
.akutell main{ 
    background: linear-gradient(180deg, #E4EBEF 0%, #E1D6DE 100%);
}
.team main{
    background: linear-gradient(180deg, #E0D4DC 0%, #CDDAEE 100%);
}
.kontakt main{
    background: linear-gradient(180deg, #CDDAEE 0%, #D3E7B2 100%);
}
.austausch main{
    background: linear-gradient(to bottom,  #e4d3dc 0%,#cadaf1 100%);
}


.content{
    max-width: 975px;
    padding: 90px 125px;
}

h1, h2, h3, strong{ 
    font-family: Radikal-Bold; 
    font-weight: normal; 
    font-style: normal; 
    color: #000;
}

h1{font-size: 36px;line-height: 46px;}

h1+h1{
    margin-top: 20px;
}

.page p{
    margin: 0 0 20px 0;
}

/*
.position main, main.position{
    height: 900px;
    background-size: contain;
    background-repeat: no-repeat !important;
}
*/

/* homepage (new 2020) */

@keyframes fadeIn{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}

main.start{
    opacity: 0;
    background: none;
    animation: fadeIn 1800ms 500ms ease forwards;
}

main.start #slides{
    position: relative;
    box-sizing: border-box;
    height: 900px;
    background-size: contain;
    background-repeat: no-repeat !important;
    transition: background 2200ms ease;
    padding: 90px 125px 0 125px;
}

main.start #slides p{
    display: block;
    position: absolute;
    bottom: 35px;
    right: 35px;
}

main.start #slides p a{
    background: #333033;
    color: #fff;
    font-size: 20px;
    font-family: Radikal-Bold;
    padding: 5px 10px;
}

main.start .copyright{
    margin-top: 10px;
}

main.start h2{
    display: block;
    border-bottom: 3px solid #000;
    text-transform: uppercase;
    margin: 60px 0 15px 0;
    letter-spacing: 1px;
}

main.start .content{
    padding-top: 0;
}

main.start .content h1{
    margin-top: 100px;
}

main.start .content figure{
    margin: 0;
}
main.start .content figcaption{
    text-align: right;
    font-size: 11px;
    margin-bottom: 20px;
}


main.start .content p{
    line-height: 155%;
}

main.start .content>p{
    text-align: right;
}

main.start .content>p>a{
    font-size: 22px;
    font-family: Radikal-Bold;
    background: url('images/arrow-radikal.svg') left center no-repeat;
    background-size: 16px auto;
    padding-left: 25px;
}

main.start .content h3{
    font-size: 16px;
    line-height: 20px;
    font-family: Radikal-Bold;
    margin: 10px 0 20px 0;
}

main.start a img{
    transition: all 500ms ease;
}

main.start a:hover>img{
    transform: translateY(-2px);
}


/* Leistungen */

.leistungen h1+h1{
    margin-bottom: 80px;
}

.leistungen .content figure{
    margin: 30px 0 0 0;
}

.leistungen .content h4{
    font-size: 16px;
    line-height: 20px;
    font-family: Radikal-Bold;
    margin: 10px 0 20px 0;
}

.leistungen .content li{
    list-style-type: disc;
    margin: 12px 0 12px 15px;
}

/* Aktuell */

@media screen and (min-width: 568px){
    .aktuell .pure-g .pure-u-1:last-child, .publikationen .pure-g .pure-u-1:last-child{
        box-sizing: border-box;
        padding-left: 20px;
    }
}
.aktuell h1, .publikationen h1{
    margin-bottom: 40px;
}
.aktuell h3, .publikationen h3{
    margin-bottom: 20px;
    padding-left: 10px;
}
.aktuell p, .publikationen p{
    padding-left: 10px;
}
.aktuell article, .publikationen article{
    border-bottom: 1px solid #000;
    padding: 30px 0 30px 0;
    margin: 0 0 0px 0 ;
}
.aktuell article .copyright, .publikationen article .copyright{
    float: left;
}
.aktuell article img, .publikationen article img{
    margin-bottom: 3px;
}

.profil .page strong{text-transform: uppercase;}

.profil .content ul li{
    margin: 0 0 8px 12px;
}

/* Team */

.team .content>h2, .projekte h2{
    display: block;
    border-bottom: 3px solid #000;
    text-transform: uppercase;
    margin: 60px 0 15px 0;
    letter-spacing: 1px;
}

.team .content .team-inner-1{
    padding-right: 12px;
}
.team .content .team-inner-2{
    padding-right: 6px;
    padding-left: 6px;
}
.team .content .team-inner-3{
    padding-left: 12px;
}

.team .team-inner{
    padding-bottom: 45px;
}

.team .team-inner figure{
    margin: 0;
}
.team .team-inner img{
    max-width: 100%;
    margin-bottom: 30px;
}

.team .content h3, .team h4{
    text-transform: uppercase;
}

.team .content h3, .team h4{
    text-transform: uppercase;
}

.team .content a{
    display: block;
    /*text-transform: uppercase;*/
    margin-bottom: 20px;
}

.team .content p{
    line-height: 20px;
}

.team .subteam h2{
    margin-top: 30px;
}

.team .subteam{
    margin-bottom: 75px;
}

/* Projekte */

.projekte article{
    padding: 50px 0 25px 0;
    border-bottom: 1px solid rgba(0,0,0,1);
}

.projekte .content{
    max-width: 1065px;
}

.projekte h2{
    margin-bottom: 30px;
}

.projekte h3, .projekte h5{
    text-transform: uppercase;
}

.projekte p.padTop{
    padding-top: 18px;
}

.projekte .content>p{
    margin-top: -15px;
    margin-bottom: 60px;
}

.projekte .projekt p a, .projekte .referenz p a{
    text-decoration: underline;
}

.projekte h3, .projekte h5, .projekte p{
    padding-right: 15px;
}

.projekte .owl-carousel{
    max-width: 550px;
}

.copyright{
    float: right;
    font-size: 10px;
    opacity: .8;
}

.projekte .data{
    max-width: 140px;
    padding: 0 0 0 15px;
    height: inherit;
}

.projekte .data p{
    font-size: 10px;
    line-height: 18px;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 0;
    margin-top: -18px;
}

.projekte .data p strong{
    white-space:pre;
    margin-right: 3px;
    letter-spacing: 0.07em;
}
.projekte .data p strong:before{content:'\A';}

.owl-pagination{text-align: left; padding: 0;}
.owl-page span{
    background: #000 !important; 
    margin: 0 10px 0 0 !important; 
    width: 7px !important; 
    height: 7px !important;
    }
.owl-page.active span{
    background: #fff !important; 
    }

.owl-prev, .owl-next{
    position: absolute;
    top: 40%;
    left: 0px;
    width: 30px;
    height: 48px; 
    background: url(images/Pfeil_links.png) no-repeat center !important;
}

.owl-next{
    background: url(images/Pfeil_rechts.png) no-repeat center !important;
    right: 0px;
    left: auto;
}

.projekte hr{
    height: 1px;
    background: #000;
    border: none;
    margin: 30px 0;
}

/* KONTAKT */


main.start #kontakt{
     padding: 25px 125px;
    background: #F1E1F4;
}

#kontakt h2{
    font-size: 38px;
    line-height: 47px;
    border: none;
    margin-bottom: 35px;
}

#kontakt p{
    font-family: Radikal-Bold;
    font-size: 28px;
    line-height: 36px;
    margin-bottom: 20px;
}

.interact{
    margin-top: 60px;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
}

.links a{
    display: inline-block;
    margin-right: 5px;
    width: 40px;
    transition: transform 400ms ease;
}

.links a:hover{
    text-decoration: none;
    transform: translateY(10px;);
}

.interact .links img{
    display: inline-block;
    width: 100%;

}

.newsletter #mc_embed_signup_scroll{
    display: flex;
    margin-left: 20px;
    transform: translateY(-2px);
}
.newsletter input{
    height: 28px;
    padding: 6px 12px;
    font-size: 20px;
    color: #000;
    border-radius: 0;
    border: 1px solid #000;
    min-width: 300px;
}
.newsletter input.button{
    background: #000;
    color: #fff;
    height: 42px;
    margin-left: 10px;
    font-family: Radikal-Bold;
    transition: transform 400ms ease;
}
.newsletter input.button:hover{
    transform: translateX(3px);
}

.kontakt strong{
    text-transform: uppercase;
}




/* AUSTAUSCH */

.austausch hr{
    height: 1px;
    background: #000;
    border: none;
    margin: 10px 0;
}

.austausch main p{
    max-width: 700px;
}

.austausch main .downloadLinks{
    margin-bottom: 40px;
}

.austausch main .downloadLinks a{ 
    display: block;
    background: url(images/Download_Icon.png) no-repeat left;
    padding: 5px 0 5px 20px;
    font-family: 'Radikal-Bold'; 
}

/* DOWNLOAD */

.download h1{
    text-transform: uppercase;
    margin: 0 0 20px 0;
}

.download h2{
    text-transform: uppercase;
    margin: 0 0 20px 0;
    font-family: 'Radikal-Light', sans-serif;
}

.download .text{
    max-width: 700px;
    margin: 0 0 20px 0;
    padding: 0 0 20px 0;
    border-bottom: 1px solid #000;
}

.download .text a{
    text-decoration: underline;
}

.download main .files a{ 
    display: block;
    float: left;
    clear: both;
    min-width: 200px;
    background: url(images/Download_Icon.png) no-repeat left;
    padding: 10px 0 10px 20px;
    font-family: 'Radikal-Bold'; 
}

.download main .files a.basic{ 

}

.download main .files a small{ 
    font-family: 'Radikal-Light', sans-serif; 
    font-size: 11px;
}

.download main a{ 
    font-family: 'Radikal-Bold'; 
}

.download main .error a{
    display: inline;
    float: none;
    background: none;
    padding: 0;
}


/* UPLOAD */

.upload main a{ 
    display: block;
    float: left;
    clear: both;
    min-width: 200px;
    background: url(images/Download_Icon.png) no-repeat left;
    padding: 10px 0 10px 20px;
    margin-top: 30px;
    font-family: 'Radikal-Bold'; 
}

.upload main small{
    display: block;
    clear: both;
}

footer a{
    margin-right: 15px;
}

/* override cookie button, show custom static button from footer.php */
footer .pixelmate-revoke{
    position: relative;
    margin: 0;
    padding: 0 !important;
    left: auto;
}
/* hide plugin button */
body>.pixelmate-revoke{
    display: none;
}

/* cookie banner css hacks */

.pixelmate-general-banner h3{
    line-height: 135%;
    text-align: center;
}

.pixelmate-general-banner p{
    text-align: center;
}

#pixelmate-fb-deny{
    color: #666 !important;
    letter-spacing: .75px;
    margin-right: 10px;
}

#pixelmate-fb-allow{
    color: #000 !important;
    letter-spacing: .75px;
}
.pixelmate-fb-banner{
    width: 80%;
    max-width: 550px;
}
.pixelmate-cookies{
    max-height: 150px;
}


/* RESPONSE */

@media screen and (max-width: 1375px){
    .projekte .owl-carousel{max-width: 480px;}
    .projekte .data{max-width: 150px;}
    /* .position main{background-size: cover; height: auto; min-height: 900px;} */
}

@media screen and (max-width: 1285px){
    .content{padding: 90px 15px;}
    .aktuell article, .publikationen article{padding-bottom: 20px;margin-bottom: 20px;}
}

@media screen and (max-width: 1154px){
    .projekte .owl-carousel{max-width: 550px;}
    .projekte .data{padding: 10px 0 0 0; max-width: 600px;}
}


@media screen and (max-width: 920px){
    .wrapper{padding: 30px 0 20px 0;}
    /*.position main{height: auto; min-height: 400px;background-size: auto;}*/
    .center{max-width: 100%; padding: 0 20px;}
    header nav a{font-size: 11px !important;}
    .mobileNavCurrent{
        cursor: pointer;
        display: block;
        text-transform: uppercase;
        text-decoration: none !important;
        margin: 62px 0 0 0;
        letter-spacing: 0.1em;
        border-bottom: 1px solid #000;
        max-width: 85%;
        background: url(images/Pfeil_Dropdown.png) right center no-repeat;
        }
    .current-menu-item a{border-bottom: 1px dotted #ccc;}
    .mobileNavContainer{display: none;}
    header nav li{
        float: none;
        margin:15px 0;
       }
    .content{padding:40px 0px 20px 0;}
    h1{font-size: 24px;line-height: 30px;}

    main.start{
        padding: 0;
    }
    main.start .content{
        padding: 0 20px;
    }
    main.start #slides{
        padding: 20px;
        height: auto;
        min-height: 400px;
        background-size: 100%;
    }
    main.start .copyright{
        display: none;
    }
    main.start #slides p{
        position: relative;
        margin: 35px 0 0 0;
        right: auto;
        bottom: auto;
    }
    main.start .wp-block-column{
        margin-bottom: 35px;
    }
    main.start #kontakt{
        padding: 20px;
        margin-top: 35px;
    }
    main.start #kontakt h2{
        margin: 0 0 25px 0;
        font-size: 24px;
        line-height: 36px;
    }
    main.start #kontakt p{
        font-size: 24px;
        line-height: 36px;
    }
    .interact{
        display: block;
    }
    .newsletter #mc_embed_signup_scroll{
        display: block;
        margin: 30px 0 0 0;
    }
    .newsletter input{
        margin: 0 0 10px 0 !important;
        font-size: 14px;
    }
}

/* PURE MD */
@media screen and (max-width: 767px){
    .team h2{margin-bottom: 35px;}
    .team-inner-1,.team-inner-2,.team-inner-3{padding: 0 20px !important;}
    .aktuell article p, .publikationen article p{font-size: 12px;} 
}

/* PURE SM */
@media screen and (max-width: 576px){
    .team-inner-1,.team-inner-2,.team-inner-3{padding: 0 0 65px 0 !important;}
    .projekte .owl-carousel{margin-top: 20px;}
    /* main.position{height: auto; background-size: contain !important;} */
    .aktuell article h3, .publikationen article h3{padding: 0; margin-top: 10px; margin-bottom: 10px;}
    .aktuell article p, .publikationen article p{padding: 0;} 
    .aktuell article, .publikationen article{margin-bottom: 35px;}
}

@media screen and (max-width: 361px){
    .mobileNavCurrent{margin-top: 43%;}
    .owl-prev, .owl-next{top: 30%;}
}

