@charset "UTF-8";

/* *************** 
 	TYPOGRAPHY 
************  */
.text-title {font-size: 2.5em;}
.text-subtitle {font-size: 2em;}
.text-large {font-size: 1.8em;}
.text-medium {font-size: 1.5em;}
.text-normal {font-size: 1.1em;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}
.wordwrap {word-wrap: normal;word-break: break-word;}
/* aligments */
.left {float: left;}
.right {float: right;}
.center {margin-left: auto; margin-right: auto;}
hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0;
	border-top: 1px solid #7f7f7f;
}
h1{font-size: 2.5em;}
h2{font-size: 2em;}
h3{font-size: 1.8em;}
h4{font-size: 1.6em;}
h1 {
	font-weight: 800;
	line-height: 1.1em;
	font-size: 3em;
	line-height: 1.2em;
	margin: 10px 0 10px 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	text-transform: uppercase;
}

h2 {
	font-weight: 800;
	margin: 0 0 .2125em 0;
	font-size: 2em;
	line-height: 1.2em;
	margin: 10px 0 10px 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	text-transform: uppercase;
}
h3 {
	font-weight: 700;
	margin: 0 0 .2125em 0;
	font-size: 1.5em;
	line-height: 1.2em;
	margin: 10px 0 10px 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	text-transform: uppercase;
}
h4 {
	font-weight: 700;
	margin: 0 0 .2125em 0;
	font-size: 1.2em;
	line-height: 1.2em;
	margin: 10px 0 10px 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}
h5 {
	font-weight: 600;
	margin: 0 0 .2125em 0;
	font-size: 1.15em;
	line-height: 1.2em;
	margin: 10px 0 10px 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

p {margin: 0 0 1.5em 0;}
.whitebox p {margin: 0 0 5px 0;}
article p, p {
  margin: 0;
  padding:0;
}

hr {
    border: 0;
    height: 1px;
    background: #949494;
    background-image: linear-gradient(to right, #ccc, #b1b1b1, #ccc);
    width: 80%;
    margin: auto;
}
/* ****************
     TITLES (spesific for uses)
***************** */

#sidebar h1 {font-size: 1.5em;}
#sidebar h2 {font-size: 1.3em;}

/* *************** 
 	LINKS 
************  */
a, a:visited {color: black; text-decoration: underline;}
a:hover {text-decoration: underline;}
.social-link a { text-decoration: none;}
.social-link a:hover {text-decoration: none; color:white;}
.darkbox a, a:visited { color: silver; text-decoration: underline;}
.darkbox a:hover { color: white; text-decoration: none;}
.whitebox a, a:visited { color: black; text-decoration: underline;}
.whitebox a:hover { color: gray; text-decoration: none;}


/* *************** 
 	BUTTONS 
************  */

.disabled { pointer-events: none;cursor: default;}

.padding {padding: 5%;}


/* buttons */
textarea, select, button {
    background: white;
    border: 1px solid silver;
    border-radius: 5px;
    padding: 5px;
    color:black;
  margin: 5px;
 }   
 input[type] {
    background: white;
    border: 1px solid silver;
    border-radius: 5px;
    padding: 5px;
    width: auto;
    background-repeat: no-repeat;
    border: 1px solid #b1b1b1;
    font-size: 13px;
    font-weight: 500;
    color: #8f8f8f;
    padding: 6px 15px 6px 15px;
    border-radius: 5px;
    box-sizing: border-box;
 }   


 input[type]:hover {
	background-color: #efefef;
}


.btn {
    display: inline-block;
    margin-bottom: 5px;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 5px 15px 5px 15px;
    font-size: 1em;
    line-height: 1.5;
    border-radius: 5px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

}
.btn {
    background-color: transparent;
    border: 1px solid silver;
    text-align: center;
  	-webkit-transition: background-color 300ms linear;
  	-ms-transition: background-color 300ms linear;
  	transition: background-color 300ms linear;
}
.button {
    background-color: transparent;
    border: 1px solid silver;
    border-radius: 5px;
    padding: 8px;
    min-width: 100px;
    text-align: center;
  -webkit-transition: background-color 300ms linear;
  -ms-transition: background-color 300ms linear;
  transition: background-color 300ms linear;
}

.btn-block, .button-block {
    display: block;
    width: 100% !important;
}

button {
	background-color: transparent;
    border: 1px solid silver;
}
.btn:hover, .button:hover, button:hover {
    background-color: #efefef;
}
.button-small {
	min-width: auto;
}

.button-regular {
  background: transparent;
    border: 1px solid white;
    border-radius: 5px;
    padding: 5px 20px 5px 20px;
    min-width: 100px;
}
.button-big {
    padding: 15px 20px 15px 20px;
    min-width: 200px;
    border: 1px solid white;
    border-radius: 5px;
    background-color : #ffffff24;
}
.button-medium {
  background-color : transparent;
    border: 1px solid white;
    border-radius: 5px;
    padding: 10px 15px 10px 15px;
    min-width: 150px;
}

.button-black {
	background-color : transparent;
    border: 1px solid black;
    color: black;
}

.button-gray {
    background-color : transparent;
    border: 1px solid #cccccc;
    color:#cccccc;
}
.button-blue {
    background-color : transparent;
    border: 1px solid #2db2ea;
    color:#cccccc;
}
.button-white {
    background-color : transparent;
    color:white;
}
.button-red {
    border: 1px solid #f33535;
    background-color : transparent;
    color:#cccccc;
}

.button-red-solid {
    border: 1px solid #f33535;
    background: #dc1212;
    color:#fff;
}

.hover-white:hover, .button-black:hover {
  background-color : black;
  color: white;
}

.hover-white:hover, .button-white:hover {
  background-color : #cccccc;
  color: black;
}

.hover-gray:hover, .button-gray:hover {
  background-color : #e8e8e8;
  color: black;
}
.hover-blue:hover, .button-blue:hover {
  background-color: #2db2ea;
  border: 1px solid #2db2ea;
  color: white;
}


.button-gray {
    background: transparent;
    border: 1px solid #cccccc;
    color:#cccccc;
}
.button-dark {
    background: transparent;
    border: 1px solid black;
    color:black;
}
.button-blue {
    background: transparent;
    border: 1px solid #2db2ea;
    color:#cccccc;
}

.dark-blue:hover, .button-dark:hover {
  background: black;
  border: 1px solid black;
  color: white;
}

.hover-gray:hover, .button-gray:hover {
  background: #e8e8e8;
  color: black;
}
.hover-blue:hover, .button-blue:hover {
  background: #2db2ea;
  border: 1px solid #2db2ea;
  color: white;
}

.hover-red:hover,.button-red:hover {
    background: #dc1212;
    color: white;
}
.button-red-solid:hover {
    background: red;
    color: white;
}





/* ************************************
      CSS QUICK THEME TOOLS
************************************** */
.rounded-small {}
.rounded-normal {}
.rounded-big {}
.rounded-huge {}

/* positions */
.resonsive {width:100%;height:auto;}
.center {}
.middle {}
.left {}
.right {}
.top {}
.bottom {}

/* animate  */
.animate {
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -ms-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.smooth {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

/* clearfix */
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 1px;
}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}
.inlineblock { display: inline-block;}
.block { display: block;}
.inline {display: inline;display: inline-block;}
/* boxes */
.darkbox {
	background: #161616;
	margin: 0;
	color: silver;
	padding: 5px;
}
.darkbox h2, .darkbox h3, .darkbox h4, .darkbox b, .darkbox strong { color:white;}

.graybox {
	background: #404040;
	margin: 0;;
	color: silver;
	padding: 5px;	
}
.lightgraybox {
	background: #7f7f7f;
	margin: 0;
	color: silver;
	padding: 5px;
}
.whitebox {
    background: #fbfbfb;
    margin: 0;
    border: 1px solid #c1c1c1;
    padding: 5px;
}
/* gradients  */
.gray-gradient {
	background-color: #f5f5f5;
    border: 1px solid #c1c1c1;
	/*
	background: -webkit-linear-gradient(top, #f4f5f7 0%,#e1e2e6 90%,#cfd1d4 100%);
	background: -moz-linear-gradient(top, #f4f5f7 0%,#e1e2e6 90%,#cfd1d4 100%);
	background: -o-linear-gradient(top, #f4f5f7 0%,#e1e2e6 90%,#cfd1d4 100%);
	background: -ms-linear-gradient(top, #f4f5f7 0%,#e1e2e6 90%,#cfd1d4 100%);
	background: linear-gradient(top, #f4f5f7 0%,#e1e2e6 90%,#cfd1d4 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f5f7', endColorstr='#cfd1d4',GradientType=0 );
	border: 1px solid #949494;
	-webkit-box-shadow: inset 0px 1px 0px #fff, 0px 1px 1px rgba(0,0,0,.15);
	-moz-box-shadow: inset 0px 1px 0px #fff, 0px 1px 1px rgba(0,0,0,.15);
	box-shadow: inset 0px 1px 0px #fff, 0px 1px 1px rgba(0,0,0,.15);
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	*/
}

button.gray-gradient, .btn.gray-gradient {
    background: white;
}



.darker-gradient {
	background: rgba(43,43,43,1);
	background: -moz-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(22,22,22,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(43,43,43,1)), color-stop(100%, rgba(22,22,22,1)));
	background: -webkit-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(22,22,22,1) 100%);
	background: -o-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(22,22,22,1) 100%);
	background: -ms-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(22,22,22,1) 100%);
	background: linear-gradient(to bottom, rgba(43,43,43,1) 0%, rgba(22,22,22,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#161616', GradientType=0 );
}
.dark-gradient {
	background: rgba(43,43,43,1);
	background: -moz-linear-gradient(top, rgba(75,75,75,1) 0%, rgba(43,43,43,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(75,75,75,1)), color-stop(100%, rgba(43,43,43,1)));
	background: -webkit-linear-gradient(top, rgba(75,75,75,1) 0%, rgba(43,43,43,1) 100%);
	background: -o-linear-gradient(top, rgba(75,75,75,1) 0%, rgba(43,43,43,1) 100%);
	background: -ms-linear-gradient(top, rgba(75,75,75,1) 0%, rgba(43,43,43,1) 100%);
	background: linear-gradient(to bottom, rgba(75,75,75,1) 0%, rgba(43,43,43,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#161616', GradientType=0 );

}
.dark-gradient {color: silver;}
.dark-gradient a, .dark-gradient a:visited , .dark-gradient a:active { color:silver !important;}
.dark-gradient a:hover{ color:white !important;}

button.dark-gradient {color:silver;}
button.dark-gradient:hover { color:white;}

.dark-gradient2 {
	background: rgba(43,43,43,1);
	background: -moz-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(75,75,75,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(43,43,43,1)), color-stop(100%, rgba(75,75,75,1)));
	background: -webkit-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(75,75,75,1) 100%);
	background: -o-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(75,75,75,1) 100%);
	background: -ms-linear-gradient(top, rgba(43,43,43,1) 0%, rgba(75,75,75,1) 100%);
	background: linear-gradient(to bottom, rgba(43,43,43,1) 0%, rgba(75,75,75,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#161616', GradientType=0 );
}
.darker-gradient2 {
	background: rgba(22,22,22,1);
	background: -moz-linear-gradient(top, rgba(22,22,22,1) 0%, rgba(43,43,43,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(22,22,22,1)), color-stop(100%, rgba(43,43,43,1)));
	background: -webkit-linear-gradient(top, rgba(22,22,22,1) 0%, rgba(43,43,43,1) 100%);
	background: -o-linear-gradient(top, rgba(22,22,22,1) 0%, rgba(43,43,43,1) 100%);
	background: -ms-linear-gradient(top, rgba(22,22,22,1) 0%, rgba(43,43,43,1) 100%);
	background: linear-gradient(to bottom, rgba(22,22,22,1) 0%, rgba(43,43,43,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#161616', GradientType=0 );
}

.dark-gradient2 {color: silver;}
.dark-gradient2 a, .dark-gradient2 a:visited , .dark-gradient2 a:active { color:silver !important;}
.dark-gradient2 a:hover{ color:white !important;}

button.dark-gradient2 {color:silver;}
button.dark-gradient2:hover { color:white;}

.blue-gradient {
background: #7abcff; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdhYmNmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ0JSIgc3RvcC1jb2xvcj0iIzYwYWJmOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0MDk2ZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #7abcff 0%, #60abf8 44%, #4096ee 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7abcff), color-stop(44%,#60abf8), color-stop(100%,#4096ee)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #7abcff 0%,#60abf8 44%,#4096ee 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #7abcff 0%,#60abf8 44%,#4096ee 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #7abcff 0%,#60abf8 44%,#4096ee 100%); /* IE10+ */
background: linear-gradient(to bottom,  #7abcff 0%,#60abf8 44%,#4096ee 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee',GradientType=0 ); /* IE6-8 */

}
.red-gradient {
	background: #ff3019; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI0NiUiIHN0b3AtY29sb3I9IiNmZjMwMTkiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjY2YwNDA0IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
background: -moz-linear-gradient(top,  #ff3019 46%, #cf0404 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(46%,#ff3019), color-stop(100%,#cf0404)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ff3019 46%,#cf0404 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ff3019 46%,#cf0404 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ff3019 46%,#cf0404 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ff3019 46%,#cf0404 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-8 */
}

/* quick tools for paddings and margins */
.padding {padding: 5px;}
.padded {padding: 5%;}

.no-padding {padding:0;}
.no-margin {margin:0;}

/* BOX STYLES */
.rounded {border-radius: 6px;padding: 5% 5%;}
.space {margin-top: 10px;margin-bottom: 10px;}
.space-top {margin-top: 10px;margin-bottom: 0px;}
.space-bottom {margin-top: 0px;margin-bottom: 10px;}
.big-space {margin-top: 20px;margin-bottom: 20px;}
.padding{ padding:5%;}
.shadow {
	-moz-box-shadow:2px 2px 1px rgba(50, 50, 50, 0.75);
	-webkit-box-shadow:2px 2px 1px rgba(50, 50, 50, 0.75);
	box-shadow: 2px 2px 1px rgba(50, 50, 50, 0.75);
}

.bigshadow {
	-webkit-box-shadow: 0px 5px 29px 0px rgba(50, 50, 50, 0.75);
	-moz-box-shadow: 0px 5px 29px 0px rgba(50, 50, 50, 0.75);
	box-shadow: 0px 5px 29px 0px rgba(50, 50, 50, 0.75);
}

.hugeshadow {
	-webkit-box-shadow: 0px 14px 40px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 14px 40px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 14px 50px 0px rgba(0,0,0,0.75);
}


/************************
/* theme colors  - must be bottom of CSS to be overrides : todo -> should prob imported LAST

/* common colors */
.green {color: green !important;}
.red {color: red !important;}
.blue {color: blue !important;}
.orange {color: orange !important;}
.cyan {color: cyan !important;}
.magenta {color: magenta !important;}
.gray {color: silver !important;}
.black {color: black !important;}
.white {color: white !important;}

.clickable {cursor: pointer;}

/* ************************ */
.text-black {color:#161616;}
.text-dark {color:#404040;}
.text-gray {color: #4b4b4b;}
.text-light {color:#7f7f7f;}
.text-white {color:white;}
.text-red {color:red;}
.text-blue {color:#00abeb;}
.text-blue {color: #2db2ea;}
.text-orange {color:#fb9600;}
.text-green {color:#37c229;}
.text-black {color:#161616;}
.text-dark {color:#404040;}
.text-gray {color: #4b4b4b;}
.text-light {color:#7f7f7f;}
.text-white {color:white;}
.text-red {color:red;}
.text-blue {color:#00abeb;}
.text-orange {color:#fb9600;}
.text-green {color:#37c229;}

.text-shadow-white { text-shadow: 0px 2px 3px #fff;}
.text-shadow-dark { text-shadow: 0px 2px 3px #404040;}
.text-shadow-light { text-shadow: 0px 2px 3px #7f7f7f;}

.background-black {background:#161616;}
.background-dark {background:#404040;}
.background-gray {background: #4b4b4b;}
.background-light {background:#7f7f7f;}
.background-white {background:white;}
.background-red {background:red;}
.background-blue {background:#00abeb;}
.background-orange {background:#fb9600;}
.background-green {background:#37c229;}


.border-black {border:#161616 1px solid;}
.border-dark {border:#404040 1px solid;}
.border-gray {border: #4b4b4b 1px solid;}
.border-light {border:#7f7f7f 1px solid;}
.border-white {border:white 1px solid;}
.border-red {border:red 1px solid;}
.border-blue {border:#00abeb 1px solid;}
.border-orange {border:#fb9600 1px solid;}
.border-green {border:#37c229 1px solid;}


.underline-black {border-bottom:#161616 1px solid;}
.underline-dark {border-bottom:#404040 1px solid;}
.underline-gray {border-bottom: #4b4b4b 1px solid;}
.underline-light {border-bottom:#7f7f7f 1px solid;}
.underline-white {border-bottom:white 1px solid;}
.underline-red {border-bottom:red 1px solid;}
.underline-blue {border-bottom:#00abeb 1px solid;}
.underline-orange {border-bottom:#fb9600 1px solid;}
.underline-green {border-bottom:#37c229 1px solid;}


.clearline { display:block; width: 100%;}

/* font size and space */
.text-small {font-size: 0.750em;}
.text-normal {font-size: 1.000em;}
.text-large {font-size: 1.333em;}
.text-big {font-size:1.667em}
.text-huge {font-size:2.000em}

.text-spaced { text-align: justify;}
.text-upper {text-transform: uppercase;}
.text-lower {text-transform: lowercase;}
.text-capitalize {text-transform: capitalize;}
.text-spaced {text-align:justify center;text-justify:inter-word;}
.text-fill {text-align: justify;}
.text-center { text-align: center;}
.text-bold {font-weight: bold;}
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}


/* center positioning  */
/* todo : needs more testing */

.center {margin-right: auto;margin-right: auto;}
.right {float:right;}
.left {float:left;}

p.center {
	min-width: 60%;
	margin: 2% 20% 2% 20%;
	height: auto;
}
.center-vertical {}
section.center {flex: 1;}
article.center_old {
	min-height: 10em;
	display: table-cell;
    vertical-align: middle;
}

.auto-center {
	display: block;
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}

/*************
 BUTTONS child of .vdj8 to apply themed stuff
************* */

.button-success,
.button-error,
.button-warning,
.button-secondary {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.button-success { background: #37c229; /* this is a green */}
.button-error { background: rgb(202, 60, 60); /* this is a maroon */}
.button-warning { background: #fb9600;; /* orange */}
.button-secondary {background: #00abeb; /* this is a light blue */}

/* ************************
	RESPONSIVE HELPERS
************************** */
.responsive {width: 100%;height:auto;}
.width-100 {width: 100% !important; }
.width-95 {width: 95% !important;}
.width-90 {width: 90% !important;}
.width-85 {width: 85% !important;}
.width-80 {width: 80% !important;}
.width-75 {width: 75% !important;}
.width-70 {width: 70% !important;}
.width-65 {width: 65% !important;}
.width-60 {width: 60% !important;}
.width-55 {width: 55% !important;}
.width-50 {width: 50% !important;}
.width-45 {width: 45% !important;}
.width-40 {width: 40% !important;}
.width-35 {width: 35% !important;}
.width-30 {width: 30% !important;}
.width-25 {width: 25% !important;}
.width-20 {width: 20% !important;}
.width-15 {width: 15% !important;}
.width-10 {width: 10% !important;}
.width-5 {width: 5% !important;}

.minwidth-100 {min-width: 100% !important; }
.minwidth-95 {min-width: 95% !important;}
.minwidth-90 {min-width: 90% !important;}
.minwidth-85 {min-width: 85% !important;}
.minwidth-80 {min-width: 80% !important;}
.minwidth-75 {min-width: 75% !important;}
.minwidth-70 {min-width: 70% !important;}
.minwidth-65 {min-width: 65% !important;}
.minwidth-60 {min-width: 60% !important;}
.minwidth-55 {min-width: 55% !important;}
.minwidth-50 {min-width: 50% !important;}
.minwidth-45 {min-width: 45% !important;}
.minwidth-40 {min-width: 40% !important;}
.minwidth-35 {min-width: 35% !important;}
.minwidth-30 {min-width: 30% !important;}
.minwidth-25 {min-width: 25% !important;}
.minwidth-20 {min-width: 20% !important;}
.minwidth-15 {min-width: 15% !important;}
.minwidth-10 {min-width: 10% !important;}
.minwidth-5 {min-width: 5% !important;}

.width-auto {width: auto !important; }
.height-auto {height: auto !important; }

.height-20px {height: 20px !important;}
.height-30px {height: 30px !important;}
.height-40px {height: 40px !important;}
.height-50px {height: 50px !important;}
.height-60px {height: 60px !important;}

/* align */
.valign-middle { vertical-align: middle;}
.valign-top { vertical-align: top;}
.valign-bottom { vertical-align: bottom;}

/* IMAGES */
img.round-corners{
	border:1px solid;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}