html {
 height: 100%;

 }

body{
 margin:0;
 padding:0;
 background:#fff;
 font-size:1em;
 color:#0c0c0c;
 font-family: 'Open sans',tahoma, arial, sans-serif;
 font-weight:normal;
 position: relative;
 }

p {
  font-size: 100%;
  padding: 0px 0px;
}

h1 {
  font-size: 3em;
  text-transform: uppercase;
  font-family: calibri;
  margin: 10px 15px 15px 15px;
  text-align: center;
}

.rectangle-list{
  margin: 0px 10px;
}

.adsbygoogle.adsbygoogle-noablate {
	margin-left: 0px !important;
}

.blog-featured h1, .blog h1 {
  font-family: calibri;
  letter-spacing: 0.3em;
  text-align: center;
  font-size: 2.5em;
  margin-top: 25px;
  color: #123241;
  margin: 10px;
  font-weight: lighter;
}

h2 {
  font-family: calibri;
  font-size: 2em;
  text-transform: uppercase;
  margin: 50px 0px 15px 0px;
  font-weight: 100;
  text-decoration: underline;
  letter-spacing: -1px;
}

h2 a {
  font-weight: 200 !important;
}

.blog h2, .blog-featured h2{
  margin-top: 0px;
  text-decoration: none;
}

.blog img + h2, .blog-featured img + h2{
  position: relative;
  left: -97px;
}

.blog img + h2 + .article-info, .blog-featured img + h2  + .article-info{
  position: relative;
  left: -95px;
  top: -10px;
}

.tag-category h2:before{
  content: "\00a0 \00a0 \00a0";
}

.tag-category h2{
  margin-top: 25px;
  text-decoration: none;
  border-bottom: 8px solid #28AA8C;
  color: #28AA8C;
  position: relative;
  left: -31px;
  padding-bottom: 5px;
  margin-bottom: 0px;
  display: block
}

h3 {
  font-size: 1.3em;
  margin: 35px 10px 15px 10px;
  font-weight: 300;
}

h3 a {
  font-weight: 300 !important;
}

.tag-category h3 {
  margin: 15px 0;
}

h4, h5, h6 {
 font-size: 100%;
}

a:link, a:visited {
  text-decoration:none;
  color:#525252;
  font-weight:bold;
}

a:hover {
  color:#658896;
  opacity: 0.8;
  letter-spacing: 0px
}

ol {
  counter-reset: li; /* Initiate a counter */
  list-style: none; /* Remove default numbering */
  *list-style: decimal; /* Keep using default numbering for IE6/7 */
  font: 15px 'trebuchet MS', 'lucida sans';
  padding: 0;
  margin-bottom: 2em;
}

figcaption {
    font-style: italic;
}

.video-container {
	position:relative;
	padding-bottom:56.25%;
	height:0;
	overflow:hidden;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:10px;
	left:10px;
	width:100%;
	height:100%;
}

.item-image {
  position: relative;
}

.item-image {
  clear both;
  margin-top: 15px;
}

.row{
  display: flex;
  display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
  display: -webkit-flex;
}

.download img {
  position: relative;
  top: 20px;
  left: 0px;
  margin-right: 15px;
}

#jcemediabox-popup-caption{
  text-align: center;
}

.rectangle-list li{
    position: relative;
    display: block;
    padding: .4em .4em .4em .8em;
    *padding: .4em;
    margin: .5em 0 .5em 2.5em;
    background: #ddd;
    color: #444;
    text-decoration: none;
    transition: all .3s ease-out;
}

.rectangle-list a:before{
    content: counter(li);
    counter-increment: li;
    position: absolute;
    left: -2.5em;
    top: 50%;
    margin-top: -1em;
    background: #711B1B;
    height: 2em;
    width: 2em;
    line-height: 2em;
    text-align: center;
    font-weight: bold;
    color: #FFF;
}

.rectangle-list a:after{
    position: absolute;
    content: '';
    border: .5em solid transparent;
    left: -1em;
    top: 50%;
    margin-top: -.5em;
    transition: all .3s ease-out;
}

.rectangle-list a:hover:after{
    left: -.5em;
    border-left-color: #711B1B;
}

.article-info{
  display: flex;
  font-size: 0.8em;
}

.article-info dd {
  margin: 0px 15px;
}

.article-info [itemprop=author]{
  margin-left: 0px;
}

ul {
  margin:0;
  padding-left:20px;
}

ul.breadcrumb{
  float: left;
  width: 100%;
  display: block;
  margin-bottom: 50px;
  font-size: 0.8em;
}

ul.breadcrumb li{
  float: left;
  display: block;
}

ul.breadcrumb li span {
  position: relative;
  top: 5px;
}

ul.breadcrumb li span img {
  position: relative;
  top: -2px;
}

ul.breadcrumb li.active span.icon-location {
  background: url('../images/breadcrumbs_home.png');
  width: 16px;
  height: 16px;
  display: block;
  float: left;
  margin-right: 10px;
  position: relative;
  top: 5px;
}


.tag-category ul{
  padding: 0;
}

.tag-category ul li {
  margin: 0;
}

ul.tags {
  padding: 0px;
  display: flex;
  display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
  display: -webkit-flex;
  /*! font-size: 0.7em; */
  /*! float: right; */
  /*! position: relative; */
  /*! top: -31px; */
}

.tags.inline li {
  margin: 0px;
  margin-right: 5px;
}

.tags.inline li a {
  background: #711b1b;
  color: #fff;
  padding: 5px;
  font-family: arial;
  font-size: 0.6em;
}

 li {
 list-style-type:none;
 background:transparent;
 margin: 4px;
}

img {
  padding:0;
  margin: 0;
  max-width: 100%;
  /*! border: 1px solid #000; */
  /*! margin: 5px; */
}

img .caption {
  text-align: left;
}

a{
  opacity: 1;
  transition-property: opacity, letter-spacing;
  transition-duration: 0.5s;
}

.highlight{
  background:#727884;
  padding: 0px 2px 0px 2px;
  color:#ffffff;
}

.button {
  background:#727884;
  border:none;
  color:#fff;
  font-weight:bold;
  padding:4px;
}

.inputbox {
 color:#fff;
 background:#727884;
 border:none;
 padding:4px;
 font-weight:bold;
}

img.cat-int{
  width: 5000px;
  opacity: 0.1;
}

.container{
  display: flex;
  display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
  display: -webkit-flex;
  justify-content: center;
  -webkit-justify-content: center;
  -webkit-box-pack: center;
  /*! background: #1a1a22; */

}

.main-wrapper, .blog, .blog-featured{
  position: relative;
  max-width: 900px;
  margin-top: 30px;
}

 fieldset {
   margin:5px;
   padding:5px;
   border:none;
}

 #header {
 background:#123241;
 z-index: 1000;
 /*! position: fixed; */
 width: 100%;
 }

 #sitename {
 color:#a10606;
 font-size: 1.5em;
 display: block;
 margin: 15px;
 outline:none !important;
 background: none !important;
 z-index: 1;
 }

#sitename::first-letter{
  background: #a10606;
  color: #000;
  padding: 2px;
  border-radius: 30px;
 }

 a#sitename:hover {

 }

 #logo{
   padding: 5px;
 }

.page-header{
  padding-bottom: 0px;
  margin: 0px;
}

#main {
  z-index: 1;
  max-width: 900px;
}

.tag-category {
  margin-bottom: 32px;
  padding-left: 25px;
  border-left: 10px solid #28AA8C;
}

#left{
  width: 100%;
}

#right{
  padding: 30px 15px;
  position: relative;
}

#footer{
  padding: 30px;
  text-align: center;
  position: relative;
  color: #FFF;
  border-top: 1px solid #262626;
  background: #13101B;
}

.navigation ul li a {
  font-weight : 100;
  font-size : 16px;
  text-transform : uppercase;
  color: #FAFAFA;
}

.mod-languages {

  margin-left: 47px;
}

.mod-languages ul.lang-inline li {
  padding: 0px;
  margin: 28px 6px 0px 0px;
}

.mod-languages ul li a{
  padding: 0px;
  position: relative;
  z-index: 1;
}

.mod-languages ul li a img{
  width: 15px;
}

#cat-int-cont {
  /*! min-height: 365px; */
  position: fixed;
}

.cat-int{
  background: #1B6561;
  opacity: 0.65;
}

.category-desc{
  font-size: 2.6em;
  font-family: oswald;
  color: #FFF;
}

.blog .item p {
  margin: 0px;
  margin-top: 15px;
}

.items-row{
  padding: 25px 35px 15px;
  background: #fff;
  margin-bottom: 35px;
  border: 1px solid #EEE;
}

img.cat-img-list{
  border: none;
  float: left;
  height: 95px;
  position: relative;
  top: -9px;
  left: -107px;
  border-radius: 50px;
}

a.readmore {
  font-size: 2em;
  transition: letter-spacing, font-size;
  transition-duration: 0.2s;
}

a.readmore:hover{
  letter-spacing: 4px;
}

 .counter {
 text-align:center;

 }

.category-name{

  padding-bottom: 5px;
  border-bottom: 1px solid #eee;
  margin: 35px 0px 5px 0px;
  font-family: oswald;
  text-transform: uppercase;
  clear: both;
}

 .pagination   {
 padding: 8px;
 margin:20px 0 0 0;
 overflow: hidden;
 background:transparent;
  border-top:1px solid #dcdcdc;
  border-bottom:1px solid #dcdcdc;
 text-align:center;
 }

 .pagination li   {
display:inline;
 margin: 0;
 padding: 8px;
 margin:0px;
 overflow: hidden;
text-align:center;


 }

 .pagination li span {
 padding: 6px;
 line-height: 20px;

 }

 .pagination li a {
 line-height: 20px;
 padding:7px;
 text-decoration: none;
 background:#fff;
 color:#000;
 border-left:1px solid #dcdcdc;
  border-right:1px solid #dcdcdc;
 }

 .pagination li a:hover, .pagination li a:active,
 .pagination li a:focus {
 text-decoration: none;
 color: #878787;

 }

 ul.pager.pagenav {
  float:left;
  background:transparent;
  width:100%;
  margin:15px 0 0 0;
  padding:0;
}

.pager .next  {
	float: right;
}
.pager .previous  {
	float: left;
}

.result-title {
 padding:10px;
 }

 .items-more {
 margin-left:70px;

}

 .items-more h3{
 margin-left:40px;

}

.items-more ul{
 margin-left:0px;

}

.items-more ol li a{
  background : url(../images/bg-right.jpg) no-repeat 0px 2px !important;
  color: #000 ;
  padding-left:20px;
  margin-left:0px;

}

.items-more ol li a:hover,
.items-more ol li a:active,
.items-more ol li a:focus{
  color:#727884;
}

.dropdown-menu {
float:left;
text-align:left;
width:80px;

}

li.print-icon a {
float:left;

}

.print-icon  {
 float:left;

}


 ul.pagenav {
 position:relative;

}

ul.pagenav li {
 list-style: none;
 padding: 8px;
 background:#000;
color:#fff;
border-radius:5px;

}

ul.pagenav li a{
color:#fff;

}

ul.pagenav li:hover, ul.pagenav li:focus {
background:#878787;
color:#fff;
padding: 8px;

}

ul.pagenav li.pagenav-prev {
float: left;

}

ul.pagenav li.pagenav-next {
float:right;

}

#right .moduletable,
#right .moduletable_menu {
float:left;
width:200px;
 background:transparent;
margin-bottom:20px;
padding:12px 10px 12px 15px;
text-align:left;

}

#right .moduletable h3,
#right .moduletable_menu h3 {
 font-family: Oswald,tahoma, arial, sans-serif;
 font-size:22px;
 padding:0;
 margin:0 0 10px 0;
 text-transform:uppercase;
 text-align:left;
}

#right .moduletable ul,
#right .moduletable_menu ul {
 padding-left:0px;

}

#right .moduletable a,
#right .moduletable_menu a {
 font-weight:normal;
 background : url(../images/bg-right.jpg) no-repeat 0px 14px ;
 padding-left:20px;
 padding-top:11px;
 font-size:14px;
}

#wrapper-box {
  float:left;
  width:100%;
}

.box{
float:left;
width:220px;
padding-bottom:20px;
margin-top:0px;
padding-top:15px;
text-align:left;
margin-left:20px;

}

.box .moduletable_menu h3,
.box .moduletable h3,
.box h3 {
font-size:16px;
text-transform:uppercase;
text-align:left;
font-weight:bold;
margin-left:10px;
color:#fff;

}

.box .moduletable_menu ,
.box .moduletable ,
.box  {
padding-bottom:10px;
font-size:12px;
color:#fff;

}

.box .moduletable_menu a,
.box .moduletable a,
.box a {
font-weight:normal;
font-style:italic;
font-size:13px;
color:#fff;

}

.box .moduletable_menu a:hover,
.box .moduletable a:hover,
.box a:hover {
color:#ccc;

}

.item-page{
  background: #FFF;
  padding: 30px;
/*   border-left: 1px solid #ddd; */
/*   border-right: 1px solid #ddd; */
}


/* screen resolution more than 600px -->  */
@media screen and (min-width: 600px){

  #small-menu-container {
    display: none;
  }

  #main-menu{
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
    -webkit-box-pack: center;
  }

  .navigation a.home-studio {
/*     background: url('../images/icon_menu_studio-normal.png') no-repeat; */
/*     padding: 14px 15px 14px 48px; */
    background-position: 5px 8px;
  }

  .navigation a.midi-controllers {
/*     background: url('../images/icon_menu_midi-normal.png') no-repeat; */
/*     padding: 14px 15px 14px 48px; */
    background-position: 5px 8px;
  }

  .navigation a.music-production {
/*     background: url('../images/icon_menu_music-normal.png') no-repeat; */
/*     padding: 14px 15px 14px 48px; */
    background-position: 5px 8px;
  }

  .navigation a.djing {
/*     background: url('../images/icon_menu_dj-normal.png') no-repeat; */
/*     padding: 14px 15px 14px 48px; */
    background-position: 5px 8px;
  }

  .navigation li.active a {
    border-bottom: 4px solid #1B635F;
    color:#fff;
    /*! padding-top: 14px; */
    font-size: 18px;
  }

  .default>a, .default>a:hover {
    background: url('../images/logo_main.svg') no-repeat center !important;
    opacity: 1;
    width: 86px;
    height: 50px;
    border: none !important;
    outline: none !important;
    font-size: 0px !important;
    padding-right: 0px !important;
    margin-left: 15px;
    margin-right: 15% !important;
  }

  .navigation {
    width: 100%;
    font-family: Oswald,tahoma, arial, sans-serif;
  }

 .navigation ul {
   list-style : none;
   padding : 0;
   display: flex;
   display: -webkit-box;
   display: -moz-box;
   display: -ms-flexbox;
   display: -webkit-flex;
   justify-content: center;
   -webkit-justify-content: center;
   -webkit-box-pack: center;
   z-index: 1;
   align-items: center;
   max-width: 1200px;
 }

 .navigation ul li {
   padding : 0;
   list-style : none;
   margin-left: 20px;
 }
  
  .navigation ul li.default a {
    padding: 8px 25px;
  }

 .navigation ul li ul {
    width : 200px;
    position : absolute;
    z-index : 99;
    left : -999em;
    height : auto;
    width : 200px;
    background : #fff;
    margin-top : 5px;
    padding-bottom : 5px;
    padding-top : 0px;
    text-align : left !important ;
    border:1px solid #0c0c0c;
  }

  .navigation ul li ul ul {
    margin : 0;
  }

  .navigation ul li li {
    padding : 0;
    margin : 0;
    width : 100%;
  }

  .navigation ul ul a {
    width : 100%;
  }

  .navigation ul li a {
    display : block;
    padding: 5px 10px;
  }

  .navigation a:hover {
    outline: 1px solid #1B635F;
    opacity: 1;
  }

  .navigation ul li ul li {
    height : 41px !important ;
  }

 .navigation ul li ul li a:hover,
 .navigation ul li ul li.active a {
   height : 38px !important ;
   width:155px !important;
 }

 .navigation ul li ul li a {
   padding-left : 31px;
   background :transparent;
   border:none;
 }

 .navigation ul li ul li:hover {
   background : transparent;
 }

 .navigation li.active ul li a {
   border:none !important;
   background : none;
   color:#000;
 }

  .navigation li.active ul li a:hover {
   border:none !important;
   background :#000;
   color:#fff;
   width:158px !important;
 }

 .navigation ul li ul li.active span {
   background : none;
 }

 .navigation ul li ul li.active a {
   background : none;
 }

 .navigation ul li ul li ul {
   margin-left : 180px;
   margin-top : -30px;
   padding-top : 0;
   text-align : left !important ;
 }
}

/*  Screen resolution 0px -> 600px*/
@media screen and (max-width: 600px){

  #small-menu-logo {
    max-height: 35px;
    padding: 15px 0px;
  }

  #small-menu-container {
    display: flex;
    /*! flex-direction: row; */
  }

  #small-menu-container a {
    width: 134px;
    text-align: right;
    padding-right: 25px;
    position: absolute;
    right: 0;
  }

  .menu-button{
    color: #FFF;
    z-index: 1000;
    padding: 15px;
    position: relative;
    top: 3px;
  }

  .menu-button:hover{
    cursor: pointer;
  }

  .menu-button span:nth-child(1){
    display: block;
    width: 40px;
    border-top: 6px solid #fff;
  }

  .menu-button span:nth-child(2){
    display: block;
    width: 40px;
    border-top: 5px solid #fff;
    margin-top:8px;
  }

  .menu-button span:nth-child(3){
    display: block;
    width: 40px;
    border-bottom: 5px solid #fff;
    margin-top:8px;
  }

  #main-menu ul {
    display: none;
    padding: 0;
    border-top: 1px solid #092c33;
    animation: fadeOut 1s;
    background: none;
    z-index: 0;
  }

  #main-menu ul.on{
    display: block;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 0.5s;
    position: absolute;
    z-index: 1000;
    background: #103F46;
  }

  #main-menu ul li {
    border-bottom: 1px solid #2b535b;
    padding: 19px;
    margin: 0px 15px;
  }

  #main-menu ul li:last-child {
    border: none;
  }

  .item-image{
    /*! display: none; */
  }
}

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

  .main-wrapper{
    width: 65%;
  }

}


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

  .blog-featured h1, .blog h1 {
    letter-spacing: 0em;
  }
  
  .blog h2, .blog-featured h2{
    text-decoration: none;
    text-align: left;
    margin: 25px 25px 10px 25px;
  }
  
  h2{
    margin: 50px 15px 15px 15px;
  }

  img.cat-int,#cat-int-cont{
    display: none;
  }

  img{
    margin: 0px 15px;
  }

  .download img{
    margin: 0px 5px 0px 0px; 
  }

  .container{
    display: block;
  }

  .items-row{
    padding:0;
    background: #fff;
    margin-bottom: 0px;
    border: none;
    border-top: 15px solid #DDD;
    box-shadow: none;
  }
  
  .items-row .item {
    padding-bottom: 15px;
  }
  
  .item-page{
    background: #FFF;
    padding: 0px;
  }

  .item-image {
    padding: 0px 15px;
  }

  .blog-featured, .blog {
    margin-top: 0;
  }
  
  .article-info{
    padding: 0px 15px;
    justify-content: left;
  }
  
  p{
    padding: 0px 15px;
  }
  
  a.readmore {
    margin-left: 15px;
    margin-bottom: 15px;
    font-size: 1em;
  }
  
  ul.tags {
    margin-left: 15px;
  }

  .video-container iframe, .video-container object, .video-container embed {
    position:absolute;
    top:10px;
    left:10px;
    width:91%;
    height:91%;
  }

  .rectangle-list{
    margin: 0px 25px;
  }

  table{
    margin: 0px 15px;
  }

  #footer{
    top: 15px;
  }
}


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

  .main-wrapper{
    width: 55%;
  }

}

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

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

@-webkit-keyframes fadeOut {
    from { opacity: 1; }
      to { opacity: 0; }
}
@keyframes fadeOut {
    from { opacity: 1; }
      to { opacity: 0; }
}