/* 
DESIGN FRAMEWORK V.02
José María Sánchez Escoto

REGLAS
- Las clases inician con "d_"
- Las frases se separan con "_" y "-"

CONTENIDO
--------------------------------
- Bootstrap Override
- Modals
--------------------------------
- Align
- Block
- Border
- Color (bg, border, font, link) 
- Devices
- Divider
- Flex
- Float
- Font (size, style) 
- Height
- Margin
- Padding
- Position
- Vspace 
- Width 

*/

/*XL Display (lg)*/

/*Lap-Desk (md)*/
@media (max-width: 1529px) {}

/*Tablet (xs) ANTES 1229*/
@media (max-width: 1099px) {}

/*Phone (xs)*/
@media (max-width: 767px) {}

/*-------------------------------------------------------------- BOOTSTRAP OVERRIDE */

a,
a:link,
a:active,
a:focus,
a:hover,
a:visited {
	outline:none;
	text-decoration:none;
}

body {
	background:#FFFFFF;
	color:#000000;
	font-family:'Barlow Semi Condensed', Arial, Helvetica, sans-serif;
	font-size:15px;
	height:100vh;
	margin:0;
}

body.main {
	background:#FFFFFF;
	color:#000000;
	font-family:'Barlow Semi Condensed', Arial, Helvetica, sans-serif;
	font-size:15px;
	height:100vh;
	margin:0;
}

button {
	padding:0;
	background:none;
	border:none;
	margin:0;
}

img {
	border:none;
	display:inline-block;
	margin:0;
	padding:0;
}

input,
input:focus,
input:hover,
input:active {
	outline:none;
}

*:focus {
    outline:none;
}

.fade {
	z-index:9998;
}

.modal-backdrop.in {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.modal-content {
  -webkit-box-shadow:none;
  box-shadow:none;
}

.modal {
	z-index:9999;
}

.modal-content {
	border-radius:0;
}

.table > thead > tr > th {
	border-bottom:1px solid #FFFFFF;
	vertical-align:bottom;
}

/*-------------------------------------------------------------- CONTAINERS */

/*XL Display (lg)*/

.container {
	width:1500px;
}

/*Lap-Desk (md)*/ 
@media (max-width: 1529px) {

	.container {
		width: 100%;
		padding:0 15px 0 15px;
	}

	/*.container {
		width:1500px;
	}*/

}

/*Tablet (xs) ANTES 1229*/
@media (max-width: 1099px) {

	.container {
		width: 100%;
		padding:0 15px 0 15px;
	}
	
	/*.container {
		width:1200px;
	}*/

}

/*Phone (xs)*/ 
@media (max-width: 767px) {}

/*-------------------------------------------------------------- MODALS */

.modal-md {
	  width:1000px;
	}

 .modal-sm {
	 width:600px;
}
	
.modal-body {
	padding:50px;
	padding-top:35px;
	padding-bottom:35px;
}

/*Lap-Desk (md)*/ 
@media (max-width: 1529px) {

	.modal-sm {
	  width:600px;
	}
	
	.modal-body {
	  padding:50px;
	  padding-top:35px;
	  padding-bottom:35px;
	}

}

/*Tablet (xs) ANTES 1229*/
@media (max-width: 1099px) {

	.modal-sm {
	  width:600px;
	}
	
	.modal-body {
	  padding:50px;
	  padding-top:35px;
	  padding-bottom:35px;
	}

}

/*Phone (xs)*/ 
@media (max-width: 767px) {

	.modal-sm {
	  width:95%;
	}
	
	.modal-body {
	  padding:30px;
	}

}

/*-------------------------------------------------------------- ALIGN */

/* general */
.d_align_left {text-align:left}
.d_align_right {text-align:right}
.d_align_center {text-align:center}
.d_align_justiy {text-align:justify}

/* ON XS */

/* to center */
.d_align_left_xs-center {text-align:left}
.d_align_right_xs-center {text-align:right}
.d_align_justiy_xs-center {text-align:justify}

/* center to */
.d_align_center_xs-left {text-align:center}
.d_align_center_xs-right {text-align:center}
.d_align_center_xs-justify {text-align:center}

/* ON SM */

/* to center */
.d_align_left_sm-center {text-align:left}
.d_align_right_sm-center {text-align:right}
.d_align_justiy_sm-center {text-align:justify}

/*Lap-Desk (md)*/ 
@media (max-width: 1529px) {}

/*Tablet (xs) ANTES 1229*/
@media (max-width: 1099px) {

	/* ON SM */
	
	/* to center */
	.d_align_left_sm-center {text-align:center}
	.d_align_right_sm-center {text-align:center}
	.d_align_justiy_sm-center {text-align:center}

}

/*Phone (xs)*/ 
@media (max-width: 767px) {
	
	/* ON XS */
	
	/* to center */
	.d_align_left_xs-center {text-align:center}
	.d_align_right_xs-center {text-align:center}
	.d_align_justiy_xs-center {text-align:center}
	
	/* center to */
	.d_align_center_xs-left {text-align:left}
	.d_align_center_xs-right {text-align:right}
	.d_align_center_xs-justify {text-align:justify}

}

/*-------------------------------------------------------------- BLOCK */

.d_block {display:block}
.d_block_inline {display:inline-block}

.d_block_wraper {
	display:block;
	position:relative;
}
.d_block_wraper:after {
	height:0;
	clear:both;
	content: ".";
	display:block;
	visibility:hidden;
}

/*-------------------------------------------------------------- BORDER */

/* 1px */
.d_border_1px-all {border:solid 1px}
.d_border_1px-top {border-top:solid 1px}
.d_border_1px-right {border-right:solid 1px}
.d_border_1px-bottom {border-bottom:solid 1px}
.d_border_1px-left {border-left:solid 1px}
.d_border_1px-x {border-left:solid 1px; border-right: solid 1px}
.d_border_1px-y {border-top:solid 1px; border-bottom::solid 1px}

/* 2px */
.d_border_2px-all {border:solid 2px}
.d_border_2px-top {border-top:solid 2px}
.d_border_2px-right {border-right:solid 2px}
.d_border_2px-bottom {border-bottom:solid 2px}
.d_border_2px-left {border-left:solid 2px}
.d_border_2px-x {border-left:solid 2px; border-right: solid 2px}
.d_border_2px-y {border-top:solid 2px; border-bottom::solid 2px}

/* none */
.d_border_none-last:last-child {border:none !important}

/* radius */
.d_border_radius-1 {border-radius:2px}
.d_border_radius-2 {border-radius:4px}
.d_border_radius-3 {border-radius:6px}
.d_border_radius-4 {border-radius:8px}
.d_border_radius-5 {border-radius:10px}

/*-------------------------------------------------------------- COLOR */

/* BACKGROUND */

/* b&w */
.d_bg_white {background:#FFFFFF}
.d_bg_black {background:#000000}

/* light gray */
.d_bg_lightgray-1 {background:#F6F6F6}
.d_bg_lightgray-2 {background:#EEEEEE}
.d_bg_lightgray-3 {background:#DDDDDD}

/* medium gray */
.d_bg_mediumgray-1 {background:#CCCCCC}
.d_bg_mediumgray-2 {background:#AAAAAA}
.d_bg_mediumgray-3 {background:#888888}

/* dark gray */
.d_bg_darkgray-1 {background:#666666}
.d_bg_darkgray-2 {background:#444444}
.d_bg_darkgray-3 {background:#222222}

/* test */
.d_bg_test-1 {background:#0F0}
.d_bg_test-2 {background:#C0F}
.d_bg_test-3 {background:#39F}

/* BORDER */

/* b&w */
.d_color_border_white {border:#FFFFFF}
.d_color_border_black {border:#000000}

/* light gray */
.d_color_border_lightgray-1 {border:#F6F6F6}
.d_color_border_lightgray-2 {border:#EEEEEE}
.d_color_border_lightgray-3 {border:#DDDDDD}

/* medium gray */
.d_color_border_mediumgray-1 {border:#CCCCCC}
.d_color_border_mediumgray-2 {border:#AAAAAA}
.d_color_border_mediumgray-3 {border:#888888}

/* dark gray */
.d_color_border_darkgray-1 {border:#666666}
.d_color_border_darkgray-2 {border:#444444}
.d_color_border_darkgray-3 {border:#222222}

/* FONT */

/* b&w */
.d_color_font_white {color:#FFFFFF}
.d_color_font_black {color:#000000}

/* light gray */
.d_color_font_lightgray-1 {color:#F6F6F6}
.d_color_font_lightgray-2 {color:#EEEEEE}
.d_color_font_lightgray-3 {color:#DDDDDD}

/* medium gray */
.d_color_font_mediumgray-1 {color:#CCCCCC}
.d_color_font_mediumgray-2 {color:#AAAAAA}
.d_color_font_mediumgray-3 {color:#888888}

/* dark gray */
.d_color_font_darkgray-1 {color:#666666}
.d_color_font_darkgray-2 {color:#444444}
.d_color_font_darkgray-3 {color:#222222}

/* LINK */

/* b&w */
.d_color_link_white,
.d_color_link_white:link,
.d_color_link_white:visited {color:#FFFFFF}
.d_color_link_white:active,
.d_color_link_white:focus,
.d_color_link_white:hover {color:#FFFFFF}

.d_color_link_black,
.d_color_link_black:link,
.d_color_link_black:visited {color:#000000}
.d_color_link_black:active,
.d_color_link_black:focus,
.d_color_link_black:hover {color:#000000}

/* light gray */
.d_color_link_lightgray-1,
.d_color_link_lightgray-1:link,
.d_color_link_lightgray-1:visited {color:#F6F6F6}
.d_color_link_lightgray-1:active,
.d_color_link_lightgray-1:focus,
.d_color_link_lightgray-1:hover {color:#FFFFFF}

.d_color_link_lightgray-2,
.d_color_link_lightgray-2:link,
.d_color_link_lightgray-2:visited {color:#EEEEEE}
.d_color_link_lightgray-2:active,
.d_color_link_lightgray-2:focus,
.d_color_link_lightgray-2:hover {color:#FFFFFF}

.d_color_link_lightgray-3,
.d_color_link_lightgray-3:link,
.d_color_link_lightgray-3:visited {color:#DDDDDD}
.d_color_link_lightgray-3:active,
.d_color_link_lightgray-3:focus,
.d_color_link_lightgray-3:hover {color:#FFFFFF}

/* medium gray */
.d_color_link_mediumgray-1,
.d_color_link_mediumgray-1:link,
.d_color_link_mediumgray-1:visited {color:#CCCCCC}
.d_color_link_mediumgray-1:active,
.d_color_link_mediumgray-1:focus,
.d_color_link_mediumgray-1:hover {color:#000000}

.d_color_link_mediumgray-2,
.d_color_link_mediumgray-2:link,
.d_color_link_mediumgray-2:visited {color:#AAAAAA}
.d_color_link_mediumgray-2:active,
.d_color_link_mediumgray-2:focus,
.d_color_link_mediumgray-2:hover {color:#000000}

.d_color_link_mediumgray-3,
.d_color_link_mediumgray-3:link,
.d_color_link_mediumgray-3:visited {color:#888888}
.d_color_link_mediumgray-3:active,
.d_color_link_mediumgray-3:focus,
.d_color_link_mediumgray-3:hover {color:#000000}

/* dark gray */
.d_color_link_darkgray-1,
.d_color_link_darkgray-1:link,
.d_color_link_darkgray-1:visited {color:#666666}
.d_color_link_darkgray-1:active,
.d_color_link_darkgray-1:focus,
.d_color_link_darkgray-1:hover {color:#000000}

.d_color_link_darkgray-2,
.d_color_link_darkgray-2:link,
.d_color_link_darkgray-2:visited {color:#444444}
.d_color_link_darkgray-2:active,
.d_color_link_darkgray-2:focus,
.d_color_link_darkgray-2:hover {color:#000000}

.d_color_link_darkgray-3,
.d_color_link_darkgray-3:link,
.d_color_link_darkgray-3:visited {color:#222222}
.d_color_link_darkgray-3:active,
.d_color_link_darkgray-3:focus,
.d_color_link_darkgray-3:hover {color:#000000}

/*-------------------------------------------------------------- DEVICES */

.d_devices {
	position:fixed;
	bottom:0;
	left:50%;
	margin-left:-60px;
	width:120px;
	text-align:center;
	padding:10px 0 5px 0;
	background-color:#99CCCC;
	font-size:12px;
	border-top-right-radius:6px;
	border-top-left-radius:6px;
	color:#FFFFFF;
	box-shadow: 0 0 15px #242424;
	border:1px solid #FFF;
	border-bottom:none;
	z-index:500;
}
.d_devices-lg {background-color:#06C}
.d_devices-md {background-color:#090}
.d_devices-sm {background-color:#C90}
.d_devices-xs {background-color:#C00}

/*-------------------------------------------------------------- DISPLAY */

.d_display_fullscreen {
	height:100vh;
	display:flex;
	flex-direction:column;
}

.d_display_split {
	flex: 1;
	display: flex;
	flex-direction:column;
}

/*-------------------------------------------------------------- DIVIDER */

.d_divider-1px {height:1px}
.d_divider-2px {height:2px}
.d_divider-3px {height:3px}
.d_divider-4px {height:4px}
.d_divider-5px {height:5px}

/*-------------------------------------------------------------- FLEX */

.d_flex {display:flex}

/* behaviors */
.d_flex_between {justify-content:space-between}
.d_flex_center {margin:auto}
.d_flex_grid {flex-wrap:wrap}
.d_flex_vertical {flex-direction:column}

/* sizes */
.d_flex_proportion-1 {flex:1}
.d_flex_proportion-2 {flex:2}
.d_flex_proportion-3 {flex:3}
.d_flex_proportion-4 {flex:4}
.d_flex_proportion-5 {flex:5}
.d_flex_proportion-6 {flex:6}
.d_flex_proportion-7 {flex:7}
.d_flex_proportion-8 {flex:8}
.d_flex_proportion-9 {flex:9}
.d_flex_proportion-10 {flex:10}

/* order */
.d_flex_order-1 {order:1}
.d_flex_order-2 {order:2}
.d_flex_order-3 {order:3}
.d_flex_order-4 {order:4}
.d_flex_order-5 {order:5}
.d_flex_order-6 {order:6}
.d_flex_order-7 {order:7}
.d_flex_order-8 {order:8}
.d_flex_order-9 {order:9}
.d_flex_order-10 {order:10}

/* width */
.d_flex_width-5 {flex-basis:5%}
.d_flex_width-10 {flex-basis:10%}
.d_flex_width-15 {flex-basis:15%}
.d_flex_width-20 {flex-basis:20%}
.d_flex_width-25 {flex-basis:25%}
.d_flex_width-30 {flex-basis:30%}
.d_flex_width-35 {flex-basis:35%}
.d_flex_width-40 {flex-basis:40%}
.d_flex_width-45 {flex-basis:45%}
.d_flex_width-50 {flex-basis:50%}
.d_flex_width-55 {flex-basis:55%}
.d_flex_width-60 {flex-basis:60%}
.d_flex_width-65 {flex-basis:65%}
.d_flex_width-70 {flex-basis:70%}
.d_flex_width-75 {flex-basis:75%}
.d_flex_width-80 {flex-basis:80%}
.d_flex_width-85 {flex-basis:85%}
.d_flex_width-90 {flex-basis:90%}
.d_flex_width-95 {flex-basis:95%}
.d_flex_width-full {flex-basis:100%}

/*-------------------------------------------------------------- FLOAT */

.d_float_left {float:left}
.d_float_right {float:right}

/*-------------------------------------------------------------- FONT */

/* size */
.d_font_size-maximum {font-size:25px}
.d_font_size-larger {font-size:20px}
.d_font_size-large {font-size:18px}
.d_font_size-medium {font-size:16px}
.d_font_size-small {font-size:14px}
.d_font_size-smaller {font-size:12px}
.d_font_size-minimum {font-size:10px}

/* style */
.d_font_style-bold {font-weight:bold}
.d_font_style-italic {font-style:italic}
.d_font_style-canceled {text-decoration:line-through}
.d_font_style-underline {text-decoration:underline !important}
.d_font_style-spaced {letter-spacing:1px}
.d_font_style-line {text-decoration:line-through}


/*-------------------------------------------------------------- HEIGHT */

.d_height_px-5 {height:5px}
.d_height_px-10 {height:10px}
.d_height_px-15 {height:15px}
.d_height_px-20 {height:20px}
.d_height_px-25 {height:25px}
.d_height_px-30 {height:30px}
.d_height_px-35 {height:35px}
.d_height_px-40 {height:40px}
.d_height_px-45 {height:45px}
.d_height_px-50 {height:50px}
.d_height_px-55 {height:55px}
.d_height_px-60 {height:60px}
.d_height_px-65 {height:65px}
.d_height_px-70 {height:70px}
.d_height_px-75 {height:75px}
.d_height_px-80 {height:80px}
.d_height_px-85 {height:85px}
.d_height_px-90 {height:90px}
.d_height_px-95 {height:95x}
.d_height_px-100 {height:100px}

/*-------------------------------------------------------------- MARGIN */

/* all */
.d_margin_all-minimum {margin:5px}
.d_margin_all-smaller {margin:10px}
.d_margin_all-small {margin:15px}
.d_margin_all-medium {margin:20px}
.d_margin_all-large {margin:30px}
.d_margin_all-larger {margin:40px}
.d_margin_all-maximum {margin:50px}

/* top */
.d_margin_top-minimum {margin-top:5px}
.d_margin_top-smaller {margin-top:10px}
.d_margin_top-small {margin-top:15px}
.d_margin_top-medium {margin-top:20px}
.d_margin_top-large {margin-top:30px}
.d_margin_top-larger {margin-top:40px}
.d_margin_top-maximum {margin-top:50px}

/* right */
.d_margin_right-minimum {margin-right:5px}
.d_margin_right-smaller {margin-right:10px}
.d_margin_right-small {margin-right:15px}
.d_margin_right-medium {margin-right:20px}
.d_margin_right-large {margin-right:30px}
.d_margin_right-larger {margin-right:40px}
.d_margin_right-maximum {margin-right:50px}

/* bottom */
.d_margin_bottom-minimum {margin-bottom:5px}
.d_margin_bottom-smaller {margin-bottom:10px}
.d_margin_bottom-small {margin-bottom:15px}
.d_margin_bottom-medium {margin-bottom:20px}
.d_margin_bottom-large {margin-bottom:30px}
.d_margin_bottom-larger {margin-bottom:40px}
.d_margin_bottom-maximum {margin-bottom:50px}

/* left */
.d_margin_left-minimum {margin-left:5px}
.d_margin_left-smaller {margin-left:10px}
.d_margin_left-small {margin-left:15px}
.d_margin_left-medium {margin-left:20px}
.d_margin_left-large {margin-left:30px}
.d_margin_left-larger {margin-left:40px}
.d_margin_left-maximum {margin-left:50px}

/* vertical (y) */
.d_margin_y-minimum {margin:5px 0 5px 0}
.d_margin_y-smaller {margin:10px 0 10px 0}
.d_margin_y-small {margin:15px 0 15px 0}
.d_margin_y-medium {margin:20px 0 20px 0}
.d_margin_y-large {margin:30px 0 30px 0}
.d_margin_y-larger {margin:40px 0 40px 0}
.d_margin_y-maximum {margin:50px 0 50px 0}

/* horizontal (x) */
.d_margin_x-minimum {margin:0 5px 0 5px}
.d_margin_x-smaller {margin:0 10px 0 10px}
.d_margin_x-small {margin:0 15px 0 15px}
.d_margin_x-medium {margin:0 20px 0 20px}
.d_margin_x-large {margin:0 30px 0 30px}
.d_margin_x-larger {margin:0 40px 0 40px}
.d_margin_x-maximum {margin:0 50px 0 50px}

/* remove */
.d_margin_remove-all {margin:0 !important}
.d_margin_remove-top {margin-top:0 !important}
.d_margin_remove-right {margin-right:0 !important}
.d_margin_remove-bottom {margin-bottom:0 !important}
.d_margin_remove-left {margin-left:0 !important}
.d_margin_remove-x {margin-left:0; margin-right:0 !important}
.d_margin_remove-y {margin-top:0; margin-bottom:0 !important}

/*-------------------------------------------------------------- PADDING */

/* all */
.d_padding_all-minimum {padding:5px}
.d_padding_all-smaller {padding:10px}
.d_padding_all-small {padding:15px}
.d_padding_all-medium {padding:20px}
.d_padding_all-large {padding:30px}
.d_padding_all-larger {padding:40px}
.d_padding_all-maximum {padding:50px}

/* top */
.d_padding_top-minimum {padding-top:5px}
.d_padding_top-smaller {padding-top:10px}
.d_padding_top-small {padding-top:15px}
.d_padding_top-medium {padding-top:20px}
.d_padding_top-large {padding-top:30px}
.d_padding_top-larger {padding-top:40px}
.d_padding_top-maximum {padding-top:50px}

/* right */
.d_padding_right-minimum {padding-right:5px}
.d_padding_right-smaller {padding-right:10px}
.d_padding_right-small {padding-right:15px}
.d_padding_right-medium {padding-right:20px}
.d_padding_right-large {padding-right:30px}
.d_padding_right-larger {padding-right:40px}
.d_padding_right-maximum {padding-right:50px}

/* bottom */
.d_padding_bottom-minimum {padding-bottom:5px}
.d_padding_bottom-smaller {padding-bottom:10px}
.d_padding_bottom-small {padding-bottom:15px}
.d_padding_bottom-medium {padding-bottom:20px}
.d_padding_bottom-large {padding-bottom:30px}
.d_padding_bottom-larger {padding-bottom:40px}
.d_padding_bottom-maximum {padding-bottom:50px}

/* left */
.d_padding_left-minimum {padding-left:5px}
.d_padding_left-smaller {padding-left:10px}
.d_padding_left-small {padding-left:15px}
.d_padding_left-medium {padding-left:20px}
.d_padding_left-large {padding-left:30px}
.d_padding_left-larger {padding-left:40px}
.d_padding_left-maximum {padding-left:50px}

/* vertical (y) */
.d_padding_y-minimum {padding:5px 0 5px 0}
.d_padding_y-smaller {padding:10px 0 10px 0}
.d_padding_y-small {padding:15px 0 15px 0}
.d_padding_y-medium {padding:20px 0 20px 0}
.d_padding_y-large {padding:30px 0 30px 0}
.d_padding_y-larger {padding:40px 0 40px 0}
.d_padding_y-maximum {padding:50px 0 50px 0}

/* horizontal (x) */
.d_padding_x-minimum {padding:0 5px 0 5px}
.d_padding_x-smaller {padding:0 10px 0 10px}
.d_padding_x-small {padding:0 15px 0 15px}
.d_padding_x-medium {padding:0 20px 0 20px}
.d_padding_x-large {padding:0 30px 0 30px}
.d_padding_x-larger {padding:0 40px 0 40px}
.d_padding_x-maximum {padding:0 50px 0 50px}

/* remove */
.d_padding_remove-all {padding:0 !important}
.d_padding_remove-top {padding-top:0 !important}
.d_padding_remove-right {padding-right:0 !important}
.d_padding_remove-bottom {padding-bottom:0 !important}
.d_padding_remove-left {padding-left:0 !important}
.d_padding_remove-x {padding-left:0; padding-right:0 !important}
.d_padding_remove-y {padding-top:0; padding-bottom:0 !important}

/*-------------------------------------------------------------- POSITION */

/* behavior */
.d_position_relative {position:relative}
.d_position_absolute {position:absolute}

/* corners */
.d_position_topleft {position:absolute; top: 0; left: 0}
.d_position_topright {position:absolute; top: 0; right: 0}
.d_position_bottomright {position:absolute; bottom: 0; right:0}
.d_position_bottomleft {position:absolute; bottom: 0; left: 0}

/*-------------------------------------------------------------- V SPACE */

.d_vspace_minimum {height:5px}
.d_vspace_smaller {height:10px}
.d_vspace_small {height:15px}
.d_vspace_medium {height:20px}
.d_vspace_large {height:30px}
.d_vspace_larger {height:40px}
.d_vspace_maximum {height:50px}

/*-------------------------------------------------------------- WIDTH */

/* percentage */
.d_width_pct-5 {width:5%}
.d_width_pct-10 {width:10%}
.d_width_pct-15 {width:15%}
.d_width_pct-20 {width:20%}
.d_width_pct-25 {width:25%}
.d_width_pct-30 {width:30%}
.d_width_pct-35 {width:35%}
.d_width_pct-40 {width:40%}
.d_width_pct-45 {width:45%}
.d_width_pct-50 {width:50%}
.d_width_pct-55 {width:55%}
.d_width_pct-60 {width:60%}
.d_width_pct-65 {width:65%}
.d_width_pct-70 {width:70%}
.d_width_pct-75 {width:75%}
.d_width_pct-80 {width:80%}
.d_width_pct-85 {width:85%}
.d_width_pct-90 {width:90%}
.d_width_pct-95 {width:95%}
.d_width_pct-100 {width:100%}

/* pixels */
.d_width_px-5 {width:50px}
.d_width_px-10 {width:10px}
.d_width_px-15 {width:15px}
.d_width_px-20 {width:20px}
.d_width_px-25 {width:25px}
.d_width_px-30 {width:30px}
.d_width_px-35 {width:35px}
.d_width_px-40 {width:40px}
.d_width_px-45 {width:45px}
.d_width_px-50 {width:50px}
.d_width_px-55 {width:55px}
.d_width_px-60 {width:60px}
.d_width_px-65 {width:65px}
.d_width_px-70 {width:70px}
.d_width_px-75 {width:75px}
.d_width_px-80 {width:80px}
.d_width_px-85 {width:85px}
.d_width_px-90 {width:90px}
.d_width_px-95 {width:95px}
.d_width_px-100 {width:100px}