* {
  margin: 0;
  padding: 0;
  }
  
@-webkit-viewport { width: device-width; }
@-moz-viewport { width: device-width; }
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }

html {
    
  }

a {
   color:#00a6cc; 
   text-decoration:none;  
  }

  
body {
  color: #000;
  font-family:Open Sans, Arial, Verdana;
  margin: 0 auto;
  max-width: 1920px;
  _width: 1920px;
  padding: 0 0px;
  text-align: center;
  -webkit-font-smoothing: antialiased;
  background: url("https://www.borislavbogdanov.com/img/body_bgr.jpg") no-repeat top center #fff ;
  
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font: normal 100%/1.4 sans-serif;
  
  }

#wrapper {
  float: left;
  width: 100%;
  border:0px solid #930;
  margin-top:120px;
  }
  
#top {
  float: left;
  width: 100%;
  height:80px;
  position:fixed;
  left:0;
  -webkit-font-smoothing: antialiased;
  background: url("https://www.borislavbogdanov.com/img/top_bgr.png") no-repeat top center ;
  z-index:10;
  padding-top:10px;

  }
#top_image {
  float: left;
  width: 100%;
  height:90px;
  background: url("https://www.borislavbogdanov.com/img/element.png") no-repeat bottom right ;

}  
  
.nav-collapse,
.nav-collapse * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border:0px solid #936;
  
}

.nav-collapse,
.nav-collapse ul {
  list-style: none;
  float: right;
  width: 100%;
  
}
@media screen and (min-width: 40em) {
.nav-collapse,
.nav-collapse ul {
  list-style: none;
  width: 65%;
  float: right;
}
}
.nav-collapse li {
  float: left;
  width: 100%;
  background:#13677a;

 
}
@media screen and (min-width: 40em) {
.nav-collapse li {
  float: left;
  width: 100%;
  background:none;

}
}
@media screen and (min-width: 40em) {
  .nav-collapse li {
    width: 28%;
    *width: 24.9%; /* IE7 Hack */
    _width: 19%; /* IE6 Hack */
  }
}

.nav-collapse a {
  color: #000;
  text-decoration: none;
  width: 100%;
  border-bottom: 1px solid #4baec5;
  padding: 0.5em !important;
  float: left;
  font-size: 22px;
  font-weight:bold;
  color:#fff;
	text-align:left;
}

.nav-collapse a:hover {
	background:#0f505f;
}

@media screen and (min-width: 40em) {
	.nav-collapse a:hover {
	border-bottom:1px solid #fe5956;
	padding-bottom:20px;
	background:none;
}
}

@media screen and (min-width: 40em) {
  .nav-collapse a {
    margin: 0;
    padding: 0em !important;
    float: left;
	width: 100%;
    text-align: right;
    border-bottom: 0;
    border-right: 0px solid white;
	color:#000;
  }
}

.nav-collapse ul ul a {
  background: #13677a;
  padding-left: 0em;
  
}

@media screen and (min-width: 40em) {
  .nav-collapse ul ul a {
    display: none;
  }
}

.nav-toggle {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 30px;
  height: 30px;
  float: right;
  text-indent: -9999px;
  overflow: hidden;
  background: #13677a url("https://www.borislavbogdanov.com/img/hamburger.gif") no-repeat 50% 50%;
}

@media screen and (-webkit-min-device-pixel-ratio: 1.3), screen and (min--moz-device-pixel-ratio: 1.3), screen and (-o-min-device-pixel-ratio: 2 / 1), screen and (min-device-pixel-ratio: 1.3), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
  .nav-toggle {
    background-image: url("https://www.borislavbogdanov.com/img/hamburger-retina.gif");
    -webkit-background-size: 100px 100px;
    -moz-background-size: 100px 100px;
    -o-background-size: 100px 100px;
    background-size: 100px 100px;
  }
}

  
  
  
  
  
  
  
  
#about {
  float: left;
  width: 100%;
  min-height:642px;
  background: url("https://www.borislavbogdanov.com/img/about_bgr.png") no-repeat top center; 
  background-size:cover;
  margin-top:-50px;
  padding-top:30px;
}
@media screen and (min-width: 40em) {
#about {
  float: left;
  width: 100%;
  min-height:642px;
  background: url("https://www.borislavbogdanov.com/img/about_bgr.png") no-repeat top center; 
  background-size:cover;
}
} 
.about {
  margin:0 auto;
  padding:0;
  width: 100%;
  max-width:960px;
  padding-top:50px;
  color:#FFFFFF;
  font-size:16px;
  min-height:592px;
  border:0px solid #FF0;
}

@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.about {
  width: 90%;
  margin:0 auto;
  padding:0;
  padding-top:90px;
  min-height:532px;
  color:#FFFFFF;
  font-size:18px;
  font-weight:normal;
  border:0px solid #FF0;
} 
} 

@media only screen  and (min-width: 640px) and (max-width: 768px) {  
.about {
  width: 90%;
  margin:0 auto;
  padding:0;
  padding-top:90px;
  min-height:532px;
  color:#FFFFFF;
  font-size:18px;
  font-weight:normal;
  border:0px solid #FF0;
} 
}

@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.about {
  width: 90%;
  margin:0 auto;
  padding:0;
  padding-top:50px;
  min-height:532px;
  color:#FFFFFF;
  font-size:18px;
  font-weight:normal;
  border:0px solid #FF0;
} 
}

@media only screen  and (min-width: 320px) and (max-width: 480px) {
.about {
 width: 90%;
  margin:0 auto;
  padding:0;
  padding-top:50px;
  min-height:532px;
  color:#FFFFFF;
  font-size:18px;
  font-weight:normal;
  border:0px solid #FF0;
} 
}

 
.txt {
  text-align:left;
  min-height:400px;
  border:0px solid #000;
  font-size:17px;
  padding-top:25px;
  line-height:1.35;
}
@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.txt {
  text-align:left;
   min-height:392px;
   border:0px solid #000;
   font-size:16px;
   padding-top:0px;
   padding-bottom:85px;
} 
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.txt {
  text-align:left;
   min-height:392px;
   border:0px solid #000;
   font-size:15px;
    padding-top:0px;
    padding-bottom:85px;
} 
}

@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.txt {
  text-align:left;
   min-height:350px;
   border:0px solid #000;
   font-size:14px;
    padding-top:0px;
    padding-bottom:85px;
} 
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.txt {
  text-align:left;
   min-height:362px;
   border:0px solid #000;
   font-size:14px;
    padding-top:10px;
	padding-left:10px;
	padding-right:10px;
    padding-bottom:45px;
} 
}
.email {
  text-align:right;
  font-size:37px;
  font-weight:bold;
  color:#000;
 
}
.email a.mail { 
  text-decoration:none;
  padding-right:70px;
  background: url("https://www.borislavbogdanov.com/img/contact_icon.jpg") no-repeat right top; 
}
.email a:hover.mail { 
  background: url("https://www.borislavbogdanov.com/img/contact_icon_hover.jpg") no-repeat right top;
}
@media screen and (min-width: 40em) {
.email{
  text-align:right;
  font-size:40px;
  font-weight:bold;
  color:#000;
} 
}
@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.email {
  text-align:right;
  font-size:22px;
  font-weight:bold;
  color:#000; 
  padding-left:10px;
  padding-right:10px;  
}
.email a.mail { 
  text-decoration:none;
  padding-right:38px;
  background: url("https://www.borislavbogdanov.com/img/contact_icon2.jpg") no-repeat right top; 
}
.email a:hover.mail { 
  background: url("https://www.borislavbogdanov.com/img/contact_icon_hover2.jpg") no-repeat right top;
} 
}

.hi {
  font-size:55px; 
  font-weight:bold;
  
}


@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.hi{
  font-size:36px; 
  font-weight:bold;
  line-height:40px;
} 
}




  
#projects {
  float: left;
  width: 100%;
}
@media screen and (min-width: 40em) {
#projects {
  float: left;
  width: 100%;
 
}
} 
.projects {
  margin:0 auto;
  padding:0;
  width: 100%;
  padding-top:10px;
  border:0px solid #FF0;
  min-height:250px;
  padding-bottom:20px;
  display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

@media screen and (min-width: 40em) {
.projects {
  width: 100%;
  margin:0 auto;
  padding:0;
  padding-top:10px;
    padding-bottom:20px;
  border:0px solid #FF0;
  display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
} 
}

.games {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
  width: 300px;
  height: 300px;
  background:#000;
  
}
.image_game {
  width: 300px;
  height: 240px;
  background: url("https://www.borislavbogdanov.com/img/game.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}

@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.games {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 226px;
  height: 226px;
 
}
.games h1 {
  font-size:34px !important;
  line-height:34px !important;
 
}
.image_game {
  width: 226px;
  height: 188px;
  background: url("https://www.borislavbogdanov.com/img/game2.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.games {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 193px;
  height: 193px;
 
}
.games h1 {
  font-size:32px !important;
  line-height:34px !important;
 
}
.image_game {
  width: 193px;
  height: 154px;
  background: url("https://www.borislavbogdanov.com/img/game3.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
} 
@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.games {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
  width: 140px;
  height: 140px;
 
}
.games h1 {
  font-size:26px !important;
  line-height:22px !important;
 
}
.image_game {
  width: 140px;
  height: 112px;
  background: url("https://www.borislavbogdanov.com/img/game4.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.games {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:18px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:5px;
  margin-top:20px;
   width: 95px;
  height: 300px;
  background:#000;
 
}
.games h1 {
  font-size:20px !important;
   font-weight:bold;
  line-height:50px !important;
 
}
.image_game {
  width: 95px;
  height: 240px;
  background: url("https://www.borislavbogdanov.com/img/game5.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}
    

.design {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
  width: 300px;
  height: 300px;
  background:#000;
  
}
.image_design {
  width: 300px;
  height: 240px;
  background: url("https://www.borislavbogdanov.com/img/design.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}

@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.design {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 226px;
  height: 226px;
 
}

.design h1 {
  font-size:34px !important;
  line-height:34px !important;
 
}
.image_design {
  width: 226px;
  height: 188px;
  background: url("https://www.borislavbogdanov.com/img/design2.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.design {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 193px;
  height: 193px;
 
}
.design h1 {
  font-size:32px !important;
  line-height:34px !important;
 
}
.image_design {
  width: 193px;
  height: 154px;
  background: url("https://www.borislavbogdanov.com/img/design3.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
} 
@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.design{
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 140px;
  height: 140px;
 
}
.design h1 {
  font-size:26px !important;
  line-height:22px !important;
 
}
.image_design {
  width: 140px;
  height: 112px;
  background: url("https://www.borislavbogdanov.com/img/design4.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.design {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:18px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:5px;
  margin-top:20px;
   width: 95px;
  height: 300px;
  background:#000;
 
}
.design h1 {
  font-size:20px !important;
   font-weight:bold;
  line-height:50px !important;
 
}
.image_design {
  width: 95px;
  height: 240px;
  background: url("https://www.borislavbogdanov.com/img/design5.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}






.art {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
  width: 300px;
  height: 300px;
  background:#000;
  
}
.image_art {
  width: 300px;
  height: 240px;
  background: url("https://www.borislavbogdanov.com/img/art.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}

@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.art {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 226px;
  height: 226px;
 
}
.art h1 {
  font-size:34px !important;
  line-height:34px !important;
 
}
.image_art {
  width: 226px;
  height: 188px;
  background: url("https://www.borislavbogdanov.com/img/art2.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.art {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 193px;
  height: 193px;
 
}
.art h1 {
  font-size:32px !important;
  line-height:34px !important;
 
}
.image_art {
  width: 193px;
  height: 154px;
  background: url("https://www.borislavbogdanov.com/img/art3.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
} 
@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.art {
  text-align:center;
    display: inline-block;
  background:#000;
  color:#FFFFFF;
  font-size:48px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 140px;
  height: 140px;
 
}
.art h1 {
  font-size:26px !important;
  line-height:22px !important;
 
}
.image_art {
  width: 140px;
  height: 112px;
  background: url("https://www.borislavbogdanov.com/img/art4.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.art {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:18px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:5px;
  margin-top:20px;
   width: 95px;
  height: 300px;
  background:#000;
 
}
.art h1 {
  font-size:20px !important;
   font-weight:bold;
  line-height:50px !important;
 
}
.image_art {
  width: 95px;
  height: 240px;
  background: url("https://www.borislavbogdanov.com/img/art5.jpg") no-repeat left top;
  display:block;
  text-decoration:none;
  
}
}








/* active categories */

.games_active {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:40px;
  font-weight:bold;
  border:0px solid #000;
  margin-right:20px;
  margin-top:20px;
  width: 300px;
  height: 300px;
  background: url("https://www.borislavbogdanov.com/img/active.jpg") no-repeat left bottom #dedede;  
}
.image_game_active {
  width: 300px;
  height:240px;
  color:#000; 
  display:block;
  text-decoration:none;
  
}


@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.games_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:34px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 226px;
  height: 226px;
  background: url("https://www.borislavbogdanov.com/img/active2.jpg") no-repeat left bottom #dedede; 
 
}

.image_game_active {
  width: 226px;
  height: 188px;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.games_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:32px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 193px;
  height: 193px;
  background: url("https://www.borislavbogdanov.com/img/active3.jpg") no-repeat left bottom #dedede; 
 
}

.image_game_active {
  width: 193px;
  height: 154px;
  display:block;
  text-decoration:none;
  
}
} 
@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.games_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:26px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 140px;
  height: 140px;
  background: url("https://www.borislavbogdanov.com/img/active4.jpg") no-repeat left bottom #dedede; 
 
}

.image_game_active {
  width: 140px;
  height: 112px;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.games_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:20px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:5px;
  margin-top:20px;
   width: 95px;
  height: 300px;
  background: url("https://www.borislavbogdanov.com/img/active5.jpg") no-repeat left bottom #dedede; 
 
}

.image_game_active {
  width: 95px;
  height: 240px;
  display:block;
  text-decoration:none;
  
}
}

.design_active {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:40px;
  font-weight:bold;
  border:0px solid #000;
  margin-right:20px;
  margin-top:20px;
  width: 300px;
  height: 300px;
  background: url("https://www.borislavbogdanov.com/img/active.jpg") no-repeat left bottom #dedede;  
}
.image_design_active {
  width: 300px;
  height:240px;
  color:#000; 
  display:block;
  text-decoration:none;
  
}


@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.design_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:34px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 226px;
  height: 226px;
  background: url("https://www.borislavbogdanov.com/img/active2.jpg") no-repeat left bottom #dedede; 
 
}

.image_design_active {
  width: 226px;
  height: 188px;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.design_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:32px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 193px;
  height: 193px;
  background: url("https://www.borislavbogdanov.com/img/active3.jpg") no-repeat left bottom #dedede; 
 
}

.image_design_active {
  width: 193px;
  height: 154px;
  display:block;
  text-decoration:none;
  
}
} 
@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.design_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:26px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 140px;
  height: 140px;
  background: url("https://www.borislavbogdanov.com/img/active4.jpg") no-repeat left bottom #dedede; 
 
}

.image_design_active {
  width: 140px;
  height: 112px;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.design_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:20px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:5px;
  margin-top:20px;
   width: 95px;
  height: 300px;
  background: url("https://www.borislavbogdanov.com/img/active5.jpg") no-repeat left bottom #dedede; 
 
}
.image_design_active {
  width: 95px;
  height: 240px;
  display:block;
  text-decoration:none;
  
}
}


.art_active {
  text-align:center;
  display: inline-block;
  color:#FFFFFF;
  font-size:40px;
  font-weight:bold;
  border:0px solid #000;
  margin-right:20px;
  margin-top:20px;
  width: 300px;
  height: 300px;
  background: url("https://www.borislavbogdanov.com/img/active.jpg") no-repeat left bottom #dedede;  
}
.image_art_active {
  width: 300px;
  height:240px;
  color:#000; 
  display:block;
  text-decoration:none;
  
}


@media only screen  and (min-width: 768px) and (max-width: 980px) { 
.art_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:34px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 226px;
  height: 226px;
  background: url("https://www.borislavbogdanov.com/img/active2.jpg") no-repeat left bottom #dedede; 
 
}

.image_art_active {
  width: 226px;
  height: 188px;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 640px) and (max-width: 768px) { 
.art_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:32px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 193px;
  height: 193px;
  background: url("https://www.borislavbogdanov.com/img/active3.jpg") no-repeat left bottom #dedede; 
 
}

.image_art_active {
  width: 193px;
  height: 154px;
  display:block;
  text-decoration:none;
  
}
} 
@media only screen  and (min-width: 480px) and (max-width: 640px) { 
.art_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:26px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:20px;
  margin-top:20px;
   width: 140px;
  height: 140px;
  background: url("https://www.borislavbogdanov.com/img/active4.jpg") no-repeat left bottom #dedede; 
 
}

.image_art_active {
  width: 140px;
  height: 112px;
  display:block;
  text-decoration:none;
  
}
}

@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.art_active {
  text-align:center;
    display: inline-block;
  color:#FFFFFF;
  font-size:20px;
  font-weight:bold;
  border:0px solid #fff;
  margin-right:5px;
  margin-top:20px;
   width: 95px;
  height: 300px;
  background: url("https://www.borislavbogdanov.com/img/active5.jpg") no-repeat left bottom #dedede; 
 
}
.image_art_active {
  width: 95px;
  height: 240px;
  display:block;
  text-decoration:none;
  
}
}



.category_projects {
  max-width: 960px;
  background:#dedede;
  padding-top:20px;
  padding-bottom:20px;
  margin: 0 auto;
  margin-bottom:20px;
  
}

.game_description {
  max-width: 960px;
  padding-bottom:20px;
  text-align:left;
  padding-left:20px; 
  padding-right:20px; 
}
#anch{
display:block;
margin-top: -4em;
    position: absolute;
}

#pr{
display:block;
margin-top: -4em;
    position: absolute;
}

#footer {
  float: left;
  width: 100%;
  margin-top:50px;
}
#footer a{
  color:#cccccc;
}
@media screen and (min-width: 40em) {
#footer {
  float: left;
  width: 100%;
  margin-top:50px;
 
}
} 
.bottom {
  margin:0 auto;
  padding:0;
  width: 100%;
  padding-top:10px;
  border:0px solid #FF0;
  background:#000;
  min-height:50px;
  font-size:11px;
  color:#4e4e4e;
}

@media screen and (min-width: 40em) {
.bottom {
  width: 100%;
  margin:0 auto;
  padding:0;
  padding-top:10px;
  min-height:50px;
  border:0px solid #FF0;
  background:#000;
  font-size:11px;
  color:#4e4e4e
} 
}  
  
/*.menu {
  float: right;
  padding-right:20px;
  -webkit-font-smoothing: antialiased;
  font-size: 22px;
  font-weight:bold;
  margin-top:0px;

  }
.menu a {
    margin-left:20px;
	text-decoration:none;
  }
.menu a:hover {
	border-bottom:4px solid #C30;
	padding-bottom:20px;
  }
 */
  
.logo {
  float: left;
  padding-left:20px;
  margin-top:2px;
  margin-bottom:10px;
  -webkit-font-smoothing: antialiased;
  border:0px solid #0C0;
  width:30%;
  }
  
@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.logo {
  float: left;
  padding-left:20px;
  margin-top:2px;
  margin-bottom:10px;
  -webkit-font-smoothing: antialiased;
  border:0px solid #0C0;
  width:30%;
  }
  
  .logo img {
  width:252px;
  height:20px;
  } 
} 
  
h1 {
  font-size: 40px;
  margin: 0px;
  margin-bottom:10px;
  margin-top:0px;
  line-height:33px;
  color:#FFFFFF;
  text-decoration:none;
  }
h1 a {
  color:#FFFFFF;
  text-decoration:none;
  }
h1 a:hover {
  color:#fe5956;
  }
  
h2 {
  font-size: 24px;
  margin: 0px;
  margin-bottom:10px;
  margin-top:0px;
  line-height:33px;
  color:#000;
  text-decoration:none;
  }
h2 a {
  color:#000;
  text-decoration:none;
  }
h2 a:hover {
  color:#fe5956;
  }
#page-wrap {
	width: 50%; 
	margin: 0 auto; 
}
.youtube {
	width: 100%;
}

.fancybox-type-iframe .fancybox-nav {
    width: 60px;       
}

.fancybox-type-iframe .fancybox-nav span {
    visibility: visible;
    opacity: 0.5;
}

.fancybox-type-iframe .fancybox-nav:hover span {
    opacity: 1;
}

.fancybox-type-iframe .fancybox-next {
    right: -60px;
}

.fancybox-type-iframe .fancybox-prev {
    left: -60px;
}



.social {
  text-align:left;
  font-size:37px;
  font-weight:bold;
  color:#000; 
  border:1px solid #000; 
}

@media screen and (min-width: 40em) {
.social{
  text-align:left;
  font-size:40px;
  font-weight:bold;
  color:#000;
} 
}
@media only screen  and (min-width: 320px) and (max-width: 480px) { 
.social {
  text-align:right;
  font-size:37px;
  font-weight:bold;
  color:#000; 
  margin-right:20px; 
}
.social a { 
  text-decoration:none;
  padding-right:70px;
  background: url("https://www.borislavbogdanov.com/img/contact_icon.jpg") no-repeat right top; 
}
.social a:hover { 
  background: url("https://www.borislavbogdanov.com/img/contact_icon_hover.jpg") no-repeat right top;
} 
}