/* ======================================================
                   PERTH Child CSS - INFO
   Das Css überschreibt die gewöhnlichen CSS Einstellung des Themes
   nach den festgelegten Gestaltungsregeln des Corporate Design
   für Dr. Offizier Immobilien
   
   alle nachfolgenden Elemente wurden leicht verändert
========================================================  */

/*======================================================
   NEU ! Farben 
   Nachtblau:        rgba(8,27,36,1)
   Mittelblau:       rgba(146,168,209,0.2)
   Blau:             rgba(146,168,209,1)
   Gelbgrau / trans: rgba(201,178,124,0.2)
   Schriftfamilien: Lora, sans-serif; und Droid, sans
========================================================  */


/* ======================================================
   Allgemeines
   ====================================================== */
.header-image {
  background-size: 100%;
}
.entry-title {
    display: none;         
}
.footer-branding { }
.footer-branding .site-title {
    display: none;
}
#sidebar-footer {
    padding: 0px;
    margin: 0px;
}
.footer-column {
    padding: 0px;
    margin: 0px;
}
#colophon {
    background-color: transparent;
}
.site-footer-color {
    width: 100%;
    background-color: RGBA(8,27,36,1);
}
.site-info.container a {
    color: #FFFFFF;
}
.site-info.container a:hover {
    color: rgba(146,168,209,1);
}
.spacer {
    padding-bottom: 45px;
}
.nofloat, .no-float { float: clear;}
.intro-text {
    margin-top: 0px;
    margin-bottom: 45px;
}
/* ======================================================
   Überschriften
   ====================================================== */
h1 {
    font-family: 'Lora', serif;
    color: #2B3C4D;
    letter-spacing: 1px;
    font-weight: 700;   
}
h3.widget-title { 
    font-family: 'Lora', serif;
}
h3.widget-title::after { 
    display: none;
}

/* -------------------------------------
   Kästchen vor Überschrift: schmal
   -------------------------------------- */

.testimonial h3.widget-title, 
.testimonial2 h3.widget-title,
.latest-news h3.widget-title, 
.news h3.widget-title,
.accordion-title,
.entry-header h1.entry-title,
.entry-header h3.entry-title,
h6.post-title {
    background: url('https://www.offizier-immobilien.de/wp-content/uploads/2016/06/balken_verwaltung-1-e1466065750692.png') no-repeat;
    padding-left: 110px;
    font-family: 'Droid Sans', sans-serif;
    font-size: 14px;
    text-transform: uppercase;
}

/* ======================================================
   Neu! Accordion-Style
   ====================================================== */
.accordion-content {
    margin-top: -10px;    
    padding-top: 40px;
    padding-left: 20px;
    padding-right: 20px; 
}

#acc-trans { 
    background-color: RGBA(201,178,124,0.2);
}
#content-acc-trans { 
    background-color: RGBA(201,178,124,0.2);
    padding-bottom: 45px;
}
#acc-dark { 
    background-color: RGBA(146,168,209,1);

}
#content-acc-dark { 
    background-color: RGBA(146,168,209,1);
    padding-bottom: 45px;
}
#acc-light { 
    background-color: RGBA(146,168,209,0.2);
}
#content-acc-light { 
    background-color: RGBA(146,168,209,0.2);
    padding-bottom: 45px;
}


/* ======================================
   für das 3er Grid oder Featueres Grid 
   ====================================== */

#acc-grid { 
    background-color: RGBA(146,168,209,0.2);
}
#content-acc-grid { 
    background-color: RGBA(146,168,209,0.2);
    display: block;
    height: 320px;
}
.accordion h6.accordion-title {
    height: 28px;
}
.acc-morelink {
    /* float: right;
    border: 1px green solid;*/
    padding-left: 5px;
    color: RGBA(146,168,209,1);
    
}

/* ======================================
   Kontaktdaten Box
   ======================================*/
.sow-headline {
    padding-left: 15px;
    border-left: 150px solid #081b24;
    margin-left: 0px; 
    margin-top: -120px;
    font-weight: bold;
    margin-bottom: -10px;
}

div.decoration { 
    display: none;
}
.contact-form h5 {
    border: 1px red solid;
}

/* ======================================
    Testimonial
    =====================================  */
.testimonial,
.testimonial2{
    background-color: rgba(201,178,124,0.2);
    text-align: left;
    height: 320px;
}
.testimonial h3.widget-title,
.testimonial2 h3.widget-title {
    margin-top:  0px;
    text-align: left;
    text-transform: uppercase;
}
.client-name h4 {
    text-transform: none;
}
.testimonials-area {
    max-width: 1024px; /* nicht mehr 750px;*/
    margin: 0 auto 30px;
    text-align: center;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: -35px;
}

/* --------------------------------------
   Netzwerk
   -------------------------------------- */
.networking {
    margin-top: 35px;
    margin-left: 0px;
    margin-right: 0px;
}
/* Networking */
.networking-area {
    max-width: 750px;
    margin: 0 auto 30px;
    text-align: center;
}
.networking-area .customer {        
        float: left;
        padding-right: 15px;
        padding-left: 15px;
}
.networking-area .no-float {
    float:clear;
}
.networking-area .avatar {
    max-width: 100px;
    margin: 7px auto 26px;
}
.intro-text h1 {
    margin-top: -50px;
    margin-bottom: 45px; /* ---------hier mehr Abstand ----------- */
}

/* --------------------------------------------------Overlayeffekt bei Verlinkung */
.avatar-img img{
    max-width: 100%;
    max-height: 100%;
}

.avatar-img img:hover {
    box-shadow: 100px 100px 100px 100px rgba(201,178,124,0.2)  inset;
} 

.networking-area .whisper {
    padding: 0 0 20px;
    margin: 0;
    border: 0;

}
.networking-area .client-name {
    font-size: 18px;
    font-weight: 500;
   display: none;
}
.networking-area .client-name span {
    font-size: 13px;
    display: block;
    color: #767676;
}
.client-name h4 {
    text-transform: none;
}
.networking-area .owl-controls {
    margin-top: 40px;
}

.owl-carousel .owl-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.owl-carousel{
    display: none;
    position: relative;
    -ms-touch-action: pan-y;
    -webkit-transition: all 0.3s !important;
    transition: all 0.3s !important;
}
.owl-carousel .owl-wrapper{
    display: none;
    position: relative;
    -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer{
    overflow: hidden;
    position: relative;
    width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight{
    -webkit-transition: height 500ms ease-in-out;
    -moz-transition: height 500ms ease-in-out;
    -ms-transition: height 500ms ease-in-out;
    -o-transition: height 500ms ease-in-out;
    transition: height 500ms ease-in-out;
}
.owl-carousel .owl-item{
    float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{
    cursor: pointer;
}
.owl-controls {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility:    hidden;
    -ms-backface-visibility:     hidden;
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
}
.owl-theme .owl-controls{
    text-align: center;
    margin-top: 45px;
}
.owl-theme .owl-controls .owl-page{
    display: inline-block;
    zoom: 1;
    *display: inline;
}
.owl-theme .owl-controls .owl-page span{
    display: block;
    width: 18px;
    height: 4px;
    margin: 4px;
    background-color: #315B9D;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition: background 0.3s;
       -moz-transition: background 0.3s;
        -ms-transition: background 0.3s;
         -o-transition: background 0.3s;
            transition: background 0.3s;
}
.owl-theme .owl-controls .owl-page.active span {
    background-color: #333;
}
/*========================================
   Nachrichten
  ======================================== */
.latest-news {
    background: rgba(146,168,209,0.2);
    margin-top: 35px;
} 
.news h3.widget-title {
    margin-top:  0px;
    text-align: left;
    text-transform: uppercase;
}
.latest-news h3.widget-title {
    margin-top:  -5px;
    margin-left: -5px;
    text-align: left;
    text-transform: uppercase;
}
.news, .latest-news  {
    background: rgba(146,168,209,0.2);
}
h6.post-title {
    margin-top: -5px;
    margin-left: -5px;
}
.blog-post {
    /* einzlene Nachricht mit umlaufend 5 px margin */
}
.more-button {
    text-transform: none;
}

.news-intro {
    margin-top: -45px;
    margin-bottom: 45px;
    margin-left: 15px;
}
.news-intro-text {
    margin-top: 45px;
    margin-bottom: 45px;
}
/* ======================================
   Nachricht single
   ====================================== */
.posts-layout {
    margin-left: 0px;
}
.post {
    border: 0px;
    background: rgba(201,178,124,0.2);
   }
.posts-layout h2.entry-title {
    display: block;
    font-size: 23px;
}
.posts-layout h2.accordion-title {
    margin-top: -30px;
    margin-left: -30px;
}
.entry-header h2 {
    margin-left: -25px;
}
.entry-header h1.entry-title {
    
    display: block;
    font-size: 14px;
    margin-top:  -30px;
    margin-left: -30px;
    text-align: left;
    text-transform: none;
}
.posts-layout .entry-content { /*Textarea in Aktuelles */
    margin: 0px;
    margin-left: -5px;
    margin-right: -5px;
    
}
.entry-content { /* Textarea des einzelner Beitrag */
    margin: 0px;
    
}
.entry-footer {
    display: none;
}
.entry-thumb img{
    width: 200px;
    height: 200px;
    border: 1px black solid;
    display: inline;
    float: right;
    margin: 15px;
}
.nav-links .nav-next {
    
}
.nav-links .nav-previous {
    
}
/* ======================================
   Impressum
   ====================================== */
div.disclaimer {
    margin-top:    145px; 
    margin-left:   45px; 
    margin-right:  45px; 
    margin-bottom: 145px;
}

/* ========================================================  */






/*--------------------------------------------------------------
## Responsive
--------------------------------------------------------------*/
@media only screen and (max-width: 1199px) {
    .content-area {
        width: 550px;
    }    
    .masonry-layout .hentry {
        width: 283px;
    }    
}
@media only screen and (max-width: 1024px) {
    .panel-row-style,
    .header-image {
        background-attachment: scroll;
        background-position: center !important;
    }
    .panel-row-style.mob-pad-0 {
        padding: 0 !important;
    }        
    .panel-row-style.mob-pad-15 {
        padding: 15px 0 !important;
    }    
    .panel-row-style.mob-pad-30 {
        padding: 30px 0 !important;
    }
    .panel-row-style.mob-pad-45 {
        padding: 45px 0 !important;
    }
    .main-navigation,
    .header-clone {
        display: none;
    }        
    .mobile-nav {
        display: block;
        width: 100%;
    }    
    .site-header {
        position: relative;
    }                        
}
@media only screen and (min-width: 1025px) {
    .main-navigation li::after {
        width: 0;
        height: 2px;
        background-color: #315B9D;
        content: '';
    	position: absolute;
		top: 0;
		left: 0;
		-webkit-transition: width 0.3s;
		transition: width 0.3s;
	}
	.main-navigation li:hover::after {
		width: 100%;
	}
}
@media only screen and (max-width: 991px) {
	.content-area,
	.widget-area {
		width: 100%;
	}	
	.widget-area {
		margin-top: 45px;
	}		
	.row-separator {
	    margin-bottom: -75px !important;
	    height: 75px;
	}
	.row-sep-b {
	    margin-top: -75px !important;
	    height: 75px;
	}
	.rowSepBefore {
		padding-top: 150px !important;
	}
	.rowSepAfter {
		padding-bottom: 150px !important;
	}
	.employee {
		width: 45%;
	}
	.service,
	.service.columns3,
	.service.columns2 {
		width: 100%;
		padding: 0;
	}
	.header-text {
		font-size: 36px;
	}
	.header-image {
		height: 400px;
	}	
	.fact-value {
		font-size: 24px;
	}
	.fact {
		width: 48%;
		margin: 1px;
	}
	.masonry-layout .hentry {
		width: 330px;
	}
	.footer-branding,
	.footer-widgets {
		width: 100%;
		float: none;
		display: block;
	}
	.footer-area {
		display: block;
	}
	.footer-branding {
		padding: 15px;
	}
	.site-info {
		text-align: center;
	}
}
@media only screen and (max-width: 780px) {
  	.panel-grid-cell {
    	margin-bottom: 15px !important;
  	}
}
@media only screen and (max-width: 767px) {
	.masonry-layout .hentry {
		width: 100%;
		max-width: 380px;
		margin: 0 0 15px;
	}
	.posts-layout.masonry {
		display: table;
		margin-left: auto;
		margin-right: auto;
		width: 100% !important;
		max-width: 380px;
	}
    .isotope-item {
        width: 50%;
    }   			
    .site-title,
    .panel-grid .widget-title {
    	font-size: 30px !important;
    }
}

@media only screen and (max-width: 460px) {
	.employee,
	.blog-post {
		width: 100%;
		padding-left: 5px;
		padding-right: 5px;
	}
	.site-branding {
		width: 100%;
		text-align: center;
		padding: 0 10px;
	}
	.site-header .container {
		display: block;
	}
	.slicknav_btn {
		display: table;
		margin: 5px auto;
	}
	.site-header {
		padding-bottom: 0;
	}
	.slicknav_nav {
		margin-top: 0;
	}
	.service-area.type-b .svg-container.service-icon-svg {
		float: none;
		margin: 0 0 25px -40px;
		left: 50%;
	}
	.service-area.type-b .service-title,
	.service-area.type-b .content {
		text-align: center;
	}
	.call-to-action.aside-style .action-text {
		float: none;
		width: 100%;
		text-align: center;
	}
	.call-to-action.aside-style .action-button {
		float: none;
		width: 100%;
	}
	.call-to-action.aside-style .more-button {
		margin-top: 25px;
	}		
	.client-item {
		width: 48%;
		padding: 5px;
	}
    /* -------------------------------------
     Kästchen vor Überschrift: Verkleinerungen
     -------------------------------------- */

    .testimonial h3.widget-title, 
    .testimonial2 h3.widget-title,
    .latest-news h3.widget-title, 
    .news h3.widget-title,
    .accordion-title,
    .entry-header h1.entry-title,
    .entry-header h3.entry-title,
    h6.post-title {
        background: url('https://www.offizier-immobilien.de/wp-content/uploads/2016/06/balken_verwaltung-1-e1466065750692.png') no-repeat;
        padding-left: 110px;
        font-family: 'Droid Sans', sans-serif;
        font-size: 10px;
        text-transform: uppercase;
    }
    .post { 
        margin-right: 20px;
        margin-left: 5px;
    } 
    .accordion {
        margin-right: 0px;
        margin-left: 0px;
    } 
    .accordion2,
    .portfolio-grid,
    .testimonial2{
        margin-right: 20px;
        margin-left: 20px;
    } 
    .testimonial {
        margin-right: 0px;
        margin-left: 0px;
        height: 350px;
    } 
    .networking {
        margin-right: 20px;
        margin-left: 20px;
    } 
    .entry-header h1.entry-title { 
        margin-top: -10px;
        margin-left: -10px;
        font-size: 12px !important;
    } 
    .entry-header h2.accordion-title { 
        margin-top: -10px;
        margin-left: -10px;
    } 
    .nav-previous {
        width: 40%;
        margin-left: 15px;
    }
    .nav-next {
         width: 40%;
        margin-right: 15px;
    }        
	.panel-grid .widget-title,
	.header-text {
		font-size: 12px !important;
	}
	.site-title,
	h1 {
		font-size: 20px !important;
	}
	.header-text,
	.panel-grid .widget-title {
		font-size: 12px !important;
	}
	h2 {
	 	font-size: 12px !important;
	}
	h3 {
	 	font-size: 12px !important;
	}
	h4 {
		font-size: 12px !important;
	}
	h5 {
		font-size: 12px !important;
	}
	h6 {
	 	font-size: 12px !important;
	}
	.site-description {
	 	font-size: 10px !important;		
	}
	.entry-title {
		font-size: 18px !important;
	}
	.header-image {
		height: 300px;
	}
	.header-info {
		top: 10%;
	}
	.header-button {
		display: block;
		float: none;
		font-size: 12px;
		padding: 10px 20px;
	}
	.header-button.right-button	{
		margin: 30px 0 0;
		padding: 10px 20px;
	}
	.header-buttons {
		margin-top: 30px;
	}
	.panel-grid .widget-title {
		margin-bottom: 60px;
	}
	.fact {
		width: 100%;
		margin: 0 0 2px;
	}
	.social-menu-widget li {
		width: 62px;
		height: 62px;
		padding: 5px;
	}
	.social-menu-widget a:before {
		font-size: 24px;
	}
	.customer .whisper {
		font-size: 14px;
	}
	#content-wrapper {
		padding: 0;
	}
	.home #content-wrapper {
		padding-left: 15px;
		padding-right: 15px;
	}
	.hentry {
		padding: 10px;
	}
	.comments-area .children {
		padding: 0;
	}
    .isotope-item {
        width: 100%;
    }  	
}