/* MAIN */

@import url(../fonts/source-sans-pro.css);
@import url(../fonts/lato.css);
@import url(../fonts/merriweather.css);
@import url(../fonts/open-sans.css);

html, body {height: 100%; min-width: 320px;}
body {margin: 0px; padding: 0px; font-family: 'Merriweather', 'Open Sans', sans-serif; font-size: 11pt; font-weight: 400; color: #330; text-align: justify; }

h1, h2, h3 {margin: 0; padding: 0; color: #330; font-family: 'Lato', 'Open Sans'; font-weight: 700;}
p, ul {margin-top: 0; }
p {line-height: 180%;}
a {color: #330; }
a:hover {text-decoration: none; }
div.clear {width: 100%; height: 1px; background-color: transparent; float: left; }

/* HEADER */
#top-wrapper {width: 100%; height: 40px; background-color: #d9f1f3;}
#top-header {width: 80%; min-width: 320px; max-width: 960px; margin: 0 auto; }

#top-header .social {width: 48%; float: left; margin-left: 2%;}
#top-header .social .facebook {background: url(../img/backgrounds/ico-facebook.png) left center no-repeat;}
#top-header .social .instagram {background: url(../img/backgrounds/ico-instagram.png) left center no-repeat;}
#top-header .social .blog {background: url(../img/backgrounds/ico-blog.png) center left no-repeat;}
#top-header .social .menu {background: url(../img/backgrounds/ico-menu.png) center left no-repeat; display: none;}
#top-header .social .unit {width: 26px; height: 26px; padding: 7px 18px 7px 0; float: left; text-indent: -9999px; background-size: 22px 22px;}

#close-button {background: url(../img/backgrounds/ico-close.png) center left no-repeat; display: none;  position: fixed; top: 60px; right: 30px; width: 26px; height: 26px; float: left; text-indent: -9999px; background-size: 22px 22px;}

#top-header .language {width: 48%; float: right; line-height: 26px; text-align: right; margin-right: 2%}
#top-header .language .unit {width: 26px; height: 26px; padding: 7px 0 7px 0;  text-decoration: none; display: inline-block; font-weight: 400}

#header 
{height: 130px; padding-top: 10px;}

/* LOGO*/
#logo {background: url('../img/logo-jose-arce.jpg') no-repeat center center; width: 480px; height: 130px; margin: 0 auto; padding: 0; display: block; text-indent: -9999px; background-size: 480px auto;}
@media screen and (max-resolution: 96dpi) and (min-width: 481px){
	#logo {background: url('../img/logo-jose-arce-d.jpg') no-repeat center center; background-size: 480px auto;}
}

/* MENU*/
#menu-wrapper {min-width: 320px; color: #330;}
#menu {margin: 0px auto; }
#menu ul {text-align: center; padding: 0; margin: 0 auto; max-width: 1200px;}
#menu li {display: inline-block; }
#menu li a, #menu li span {display: inline-block; padding: 1.3em; letter-spacing: 0.20em; text-decoration: none; font-size: 1em; font-family: 'Lato','Open Sans'; font-weight: 700; text-transform: uppercase; outline: 0; color: #330; }
#menu .current_page_item a {border-bottom: 4px solid #000; padding-bottom: 1em; }



/* LAYOUTS */
#content-wrapper {max-width: 80%; max-width: 960px; margin: 0 auto;}
#content-wrapper .content-left {position: relative;}
#content-wrapper .layout1 .tx-yag-breadcrumbcomtainer, #content-wrapper .layout1 .tx-yag-pager {display: none;}
#content-wrapper .layout1 .tx-yag-items {text-align: center; }
#content-wrapper .layout1 .yag-item-thumb-outerframe {float: none; display: inline-block; }
#content-wrapper .layout2 {background: #d9f1f3;}

.posts h1 {text-transform: uppercase; text-align: center; padding: 0 0 20px 0;}


/* CONTENT */
#content-wrapper .content {width: 100%; margin: 0 auto; display: block;}
#content-wrapper.one .content .posts {width: 96%; padding: 2%; text-align: left;}
#content-wrapper.one .content .posts .video-js-box, #content-wrapper.one .content .posts object, #content-wrapper.one .content .posts iframe {margin: 0 auto;display: block; width: 100% !important; max-width: 640px; }
#content-wrapper.one .content .posts .video-js-box {height: auto !important;}
#content-wrapper.one .content .posts .video-js-box video {width: 100%; height: auto;}





.csc-textpic-imagewrap .csc-textpic-image {max-width: 100%}
.csc-textpic-imagewrap img {max-width: 100%; height: auto;}

/* Center-aligned textpic (csc-textpic-center) */
.csc-textpic-center .csc-textpic-imagewrap {text-align: center;}
.csc-textpic-center-outer {width: 100%; text-align: center;}
.csc-textpic-center-inner {display: inline-block; text-align: left;}
.csc-textpic-center figure {margin: 0 auto;}


/* CONTACT */
#content-wrapper .layout3 {width: 60%; display:inline-block; float: left;}
#content-wrapper .layout4 {width: 35%; margin: 21px 0 0 2%; display:inline-block; color: #fff;}
#content-wrapper.one .layout4 .content .posts {text-align: center;}


#contact_form ol {list-style-type: none;}
#contact_form li {}
#contact_form label {width: 100%; margin: 0;}
#contact_form input {width: 94%; height: 50px; border: 2px solid #330; border-radius: 0; margin-bottom: 30px; font-size: 14px; padding: 0 2%; }
#contact_form textarea {width: 94%; height: 150px; border: 2px solid #330; margin-bottom: 30px; font-size: 14px; padding: 2%; }
#contact_form .csc-form-element-submit input {width: 48%; color: #ff3300; border-color: #ff3300; text-transform: uppercase; background: #fff; font: 700 16px 'Source Sans Pro'; }

#contact-info {width: 100%; height: 505px; text-align: center; background: #ff3300;}
#contact-info h1 {color: #fff; margin: 0 auto; width: 100px; padding-top: 20px; font-size: 16px; font-weight: 400;}
#contact-info a {color: #fff;}

/* FOOTER */
#footer-wrapper {width: 100%; min-width: 320px; background: #d9f1f3; margin: 0; padding: 0; float:left;}
#footer {max-width: 80%; max-width: 960px; margin: 0 auto; height: 155px; padding: 0; }
#footer .footer-top {color: #099; text-align: center; margin: 0 auto; line-height: 20px; height: 20px; padding: 30px 0 0;}
#footer .footer-top a {color: #099; text-decoration: none;}
#footer .footer-left {margin: 0 auto; text-align: center; padding: 25px 0 5px; float: none} 
#footer .footer-right {margin: 0 auto; text-align: center;  float: none}
#footer .footer-right a {text-decoration: none;}
#footer .footer-left, #footer .footer-right, #footer .footer-right a {font: 400 14px/25px 'Source Sans Pro'; color: #330; text-transform: uppercase; }

@media (min-width: 801px) {
	#close-button {display: none !important;}
	#menu-wrapper {display: block !important;}
}

@media (max-width: 800px) {
	
h1 {font-size: 1.5em;}	

#top-header {width: 88%;}
	
#top-wrapper {position: fixed; top: 0px; left: 0px; z-index: 12000; }
#header-wrapper {margin-top: 50px;}
	
#menu-wrapper {display: none; background: #fff; opacity: 0.95; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; margin: 0; padding: 0; z-index: 9999;}
#menu {opacity: 1; position: relative; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%);}

#top-header .social .unit {width: 26px; height: 26px; padding: 7px 10px 7px 0; background-size: 18px 18px;}
#top-header .social .menu {display: block; background-size: 25px 25px; padding: 2px 10px 2px 0; width: 36px; height: 36px;}


.content, .container {width: 100% !important;}

#content-wrapper .layout3 {width: 100%}
#content-wrapper .layout4 {width: 100%; margin: 0; }

#contact_form li.csc-form-element-submit {text-align: center;}


/* Post TextPic */
.csc-textpic-text p {text-align: justify;}
#contact-info .csc-textpic-text p {text-align: center;}

}

@media (max-width:480px){

/* HEADER */
#top-header {width: 95%;}
#header {height: 100px;}
#logo {background-size: 300px 82px; width: 300px; height: 82px; }

/* MENU */
#menu li a, #menu li span {padding: 1em; }
#menu .current_page_item a {border-bottom: 3px solid #000; padding-bottom: 0.5em; }


/* CONTENT */
#content-wrapper .layout1 .yag-gallery ul {padding-left: 0;}
#content-wrapper .layout1 .yag-item-thumb-outerframe {width: 100%; height: auto;  }
#content-wrapper .layout1 .yag-item-thumb-outerframe img {width: 100%; height: auto;  }

/* Post TextPic */
.csc-textpic-imagewrap {width: 100%}
.csc-textpic-imagewrap .csc-textpic-image {width: 100%}
.csc-textpic-imagewrap img {width: 100%; height: auto;}


}




/** HUNDESCHULEN UND DOGWALKER **/

.flags-wrap {display: block; width: auto; margin: 20px auto; text-align: center;}


.flags.flagde {background: url(../img/flag-de.jpg);}
.flags.flagat {background: url(../img/flag-at.jpg);}
.flags.flagch {background: url(../img/flag-ch.jpg);}
.flags.flagit {background: url(../img/flag-it.jpg);}
.flags.flages {background: url(../img/flag-es.jpg);}

.flags {display: inline-block; height: 125px; width: 200px; margin: 20px 20px; background-position: center center !important; background-size: 100% 100% !important; text-indent: -9999px;}

@media (max-width:640px){
.flags {height: 40px; width: 64px; margin: 10px 5px;}
}

/* Fix for images with missing dimensions */
img[width="0"], img[height="0"] {
    width: auto !important;
    height: auto !important;
    max-width: 100%;
}