/* ----------------------------------------------------------------
    Copyright (c) Demosphere International Inc.
    No permission is granted for any purpose without prior
    written consent from Demosphere International Inc.
-------------------------------------------------------------------*/

/* General Page Styles */
html { height: 100%; }
body { margin: 0; padding: 0; height: 100%; background: #000 url('../images/bg.jpg') no-repeat center top; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

#design-wrapper { margin: 0 auto; width: 100%; max-width: 1020px; }

/* Header */
header { position: relative; margin: 0; padding: 0; width: 100%; height: 150px; border-bottom: 2px solid #fff; box-sizing: border-box; }
header #design-logo { position: absolute; top: 32px; left: -4px; z-index: 10; }
header #design-title { position: absolute; top: 40px; left: 172px; }
header #design-adidas { position: absolute; top: 68px; right: 10px; }
header #design-logo img,
header #design-title img,
header #design-adidas img { width: 100%; }

@media screen and (max-width: 640px) {
  
  body { background-image: none; }
  header { height: 120px; }
  header #design-logo { top: 5px; width: 130px; }
  header #design-title { top: 30px; left: 125px; width: 250px; }
  header #design-adidas { top: 50px; right: 10px; width: 90px; }

}

@media screen and (max-width: 480px) {
  
  header #design-title { width: 220px; }
  header #design-adidas { display: none; }

}

nav {
  margin: 0;
  padding-left: 170px;
  width: 100%;
  height: 42px;
  background: #e8062e;
  background: -moz-linear-gradient(top,  #e8062e 0%, #d4052b 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8062e), color-stop(100%,#d4052b));
  background: -webkit-linear-gradient(top,  #e8062e 0%,#d4052b 100%);
  background: -o-linear-gradient(top,  #e8062e 0%,#d4052b 100%);
  background: -ms-linear-gradient(top,  #e8062e 0%,#d4052b 100%);
  background: linear-gradient(to bottom,  #e8062e 0%,#d4052b 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8062e', endColorstr='#d4052b',GradientType=0 );
  border-top: 1px solid #000;
  border-bottom: 1px solid #f92c50;
  box-sizing: border-box;
}
nav #design-container-main-nav { margin: 0; padding: 0; width: 100%; height: 42px; box-sizing: border-box; }
nav #design-container-main-nav #ww-btn-main-nav { padding: 10px; height: 42px; background: none; border: 0 none; color: #fff; box-sizing: border-box; }
nav #design-container-main-nav #ww-btn-main-nav i { margin-right: 5px; }

@media screen and (max-width: 640px) {
  
  nav { padding: 0; }
  
}

/* Main */
main { display: block; margin: 0; padding: 10px; width: 100%; background: #fff; border-top: 3px solid #000; box-sizing: border-box; }
main #design-container-main { margin-bottom: 10px; padding: 0; width: 100%; box-sizing: border-box; }
main #design-bottom-content { margin-top: 10px; padding: 10px; border-top: 3px solid #adadad; border-bottom: 3px solid #adadad; box-sizing: border-box; }
main #design-bottom-links { padding: 10px 10px 0 10px; text-align: center; box-sizing: border-box; }
main #design-bottom-links,
main #design-bottom-links a { font-family: Verdana, Arial, sans-serif; font-size: 10px; font-weight: bold; color: #000; text-decoration: none; }
main #design-bottom-links a:hover { color: #e10031; }

main #design-container-3 .dii-content.dii-content-image .dii-content-image-main-photo { margin: 0; padding: 0; border: none; }

main #design-container-5 { text-align: center; }
main #design-container-5 .dii-content.dii-content-image { display: inline-block; margin: 0; padding: 0 3px; }
main #design-container-5 .dii-content.dii-content-image .dii-content-image-main-photo { margin: 0; padding: 0; border: none; }

@media screen and (max-width: 640px) {
  
  main { padding: 5px; background-image: none; }
  main #design-container-main { padding: 0; }

}

/* Footer */
footer { width: 100%; margin: 0; padding: 0; height: 64px; background: #000; border-top: 3px solid #e10031; box-sizing: border-box; }
footer #design-footer-left { float: left; height: 60px; }
footer #design-footer-left div,
footer #design-footer-left div a { font-family: Verdana, Arial, sans-serif; font-size: 10px; font-weight: normal; line-height: 1.2em; color: #fff; text-decoration: none; }
footer #design-footer-right { float: right; height: 60px; width: 230px; }

footer #design-footer-left #design-copyright { margin: 14px 0 0 10px; font-weight: bold; }
footer #design-footer-left #design-copyrightDII { margin: 2px 0 0 10px; }

@media screen and (max-width: 480px) {
  
	footer { margin: 0; padding: 0; width: 100%; height: 150px; background-image: none; background: #000; }
	footer #design-footer-left { display: block; width: 100%; text-align: center; }
	footer #design-footer-right { display: block; width: 100%; text-align: center; }
  
}

/* Content Boxes */
.design-section-header {
  margin: 0;
	padding: 13px 10px;
	width: 100%;
  height: 42px;
  background: #e8062e;
  background: -moz-linear-gradient(top,  #e8062e 0%, #d4052b 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8062e), color-stop(100%,#d4052b));
  background: -webkit-linear-gradient(top,  #e8062e 0%,#d4052b 100%);
  background: -o-linear-gradient(top,  #e8062e 0%,#d4052b 100%);
  background: -ms-linear-gradient(top,  #e8062e 0%,#d4052b 100%);
  background: linear-gradient(to bottom,  #e8062e 0%,#d4052b 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8062e', endColorstr='#d4052b',GradientType=0 );
  border-bottom: 3px solid #000;
	font-family: 'Oswald', sans-serif;
	font-size: 14px; 
	font-weight: 400;
	color: #fff;
  letter-spacing: 0;
	line-height: 14px;
  text-transform: uppercase;
  text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
	box-sizing: border-box;
}

.design-clear { clear: both; }