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

/*-- Box-sizing Reset --*/
body div#dii-navbar { height: 71px; }
body div#navbar-product { height: 26px; }
body div#navbar-top-row a.navbar-tab { height: 27px; padding: 0; }
body div#navbar-top-row a.navbar-tab span.dii-lib-icon { background-position: left; padding: 3px 3px 2px 28px; } 
body div#navbar-top-row a.navbar-tab.navbar-tab-one-line span { height: initial; padding-top: 7px; padding-bottom: 7px; box-sizing: initial; }
body .dii-action-icon,
body .dii-action-icon-text,
body .dii-action-text { height: initial; box-sizing: initial; }
body .dii-action-icon-text div { top: 0; }
body .dii-function-icon,
body .dii-function-icon-text,
body .dii-function-icon-text-big,
body .dii-function-text,
body .dii-function-text-big { height: initial; box-sizing: initial; }
body .dii-main-title,
body .dii-main-title-icon { box-sizing: initial; }
body .ui-dialog,
body .ui-dialog *,
body .dii-ss-rb-container,
body .dii-ss-rb-container * { box-sizing: initial; }

/* General Page Styles */
* { box-sizing: border-box; }
.caret { border: 0 none; }

select { color: #605c56 !important; }

body, body div, body span, body p, body a, body li, body th, body td, body section, body button, body label { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body#design-body { margin: 0; padding: 10px 0 0 0; height: 100%; background: #214194 url('../images/bg.png') repeat-x; }

#design-wrapper { margin: 0 auto; width: 100%; box-sizing: border-box; }
.container { max-width: 1080px; }
  
/* Bootstrap 6px gutter */
.gutter-6.row { margin-right: -3px; margin-left: -3px; }
.gutter-6 > [class^="col-"], .gutter-10 > [class^=" col-"] { padding-right: 3px; padding-left: 3px; }

/* Header overrides */
.h1, .h2, .h3, h1, h2, h3, .h4, .h5, .h6, h4, h5, h6 { margin-bottom: 0; margin-top: 0; }
.h1, .h2, .h3, h1, h2, h3, .h4, .h5, .h6, h4, h5, h6 { font-family: inherit; font-weight: inherit; font-size: inherit; }

/* Header */
header {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 160px;
  background: #1d3c8b;
  background: -moz-linear-gradient(top,  #1d3c8b 0%, #0b1738 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1d3c8b), color-stop(100%,#0b1738));
  background: -webkit-linear-gradient(top, #1d3c8b 0%,#0b1738 100%);
  background: -o-linear-gradient(top, #1d3c8b 0%,#0b1738 100%);
  background: -ms-linear-gradient(top, #1d3c8b 0%,#0b1738 100%);
  background: linear-gradient(to bottom, #1d3c8b 0%,#0b1738 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1d3c8b', endColorstr='#0b1738',GradientType=0 );
  border: 1px solid #395ab2;
  border-bottom: 0 none;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
header #design-logo { position: absolute; top: 20px; left: 10px; z-index: 1; }
header #design-logo a { display: inline-block; }
header #design-title { position: absolute; top: 45px; left: 215px; }
header #design-logo img,
header #design-title img { width: 100%; }
header #design-links { position: absolute; top: 10px; right: 15px; }
header #design-links a { display: inline-block; margin: 0; padding: 0; font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 11px; color: #a8afc8; text-transform: uppercase; }
header #design-links span { display: inline-block; margin: 0; padding: 0 5px; font-family: 'Montserrat', sans-serif; font-weight: 400; font-size: 11px; color: #395ab2; }

@media (max-width: 480px) {
  
  header { height: 90px; }
  header #design-logo { width: 90px; }
  header #design-title { top: 40px; left: 100px; width: 210px; }
  header #design-links a { font-size: 9px; }
  header #design-links span { font-size: 9px; }
  
}

/* Nav */
nav {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 48px;
  background: #bb1310;
  background: -moz-linear-gradient(top,  #ec2d2a 0%, #bb1310 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ec2d2a), color-stop(100%,#bb1310));
  background: -webkit-linear-gradient(top, #ec2d2a 0%,#bb1310 100%);
  background: -o-linear-gradient(top, #ec2d2a 0%,#bb1310 100%);
  background: -ms-linear-gradient(top, #ec2d2a 0%,#bb1310 100%);
  background: linear-gradient(to bottom, #ec2d2a 0%,#bb1310 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec2d2a', endColorstr='#bb1310',GradientType=0 );
  border: 1px solid #ed2d2a;
  border-top: 2px solid #fff;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
nav #design-container-main-nav {
  float: left;
  margin: 0;
  padding: 0 0 0 190px;
  width: 100%;
  height: 48px;
}
nav #design-container-main-nav #ww-btn-main-nav {
  width: 100%;
  padding: 5px 10px;
  height: 48px;
  background: none;
  border: 0 none;
  font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
  text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
}

@media (max-width: 800px) {

  
}

@media (max-width: 480px) {
  
  nav { border-radius: 0; }
  nav #design-container-main-nav { padding: 0; }
  
}


/* Main */
main { display: block; margin: 0; padding: 6px 0; width: 100%; }
#design-container-main { margin: 0; padding: 10px; width: 100%; background: #fff; border-radius: 6px; }

#design-container-main .dii-content-title-photo,
#design-container-1 .dii-content .dii-content-title-photo,
#design-container-2 .dii-content .dii-content-title-photo,
#design-container-3 .dii-content .dii-content-title-photo,
#design-container-4 .dii-content .dii-content-title-photo,
#design-container-5 .dii-content .dii-content-title-photo { margin: 0; padding: 0; border: none; }

#design-container-1,
#design-container-2,
#design-container-3,
#design-container-4,
#design-container-5 { margin: 0 0 6px 0; padding: 6px; background: #0a215c; border-radius: 8px; }

@media (max-width: 480px) {
  
  #design-container-main { margin: 0 0 10px; }
  
}


/* Footer */
footer {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 60px;
  background: -moz-linear-gradient(top,  rgba(11,23,56,1) 0%, rgba(11,23,56,0.3) 70%, rgba(11,23,56,0) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(11,23,56,1)), color-stop(70%,rgba(11,23,56,0.3)), color-stop(100%,rgba(11,23,56,0)));
  background: -webkit-linear-gradient(top,  rgba(11,23,56,1) 0%,rgba(11,23,56,0.3) 70%,rgba(11,23,56,0) 100%);
  background: -o-linear-gradient(top,  rgba(11,23,56,1) 0%,rgba(11,23,56,0.3) 70%,rgba(11,23,56,0) 100%);
  background: -ms-linear-gradient(top,  rgba(11,23,56,1) 0%,rgba(11,23,56,0.3) 70%,rgba(11,23,56,0) 100%);
  background: linear-gradient(to bottom,  rgba(11,23,56,1) 0%,rgba(11,23,56,0.3) 70%,rgba(11,23,56,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b1738', endColorstr='#000b1738',GradientType=0 );
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
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.4; color: #fff; text-decoration: none; }
footer #design-footer-right { float: right; width: 200px; height: 60px; }

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

@media screen and (max-width: 480px) {
  
	footer { margin: 0; padding: 0; width: 100%; height: 130px; }
	footer #design-footer-left { display: block; width: 100%; height: 50px; text-align: center; }
	footer #design-footer-right { display: block; width: 100%; text-align: center; }
  
  footer #design-footer-left #design-copyright { margin: 15px 0 0 0; }
  footer #design-footer-left #design-copyrightDII { margin: 0px 0 0 0; }
  
}

.design-sectionContent { margin-bottom: 10px; padding: 6px 6px 10px 6px; width: 228px; background: #000; border-radius: 6px; box-sizing: border-box; }
.design-sectionContent:last-of-type { margin: 0; }
.design-clear { clear: both; }
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}