/* ==========================================================================
   Base Styles, Bootstrap Modifications & Fonts Import
   ========================================================================== */
   
  
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;600;900&display=swap');
@import url(http://fonts.googleapis.com/css?family=Open+Sans);


::-moz-selection {
    background: #addbcb;
    color: #FFF;
    text-shadow: none;
}

::selection {
    background: #16a085;
    color: #a4003a;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

.centered {
    text-align: center
}

.mt {
    margin-top: 60px;
}


.mt100 {
    margin-top: 100px;
}

.mt-30 {
    margin-top: 30px;
}

.mb {
    margin-bottom: 30px;
}

.meta {
    text-align: right;
    font-size: 80%;
}
@media (max-width: 767px) {
    .meta  {
        text-align:left;
        padding-left:10px;
        padding-top: 10px;

    }
}
.mr {
	margin-right: 20px;
	margin-bottom: 20px;
}

/* ==========================================================================
   General styles
   ========================================================================== */


body {
    font-family: 'Barlow', sans-serif;
    font-weight: 300;
    font-size: 18px;
    line-height: 1.42857143;
    -webkit-font-smoothing: antialiased;
    -webkit-overflow-scrolling: touch;
    color:#1D2E36;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 300;
    color: #446C7E;
}
h1,
.h1 {
    font-size: 270%;
}
h2,
.h2 {
    font-size: 200%;
}
h3,
.h3 {
    font-size: 160%;
	
}
h4,
.h4 {
    font-size: 120%;
}
h5,
.h5 {
    font-size: 90%;
}
h6,
.h6 {
    font-family: 'Open Sans', sans-serif;
    font-size: 11px;
    color: #ADA68F;
    text-transform:uppercase;
}

p {
font-family: 'Barlow', sans-serif;
    color:#1D2E36;
    font-size: 120%;
    font-weight: 300;
    padding-left: 60px;
    margin: 20px,10px;

}

a {
    color: #669999;
    text-decoration: none;
    font-size: 120%;
}
a:hover,
a:focus {
  color: #663399;
  text-decoration: none;
}

.img-logos{
  max-width: 80%;
  height: auto;
}
.img-logos-vw{
  max-width: 55%;
  height: auto;
}

.largeType{
    font-size:450%;
}



.navbar-default .navbar-brand {
    color: #1abc9c;
}

.navbar-default {
    background-color:#FFF;
    border-bottom: 1px dotted #d8cf9a;
}


.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color: rgba(0, 0, 0, 0);
    border-bottom: 2px solid #C5A425;
    color: #1d2e36;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #446c7e;
    background-color: transparent;
}

.navbar-default .navbar-nav > li > a {
    color: #446c7e;
}

@media (max-width: 768px) {
    .navbar-nav {
        width:100%;
        margin: 0;
		
    }

    .navbar-nav > li > a {
        padding-top: 0px;
        padding-bottom: 0px;
        line-height: 20px;

    }
	.navbar-header {
	float: none;
	}
	.nav > li > a {
		padding-bottom: 0px;
		padding-top: 6px;
	}
}
@media (max-width: 767px) {
.nav-adjust >li > a{
	margin-top: 10px;
	margin-bottom: 20px;
	padding-left: 5px;
}
}

.navbar-default .navbar-toggle {
    border-color: #fff;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #addbcb;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #669999;
}

/*Caro added media query*/

/* ==========================================================================
   Wrap Sections
   ========================================================================== */

#headerwrap {

    padding-top: 38px;
    width: 100%;
    

}

#headerwrap h1 {
	font-size: 400%;
	
	color: #1E2E36;
	font-weight: 900;
	
}
#headerwrap h2 {
	font-size: 260%;
	color: #446C7E;	
	font-weight: 100;
	margin-top: -20px;
	
}
#headerwrap h3 {
	font-size: 180%;
	color: #88844C;
	
	font-weight: 300;
	
	
}

@media (max-width: 767px) {
   
    h2,
    .h2 {
        font-size: 45px;
    }
	#workwrap h2 {
		font-size: 400%;
	}
	
}


@media (min-width: 1200px) {
    #headerwrap h1 {
        max-width: 100%;
    }
    h2,
    .h2 {
        font-size: 36px;
    }

}

#small-icon-Blur{
    min-height: 20px;
    width: 100%;
    margin-left:auto;
    margin-right:auto;
}

#selectedWorks h2 {
	font-size: 210%;
	font-weight: 300;
	margin: 20px,10px,0px,0px;
	
}
#selectedWorks a, #headerwrap a{
    color: #669999;
    text-decoration: none;
    font-size: 100%;
}
#selectedWorks a:hover, #headerwrap a:hover {
    color: #996699;
    text-decoration: none;
    font-size: 100%;
}

/* ==========================================================================
   SEO Wrap Projects Agencies
   ========================================================================== */
#seowrap {
    margin-top: 0px;
    font-size:120%;
	line-height: 160%;
}


#seowrap h1{
	margin-top: 0px;
	margin-bottom: 7px;
	color: #669999;
}


#seowrap h3 {
margin-top: 0px;
	margin-bottom: 10px;
	color:#C5A426;
	
}



#seowrap p{
    padding-right:40px;
    font-size:110%;
}

#seowrap a {
    color: #669999;
    text-decoration: none;
	font-size: 100%;
	font-weight: 300;
}

#seowrap a:hover {
    outline: 0;
    color: #996699;
    text-decoration: none;
}


.logos-list contact-list{
    list-style: none;
    margin-bottom:20px;
    font-size:120%;
	padding: 0px;
}

.logos-list > li {
    display: inline-block;
    max-width: 150px;
}

.contact-list > li {
    display: inline-block;
    width: 65px;

}

ul,
ol {
    margin-top: 0;
    margin-bottom: 0px;
}

.projects-list a {
    color: #ADA68F;
    text-decoration: none;
}
.disclaimer a {
    color: #446c7e;
    text-decoration: none;
	font-size: 80%;
}
.disclaimer a:hover {
    outline: 0;
    color: #996699;
    text-decoration: none;
	font-size: 80%;
}

.projects-list a:hover {
    outline: 0;
    color: #996699;
    text-decoration: none;
}


/* Footer */
#footerwrap {
    margin-top: 50px;
    padding-top: 20px;
    padding-bottom: 20px;
    border-top: 1px dotted #d8cf9a;
}

#footerwrap p {
    font-weight: 300;
    color:#ADA68F ;
    font-size:80%;
}

/* HolaCaro */

#holaCaro {
	 margin-top: 0px;
	
}
.label {
    font-size: 140%;
  display: inline-block;
  margin-bottom: 5px;
  font-weight: 400;
	border-radius: 0px;


}
.label-warning {
  background-color: #DDC047;
}
.label-ui {
  background-color: #d8cf9a;
}
.btn {
	font-size: 80%;
    border-radius: 0;
    font-weight: 300;
    padding: 5px 13px;
	
}

.borderT {
	border-top: 1px dotted #d8cf9a;
	padding-top: 20px;
}
.btn-info {
  color: #fff;
  background-color: #5bc0de;
  border-color: #46b8da;
	font-size: 180%;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
  color: #fff;
  background-color: #39b3d7;
  border-color: #269abc;
	font-size: 180%;
}
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info {
  background-image: none;
}
/* WORKS*/




#aboutwrap {
    margin-top: -70px;
    padding-top: 250px;
    background-attachment: relative;
    background-position: center center;
    min-height: 550px;
    width: 100%;

    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}






/* Gallery */
.gallery {
    margin-top: 2px;
}

/*
.gallery img:hover {
    opacity: 0.4;
}
*/



/* NEUER PART VON OLE changed by Caro 2017 - START*/

.work .description {
	float:left;
	text-align:left;
}

.work .description h2 {
    color: #669999;
    font-size: 200%;
    text-decoration: none;
    text-transform:uppercase;
	
}

.work .description p{
	font-family: 'Open Sans', sans-serif;
	font-size:14px;
	font-variant:normal;
	text-decoration:none;
	color: #669999;
	margin-top:-10px;
}
.work .description a {
    color: #669999;
    text-decoration: none;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    outline: 0;
}
.work .description a:active {
    outline: 0;
}

/*Gallery*/
.work {
    float:left;
    position:relative;
    overflow:hidden;
    display:block;
}

.work img { width:100% !important;height:auto; }

.work .description_wrapper {
    position:absolute;
    background:#FFFFFF;
    background: rgba(255,255,255,0.7);
    width:100%;
    height:100%;
    left:0px;
    top:0px;
    display:none;
}

.work .description_wrapper:active {

	background: rgba(255,255,255,0.7);
}

.work:hover .description_wrapper {
    display:block;
}

.work .description_wrapper .description {
    margin:25px;
}

.work .description_wrapper .description .link_mask {
    height:100%;
    width:100%;
    position:absolute;
    top:0px;
    left:0px
}

.work .description_wrapper,
.work .description {
    height:100%;
	width: 100%;
}


/* NEUER PART VON OLE - ENDE*/




/* ==========================================================================
   Caro Next and Previous
   ========================================================================== */
.stagebk {
	background-color:#E2E2E2;
}

.no-pl {
	
padding-left: 0px;
}
.pr {
	padding-right: 7px;
}
#project-wrap{
	margin-top: 70px;
}
.navigation-fixed-top {
  position: fixed;
  right: 0;
  left: 0;
  z-index: 1029;
background-color:#fff;
}


.desc-project {
	margin-bottom: 30px;
	margin-top: 50px;
}
.mt-logo{
	margin-top: 30px;
	margin-bottom: 20px;
	
}
.mt-60{
	margin-top: 60px;
	margin-bottom: 30px;
	
}

.arrow {
  list-style: none;
  position: relative;
    width: 100%;
	 margin-left:0;
	 margin-right:0;
	font-size:20px;
	font-weight:300;
	padding-left:0px;
}
.arrow li a {
	padding: 30px 5px;
	
}

.arrow ul{
	list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
.arrow li {
	float: left;
}

.boxshadow {
	-webkit-box-shadow: 0px 2px 8px -4px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 2px 8px -4px rgba(0,0,0,0.4);
box-shadow: 0px 2px 8px -4px rgba(0,0,0,0.4);
}

.teamFont {
	font-size: 200%;
	
}

.list-group-item {
   font-size: 130%;
   font-weight:600;
    color: #025163;
    padding: 20px 60px;
    border-left: none;
    border-right: none;
    margin-bottom: 15px;
    background-color: #f6f6eb;
    border: none;
}

.thiss{
 background-color: #e6e3dc;
} 



/* ==========================================================================
   Image on text 2023
   ========================================================================== */
.keyvisual {
  position: relative;
  text-align: center;
  color: white;
}

/* Bottom left text */
.bottom-left-key {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

/* Top left text */
.top-left-key {
  position: absolute;
  top: 8px;
  left: 16px;
}

/* Top right text */
.top-right-key {
  position: absolute;
  top: 8px;
  right: 16px;
}

/* Bottom right text */
.bottom-right-key {
  position: absolute;
  bottom: 8px;
  right: 16px;
}

/* Centered text */
.centered-key {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}