/* ==========================================================================

	IMPACT PRODUCERS COURSE
	James Franklin - james@docsociety.org

   ========================================================================== */

@font-face {
    font-family: 'bebas_neueregular';
    src: url('../fonts/BebasNeue-webfont.eot');
    src: url('../fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/BebasNeue-webfont.woff') format('woff'),
         url('../fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('../fonts/BebasNeue-webfont.svg#bebas_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-Light.eot');
    src: local('Gotham Light'), local('Gotham-Light'), url('../fonts/Gotham-Light.woff') format('woff'), url('../fonts/Gotham-Light.otf') format('opentype'), url('../fonts/Gotham-Light.svg#Gotham-Light') format('svg');
    font-weight:100;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-LightItalic.eot');
    src: local('Gotham Light Italic'), local('Gotham-LightItalic'), url('../fonts/Gotham-LightItalic.woff') format('woff'), url('../fonts/Gotham-LightItalic.otf') format('opentype'), url('../fonts/Gotham-LightItalic.svg#Gotham-LightItalic') format('svg');
    font-weight:100;
    font-style:italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-Book.eot');
    src: local('Gotham Book'), local('Gotham-Book'), url('../fonts/Gotham-Book.woff') format('woff'), url('../fonts/Gotham-Book.otf') format('opentype'), url('../fonts/Gotham-Book.svg#Gotham-Light') format('svg');
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-BookItalic.eot');
    src: local('Gotham Book Italic'), local('Gotham-BookItalic'), url('../fonts/Gotham-BookItalic.woff') format('woff'), url('../fonts/Gotham-BookItalic.otf') format('opentype'), url('../fonts/Gotham-BookItalic.svg#Gotham-BookItalic') format('svg');
    font-style:italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-Bold.eot');
    src: local('Gotham Bold'), local('Gotham-Bold'), url('../fonts/Gotham-Bold.woff') format('woff'), url('../fonts/Gotham-Bold.otf') format('opentype'), url('../fonts/Gotham-Bold.svg#Gotham-Bold') format('svg');
    font-weight:bold;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-BoldItalic.eot');
    src: local('Gotham Bold Italic'), local('Gotham-BoldItalic'), url('../fonts/Gotham-BoldItalic.woff') format('woff'), url('../fonts/Gotham-BoldItalic.otf') format('opentype'), url('../fonts/Gotham-BoldItalic.svg#Gotham-BoldItalic') format('svg');
    font-weight:bold;
    font-style:italic;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-Medium.eot');
    src: local('Gotham Medium'), local('Gotham-Medium'), url('../fonts/Gotham-Medium.woff') format('woff'), url('../fonts/Gotham-Medium.otf') format('opentype'), url('../fonts/Gotham-Medium.svg#Gotham-Medium') format('svg');
    font-weight:400;
}

@font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-MediumItalic.eot');
    src: local('Gotham Bold Italic'), local('Gotham-MediumItalic'), url('../fonts/Gotham-MediumItalic.woff') format('woff'), url('../fonts/Gotham-MediumItalic.otf') format('opentype'), url('../fonts/Gotham-MediumItalic.svg#Gotham-MediumItalic') format('svg');
    font-weight:400;
    font-style:italic;
}

body {
    color:#5D5F63;
    background:#fff;
    font-family:'Open Sans', sans-serif;
    padding:0px;
    margin:0px;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing: antialiased;

}

a:link, a:visited {
    text-decoration: underline;
    outline:none;
    color:#a9bd44;
}

a:hover, a:active {
    outline:none;
    text-decoration: none;
    color:#8c9d38;
}

p a:hover {
    background-color: rgba(225,225,225,0.3);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Gotham', sans-serif;
    font-weight: normal !important;
}
h1 {
    color: #a8bc44;
    font-size: 1.9em;
}
h2 {
    font-size: 2.4em;
}

p {font-size: 1.2em;}

hr {
    margin-top: 10px;
    margin-bottom: 10px;
}
img{
    max-width: 100%;
}
::selection {
    background:#fff7dd;
}
::-moz-selection {
    background:#fff7dd;
}

/* colours ========================================================================== */

/* Introduction Purple */
.color-introduction,
body#introduction h1,
body#introduction h2,
body#introduction .breadcrumb > li a,
body#introduction blockquote p,
body#introduction .highlight,
body#introduction a.active,
body#introduction .quote,
li.introduction,
li.introduction>a,
ul.dropdown-menu li.introduction ul a,
.s1-1 #leftside-navigation ul ul a.s1-1,
.s1-2 #leftside-navigation ul ul a.s1-2,
.s1-3 #leftside-navigation ul ul a.s1-3,
.s1-4 #leftside-navigation ul ul a.s1-4,
.s1-5 #leftside-navigation ul ul a.s1-5,
.s1-6 #leftside-navigation ul ul a.s1-6,
.s1-7 #leftside-navigation ul ul a.s1-7 {
    color: #a597c5 !important;
}
body#introduction blockquote,
body#introduction ul.breadcrumb {
    border-color: #a597c5;
}
.circle.circle:nth-child(1) {
    border: 2px solid #a597c5;
}
.circle:nth-child(1) div a {
    background-color: #a597c5;
}

/* Planning Blue */
.color-planning,
body#planning h1,
body#planning h2,
body#planning .breadcrumb > li a,
body#planning blockquote p,
body#planning .highlight,
body#planning a.active,
body#planning .quote,
li.planning,
li.planning>a,
ul.dropdown-menu li.planning ul a,
.s2-1 a.s2-1,
.s2-2 a.s2-2,
.s2-3 a.s2-3,
.s2-4 a.s2-4,
.s2-5 a.s2-5,
.s2-6 a.s2-6,
.s2-7 a.s2-7 {
    color: #4dbed1 !important;
}
body#planning blockquote,
body#planning ul.breadcrumb {
    border-color: #4dbed1;
}
.circle.circle:nth-child(2) {
    border: 2px solid #4dbed1;
}
.circle:nth-child(2) div {
    background-color: #4dbed1;
}

/* Impact In Action Yellow */
.color-impact-in-action,
body#impact-in-action h1,
body#impact-in-action h2,
body#impact-in-action .breadcrumb > li a,
body#impact-in-action blockquote p,
body#impact-in-action .highlight,
body#impact-in-action a.active,
body#impact-in-action .quote,
li.impact-in-action,
li.impact-in-action>a,
ul.dropdown-menu li.impact-in-action ul a,
.s3-1 a.s3-1,
.s3-2 a.s3-2,
.s3-3 a.s3-3,
.s3-4 a.s3-4,
.s3-5 a.s3-5,
.s3-6 a.s3-6,
.s3-7 a.s3-7 {
    color: #f3c933 !important;
}
body#impact-in-action blockquote,
body#impact-in-action ul.breadcrumb {
    border-color: #f3c933;
}
.circle.circle:nth-child(3) {
    border: 2px solid #f3c933;
}
.circle:nth-child(3) div {
    background-color: #f3c933;
}

/* Impact Distribution Red */
.color-impact-distribution,
body#impact-distribution h1,
body#impact-distribution h2,
body#impact-distribution .breadcrumb > li a,
body#impact-distribution blockquote p,
body#impact-distribution .highlight,
body#impact-distribution a.active,
body#impact-distribution .quote,
li.impact-distribution,
li.impact-distribution>a,
ul.dropdown-menu li.impact-distribution ul a,
.s4-1 a.s4-1,
.s4-2 a.s4-2,
.s4-3 a.s4-3,
.s4-4 a.s4-4,
.s4-5 a.s4-5,
.s4-6 a.s4-6,
.s4-7 a.s4-7 {
    color: #e86d27 !important;
}
body#impact-distribution blockquote,
body#impact-distribution ul.breadcrumb {
    border-color: #e86d27;
}
.circle.circle:nth-child(4) {
    border: 2px solid #e86d27;
}
.circle:nth-child(4) div {
    background-color: #e86d27;
}

/* Shorts Purple */
.color-making-and-moving-shorts,
body#making-and-moving-shorts h1,
body#making-and-moving-shorts h2,
body#making-and-moving-shorts .breadcrumb > li a,
body#making-and-moving-shorts blockquote p,
body#making-and-moving-shorts .highlight,
body#making-and-moving-shorts a.active,
body#making-and-moving-shorts .quote,
li.making-and-moving-shorts,
li.making-and-moving-shorts>a,
ul.dropdown-menu li.making-and-moving-shorts ul a,
.s5-1 a.s5-1,
.s5-2 a.s5-2,
.s5-3 a.s5-3,
.s5-4 a.s5-4,
.s5-5 a.s5-5,
.s5-6 a.s5-6,
.s5-7 a.s5-7 {
    color: #5c3153 !important;
}
body#making-and-moving-shorts blockquote,
body#making-and-moving-shorts ul.breadcrumb {
    border-color: #5c3153;
}
.circle.circle:nth-child(5) {
    border: 2px solid #5c3153;
}
.circle:nth-child(5) div {
    background-color: #5c3153;
}

/* Evaluation Green */
body#measuring-impact h1,
body#measuring-impact h2,
body#measuring-impact .breadcrumb > li a,
body#measuring-impact blockquote p,
body#measuring-impact .highlight,
body#measuring-impact a.active,
body#measuring-impact .quote,
li.measuring-impact,
li.measuring-impact>a,
ul.dropdown-menu li.measuring-impact ul a,
.color-evaluating,
body#evaluating h1,
body#evaluating h2,
body#evaluating .breadcrumb > li a,
body#evaluating blockquote p,
body#evaluating .highlight,
body#evaluating a.active,
body#evaluating .quote,
li.evaluating,
li.evaluating>a,
ul.dropdown-menu li.evaluating ul a,
.s5-1 a.s5-1,
.s5-2 a.s5-2,
.s5-3 a.s5-3,
.s5-4 a.s5-4,
.s5-5 a.s5-5,
.s5-6 a.s5-6,
.s5-7 a.s5-7 {
    color: #9cb35b !important;
}
body#measuring-impact blockquote,
body#measuring-impact ul.breadcrumb,
body#evaluating blockquote,
body#evaluating ul.breadcrumb {
    border-color: #9cb35b;
}
.circle.circle:nth-child(6) {
    border: 2px solid #5c3153;
}
.circle:nth-child(6) div {
    background-color: #9cb35b;
}

.white {
    color: #fff;
}

.black {
    color: #000;
}

/* ==========================================================================
   Helpers
   ========================================================================== */

.toolbox-table ul.nav-tabs li a {
    font-size: 11px !important;
}

.toolbox-table ul {
    width: 100% !important;
    display: block !important;
}


#Organisations {
    list-style: none;
    padding: 0;
    margin: 0;
}
#Library .mix, #Library-espanol .mix {
    display: none;
}
#Library .mix, #Organisations .org, #Library-espanol .mix {
    max-width: 300px;
    margin: 20px 2% 10px 0;
    padding: 5px 0;
    float: left;
    vertical-align: text-top;
    border-top: 2px solid #777;
    height: 320px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center 5px;
}

#Organisations .org {
    height: 180px;
}

#Library .btn-primary, #Library-espanol .btn-primary {
    margin-top: 9px;
    display: inline-block;
}

#Library .mix div.downloadOverlay, #Library-espanol .mix div.downloadOverlay {
    display: block;
    width: 300px;
    padding: 0 20px;
    height: 169px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
#Library .mix div.downloadOverlay a, #Library .mix div.downloadOverlay p, #Library-espanol .mix div.downloadOverlay a, #Library-espanol .mix div.downloadOverlay p {
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
    opacity: 0;
}
#Library .mix div.downloadOverlay p, #Library-espanol .mix div.downloadOverlay p {
    font-size: 12px;
}

#Library .mix div.downloadOverlay:hover, #Library-espanol .mix div.downloadOverlay:hover {
    background-color: rgba(255,255,255,0.9);
}

#Library .mix div.downloadOverlay:hover a, #Library .mix div.downloadOverlay:hover p, #Library-espanol .mix div.downloadOverlay:hover a, #Library-espanol .mix div.downloadOverlay:hover p {
    opacity: 1;
}

.green { background-color: #1db88f; }
.orange { background-color: #f89e34; }
.pink { background-color: #f14d96; }
.darkPink { background-color: #b6a591; }
.lightPink { background-color: #f282a9; }
.salmon { background-color: #f58d6b; }
.purple { background-color: #84609e; }
.lightBlue { background-color: #00d7d4; }
.darkBlue { background-color: #00afe1; }
.grey { background-color: #b6a591; }

.text-green { color: #1db88f !important; }
.text-orange { color: #f89e34 !important; }
.text-pink { color: #f14d96 !important; }
.text-darkPink { color: #b6a591 !important; }
.text-lightPink { color: #f282a9 !important; }
.text-salmon { color: #f58d6b !important; }
.text-purple { color: #84609e !important; }
.text-lightBlue { color: #00d7d4 !important; }
.text-darkBlue { color: #00afe1 !important; }
.text-grey { color: #b6a591 !important; }

.slider div.slide {
    width: 100%;
    height: 700px;
    padding-top: 50px;
}

.slideBg {
    width: 100%;
    height: 350px;
    background-color: #eee;
}

.krakatoa-control{
    padding-bottom:20px;
}
.arrows{
    position:absolute;
    left:0;
    z-index:100;
    font-size: 30px;
}
.arrow{
    float:left;
    width:13px;
    height:0;
    margin-right:7px;
    padding-top:16px;
}
.arrow-left{
    background-position:0 0;
}
.arrow-left:hover{
    background-position:0 -16px;
}
.arrow-right{
    background-position:-20px 0;
    left:20px;
}
.arrow-right:hover{
    background-position:-20px -16px;
}
.buttons{
    position:absolute;
    top:5px;
    right:0px;
    z-index:100;
    font-size: 15px;
}
.pagination{
    float:left;
    margin:0 2px;
}
.pagination a{
    display:block;
    width:10px;
    height:0;
    padding-top:10px;
    content: '>';
}
.pagination a:hover,
.active-button a{
    background-position:0 -30px;
}

.clear, .clear:after {
    content: '';
    clear: both;
    display: block;
}

.full-height {
    height: 100%;
    padding-top: 3em;
}

.case-study {
    min-height: 400px;
    background: center center;
    background-size: cover;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    font-family: 'Gotham', 'Montserrat', sans-serif;
    color: #fff;
    position: relative;
    margin: 0 0 3px 0;
}

.case-study.case-study-small {
    min-height: 230px;
    width: 34% !important;
    font-size: 14px !important;
}
.case-study span {
    padding: 150px 80px;
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(0,0,0,0.4);
}
.case-study.case-study-small span {
    padding: 50px 40px;
}

.case-study span a {
    color: #fff;
    font-size: 33px;
}
.case-study.case-study-small span a{
    font-size: 23px;
}

.case-study span a:after {
    content: '';
    clear: both;
}
div.download-stamp {
    position: relative;
    top: 0;
    right: 0;
}

div.download-stamp a {
    display: block;
    margin: 60px 20px;
    width: 180px;
    background: url(../img/download-stamp.png) center center;
    background-size: cover;
    min-height: 180px;
    text-indent: -1000px;
    overflow: hidden;
    opacity: 0.5;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#Hello div.download-stamp {
    position: absolute;
    top: 30px;
    right: 40px;
}

div.download-stamp a:hover {
    opacity: 1;
    transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -ms-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -webkit-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
}

div.download-update {
    position: absolute;
    top:0;
}

div.download-update a {
    z-index: 9999;
    display: block;
    margin: 60px 20px;
    width: 120px;
    background: url(../img/download-stamp-updated-2020.png) center center;
    background-size: cover;
    min-height: 120px;
    text-indent: -1000px;
    overflow: hidden;
    opacity: 0.8;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
    position: absolute;
    top: 15px;
    left: -70px;
}

div.download-update a:hover {
    opacity: 1;
    transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -ms-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -webkit-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
}

div.download-update-big {
    position: absolute;
    top:0;
    right: 0;
}

div.download-update-big a {
    z-index: 9999;
    display: block;
    margin: 60px 20px;
    width: 250px;
    background: url(../img/download-stamp-updated-2020.png) center center;
    background-size: cover;
    min-height: 250px;
    text-indent: -1000px;
    overflow: hidden;
    opacity: 0.8;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
    position: absolute;
    top: -80px;
    right: 40px;
}

div.download-update-big a:hover {
    opacity: 1;
    transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -ms-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -webkit-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
}


/* ==========================================================================
   Layout
   ========================================================================== */
#container {
    width: 100%;
    height: 100%;
    z-index: 0;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
    margin-top: 20px;
}

#Hello #container {
    margin-top: 0;
}

/* Header ========================================================================== */
#header {
    left: 290px;
    right: 0;
    top: 0;
    z-index: 200;
    position: absolute;
    height: 100px;
    background-color: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    border-bottom: dashed 1px #999;
}
#Hello #header {
    left: 0;
    background-color: #1db78d;
}
.brand {
    z-index: 201;
    position: absolute;
    top: 0;
    left: 0;
    width: 250px;
    min-height: 135px;
    padding: 0;
    background: #fff;
}
#Hello .brand {
    display: none;
}
#Hello .main-content-wrapper #main-content div div>img.logo {
    padding-bottom:30px;
    max-width: 100%;
    margin-top:30px;
    margin-bottom: 10px;
    padding-right: 40px;
}
.brand a.logo {
    display: block;
    width: 240px;
    min-height: 100px;
    padding: 17px 0 0 20px;
    background: transparent;
}
.brand a.logo img {
    max-width: 225px;
}

.toggle-navigation.toggle-left .btn-default {
    display: none;
}

.toggle-navigation button:hover,
.toggle-navigation button:active,
button#toggle-mail:hover,
button#toggle-mail:active{
    background: #1db88f;
}

.toggle-navigation button:hover i,
button#toggle-mail:hover i{
    color:#F6F6F6;
}

.toggle-navigation.toggle-left {
    margin: 0;
    display: block;
    position: absolute;
    top: 30px;
    right: 30px;
}
.toggle-navigation .btn-default {
    padding: 3px 9px;
    background: #1db88f;
    border-radius: 50%;
    -moz-border-radius:50%;
    -webkit-border-radius: 50%;
    width: 35px;
    height: 35px;
}

ul.breadcrumb {
    border-top: 1px solid #4dbed1;
    padding: 5px 0 0 0;
    margin-bottom: 0px;
    height: 40px;
    border-radius: 0;
    width: 100% !important;
}

/* Main Nav ========================================================================= */

ul.main-nav {
    width: 100%;
    display: block;
    text-align: center;
    margin-bottom: 0;
}

ul.main-nav li {
    list-style: none;
    display: inline-block;
    padding: 0;
    margin: 0 3px;
    width: 150px;
}

ul.main-nav li a {
    background-color: #b9cd54;
    font-family: gotham,montserrat,sans-serif;
    text-transform: uppercase;
    font-weight: 400 !important;
    color: #fff;
    display: block;
    width: 100%;
    height: 50px;
    transition: all .3s ease-in-out;
    text-align: center;
    padding: 15px 10px 17px;
}

ul.main-nav li a:hover {
    background-color:#666;
}

ul.main-nav li a.active {
    color: #a9bd44;
    background-color:#fff;
}

/* Top Nav ========================================================================== */

.top-nav {
    position: absolute;
    z-index: 201;
    top: 20px;
    right: 20px;
    left: 280px;
    height: 70px;
    padding: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.top-nav>ul {
    list-style: none;
    padding: 8px 0;
    margin: 0;
    height: 70px;
}

.top-nav>ul>li {
    padding: 0;
    margin: 0;
    display: inline-block;
    display: inline-flex;
    height: 51px;
    position: relative;
    border: 1px #fff solid;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    overflow: hidden;
}
.top-nav>ul>li.guide-menu:hover, .top-nav>ul>li.language-menu:hover {
    border-bottom-color: #fff;
}
.top-nav>ul>li.guide-menu:after, .top-nav>ul>li.language-menu:after {
    content: "" !important;
    padding: 0;
    margin: 0;
    display: block;
    height: 2px;
    position: absolute;
    background-color: #fff;
    width: 100%;
    top: 47px;
    z-index: 9999;
    left: 0;
}
.top-nav>ul>li.language-menu:after {
    top: 49px;
}
.top-nav>ul>li:hover {
    border: 1px #999 solid;
}
.top-nav>ul>li>a {
    display: block;
    font-family: 'Gotham', 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: 400 !important;
    text-decoration: none;
    height: 50px;
    padding: 15px 10px 17px 10px;
    margin-bottom: -1px;
}

.top-nav ul li.login, .top-nav ul li.language-menu {
    float: right;
}

.top-nav ul li ul.dropdown-menu {
    background-color:#fff;
    padding: 8px;
    top: 47px;
    left: -1px;
    border-radius: 0;
    border: 1px #999 solid;
    min-width: 102%;
    opacity: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    display: inline;
}
.top-nav ul li.language-menu ul.dropdown-menu li a, .top-nav ul li.language-menu ul.dropdown-menu li p {
    font-size: 14px;
    font-weight: 400 !important;
}

.top-nav ul li ul.dropdown-menu li a span {
    display: none;
}
.top-nav ul li ul.dropdown-menu li a span.section-number {
    display: inline;
}
.top-nav ul li ul.dropdown-menu li a:hover {
    background: none;
    opacity: 0.7;
}

.top-nav ul li.guide-menu ul.dropdown-menu {
    min-width: 900px;
}

.top-nav ul li.guide-menu:hover, .top-nav ul li.language-menu:hover {
    overflow: visible;
}
.top-nav ul li:hover ul.dropdown-menu {
    display: block;
    opacity: 1;
}

.top-nav .inactive {
    opacity: 0.3;
}

#Hello .top-nav ul li.login {
    float: none;
}

#Hello .top-nav ul li.language-menu {
    display: none;
    float: none;
}

#Hello .top-nav ul li.feedback {
    display: none;
}

#Hello .top-nav {
    position: relative;
    z-index: 201;
    height: 70px;
    padding: 0;
}

#Hello .top-nav>ul>li {
    border: 1px #999 solid;
    margin: 0 15px;
}

#Hello .top-nav>ul>li>a {
    padding: 15px 20px 17px 20px;
}

#Hello .top-nav ul li ul.dropdown-menu {
    background-color: #fff;
    padding: 8px;
    top: 47px;
    /* left: -215px; */
}

/* Section Nav ========================================================================== */

ul.section-menu, .home-nav {
    font-family: 'Gotham', 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: 400 !important;
    text-decoration: none;
    padding: 0;
    margin: 0;
    list-style: none;
    width: 100%;
    text-align: center;
}

ul.section-menu li, .home-nav>ul>li {
    padding: 1%;
    width: 16%;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    line-height: 1;
}

/* top nav section nav */

.top-nav ul.section-menu>li>a, .home-nav>ul>li>a {
    display: block;
    border-top: 24px solid;
    border-bottom: 1px solid;
    min-height: 60px;
}

.top-nav ul.section-menu li i, .home-nav ul li i{
    display: block;
    font-size: 14px;
    margin-bottom: 10px;
    text-align: center;
    margin-top: -19px;
    color: #fff !important;
}

.top-nav ul.dropdown-menu li a,
.top-nav ul.dropdown-menu li p,
.home-nav ul li a,
.home-nav ul li p {
    font-family: 'Gotham', 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: bold !important;
    text-decoration: none;
    padding: 0 0 4px;
    margin: 0;
    font-size: 1.1em;
    white-space: normal;
    line-height: 1;
    letter-spacing: -1px;
}


.top-nav ul.section-menu ul, .home-nav ul ul {
    margin: 10px 0 0;
    padding: 0;
}

.top-nav ul.section-menu ul li, .home-nav ul ul li {
    display: inline-block;
    padding: 6px 0px;
    margin-right: 0px;
    width: 100%;
    border-bottom: 1px #ddd solid;
}

.top-nav ul.section-menu ul li a, .home-nav ul ul li a {
    font-weight: 400 !important;
    text-transform: none;
    font-size: 0.8em;
    letter-spacing: 0;
}

.top-nav .nav-header, .home-nav .nav-header {
    padding: 0 !important;
    margin-bottom: 10px;
    display: inline-block;
    width: 100%;
}


/* Sidebar ========================================================================== */


/* side nav section nav */

#leftside-wrapper {
    border-left: 1px solid #ccc;
    margin-left: 10px;
    padding: 10px 0 1px;
}

#left-nav-circle {
    width: 10px;
    height: 10px;
    border-radius:50% ;
    background: #ccc;
    margin-left: 6px;
}

#leftside-navigation li.introduction {
    margin-top: -24px;
}

.homeinner {
    text-align: center;
    margin: 0 auto;
}

.sidebar {
    width: 240px;
    min-height: 100%;
    position: absolute;
    top: 110px;
    background: #fff;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    z-index: 100;
    padding-left: 15px;
}

#Hello .sidebar {
    display: none;
}

.sidebar-toggle {
    margin-left: -280px;
}

#leftside-navigation {
    margin-top: 140px;
    font-family: 'Gotham', 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: 400 !important;
}
#leftside-navigation ul,
#leftside-navigation ul ul {
    margin: 0;
    padding: 0;
}
#leftside-navigation ul li {
    list-style-type: none;
    width: 230px;
    margin: 0 0 18px;
}

#leftside-navigation ul li a {
    text-align: left;
    text-decoration: none;
    display: block;
    font-size: 15px;
    outline: none;
    -webkit-transition: all 200ms ease-in;
    -o-transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    margin-bottom: 1px;
    padding-left: 20px;
}
#leftside-navigation ul li.about {
    display: inline-block;
    width: auto;
}

#leftside-navigation ul li.about a {
    color: #666;
    padding: 0;
    font-size: 12px;
    display: inline-block;
}
#leftside-navigation ul.sub-nav {
    text-align: center;
    margin-top: 15px;
}
#leftside-navigation ul.sub-nav li:after {
    content: "-";
}
#leftside-navigation ul.sub-nav li:nth-child(3):after {
    content: "" !important;
}
#leftside-navigation ul li.about a {
    color: #e65930;
}
#leftside-navigation ul li.about.active a {
    color: #ccc;
}
#leftside-navigation ul li.about a:hover {
    color: #ccc;
    letter-spacing: 0;
    text-decoration: underline;
}
#leftside-navigation ul li.disabled a {
    color: rgba(255,255,255,0.4);
}
#leftside-navigation ul li.disabled a:hover {
    color: rgba(255,255,255,0.4) !important;
    text-indent: 0;
    letter-spacing: 0;
    cursor: text;
}
#leftside-navigation li.library {
    margin-bottom: -16px;
}
#leftside-navigation li.library a {
    color: #6a6a6a;
}
#leftside-navigation ul ul li {
    margin: 0;
}
#leftside-navigation ul ul a {
    font-size: 12px;
    padding-top: 3px;
    padding-bottom: 3px;
    vertical-align: middle;
    border-bottom: 1px transparent solid;
    color: #666;
    line-height: 1;
}
#leftside-navigation ul li span.section-number {
    display: none;
}
#leftside-navigation ul li a.active,
.s1-1 a.s1-1,
.s1-2 a.s1-2,
.s1-3 a.s1-3,
.s1-4 a.s1-4,
.s1-5 a.s1-5,
.s1-6 a.s1-6,
.s1-7 a.s1-7,
.s2-1 a.s2-1,
.s2-2 a.s2-2,
.s2-3 a.s2-3,
.s2-4 a.s2-4,
.s2-5 a.s2-5,
.s2-6 a.s2-6,
.s2-7 a.s2-7,
.s3-1 a.s3-1,
.s3-2 a.s3-2,
.s3-3 a.s3-3,
.s3-4 a.s3-4,
.s3-5 a.s3-5,
.s3-6 a.s3-6,
.s3-7 a.s3-7,
.s4-1 a.s4-1,
.s4-2 a.s4-2,
.s4-3 a.s4-3,
.s4-4 a.s4-4,
.s4-5 a.s4-5,
.s4-6 a.s4-6,
.s4-7 a.s4-7,
.s5-1 a.s5-1,
.s5-2 a.s5-2,
.s5-3 a.s5-3,
.s5-4 a.s5-4,
.s5-5 a.s5-5,
.s5-6 a.s5-6,
.s5-7 a.s5-7 {
    padding-left: 10px;
}
#leftside-navigation ul li a.active:before,
.s1-1 a.s1-1:before,
.s1-2 a.s1-2:before,
.s1-3 a.s1-3:before,
.s1-4 a.s1-4:before,
.s1-5 a.s1-5:before,
.s1-6 a.s1-6:before,
.s1-7 a.s1-7:before,
.s2-1 a.s2-1:before,
.s2-2 a.s2-2:before,
.s2-3 a.s2-3:before,
.s2-4 a.s2-4:before,
.s2-5 a.s2-5:before,
.s2-6 a.s2-6:before,
.s2-7 a.s2-7:before,
.s3-1 a.s3-1:before,
.s3-2 a.s3-2:before,
.s3-3 a.s3-3:before,
.s3-4 a.s3-4:before,
.s3-5 a.s3-5:before,
.s3-6 a.s3-6:before,
.s3-7 a.s3-7:before,
.s4-1 a.s4-1:before,
.s4-2 a.s4-2:before,
.s4-3 a.s4-3:before,
.s4-4 a.s4-4:before,
.s4-5 a.s4-5:before,
.s4-6 a.s4-6:before,
.s4-7 a.s4-7:before,
.s5-1 a.s5-1:before,
.s5-2 a.s5-2:before,
.s5-3 a.s5-3:before,
.s5-4 a.s5-4:before,
.s5-5 a.s5-5:before,
.s5-6 a.s5-6:before,
.s5-7 a.s5-7:before {
    display: block;
    content: '';
    width: 10px;
    height: 10px;
    border-radius:50% ;
    background-color: #ccc;
    position: absolute;
    left: 21px;
}
#leftside-navigation ul li a i {
    width: 20px;
    text-align: left;
}
#leftside-navigation ul li a i.fa-angle-right, #leftside-navigation ul li a i.fa-angle-left {
    padding-top:3px;
}
#leftside-navigation ul ul {
    display: none;
}
#introduction #leftside-navigation li.introduction ul,
#planning #leftside-navigation li.planning ul,
#impact-in-action #leftside-navigation li.impact-in-action ul,
#impact-distribution #leftside-navigation li.impact-distribution ul,
#evaluating #leftside-navigation li.evaluating ul {
    display: block;
}
#leftside-navigation li.active ul {
    display: block;
}
#leftside-navigation ul li > a:hover {
    color:#605551;
}
#leftside-navigation ul li li > a:hover {
    color:#605551;
    letter-spacing: 0;
}
#leftside-navigation .tooltip {
    margin-left: -20px;
}
#leftside-navigation .tooltip-inner {
    width: 115px;
    background-color: #777;
}
#leftside-navigation .tooltip-arrow {
    border-right-color: #777;
}
.nano {
    position : relative;
    width : 100%;
    height : 100%;
    overflow : hidden;
}
.nano > .nano-content {
    position : absolute;
    overflow : scroll;
    overflow-x : hidden;
    top : 0;
    right : 0;
    bottom : 0;
    left : 0;
}
.nano > .nano-content:focus {
    outline: thin dotted;
}
.nano > .nano-content::-webkit-scrollbar {
    visibility: hidden;
}
.has-scrollbar > .nano-content::-webkit-scrollbar {
    visibility: visible;
}
.nano > .nano-pane {
    background : rgba(0, 0, 0, .25);
    position : absolute;
    width : 10px;
    right : 0;
    top : 0;
    bottom : 0;
    visibility : hidden\9;
    opacity : .01;
    -webkit-transition : .2s;
    -moz-transition : .2s;
    -o-transition : .2s;
    transition : .2s;
    -moz-border-radius : 5px;
    -webkit-border-radius : 5px;
    border-radius : 5px;
}
.nano > .nano-pane > .nano-slider {
    background: #444;
    background: rgba(0, 0, 0, .5);
    position : relative;
    margin : 0 1px;
    -moz-border-radius : 3px;
    -webkit-border-radius : 3px;
    border-radius : 3px;
}
.nano:hover > .nano-pane, .nano-pane.active, .nano-pane.flashed {
    visibility : visible\9;
    opacity : 0.99;
}
.nano > .nano-pane > .nano-slider{background-color: #1db78d;}

.btn-primary + .dropdown-menu>li>a:hover,
.btn-primary + .dropdown-menu>li>a:active{
    background-color: #16a086;
}

.home-nav-roll .home-nav {
    position: absolute;
    top: 0;
    left: 100%;
    width:100vw;
    max-width: 950px;
    background-color: #fff;
    z-index: 99999;
    padding: 10px;
    display: none;
    overflow : scroll;
    border: 1px solid #1db78d;
}

.home-nav-roll:hover .home-nav {
    display: block;
}

.home-nav-roll .home-nav ul {
    padding: 0;
    list-style: none;
}

.home-nav-roll .home-nav>ul>li.sub-menu {
    display: inline-block;
    max-width: 150px;
    vertical-align: top;
    padding-left: 5px;
}

.home-links ul {
    list-style: none;
}

.home-links ul li {
    display: inline-block;
}


/* ==========================================================================
   Intro / Home Page
   ========================================================================== */

.intro-wrapper {
    margin-left: 0;
    margin-right: 0
                  -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    background-color: #f89e34;
}
.intro-wrapper #main-content {
    display: inline-block;
    margin-top: 10px;
    padding: 40px;
    width: 100%;
    height: 100%;
}
.intro-wrapper #main-content .h1 {
    margin: 0;
    padding: 0px 10px 40px 10px;
    font-weight: normal;
    font-size: 3.5em;
    color: #fff;
}
.intro-wrapper #main-content p {
    color: #000;
}
/* ==========================================================================
   Main Content
   ========================================================================== */
.main-content-wrapper {
    margin-left: 260px;
    margin-right: 0;
    margin-top: 100px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
#Hello .main-content-wrapper {
    margin-left:0px; /*241px;*/
    margin-top: 0;
}
#Hello .main-content-wrapper #main-content {
    padding: 0;
}
.main-content-toggle-left {
    margin-left:0;
}
.main-content-toggle-right {
    margin-right:240px;
}
.main-content-wrapper #main-content {
    display: inline-block;
    margin-top: 0;
    padding: 15px;
    width: 100%;
    height: 100%;
}
.content-page .main-content-wrapper #main-content h1 {
    margin: 0;
    padding: 0px 10px 40px 0;
    float: left;
    font-weight: bold;
    font-size: 3.1em;
    width: 66.66666667%;
}
.main-content-wrapper #main-content h1.twoline {
    padding: 0px 10px 10px 0;
}
.content-page .main-content-wrapper #main-content h2{
    font-size: 25px;
    text-transform: none;
    clear: left;
    /* padding: 20px 10px 5px 0; */
    width: 66%;
}
.content-page .main-content-wrapper #main-content h3 {
    font-size: 18px;
    text-transform: none;
    clear: left;
    padding: 20px 10px 5px 0;
    width: 66%;
}
.content-page .main-content-wrapper #main-content p, .content-page .main-content-wrapper #main-content ul, .content-page .main-content-wrapper #main-content ol, p.two-thirds {
    width: 66%;
    display: inline-block;
    font-size: 1.25em;
}

.content-page .main-content-wrapper #main-content td ul {
    font-size: 1em;
}

.content-page .main-content-wrapper #main-content p.lead {
    font-size: 1.6em;
}

.content-page .main-content-wrapper #main-content hr {
    width: 66%;
    margin-left: 0;
}

.bebas-neue {
    font-family: 'bebas_neueregular';
}

.inlinesize {
    width: 66%;
}

.highlight, span.highlighted {
    color: #e65930;
}

.quote {
    font-size: 33px;
    color: #9cb545;
}

.quote-small {
    font-size: 23px;
}

.quote-right {
    float: right;
}

.indent {
    border-left: 5px #eee solid;
    padding-left: 10px;
    margin-bottom: 20px;
}

.main-content-wrapper #main-content div div>img {
    margin: 30px 0;
}

.main-content-wrapper #main-content blockquote.inline-quote {
    width: 66%;
    float: none;
    border: none;
    padding-left: 0;
}

.main-content-wrapper #main-content blockquote {
    width: 30%;
    float: right;
    clear: both;
}

.main-content-wrapper #main-content .right-col {
    width: 30%;
    float: right;
    clear: both;
}

.content-page .main-content-wrapper #main-content blockquote p {
    font-size: 1em;
    width: 100%;
}

.main-content-wrapper #main-content .panel {
    width: 66%;
    margin-top: 40px;
}

.main-content-wrapper #main-content .panel h3 {
    padding-top: 0;
}

.main-content-wrapper #main-content .panel img {
    max-height: 80px;
    float: left;
    margin-right: 10px;
    border: 3px solid #fff;
    padding: 0;
}

blockquote img {
    max-height: 80px;
    float: left;
    margin-right: 10px;
    border: 3px solid #ddd;
}

a.share-link {
    font-family: 'Gotham','Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: bold !important;
    text-decoration: none;
}

.story-graph {
    font-family: 'Gotham', 'Montserrat', sans-serif;
    min-height: 60vh;
    width: 66%;
    background-color: #444;
    margin: 50px 0;
    position: relative;
    line-height: 1.1;
    color: #fff;
}
.story-graph>p {
    color: #999 !important;
    font-size: 12px !important;
    text-align: center;
    width: 100% !important;
    position: absolute;
    top: 3px;
}
.story-graph>p:nth-child(2) {
    bottom: -4px;
    top: auto;
}
.story-graph>p:nth-child(3) {
    bottom: auto;
    top: 50%;
    left: -35px;
    width: 100px !important;
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.story-graph>p:nth-child(4) {
    bottom: auto;
    top: 50%;
    right: -35px;
    width: 100px !important;
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.graph-fresh, .graph-familiar, .graph-hidden, .graph-entrenched {
    border: 1px dotted #fff;
    display: inline-block;
    width: 45%;
    height: 45%;
    position: absolute;
    top: 5%;
    left: 5%;
    text-align: center;
    padding: 40px 10px;
}
.graph-fresh {
    border-top: none;
    border-left: none;
}
.graph-familiar {
    left: auto;
    right: 5%;
    border-right: none;
    border-top: none;
    border-left: none;
}
.graph-hidden {
    top: auto;
    bottom: 5%;
    border-left: none;
    border-bottom: none;
    border-top: none;
}
.graph-entrenched {
    border: none;
    top: auto;
    bottom: 5%;
    right: 5%;
    left: auto;
}
.story-graph div p:nth-child(1) {
    color: #a597c5;
}
.story-graph div p:nth-child(1) span {
    color: #dbd2ef;
}
.story-graph div p:nth-child(2) {
    opacity: 0;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    font-size: 14px !important;
}
.story-graph div:hover p:nth-child(2) {
    opacity: 1;
}
.main-row {
    padding: 20px 30px;
}
.home0 {
    padding-bottom: 0;
}

.home0 h4 {
    letter-spacing: 3px;
    color: #9CB545 !important;
}

.home2 p, .home3 p {
    font-size: 20px !important;
    color: #fff;
    padding: 30px;
}
.home1 {
    padding: 25px 0 0;
    margin: 7em 0 0;
    /* background-color: #ddd; */
    color: #6c6665;
}
.home11 {
        /* background: #ddd; */
    padding: 0 0 10px 0;
}
.home2 {
    margin: 1px 0 0;
    padding: 40px 0;
    background-color: #fff;
}
.home3 {
    margin: 1px 0 0;
    background-color: #4dbed1;
    margin-bottom: 0 !important;
}
.home4 {
    padding: 3em 0;
    /*background-color: #9cb545;*/
    background-color: #645550;
}
.home4 p {
    max-width: 900px;
    margin: 0 auto 0 auto;
    padding: 20px 0;
}
.home4 a {
    -webkit-transition : .5s;
    -moz-transition : .5s;
    -o-transition : .5s;
    transition : .5s;
    opacity: 0.6;
}
.home4 a:hover {
    background: none;
    opacity: 1;
    margin-left: 15px;
}
.home4 img{
    max-width: 30%;
}
.home5 {
    min-height: 300px;
    background-color: #f58e6c;
}
.home6 {
    min-height: 300px;
    background-color: #f89c34;
}
.home7 {
    padding: 3em 0;
}
.circle {
    background-color: #fff;
    border-radius: 50%;
    width: 180px;
    height: 180px;
    display: inline-block;
    vertical-align: middle;
    border: 2px solid #9cb545;
    margin:10px;
    -webkit-transition : .2s;
    -moz-transition : .2s;
    -o-transition : .2s;
    transition : .2s;
}
.circle:hover {
    -webkit-box-shadow: inset 0px 0px 12px 0px rgba(0,0,0,0.17);
    -moz-box-shadow: inset 0px 0px 12px 0px rgba(0,0,0,0.17);
    box-shadow: inset 0px 0px 12px 0px rgba(0,0,0,0.17);
}
.circle:hover div {
	/* transform: scale(0.95,0.95), rotateZ(3deg); */
    transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -ms-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    -webkit-transform:matrix(0.95,0.05,-0.05,0.95,0,0);
    opacity: 0.9;
}
.circle div {
    background-color: #666;
    border-radius: 50%;
    width: 100%;
    height: 100%;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    border: 2px solid #fff;
    -webkit-transition : .2s;
    -moz-transition : .2s;
    -o-transition : .2s;
    transition : .2s;
}
.circle a {
    border-radius: 50%;
    width: 180px;
    height: 170px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    color: #fff;
    font-size: 16px;
    padding: 20px;
    font-family: 'Gotham', 'Montserrat', sans-serif;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: bold;
    line-height: 1;
}

.circle a span {
    font-size: 35px;
    font-weight: 100;
    display: block;
    padding: 0;
    margin: 0;
}

.circle.disabled a {
    opacity: 0.5;
    cursor: text;
}

.home-lang-brackets:before,
.home-lang-brackets:after {
    content: '';
    width: 30px;
    position: absolute;
    top: 0;
    bottom: 0;
    border: #fff 2px solid;
}
.home-lang-brackets:before {
    left: 0;
    border-right: none;
}

.home-lang-brackets:after {
    right: 0;
    border-left: none;
}


/* My Impact Plan =================================================================== */

section.myplan {
    border: 1px #ddd solid;
    -webkit-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.17);
    -moz-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.17);
    box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.17);
    padding: 40px;
    margin: 3em 1em 2em 0;
}

section.myplan p, section.myplan ol, section.myplan ul {
    font-size: 1.1em;
}

section.myplan input.form-control, input.form-control.written {
    margin: 0;
    padding: 0;
    color: #ccc;
    vertical-align: bottom;
    background: transparent;
    border: none;
    border-bottom: 3px solid rgba(0,0,0,0.2);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    width: 100%;
    margin-bottom: 20px;
    font-size: 1.7em;
    display: inline-block;
}

section.myplan ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

section.myplan ul>li {
    margin: 20px 0 0;
    padding: 0;
}

section.myplan ul li>div.not-edited {
    background-color: #eee;
    padding: 13%;
    text-align: center;
}

section.myplan ul li>div.priorities {
    background-color: #fff;
    padding: 20px 0;
    text-align: left;
}
section.myplan ul li div.priorities ol.priority_list {
    border-top: 1px #ccc solid;
    border-bottom: 1px #ccc solid;
    font-size: 1em;
    padding: 20px 30px;
}
section.myplan ul li div.priorities ol.priority_list li {
    margin-bottom: 4px;
}

section.myplan ul li div.story-environment {
    border-top: 1px #ccc solid;
    border-bottom: 1px #ccc solid;
    font-size: 1em;
    padding: 20px 30px;
}
section.myplan ul li div.strategy-plan {
    border-top: 1px #ccc solid;
    border-bottom: 1px #ccc solid;
    font-size: 1em;
    padding: 20px 0;
}
section.myplan ul li div.strategy-plan h3 {
    text-transform: uppercase;
    font-size: 1.4em;
}
section.myplan ul li div.strategy-plan h4 {
    text-transform: uppercase;
    color: #4dbed1;
}
section.myplan ul li div.strategy-plan table {
    border-top: #4dbed1 3px solid;
    border-bottom: none;
}
section.myplan ul li div.strategy-plan table th {
    font-weight: normal;
    color: #4dbed1;
}
section.myplan ul li div.strategy-plan table td {
    border-bottom: 1px #ddd dashed;
}
body#myplan #Library .mix {
    display: block;
}

/* Footer =================================================================== */

.pageFooter div {
    min-height: 150px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: #999 double 1px;
    max-width: 66.6666%;
}

.pageFooter div p {
    width: 100% !important;
}

.pageFooter .btn {
    min-width: 150px;
}

.footerBar {
    padding: 30px;
    text-align: center;
    clear: all !important;
    display: block;
}

.footerBar img {
    opacity: 0.4;
    max-height: 40px;
}

.footerBar img:hover {
    opacity: 0.8;
}

.footerBar p {
}

.footer-nav {
    margin: 50px 0;
}
.footer-nav p {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-weight: normal !important;
    font-size: 14px;
    text-align: center;
    width: 100%;
}

#Hello .footer-nav p {
    font-size: 1.2em;
}

#Hello .footer-nav p a {
    padding: 0 10px;
    letter-spacing: 1px;
}

footer.footer {
    background-color: #8f8777;
    color: #fff;
    padding-bottom: 0;
    border-bottom: 8px #79bb59 solid;
    clear: both;
}
footer.footer h2 {
    display:block;
    border-bottom: 1px dotted #ccc;
    padding-bottom: 0.25em;
    margin-bottom: 1em;
}
footer.footer ul {
    list-style: none;
    font-size: 1em;
    line-height: 1.5em;
    margin-bottom: 40px;
}

footer.footer p {
    font-size: 1.3em;
    line-height: 1.5em;
    padding: 1em;
}

footer.footer .five-col li {
    width: 16%;
    margin: 0 4% 2em 0;
    float: left;
}

footer.footer .image-holder {
    text-align: center;
}

footer.footer img {
    float: none;
    margin: inherit;
    max-height: 60px;
}

footer.footer img:hover {
    opacity: 0.8;
}

footer.footer img.logo-main {
    float: none;
    margin: inherit;
    max-height: 100px;
}

footer.footer .three-col li {
    margin-bottom: 1em;
}

footer.footer .footer_logos {
    background-color: #1d1d1b;
    text-align: center;
    padding-bottom: 0;
}


footer.footer section.footer_logos p {
    margin-bottom: 0;
    color: #999;
}

.footer_nav {
    text-align: left;
}

.footer_nav .container ul {
    list-style: none;
}

.footer_nav .container ul li {
    padding-top: 15px;
}

.footer_nav .container ul li a {
    display: block;
    margin: 2px 0 0;
    padding: 2px 10px;
    color: #000;
    font-size: 1em;
}

.footer_nav .container ul li p {
    display: block;
    padding: 4px 10px 0;
    font-size: 2em;
    margin: 0;
}

.footer_nav .container ul li a:hover {
    background-color: #c7c3bb;
}


/* ==========================================================================
   Tiles
   ========================================================================== */
.dashboard-tile {
    background-color: #fff;
    color: #555;
    margin-bottom: 15px;
    padding: 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
}
.dashboard-tile.tile-turquoise {
    background-color: #1db78d;
    color: #fff;
}
.dashboard-tile.tile-red {
    background-color: #e84c3d;
    color: #fff;
}
.dashboard-tile.tile-blue {
    background-color: #3598db;
    color: #fff;
}
.dashboard-tile.tile-purple {
    background-color: #9a59b5;
    color: #fff;
}
.dashboard-tile .header {
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
}
.dashboard-tile .header .title {
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    padding: 5px;
    position: absolute;
    text-transform: uppercase;
    top: 7px;
}
.dashboard-tile .content {
    padding: 10px;
}
.dashboard-tile.header .content {
    padding: 10px 20px;
    background: transparent;
    padding-right: 10px;
    display: inline-block;
    position: relative;
    z-index: 5;
}
.dashboard-tile.detail .icon {
    bottom: 0px;
    width: 80px;
    padding-top: 10px;
    position: absolute;
    right: 10px;
}
.dashboard-tile.header .icon img {
    opacity: 0.8;
    display: block;
    float: right;
    height: 80px;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-top: 10px;
    position: absolute;
    right: 10px;
    top: 50px;
    width: 80px;
}
.dashboard-tile.header {
    position: relative;
    overflow: hidden;
}
.dashboard-tile.detail {
    position: relative;
    overflow: hidden;
}
.dashboard-tile.detail .content {
    background: transparent;
    padding: 10px 10px 13px;
    display: inline-block;
    position: relative;
    z-index: 5;
}
.dashboard-tile.detail .icon {
    display: block;
    float: right;
    height: 80px;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-top: 10px;
    width: 80px;
    right: 40px;
    bottom: 9px;
}
.dashboard-tile.detail .icon i {
    color: rgba(0, 0, 0, 0.05);
    font-size: 85px;
    line-height: 65px;
}
.dashboard-tile .content p {
    margin-bottom: 0;
    padding:10px;
    font-weight: 4 00;
    font-size: 22px;
    clear: both;
}
#main-content .dashboard-tile .content h1 {
    margin: 0;
    font-weight: 300;
    font-size: 40px;
    padding:8px;
}
/* ==========================================================================
  Forms
   ========================================================================== */
.form-control {
    color: #717171;
    outline: 0;
    padding: 6px 11px;
    line-height: 18px;
    font-size: 13px;
    background-color: #fafafa;
    min-height: 36px;
    filter: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
    -webkit-transition: all .2s linear;
    transition: all .2s linear;
}

.form-control:focus{
    border-color: #7c7c7c;
}

.form-horizontal.form-border .form-group {
    border-bottom: 1px solid #eff2f7;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.input-group {
    margin-bottom: 15px;
}

.control-group.error input, .control-group.error select, .control-group.error textarea {
    border-color: #b94a48;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.control-group.error .checkbox, .control-group.error .radio, .control-group.error input, .control-group.error select, .control-group.error textarea {
    color: #b94a48;
}

label.error{
    color:#fff;
    background:#b94a48;
    border:solid thin #fff;
    padding:3px 5px;
}

label.valid{
    color:#fff;
    background:#5CB85C;
    border:solid thin #fff;
    padding:3px 5px;

}

.icheck div,.icheck .disabled {
    float:left;
}
.icheck div{
    margin-right:10px;
}
.icheck label {
    font-weight:normal;
}
.icheck .checkbox,.icheck .radio {
    margin-bottom:10px;
}


/* ==========================================================================
  Buttons
   ========================================================================== */
.btn, a.btn {
    border: none;
    text-decoration: none;
    font-size: 15px;
    font-weight: normal;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
    padding: 8px 14px;
    margin-bottom:5px;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-transition: border .25s linear, color .25s linear, background-color .25s linear;
    transition: border .25s linear, color .25s linear, background-color .25s linear;
}
.btn:hover, .btn:focus {
    outline: none;
}
.btn:active, .btn.active {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
    background-color: #bdc3c7;
    color: rgba(255, 255, 255, 0.75);
    opacity: 0.7;
    filter: alpha(opacity=70);
}
/* Default Buttons*/
.btn-default,
a.btn-default:link,
a.btn-default:visited {
    color: #ffffff;
    background-color: #bdc3c7;
}
a.btn-default:hover,
a.btn-default:active {
    color: #ffffff;
    background-color: #cacfd2;
    border-color: #cacfd2;
}
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
    color: #ffffff;
    background-color: #cacfd2;
    border-color: #cacfd2;
}
.btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
    background: #a1a6a9;
    border-color: #a1a6a9;
}
.btn-default.disabled, .btn-default[disabled], fieldset[disabled] .btn-default, .btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled:active, .btn-default[disabled]:active, fieldset[disabled] .btn-default:active, .btn-default.disabled.active, .btn-default[disabled].active, fieldset[disabled] .btn-default.active {
    background-color: #bdc3c7;
    border-color: #bdc3c7;
}
.btn-primary,
a.btn-primary:link,
a.btn-primary:visited{
    color: #fff;
    background-color: #9cb545;
}
a.btn-primary:hover,
a.btn-primary:active{
    color: #ffffff;
    background-color: #81943a;
    border-color: #81943a;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    color: #ffffff;
    background-color: #48c9b0;
    border-color: #48c9b0;
}
.btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    background: #16a085;
    border-color: #16a085;
}
.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active {
    background-color: #1db78d;
    border-color: #1db78d;
}


.btn-info {
    color: #ffffff;
    background-color: #3498db;
}

.btn-info,
a.btn-info:link,
a.btn-info:visited{
    color: #ffffff;
    background-color: #3498db;
}

a.btn-info:hover,
a.btn-info:active{
    color: #ffffff;
    background-color: #5dade2;

}

.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info {
    color: #ffffff;
    background-color: #5dade2;
    border-color: #5dade2;
}
.btn-info:active, .btn-info.active, .open .dropdown-toggle.btn-info {
    background: #2c81ba;
    border-color: #2c81ba;
}
.btn-info.disabled, .btn-info[disabled], fieldset[disabled] .btn-info, .btn-info.disabled:hover, .btn-info[disabled]:hover, fieldset[disabled] .btn-info:hover, .btn-info.disabled:focus, .btn-info[disabled]:focus, fieldset[disabled] .btn-info:focus, .btn-info.disabled:active, .btn-info[disabled]:active, fieldset[disabled] .btn-info:active, .btn-info.disabled.active, .btn-info[disabled].active, fieldset[disabled] .btn-info.active {
    background-color: #3498db;
    border-color: #3498db;
}
.btn-danger {
    color: #ffffff;
    background-color: #e74c3c;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger {
    color: #ffffff;
    background-color: #ec7063;
    border-color: #ec7063;
}
.btn-danger:active, .btn-danger.active, .open .dropdown-toggle.btn-danger {
    background: #c44133;
    border-color: #c44133;
}
.btn-danger.disabled, .btn-danger[disabled], fieldset[disabled] .btn-danger, .btn-danger.disabled:hover, .btn-danger[disabled]:hover, fieldset[disabled] .btn-danger:hover, .btn-danger.disabled:focus, .btn-danger[disabled]:focus, fieldset[disabled] .btn-danger:focus, .btn-danger.disabled:active, .btn-danger[disabled]:active, fieldset[disabled] .btn-danger:active, .btn-danger.disabled.active, .btn-danger[disabled].active, fieldset[disabled] .btn-danger.active {
    background-color: #e74c3c;
    border-color: #e74c3c;
}
.btn-success {
    color: #ffffff;
    background-color: #2ecc71;
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success {
    color: #ffffff;
    background-color: #58d68d;
    border-color: #58d68d;
}
.btn-success:active, .btn-success.active, .open .dropdown-toggle.btn-success {
    background: #27ad60;
    border-color: #27ad60;
}
.btn-success.disabled, .btn-success[disabled], fieldset[disabled] .btn-success, .btn-success.disabled:hover, .btn-success[disabled]:hover, fieldset[disabled] .btn-success:hover, .btn-success.disabled:focus, .btn-success[disabled]:focus, fieldset[disabled] .btn-success:focus, .btn-success.disabled:active, .btn-success[disabled]:active, fieldset[disabled] .btn-success:active, .btn-success.disabled.active, .btn-success[disabled].active, fieldset[disabled] .btn-success.active {
    background-color: #2ecc71;
    border-color: #2ecc71;
}
.btn-warning {
    color: #ffffff;
    background-color: #f1c40f;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .open .dropdown-toggle.btn-warning {
    color: #ffffff;
    background-color: #f5d313;
    border-color: #f5d313;
}
.btn-warning:active, .btn-warning.active, .open .dropdown-toggle.btn-warning {
    background: #cda70d;
    border-color: #cda70d;
}
.btn-warning.disabled, .btn-warning[disabled], fieldset[disabled] .btn-warning, .btn-warning.disabled:hover, .btn-warning[disabled]:hover, fieldset[disabled] .btn-warning:hover, .btn-warning.disabled:focus, .btn-warning[disabled]:focus, fieldset[disabled] .btn-warning:focus, .btn-warning.disabled:active, .btn-warning[disabled]:active, fieldset[disabled] .btn-warning:active, .btn-warning.disabled.active, .btn-warning[disabled].active, fieldset[disabled] .btn-warning.active {
    background-color: #f1c40f;
    border-color: #f1c40f;
}
.btn-home {
    color: #ffffff !important;
    background-color: transparent;
    border: solid thin #ffffff;
}
.btn-home:hover, .btn-home:focus, .btn-home:active, .btn-home.active, .open .dropdown-toggle.btn-home {
    color: #ffffff;
    background-color: #ec7063;
    border-color: #ec7063;
}
.btn-home:active, .btn-home.active, .open .dropdown-toggle.btn-home {
    background: #c44133;
    border-color: #c44133;
}
.btn-home.disabled, .btn-home[disabled], fieldset[disabled] .btn-home, .btn-home.disabled:hover, .btn-home[disabled]:hover, fieldset[disabled] .btn-home:hover, .btn-home.disabled:focus, .btn-home[disabled]:focus, fieldset[disabled] .btn-home:focus, .btn-home.disabled:active, .btn-home[disabled]:active, fieldset[disabled] .btn-home:active, .btn-home.disabled.active, .btn-home[disabled].active, fieldset[disabled] .btn-home.active {
    background-color: #e74c3c;
    border-color: #e74c3c;
}
/* 3d Buttons*/
.btn.btn-3d {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    transform: translate(0, 0);
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}
.btn.btn-3d:active {
    -webkit-transform: translate(0, 3px);
    -moz-transform: translate(0, 3px);
    transform: translate(0, 3px);
}
.btn-default.btn-3d {
    -webkit-box-shadow: 0px 6px 0px #A6AAAC;
    -moz-box-shadow: 0px 6px 0px #A6AAAC;
    box-shadow: 0px 6px 0px #A6AAAC;
}
.btn-default.btn-3d:hover, .btn-default.btn-3d:focus {
    background-color: #bdc3c7;
}
.btn-default.btn-3d:active {
    -webkit-box-shadow: 0px 2px 0px #A6AAAC;
    -moz-box-shadow: 0px 2px 0px #A6AAAC;
    box-shadow: 0px 2px 0px #A6AAAC;
}
.btn-default.btn-3d:hover, .btn-default.btn-3d:focus {
    background-color: #bdc3c7;
}
.btn-primary.btn-3d {
    -webkit-box-shadow: 0px 6px 0px #14a084;
    -moz-box-shadow: 0px 6px 0px #14a084;
    box-shadow: 0px 6px 0px #14a084;
}
.btn-primary.btn-3d:active {
    -webkit-box-shadow: 0px 2px 0px #14a084;
    -moz-box-shadow: 0px 2px 0px #14a084;
    box-shadow: 0px 2px 0px #14a084;
}
.btn-primary.btn-3d:hover, .btn-primary.btn-3d:focus {
    background-color: #1db78d;
}
.btn-success.btn-3d {
    -webkit-box-shadow: 0px 6px 0px #2ab263;
    -moz-box-shadow: 0px 6px 0px #2ab263;
    box-shadow: 0px 6px 0px #2ab263;
}
.btn-success.btn-3d:active {
    -webkit-box-shadow: 0px 2px 0px #2ab263;
    -moz-box-shadow: 0px 2px 0px #2ab263;
    box-shadow: 0px 2px 0px #2ab263;
}
.btn-success.btn-3d:hover, .btn-success.btn-3d:focus {
    background-color: #2ecc71;
}
.btn-info.btn-3d {
    -webkit-box-shadow: 0px 6px 0px #2e86c1;
    -moz-box-shadow: 0px 6px 0px #2e86c1;
    box-shadow: 0px 6px 0px #2e86c1;
}
.btn-info.btn-3d:active {
    -webkit-box-shadow: 0px 2px 0px #2e86c1;
    -moz-box-shadow: 0px 2px 0px #2e86c1;
    box-shadow: 0px 2px 0px #2e86c1;
}
.btn-info.btn-3d:hover, .btn-info.btn-3d:focus {
    background-color: #3498db;
}
.btn-warning.btn-3d {
    -webkit-box-shadow: 0px 6px 0px #d6ae11;
    -moz-box-shadow: 0px 6px 0px #d6ae11;
    box-shadow: 0px 6px 0px #d6ae11;
}
.btn-warning.btn-3d:active {
    -webkit-box-shadow: 0px 2px 0px #d6ae11;
    -moz-box-shadow: 0px 2px 0px #d6ae11;
    box-shadow: 0px 2px 0px #d6ae11;
}
.btn-warning.btn-3d:hover, .btn-warning.btn-3d:focus {
    background-color: #f1c40f;
}
.btn-danger.btn-3d {
    -webkit-box-shadow: 0px 6px 0px #c94034;
    -moz-box-shadow: 0px 6px 0px #c94034;
    box-shadow: 0px 6px 0px #c94034;
}
.btn-danger.btn-3d:active {
    -webkit-box-shadow: 0px 2px 0px #c94034;
    -moz-box-shadow: 0px 2px 0px #c94034;
    box-shadow: 0px 2px 0px #c94034;
}
.btn-danger.btn-3d:hover, .btn-danger.btn-3d:focus {
    background-color: #e74c3c;
}
/* square buttons */
.btn-square {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius:0;
}
/* Transparent buttons */
.btn-default.btn-trans {
    color: #bdc3c7;
    background-color: transparent;
    border: solid thin #bdc3c7;
}
.btn-default.btn-trans:hover, .btn-default.btn-trans:active, .btn-default.btn-trans:focus {
    color: #fff;
    background-color: #bdc3c7;
    border: solid thin #bdc3c7;
}
.btn-primary.btn-trans {
    color: #1db78d;
    background-color: transparent;
    border: solid thin #1db78d;
}
.btn-primary.btn-trans:hover, .btn-primary.btn-trans:active, .btn-primary.btn-trans:focus {
    color: #fff;
    background-color: #1db78d;
    border: solid thin #1db78d;
}
.btn-success.btn-trans {
    color: #2ecc71;
    background-color: transparent;
    border: solid thin #2ecc71;
}
.btn-success.btn-trans:hover, .btn-success.btn-trans:active, .btn-success.btn-trans:focus {
    color: #fff;
    background-color: #2ecc71;
    border: solid thin #2ecc71;
}
.btn-info.btn-trans {
    color: #3498db;
    background-color: transparent;
    border: solid thin #3498db;
}
.btn-info.btn-trans:hover, .btn-info.btn-trans:active, .btn-info.btn-trans:focus {
    color: #fff;
    background-color: #3498db;
    border: solid thin #3498db;
}
.btn-warning.btn-trans {
    color: #f5d313;
    background-color: transparent;
    border: solid thin #f5d313;
}
.btn-warning.btn-trans:hover, .btn-warning.btn-trans:active, .btn-warning.btn-trans:focus {
    color: #fff;
    background-color: #f5d313;
    border: solid thin #f5d313;
}
.btn-danger.btn-trans {
    color: #e74c3c;
    background-color: transparent;
    border: solid thin #e74c3c;
}
.btn-danger.btn-trans:hover, .btn-danger.btn-trans:active, .btn-danger.btn-trans:focus {
    color: #fff;
    background-color: #e74c3c;
    border: solid thin #e74c3c;
}
/* Button Sizes */
.btn-xxlg, a.btn-xxlg {
    padding: 20px 26px;
    font-size: 28px;
    line-height: 1.33;
}
.btn-lg, a.btn-lg {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.33;
}
.btn-sm, .btn-mini, a.btn-sm, a.btn-mini  {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
}
.btn-xs, a.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
}
/* ==========================================================================
  Badges
   ========================================================================== */
.badge.badge-success {
    background-color: #2dcc70;
    color: #fff;
}
.badge.badge-info {
    background-color: #3598db;
    color: #fff;
}
.badge.badge-warning {
    background-color: #f1c40f;
    color: #fff;
}
.badge.badge-danager {
    background-color: #e84c3d;
    color: #fff;
}
/* ==========================================================================
 Sliders
   ========================================================================== */
.slider.slider-horizontal {
    margin:10px 0;
}
.slider.slider-vertical {
    margin:0 10px;
}
.slider-handle.round {
    position: absolute;
    width: 20px;
    height: 20px;
    border: 1px solid #EFF2F7;
    background: #fff;
    cursor: pointer;
}
.slider-default .slider-selection {
    background-image:none;
    background-color:#bdc3c7;
}
.slider-primary .slider-selection {
    background-image:none;
    background-color:#1db78d;
}
.slider-success .slider-selection {
    background-image:none;
    background-color:#2dcc70;
}
.slider-warning .slider-selection {
    background-image:none;
    background-color:#f1c40f;
}
.slider-info .slider-selection {
    background-image:none;
    background-color:#3598db;
}
.slider-danger .slider-selection {
    background-image:none;
    background-color:#e84c3d;
}
#RGB {
    height: 239px;
    background: #808080;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
}
/* ==========================================================================
   Progress Bars
   ========================================================================== */
.progress-bar-default {
    background-color:#bdc3c7;
}
.progress-bar-primary {
    background-color:#1db78d;
}
.progress-bar-success {
    background-color:#2dcc70;
}
.progress-bar-warning {
    background-color:#f1c40f;
}
.progress-bar-info {
    background-color:#3598db;
}
.progress-bar-danger {
    background-color:#e84c3d;
}
/* ==========================================================================
   Nestable Sortable
   ========================================================================== */
.dd {
    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    max-width: 600px;
    font-size: 13px;
    line-height: 20px;
}
.dd ol {
    width: 100% !important;
    margin-left: 30px;
}
.dd-list {
    display: block;
    position: relative;
    margin: 0;
    padding: 0;
    list-style: decimal-leading-zero !important;
}
.dd-list .dd-list {
    padding-left: 30px;
}
.dd-collapsed .dd-list {
    display: none;
}
.dd-item, .dd-empty, .dd-placeholder {
    display: list-item !important;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 20px;
    font-size: 13px;
    line-height: 20px;
}
ol.dd-numbers li {
    height: 60px;
    padding: 5px;
    line-height: 50px;
}
.dd-handle {
    cursor: move;
    display: block;
    height: 55px !important;
    margin: 5px 0;
    padding: 5px 10px;
    color: inherit !important;
    text-decoration: none;
    font-weight: inherit !important;
    border: 1px dashed #ccc !important;
    background: #fff !important;
    font-size: inherit !important;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.dd-content {
    font-size: 1.3em;
}
.dd-handle:hover {
    background: #fff;
    color: #1db78d;
}
.dd-item > button {
    display: block;
    position: relative;
    cursor: pointer;
    float: left;
    width: 25px;
    height: 20px;
    margin: 5px 0;
    padding: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    border: 0;
    background: transparent;
    font-size: 12px;
    line-height: 1;
    text-align: center;
    font-weight: bold;
}
.dd-item > button:before {
    content:'+';
    display: block;
    position: absolute;
    width: 100%;
    text-align: center;
    text-indent: 0;
}
.dd-item > button[data-action="collapse"]:before {
    content:'-';
}
.dd-placeholder, .dd-empty {
    margin: 5px 0;
    padding: 0;
    min-height: 30px;
    background: #f2fbff;
    border: 1px dashed #b6bcbf;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.dd-empty {
    border: 1px dashed #bbb;
    min-height: 100px;
    background-color: #e5e5e5;
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px;
}
.dd-dragel {
    position: absolute;
    pointer-events: none;
    z-index: 9999;
}
.dd-dragel > .dd-item .dd-handle {
    margin-top: 0;
}
.dd-dragel .dd-handle {
    -webkit-box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
    box-shadow: 2px 4px 6px 0 rgba(0, 0, 0, .1);
}
/* ==========================================================================
   Breadcrumbs
   ========================================================================== */
.breadcrumb {
    background:none;
}
.breadcrumb > li {
    font-size: 12px;
    text-transform: uppercase;
    font-family: "Montserrat",sans-serif;
}
.breadcrumb > li a{
    text-decoration: none;
    color: #4dbed1;
}
/* ==========================================================================
  Modal
   ========================================================================== */
.modal-footer .btn+.btn {
    margin-bottom:5px;
}
.modal .modal-body.modal-scroll {
    max-height: 300px;
    overflow-y: auto;
}
/* ==========================================================================
   FlotChart
   ========================================================================== */
.chart-tooltip {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
    background-color: #233242 !important;
    border:0px !important;
    color: #ffffff;
    padding: 10px 20px !important;
    font-size: 13px;
}
/* ==========================================================================
   Icons
   ========================================================================== */
.fa-hover {
    margin: 5px 0;
}
.fa-hover i {
    font-size: 14px;
    margin-right: 5px;
    width: 20px;
}
/* ==========================================================================
   Tabs
   ========================================================================== */
.tab-wrapper {
    margin-bottom: 20px;
}
.tab-wrapper .nav-tabs > li > a {
    border-radius: 0;
}
.tab-wrapper .tab-content {
    border: 1px solid #ddd;
    border-top: 0;
    padding: 10px 15px;
}
.tab-wrapper > .nav-tabs > li a {
    color:#5D5F63;
}

.tab-wrapper.big-tabs > .nav-tabs > li a {
    color:#aaa;
    font-size: 15px;
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none;
}

.tab-wrapper.big-tabs > .nav-tabs > li a:hover {
    text-decoration: none;
    color:#666;
}

.tab-wrapper.big-tabs > .nav-tabs > li.active > a{
    color:#333;
}

.tab-wrapper > .nav-tabs > li.active > a {
    border-top: 2px solid #1db78d;
    background-color: #ffffff;
}
.tab-wrapper.tab-left > .nav-tabs > li, .tab-wrapper.tab-right > .nav-tabs > li {
    float: none;
    min-width: 75px;
}
.tab-wrapper.tab-left > .nav-tabs > li > a, .tab-wrapper.tab-right > .nav-tabs > li > a {
    border: 1px solid #ddd;
}
.tab-wrapper.tab-left > .nav-tabs > li.active > a, .tab-wrapper.tab-right > .nav-tabs > li.active > a {
    border-top-color: #ddd !important;
}
.tab-wrapper.tab-left .tab-content, .tab-wrapper.tab-right .tab-content {
    overflow: auto;
    border-top: 1px solid #ddd;
}
.tab-wrapper.tab-left > .nav-tabs {
    float: left;
    margin-right: -3px;
}
.tab-wrapper.tab-left > .nav-tabs > li > a {
    border-right: 0;
}
.tab-wrapper.tab-left > .nav-tabs > li.active > a {
    border-left: 2px solid #1db78d;
}
.tab-wrapper.tab-right > .nav-tabs {
    float: right;
    margin-left: -1px;
}
.tab-wrapper.tab-right > .nav-tabs > li > a {
    border-left: 0;
}
.tab-wrapper.tab-right > .nav-tabs > li.active > a {
    border-right: 2px solid #1db78d;
}
.tab-wrapper.tab-bottom > .tab-content {
    border-top: 1px solid #ddd;
}
.tab-wrapper.tab-bottom > .nav-tabs {
    border-bottom: none;
    margin-top: 0px;
}
.tab-wrapper.tab-bottom > .nav-tabs > li.active > a {
    margin-top: -2px;
    border-top-color: transparent !important;
    border-bottom: 2px solid #1db78d;
}
.tab-primary.tab-wrapper > .nav-tabs > li.active > a {
    border-top-color: #1db78d;
}
.tab-primary.tab-wrapper.tab-left > .nav-tabs > li.active {
    border-left-color: #1db78d;
}
.tab-primary.tab-wrapper.tab-right > .nav-tabs > li.active {
    border-right-color: #1db78d;
}
.tab-primary.tab-wrapper.tab-bottom > .nav-tabs > li.active > a {
    border-bottom-color: #1db78d;
}
/* ==========================================================================
   Panels
   ========================================================================== */
.panel {
    border: none;
    box-shadow: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
    position: relative;
}
.panel a {
    color: #fff !important;
}
.panel>.panel-heading {
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 15px;
}
.panel .actions {
    position: absolute;
    top: 12px;
    float: none;
    right: 6px;
}
.panel .actions i {
    font-size: 1em;
    margin:0 3px;
}
.panel .actions i:hover {
    cursor:pointer;
}
.panel>.panel-footer {
    font-size: 13px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 15px;
}
.panel-solid-default {
    cursor:pointer;
}
.panel-default>.panel-heading {
    border-color: #eff2f7;
    background: #fafafa;
    color:#767676;
}
.panel-default .actions i {
    font-size: 1em;
    color: #bdc3c7;
    margin:0 3px;
}
.panel-default .actions i:hover {
    cursor:pointer;
    color:#767676;
}
.panel-default>.panel-footer {
    border-color: #eff2f7;
    background: #fafafa;
    color:#767676;
}

.panel-primary>.panel-heading {
    color: #fff;
    background-color: #1db78d;
    border-color: #1db78d;
}
.panel-primary {
    border-color: #1db78d;
}

.panel-primary>.panel-heading a,
.panel-primary>.panel-heading a:hover{
    color: #fff;
}

.panel-solid-default>.panel-heading, .panel-solid-default>.panel-body, .panel-solid-default>.panel-footer {
    background:#bdc3c7;
    color:#fff;
    border:none;
}
.panel-solid-primary >.panel-heading, .panel-solid-primary >.panel-body, .panel-solid-primary >.panel-footer {
    background:#1db78d;
    color:#fff;
    border:none;
}
.panel-solid-primary a {
    color: #000 !important;
}
.panel-solid-success>.panel-heading, .panel-solid-success>.panel-body, .panel-solid-success>.panel-footer {
    background:#2dcc70;
    color:#fff;
    border:none;
}
.panel-solid-warning >.panel-heading, .panel-solid-warning >.panel-body, .panel-solid-warning >.panel-footer {
    background:#f1c40f;
    color:#fff;
    border:none;
}
.panel-solid-info>.panel-heading, .panel-solid-info>.panel-body, .panel-solid-info>.panel-footer {
    background:#3598db;
    color:#fff;
    border:none;
}
.panel-solid-info a {
    color: #000 !important;
}
.panel-solid-danger >.panel-heading, .panel-solid-danger >.panel-body, .panel-solid-danger >.panel-footer {
    background:#e84c3d;
    color:#fff;
    border:none;
}

/* ==========================================================================
   Wizard
   ========================================================================== */

.step-content {
    border: 1px solid #D4D4D4;
    border-top: 0;
    border-radius: 0 0 4px 4px;
    padding: 10px;
    margin-bottom: 10px;
}

.wizard {
    position: relative;
    overflow: hidden;
    background-color: #f9f9f9;
    border: 1px solid #d4d4d4;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    *zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}

.wizard:before,
.wizard:after {
    display: table;
    line-height: 0;
    content: "";
}

.wizard:after {
    clear: both;
}

.wizard ul {
    width: 4000px;
    padding: 0;
    margin: 0;
    list-style: none outside none;
}

.wizard ul.previous-disabled li.complete {
    cursor: default;
}

.wizard ul.previous-disabled li.complete:hover {
    color: #468847;
    cursor: default;
    background: #f3f4f5;
}

.wizard ul.previous-disabled li.complete:hover .chevron:before {
    border-left-color: #f3f4f5;
}

.wizard ul li {
    position: relative;
    float: left;
    height: 46px;
    padding: 0 20px 0 30px;
    margin: 0;
    font-size: 16px;
    line-height: 46px;
    color: #999999;
    cursor: default;
    background: #ededed;
}

.wizard ul li .chevron {
    position: absolute;
    top: 0;
    right: -14px;
    z-index: 1;
    display: block;
    border: 24px solid transparent;
    border-right: 0;
    border-left: 14px solid #d4d4d4;
}

.wizard ul li .chevron:before {
    position: absolute;
    top: -24px;
    right: 1px;
    display: block;
    border: 24px solid transparent;
    border-right: 0;
    border-left: 14px solid #ededed;
    content: "";
}

.wizard ul li.complete {
    color: #1db78d;
    background: #f3f4f5;
}

.wizard ul li.complete:hover {
    cursor: pointer;
    background: #e1f2ef;
}

.wizard ul li.complete:hover .chevron:before {
    border-left: 14px solid #e1f2ef;
}

.wizard ul li.complete .chevron:before {
    border-left: 14px solid #f3f4f5;
}

.wizard ul li.active {
    color:#1db78d;
    background: #fff;
}

.wizard ul li.active .chevron:before {
    border-left: 14px solid #fff;
}

.wizard ul li .badge {
    margin-right: 8px;
}

.wizard ul li:first-child {
    padding-left: 20px;
    border-radius: 4px 0 0 4px;
}

.wizard .actions {
    position: initial;
    z-index: 1000;
    float: right;
    padding-right: 15px;
    padding-left: 15px;
    line-height: 46px;
    vertical-align: middle;
    background-color: #e5e5e5;
    border-left: 1px solid #d4d4d4;
}

.wizard .actions a {
    margin-right: 8px;
    font-size: 12px;
    line-height: 45px;
}

.wizard .actions .btn-prev i {
    margin-right: 5px;
    color:#fff;
}

.wizard .actions .btn-next i {
    margin-left: 5px;
    color:#fff;
}

.wizard .actions .btn-prev[disabled] i{
    color: rgba(255, 255, 255, 0.75);

}

.step-content .step-pane {
    display: none;
}

.step-content .active {
    display: block;
}

.step-content .active .btn-group .active {
    display: inline-block;
}

.wizard .steps .badge.badge-info{
    background-color: #1db78d;
}

.wizard .steps .badge.badge-success {
    background-color: #1db78d;
}

.form-group .title{
    text-align: right;
}


/* ==========================================================================
   Mail
   ========================================================================== */
.mail-option ul li{

    list-style:none;

}

#view-mail-wrapper header{
    color:#a2a2a2;
}


#view-mail-wrapper header h2{
    border-bottom: 1px solid #ddd;
    padding: 0 0 15px 0;
}

#view-mail-wrapper header p{
    position: absolute;
    right: 35px;
    top: 48px;
}

#view-mail-wrapper .view-mail-header{
    padding-top: 5px;
}

#view-mail-wrapper .view-mail-header img{
    margin-right:10px;
}

#view-mail-wrapper  .view-mail-reply{
    margin-top: 12px;
}

#view-mail-wrapper .view-mail-body{
    border-top: 1px solid #ddd;
    padding-top:15px;
    margin-top: 15px;
}

#view-mail-wrapper .view-mail-body p{
    line-height: 1.8em;
}

#view-mail-wrapper .view-mail-body .panel-footer,
#view-mail-wrapper .view-compose-body .panel-footer{
    background: #fff;
    border-bottom: 1px solid #ddd;
    border-radius:0;
    padding: 15px 0;
}

#view-mail-wrapper .view-mail-body .panel-footer h5{
    display: inline-block;
}


#view-mail-wrapper .view-mail-body .panel-footer .attchments{
    padding:0 8px;
    text-transform:lowercase;
}

#view-mail-wrapper .view-mail-body .panel-footer button.pull-right{
    margin: 0 0 0px 8px;
}

.send-options {

    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    position: absolute;
    right: 45px;
    top: 22px;
}

.send-options a{
    color: #979797;
}

#form-group-cc,
#form-group-bcc{
    display: none;
}


.compose-nav>li+li {
    margin-left: 0;
    margin-top: 0px;
}


.compose-nav li a,
.compose-nav li a:visited {
    border-radius: 0;
    -webkit-border-radius: 0;
    border-top: 1px solid #f2f3f6;
    padding: 15px;
    border-right: 3px solid rgba(0,0,0,0);
    color:#5D5F63;
}

.compose-nav>li.active>a, .compose-nav>li.active>a:hover, .compose-nav>li.active>a:focus {
    background: #f9f9f9;
    color: #1db78d;
    border-left: 3px solid #1db78d;
    margin-left:-3px;
}

.compose-nav>li>a:hover, .compose-nav>li>a:focus {
    background: #f9f9f9;
    color: #1db78d;
    border-left: 3px solid #1db78d;
    margin-left:-3px;
}

.mail-checkbox{
    margin: 0 15px 0 8px;
}

.mail-option .btn-group .fa-refresh,
.pag-left,.pag-right{
    color:#fff;
}

.inbox-pag li{
    float:left;
    margin-left:5px;
}

.inbox-pag li span{
    display: inline-block;
    margin-top: 7px;
    margin-right: 5px;

}

.compose-nav {
    margin: 15px -15px 0 -15px;
}
.table-inbox span.title{
    display: block;
    font-weight: bold;

}

.table-inbox tr{
    background:#f9f9f9
}
.table-inbox tr.unread{
    background: #fff;
}


.table-inbox a,
.table-inbox a:visited{
    color:#5D5F63;
}

.table-inbox .unread a,
.table-inbox .unread a:visited{
    color:#1db78d;
}

.table-inbox .fa-star{
    color:#f1c40f;
}


/* ==========================================================================
   Google Maps
   ========================================================================== */

.overlay{
    display:block;
    text-align:center;
    color:#fff;
    font-size:60px;
    line-height:80px;
    opacity:0.8;
    background:#1db78d;
    border:solid 3px #1db78d;
    border-radius:4px;
    box-shadow:2px 2px 10px #333;
    text-shadow:1px 1px 1px #666;
    padding:0 4px;
}

.overlay_arrow{
    left:50%;
    margin-left:-16px;
    width:0;
    height:0;
    position:absolute;
}
.overlay_arrow.above{
    bottom:-15px;
    border-left:16px solid transparent;
    border-right:16px solid transparent;
    border-top:16px solid #1db78d;
}
.overlay_arrow.below{
    top:-15px;
    border-left:16px solid transparent;
    border-right:16px solid transparent;
    border-bottom:16px solid #1db78d;
}


/* ==========================================================================
   Login
   ========================================================================== */

.login-box {
    z-index: 9999;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(255,255,255,1);
    padding: 30px;
    padding-top: 10vh;
    overflow: scroll;
}

.login-box .close-x {
    position: fixed;
    top: 0;
    right: 20px;
    font-size: 5em;
}

.login-box .close a {
    opacity: 1;
}

#login-container{
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;

}

#login-wrapper{
    margin:100px auto;
    float:none;

}


#login-wrapper .logo {
    color: #fff;
    font-size: 1.7em;
    text-transform: uppercase;
    display: inline-block;

}

#login-wrapper .logo:before {
    background-image: url('../img/logo.png');
    background-position: left center;
    background-repeat: no-repeat;
    padding: 0 20px;
    content: "\00a0";
}

#login-wrapper .form-group i{
    position: absolute;
    left: 27px;
    top: 11px;
}

#login-wrapper #email,
#login-wrapper #password{
    padding-left:32px;
}

/* ==========================================================================
   Error Pages 404 and 500
   ========================================================================== */

#error-container{
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition: all .3s ease-in-out;
    color:#fff;
    background: #405d8c; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  #405d8c 0%, #293949 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#405d8c), color-stop(100%,#293949)); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover,  #405d8c 0%,#293949 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover,  #405d8c 0%,#293949 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover,  #405d8c 0%,#293949 100%); /* IE10+ */
    background: radial-gradient(ellipse at center,  #405d8c 0%,#293949 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#405d8c', endColorstr='#293949',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */



}

#error-container .block-error {
    width: 400px;
    margin: 50px auto 0px;
}

#error-container header h1.error{
    color:#fff;
    font-size:250px;
}

#error-container header p{
    color:#fff;
    text-transform: uppercase;
    font-size: 30px;
}

#error-container  p{
    margin:10px 0 40px 0;
}

/* ==========================================================================
   Timeline
   ========================================================================== */

.timeline {
    border-collapse:collapse;
    border-spacing:0;
    display:table;
    position:relative;
    table-layout:fixed;
    width:100%;
}


.timeline .time-layer {
    margin-right: -40px;
    margin-top:30px;
    position:relative;
    margin-bottom:30px;
}


.timeline:before {
    background-color:#d8d9df;
    bottom:0px;
    content:"";
    left:50%;
    position:absolute;
    top:30px;
    width:1px;
    z-index:0;
}
h3.timeline-title {
    margin:0;
    color:#C8CCD7;
    font-size:20px;
    font-weight:400;
    margin:0 0 5px;
    text-transform:uppercase;
}

.timeline-layer .panel .panel-heading h1 i{
    color:#BDC3C7 ;
}

.timeline-item:before,.timeline-item.left:after {
    content:"";
    display:block;
    width:50%;
}
.timeline-item {
    display:table-row;
}
.timeline-layer {
    display:table-cell;
    vertical-align:top;
    width:50%;
}
.timeline-layer h1 {
    font-size:16px;
    font-weight:300;
    margin:0 0 5px;
}
.timeline-layer .panel {
    display:block;
    margin-left:45px;
    position:relative;
    text-align:left;
    background:#fff;
}
.timeline-item .timeline-layer .arrow {
    border-bottom:8px solid transparent;
    border-top:8px solid transparent;
    display:block;
    height:0;
    left:-7px;
    position:absolute;
    top:13px;
    width:0;
}
.timeline-item .timeline-layer .arrow {
    border-right:8px solid #fff;
}
.timeline-item.left .timeline-layer .arrow-left {
    border-bottom:8px solid transparent;
    border-top:8px solid transparent;
    display:block;
    height:0;
    right:-7px;
    position:absolute;
    top:13px;
    width:0;
    left:auto;
}
.timeline-item.left .timeline-layer .arrow-left {
    border-left:8px solid #fff;
}
.timeline .timeline-icon {
    left:-60px;
    position:absolute;
    top:5px;
}

.timeline .timeline-icon {
    background:#bdc3c7;
}

.timeline .timeline-icon {
    border-radius:50%;
    -webkit-border-radius:50%;
    display:block;
    height:30px;
    width:30px;
    text-align:center;
    color:#fff;
}
.timeline .timeline-icon i {
    margin-top:9px;
}
.timeline-item.left .timeline-icon {
    left:auto;
    right:-60px;
}
.timeline .time-icon:before {
    font-size:16px;
    margin-top:5px;
}
.timeline .timeline-date {
    left:-245px;
    position:absolute;
    text-align:right;
    top:12px;
    width:150px;
    display:none;
}
.timeline-item.left .timeline-date {
    left:auto;
    right:-245px;
    text-align:left;
    display:none;
}

.timeline-item.left:before {
    display:none;
}

.timeline-layer p {
    font-size:14px;
    margin-bottom:0;
    color:#999;
}

.timeline-layer .panel {
    margin-bottom:5px;
}
.timeline-layer .album {
    margin-top:20px;
}
.timeline-item.left .timeline-layer .album {
    margin-top:20px;
    float:right;
}

.timeline-layer .notification {
    background:#FFFFFF;
    margin-top:20px;
    padding:4px;
}
.timeline-item.left .panel {
    margin-left:0;
    margin-right:45px;
}

.timeline-item.left h1,
.timeline-item.left p {
    text-align: right;
}
/* ==========================================================================
   Calendar
   ========================================================================== */
#cal{
    background:#fff;
    padding:20px;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    -ms-border-radius: 0 3px 3px 0;
    -o-border-radius: 0 3px 3px 0;
    border-radius:0 3px 3px 0;
}

#events{
    background: #1db78d;
    color: #fff;
    height: 755px;
    -webkit-border-radius: 3px 0 0 3px;
    -moz-border-radius: 3px 0 0 3px;
    -ms-border-radius: 3px 0 0 3px;
    -o-border-radius: 3px 0 0 3px;
    border-radius:3px 0 0 3px;
}

#events h2{
    font-size: 3em;
    font-weight: 300;
}

#events h3{
    font-size: 2em;
    font-weight: 300;
    padding: 0;
    margin: 0 0 50px 0;
}

.external-event.ui-draggable{
    margin:10px 0;
    padding:5px;
    background: #149e82;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius:3px;
}

.external-event.ui-draggable:hover{
    cursor: move;
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus{
    background-color: #1db78d;
    border-color: #1db78d;
}
.pagination>li>a, .pagination>li>span{
    color: #1db78d;
}


/* ==========================================================================
   Colors
   ========================================================================== */

.default-bg{ background-color:#bdc3c7;}
.primary-bg{ background-color:#1db78d;}
.success-bg{ background-color:#2dcc70;}
.warning-bg{ background-color:#f1c40f;}
.info-bg{background-color:#3598db;}
.danger-bg{background-color:#e84c3d;}

.default-txt{color:#bdc3c7;}
.primary-txt{color:#1db78d;}
.success-txt{color:#2dcc70;}
.warning-txt{color:#f1c40f;}
.info-txt{color:#3598db;}
.danger-txt{color:#e84c3d;}

.label-default{background-color:#bdc3c7;}
.label-primary{ background-color:#1db78d;}
.label-success{background-color:#2dcc70;}
.label-warning{ background-color:#f1c40f;}
.label-info{background-color:#3598db;}
.label-danger{background-color:#e84c3d;}


/* ==========================================================================
   Charts JS
   ========================================================================== */
.canvas-container {
    min-height: 300px;
    max-height: 600px;
    position: relative;
}



/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 1180px) and (min-width: 769px) {
    .top-nav>ul>li.feedback {
        display: none;
    }
}
@media only screen and (max-width: 1040px) and (min-width: 769px) {
    .top-nav>ul>li.about, .top-nav>ul>li.feedback {
        display: none;
    }
    .story-graph {
        width: 100%;
    }
}
@media only screen and (max-width: 940px) and (min-width: 769px) {
    .top-nav>ul>li.login {
        display: none;
    }
    div.download-stamp a {
        width: 80px;
        min-height: 80px;
    }
}

@media only screen and (max-width: 768px) {
    .content-page .main-content-wrapper #main-content p,
    .content-page .main-content-wrapper #main-content ul,
    .content-page .main-content-wrapper #main-content ol,
    p.two-thirds,
    .main-content-wrapper #main-content blockquote,
    .story-graph,
    .inlinesize,
    .pageFooter div {
        width: 100%;
        max-width: 100%;
    }
    #leftside-navigation {
        margin-top: 170px;
    }
    .top-nav {
        display: block;
        background-color: #fff;
        position: absolute;
        top: 120px;
        right: auto;
        left: 0;
        width: 280px;
        height: auto;
    }
    .top-nav>ul {
        height: auto;
    }
    .top-nav>ul>li {
        display: block;
        height: 25px;
        margin-bottom: 3px;
    }
    .top-nav>ul>li.guide-menu {
        display: none;
    }
    .top-nav>ul>li>a {
        height: 25px;
        padding: 0 10px 0 10px;
        margin-bottom: 0;
    }
    body.nav-toggle .top-nav {
        left: -280px;
    }
    .top-nav ul {
        padding: 0 10px;
    }
    .top-nav>ul>li:hover {
        border: 1px transparent solid;
        border-bottom: 1px solid #999;
    }
    .sidebar {
        position: absolute;
        display: block !important;
        width: 280px;
    }
    /*div.download-stamp {
		position: relative;
		top: 0;
		left: 0;
	}*/
    #Hello div.download-stamp {
        display: none;
    }
    #leftside-navigation ul li {
        margin: 0 0 6px;
    }

    .top-nav ul li.login, .top-nav ul li.language-menu {
        float: none;
    }

    .sidebar {
        top: 130px;
    }

    .top-nav ul li ul.dropdown-menu {
        top: 20px;
    }

    #Hello .sidebar, #Hello #toggle-left {
        display: none !important;
    }

    #Hello .top-nav {
        width: auto;
        top: 200px;
        height: auto;
    }

    #Hello .top-nav>ul>li {
        display: inline-block;
        height: 51px;
        margin-bottom: 3px;
    }

    #Hello .top-nav ul li.about {
        display: none;
    }

    #Hello .main-content-wrapper #main-content {
        margin-top: 0;
    }
    #Hello .main-content-wrapper #main-content div div>img.logo {
        max-width: 320px;
        width: 100%;
        padding-bottom: 100px;
    }

    div.download-update-big a {
        z-index: 9999;
        display: block;
        margin: 60px 20px;
        width: 150px;
        background: url(../img/download-stamp-updated-2020.png) center center;
        background-size: cover;
        min-height: 150px;
        text-indent: -1000px;
        overflow: hidden;
        opacity: 0.8;
        -webkit-transition:all .3s ease-in-out;
        -moz-transition:all .3s ease-in-out;
        -o-transition:all .3s ease-in-out;
        transition: all .3s ease-in-out;
        position: absolute;
        top: 10px;
        right: -40px;
    }

    #Hello .home-tabs {
        padding: 0 10px 20px 10px;
    }

    #Hello .home0 p {
        padding: 20px;
    }

    #Hello .footer-nav p a {
        padding: 10px 0px;
        display: block;
    }

}

@media only screen and (max-width: 768px) and (min-width: 480px) {

    /* Main Content */
    #Hello .main-content-wrapper, .main-content-wrapper {
        margin-left:0;
        margin-right:0;
        margin-top: 0;
    }

    #main-content .h1{
        font-size: 35px;
    }
    .main-content-wrapper #main-content {
        margin-top: 100px;
    }
    .toggle-navigation.toggle-left .btn-default {
        display: block;
    }
    .brand {
        position: absolute;
        min-height: 100px !important;
    }


}

@media only screen and (max-width: 660px) {

    #header .brand{
        width:100%;
    }

    #header  .user-nav  ul{
        padding-left: 0;
    }
    #header .toggle-navigation.toggle-left{
        float:left;
    }
    .main-content-wrapper #main-content {
        margin-top: 153px;
    }

    .user-nav ul li{
        font-size:12px;
    }
}
@media only screen and (max-width: 479px) {

    /* Main Content */
    #Hello .main-content-wrapper, .main-content-wrapper {
        margin-left:0;
        margin-right:0;
        margin-top: 0;
    }

    #main-content .h1{
        font-size: 22px;
    }

    .sidebar.sidebar-toggle {
        width: 10px;
    }

    #leftside-navigation ul li {
        width: 100%;
    }

    .sidebar {
        width: 100%;
    }

    #header .dropdown.messages{
        display: none;
    }
    .toggle-navigation.toggle-left {
        top: 35px;
        right: 20px;
    }

    .toggle-navigation.toggle-left .btn-default {
        display: block;
    }

    .brand {
        position: absolute;
    }
}



table td.space{
    width: 100px;
}

table thead td{
    background:#f7f7f7;
    font-weight: bold;
    vertical-align: middle;
}
table td.td-highlight{
    /* background:#E6F7F9; */
}

table.small-text.table td{
    font-size: 13px !important;
}


.zoom {
    display:inline-block;
    position: relative;
}

/* magnifying glass icon */
.zoom:after {
    content:'';
    display:block;
    width:33px;
    height:33px;
    position:absolute;
    top:0;
    right:0;
    background:url('../img/icon.png');
}

.zoom img {
    display: block;
}

.zoom img::selection { background-color: transparent; }

.content-page .main-content-wrapper #main-content .zoom p {
    position:absolute;
    top:3px;
    right:28px;
    color:#555;
    font:bold 13px/1 sans-serif;
    width: 45px;
    display: block;
    font-size: 1em;
}

[data-inline-tweet] a {
    text-decoration: none;
    color: inherit !important;
}
[data-inline-tweet] a span {
    border-bottom: 1px dotted;
    margin-right: 10px;
}
[data-inline-tweet] a:hover span {
    background-color: rgba(0,172,237,0.1);
    color: rgb(0,172,237);
}

@media (min-width: 992px) {
    .dl-col {
    /* width: 14% !important; */
    }
}