/*

Theme Name:     SMG
Theme URI:      http://soundart-mediagroup.de/
Description:    
Author:         calmar creativ GbR
Author URI:     http://www.calmar.cc/

*/


/*@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,700);*/

/* yanone-kaffeesatz-200 - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 200;
  src: local(''),
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* yanone-kaffeesatz-300 - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* yanone-kaffeesatz-regular - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* yanone-kaffeesatz-500 - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 500;
  src: local(''),
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* yanone-kaffeesatz-600 - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 600;
  src: local(''),
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* yanone-kaffeesatz-700 - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/wp-content/uploads/fonts/yanone-kaffeesatz-v24-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

body {

  margin:0px; padding:0px;
  font-family:Roboto, sans-serif; font-weight:300;
  font-size:16px; line-height:24px;
  background-color:#ededed; color:#2c2c2c;
}

h1, h2, h3, h4, h5, h6 { color:#ff7b2b; text-transform:uppercase; }

h1 { font-size:26px; line-height:30px; }
h2 { font-size:26px; line-height:30px; }
h3 { font-size:20px; line-height:24px; }
h4 { font-size:16px; line-height:20px; }
h5 { font-size:14px; line-height:18px; }
h6 { font-size:14px; line-height:18px; }


.innercontent {

  width:980px; max-width:980px; margin:auto;
}


a { outline:none; color:#2c2c2c; text-decoration:underline; }
a:hover { color:#ff7b2b; }

img { border:0px; }
strong { font-weight:700; }

hr  {

  clear:both; margin:12px 0px; height:1px;
  border:1px solid #192f66; border-width:1px 0px 0px 0px;
}

.align-left, .alignleft  { float:left;  }
.align-right, .alignright { float:right; }
.clear { clear:both; }

.donotshow  { display:none; }
.mobileonly { display:none; }

.aligncenter {

  display: block; margin-left: auto; margin-right: auto;
}

blockquote.alignleft, img.alignleft {

  margin: 7px 24px 7px 0;
}

.wp-caption.alignleft {

  margin: 7px 14px 7px 0;
}

blockquote.alignright, img.alignright {

  margin: 7px 0 7px 24px;
}

.wp-caption.alignright {

  margin: 7px 0 7px 14px;
}

blockquote.aligncenter, img.aligncenter, .wp-caption.aligncenter {

  margin-top: 7px; margin-bottom: 7px;
}



#postimage {

  position:absolute; top:0; left:0; z-index:1;
  display:none; width:100%; height:700px;
  background-position:center top;
  background-repeat:no-repeat; background-size:cover;
}

#postimageinner {

  width:100%; height:700px;
  background-image:url(images/bg-postimage.png);
  background-position:0px 510px; background-repeat:repeat-x;
}

#header {

  position:absolute; top:0; left:0; width:100%; height:96px; z-index:9990;
  background-color:rgba(40,40,40,0.86);
}

.nobgimage #header {

  border:1px solid #ff7b2b; border-width:0px 0px 6px 0px; 
}

body.home #header {

  border:0px;
}


#header .toplogo {

  float:left;
}

#header .toplogo img {

  width:209px; max-width:209px;
  height:31px; border:0px; margin:36px 40px 0px 45px;
}


#header #mainmenu {

  float:right; max-width:680px; margin:36px 0px 0px 0px; padding:0px; list-style-type:none;
}

#header #mainmenu li {

  float:left; height:24px; line-height:24px; padding:0px 12px; margin:0px;
  position:relative; text-transform:uppercase;
  font-size:16px; font-weight:400;
  border:1px solid #fff; border-width:0px 0px 0px 1px;
}

#header #mainmenu li:first-child {

  border:0px;
}

#header #mainmenu li a {

  line-height:24px;
  color:#fff; text-decoration:none;
}

#header #mainmenu li:hover a {

  color:#ff7b2b;
}

#header #mainmenu li .sub-menu {

  float:none; display:none; position:absolute; top:22px; left:0px; z-index:3000;
  min-width:192px; height:auto; padding:8px 0px 0px 0px; margin:0px; list-style-type:none;
}


#header #mainmenu li:hover .sub-menu { display:block; }

#header #mainmenu .sub-menu li {

  float:none; height:auto; margin:0px; padding:0px; border:0px;
  background-image:none; border:1px solid #3c3c3c; border-width:1px 0px 0px 0px;
  background-color:#2c2c2c; color:#fff;
}

#header #mainmenu .sub-menu li:first-child {

  border:0px;
}

#header #mainmenu .sub-menu li a,
#header #mainmenu .sub-menu li.current-menu-item a {

  display:block; height:auto; line-height:21px; margin:0px; padding:10px 18px;
  font-size:14px; color:#fff; font-weight:normal; text-transform:none;
  background-image:none;
}


#header #mainmenu .sub-menu li a:hover {

  color:#2c2c2c; background-color:#ff7b2b;
}


#header #mainmenu .sub-menu li ul {

  display:none;
}



#main {

	width:980px; margin:auto; min-height:500px; padding:145px 0px 45px 0px;
	position:relative; z-index:2;
}

body.hasbgimage #main {

	padding-top:570px; padding-bottom:60px;
}

body.home #main {

	position:relative; top:-40px; padding-top:0px; min-height:0px;
}


@media screen and (max-width: 980px) {

	body.home #main {

		top:0px;
	}
}


@media screen and (min-width: 1440px) {

	body.home #main {

		top:-60px;
	}

	body.home #content {

		padding:40px 6%;
	}
}


#content .block {

  clear:both;
  padding:40px 60px;
  min-width:860px; max-width:860px; margin:0px auto; 

  background-color:#fff;
  box-shadow: 0px 2px 4px -1px rgba(180,180,180,0.75);
}

#content .withspacer {

  margin-top:50px; margin-bottom:15px;
}

#content h1,
#content .withspacer h2 {

  margin-top:10px;
}

#content .smg-gallery {

  margin:30px 0px; padding:0px; max-width:none;
  background-color:transparent; box-shadow:none;
}

#content .smg-gallery-table {

  display:flex; flex-direction:row;
  justify-content:space-between; flex-flow:row wrap;
}

#content .smg-gallery-cell {

  width:260px; max-width:260px; margin:20px 0px; padding:20px;
  background-color:#fff; text-align:center;
  box-shadow: 0px 2px 4px -1px rgba(180,180,180,0.75);
}

#content .smg-gallery-cell img {

  display:block; padding:0px; margin:0px auto; border:0px;
}

#content .smg-gallery-cell h5 {

  margin:20px 0px 10px 0px;
  font-size:16px; line-height:20px;
}

#content .smg-gallery-cell p {

  margin:0px;
}




#content hr {

  display:none;
}

#content img.smg-img-left {

  float:left;
  margin:-38px 50px -25px -45px;
}

#content img.smg-img-right {

  float:right;
  margin:-38px -45px -25px 50px;
}


ul {

  margin:2px 0px;
}

ul.smg-list {

  display:block;
  margin:2px 0px; padding:0px;
  list-style-type:none;
}


ul.smg-list li {

  margin:2px 0px; padding:8px 20px 8px 14px;
  border:1px solid #ff7b2b; border-width:0px 0px 0px 5px;
  background-color:#ebebeb; color:#2c2c2c;
}


a.smg-button {

  display:inline-block; border-radius:5px; padding:6px 32px;
  background-color:#ff7b2b; color:#fff; text-decoration:none;
}


a.smg-button:hover {

  background-color:#2c2c2c;
}



#footer {

  color:#7b7b7b; background-color:#3e3e3e;
  background-image:url(images/bg-footer.jpg);
  background-position:center center; background-repeat:no-repeat;
  background-size:cover;
  border:1px solid #ff7b2b; border-width:0px 0px 6px 0px;
}

#footer a {

  color:#7b7b7b;
}


#footer .innercontent {

  min-height:260px; padding:25px 0px 8px 0px;
}


#footer .footertext {

  padding-left:60px;
}


#footer h4 {

  font-size:22px; line-height:26px; margin:20px 0px 20px 0px;
}


#footer #socialicons ul {

  float:right; height:39px; margin:12px 16px 0px 0px; padding:0px; list-style-type:none;
}

#footer #socialicons ul li {

  float:left; margin:0px; padding:0px 6px; height:39px; overflow:hidden;
}

#footer #socialicons ul li a {

  display:block; width:37px; height:37px; padding:1px;
  background-image:url(images/socialicons.png);
  background-repeat:no-repeat;
}

#footer #socialicons ul li a.fb { background-position:0px 0px; }
#footer #socialicons ul li a.tw { background-position:-51px 0px; }
#footer #socialicons ul li a.xi { background-position:-102px 0px; }
#footer #socialicons ul li a.yt { background-position:-152px 0px; }

#footer #socialicons ul li a span {

  display:none;
}


#footer #footerlogo {

  display:block; float:right;
  width:147px; max-width:147px; height:230px; margin:8px 8px 0px 30px;
}


#footer #footermenu {

  float:right; margin:-37px 150px 0px 0px; padding:0px; list-style-type:none;
}


#footer #footermenu li {

  float:left; height:18px; line-height:18px; padding:0px 14px; margin:0px;
  position:relative; text-transform:uppercase;
  font-size:15px; font-weight:400; font-family:'Roboto', serif;
  border:1px solid #fff; border-width:0px 0px 0px 1px;
}


#footer #footermenu li:first-child {

  border:0px;
}


#footer #footermenu li a {

  color:#fff; text-decoration:none;
}


#footer #footermenu li a:hover {

  text-decoration:underline;
}


#footer #footermenu li ul {

  display:none;
}



#divSiteNav {
  background-color: #0a0607;
  border: 2px solid gainsboro;
  border-radius: 5px;
  cursor: pointer;
  display: none;
  height: 20px;
  margin-left: 15px;
  margin-top: 18px;
  padding: 3px;
  position: fixed;
  width: 20px;
  z-index: 9999;

}    


#btnMobileNav {
  background: gainsboro none repeat scroll 0 0;
  border-radius: 2px;
  box-shadow: 0 7px gainsboro, 0 14px gainsboro;
  display: table;
  height: 3px;
  z-index: 9999;
  margin-top:1px;
  top: 20px;
  width:20px;
}



@media screen and (min-width: 1280px) {

	#main {

		font-size:18px; line-height:25px;
	}

}


@media screen and (max-width: 1005px) {

	.innercontent {
	
		width:100%; margin:auto;
	}

	#main {

		width:auto; margin:0px 15px;
	}

	#content .block {

		width:auto; min-width:0px; max-width:none;
	}

	#content .withspacer {

		margin-top:35px; margin-bottom:20px;
	}

	#content .smg-gallery {

		margin:0px;
	}

	#footer .innercontent {

		padding:15px 0px 0px 0px;
	}

	#footer {

		line-height:20px;	
	}

	#footer h4 {

		font-size:21px; line-height:25px; margin:18px 0px 14px 0px;
	}

	#footer #footerlogo {

		width:20%; height:auto; margin:12px 20px 0px 10px;
	}

	#footer #footermenu {

		float:left; margin:5px 0px 10px 46px;
	}

	#footer #footermenu li {

		font-size:14px;
	}
}


@media screen and (max-width: 980px) {

	body {

		font-size:15px; line-height:21px;	
	}

	#header .toplogo img {

		width:180px; height:auto;
		margin-left:25px; margin-right:20px;
	}

	#header #mainmenu {

		float:left; max-width:none; margin-top:35px;
	}

	#header #mainmenu li {

		padding:0px 14px; font-size:14px;
	}

	#content .block {

		padding:20px 25px;
	}

	#content iframe {
	
		width:100%; max-width:560px;
	}

	#content img.scalemobile {
	
		max-width:800px; width:100%; height:auto;
	}

	#content .smg-gallery {

		padding:0px;
	}

	#content .smg-gallery-cell {

		width:29%; padding:8px;
	}

	#content .smg-gallery-cell img {

		width:100%; height:auto;
	}

	#content img.smg-img-left {

		float:left; width:45%; height:auto;
		margin:-18px 25px 0px -12px;
	}

	#content img.smg-img-right {

		float:right; width:45%; height:auto;
		margin:-18px -12px 0px 25px;
	}

	#footer .footertext {

		padding-left:25px;
	}

	#footer #footerlogo {

		margin-right:25px;
	}

	#footer #footermenu {

		margin-left:11px;
	}

}


@media screen and (min-width: 881px) {

	#mainmenu { display:block !important; }
}


@media screen and (max-width: 880px) {


	h1 { font-size:22px; line-height:26px; }
	h2 { font-size:22px; line-height:26px; }


	#main {

		padding:110px 0px 50px 0px;
	}

	body.hasbgimage #main {

		padding:360px 0px 50px 0px; min-height:300px;
	}

	#postimage {

		height:500px;
		background-position:center bottom;
	}

	#postimageinner {

		width:100%; height:500px;
		background-position:0px 310px;
	}
	
	#header {
	
		height:66px;
	}

	#header .toplogo {

		position:absolute; z-index:9999; top:0px; right:15px;
	}

	#header .toplogo img {

		width:100%; margin:18px 40px 0px 0px;
	}

    #divSiteNav {
    
		display:block !important;
	}


    #header #mainmenu {

        float:none; display:none; max-width:320px; height:auto; padding:0px;
        position:fixed; background-color:#2c2c2c; color:#fff; border:0px;
        margin:0px; padding:56px 0px 10px 0px; z-index:9000;
    }

    #header #mainmenu li,
    #header #mainmenu li.current_page_item,
    #header #mainmenu li.current-menu-parent,
    #header #mainmenu li.current_page_parent,
    #header #mainmenu li.current-menu-item,
	#header #mainmenu .sub-menu li {

		float:none; max-width:300px; height:auto; position:static !important;
		display:block; margin:0px; padding:7px 14px 4px 16px;
		border:1px solid #3c3c3c; border-width:1px 0px 0px 0px; line-height:19px;
	}

	#header #mainmenu > li:last-child {

		padding-bottom:0px;
	}

    #header #mainmenu li a {

		line-height:19px;
	}

	#header #mainmenu > li a,
	#header #mainmenu li:hover a {

		color:#ff7b2b;
	}

	#header #mainmenu li .sub-menu {

		float:none; display:block !important; position:static !important; top:auto; left:auto;
		margin:0px; padding:3px 0px 0px 12px; border:0px; background-color:#2c2c2c; color:#fff;
	}

	#header #mainmenu li .sub-menu li {

		border:0px; padding:3px 0px 3px 0px;
	}

	#header #mainmenu li .sub-menu li a,
	#header #mainmenu li .sub-menu li a:hover,
	#header #mainmenu .sub-menu li.current-menu-item a {

		color:#fff; padding:0px; background-color:transparent;
	}


	#content .smg-gallery {

		padding:0px; width:500px; margin:auto;
	}

	#content .smg-gallery-cell {

		margin:10px 0px;
		width:auto; max-width:220px; padding:10px;
	}
  
	#content .smg-gallery-cell h5 {

		font-size:15px; line-height:18px;
	}

}

@media screen and (max-width: 740px) {

	body {

		font-size:14px; line-height:18px;	
	}

	#content .block {

		padding:15px 20px;
	}

	#content .withspacer {

		margin-top:15px; margin-bottom:10px;
	}

	#content img.smg-img-left {

		display:none;
	}

	#content img.smg-img-right {

		display:none;
	}

	#footer .footertext {

		padding-left:20px;
	}

	#footer #footerlogo {

		margin-right:22px;
	}

	#footer #footermenu {

		margin-left:6px;
	}

}


@media screen and (max-width: 560px) {

	body.hasbgimage #main {

		padding:260px 0px 50px 0px;
	}

	body.home #main {

		padding:110px 0px 50px 0px;
	}

	#header .toplogo img {

		width:95%; margin-right:0px;
	}

	#postimage, #jssor_1 {
	
		display:none;
	}

	#content .block {

		box-shadow:none;
	}

	#postimage {

		height:400px;
		background-position:center bottom;
	}

	#postimageinner {

		width:100%; height:400px;
		background-position:0px 210px;
	}

	#content .smg-gallery {

		padding:0px; width:280px;
	}

	#content .smg-gallery-cell {

		margin:10px 0px; width:260px; max-width:260px;
	}
  
	#content .smg-gallery-cell h5 {

		font-size:15px; line-height:18px;
	}

	#footer #socialicons ul {

		float:none; margin:6px 0px 0px 13px;
	}

	#footer #footerlogo {

		display:none;
	}

}