/*----------------------------------------
/ base
----------------------------------------*/

html {font-size:100%;}
body {font:17px "Quicksand", "Karla", "Helvetica Neue", helvetica, arial, sans-serif; color:#333; margin:0; padding:0; background:#fff; line-height:1.5; font-weight: 500;}
#aspnetForm {overflow-x: hidden;}


.magenta {color: #af005e !important;}
.teal {color: #54889b !important;}
.blue {color: #007CB5 !important;}


.angle-bottom-right {position: relative;}
.angle-bottom-right:before {    content: "";
    width: 180px;
    height: 20px;
    display: block;
    position: absolute;
    bottom: 0px;
    right: 0px;
    background: #d3d3d34f;}
.angle-bottom-right:after {    content: "";
    width: 20px;
    height: 180px;
    display: block;
    position: absolute;
    bottom: 0px;
    right: 0px;
    background: #d3d3d34f;}

.fa, .fas, .fab {font-size: 25px; color: #666;}

.max-width600 {    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.max-width700 {    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.max-width800 {    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.max-width900 {    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}
.max-width1000 {    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.max-width1100 {    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}
.max-width1200 {    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.box-top-right {position: relative;}
.box-top-right:before {content: "";
    border: 10px solid rgb(234, 234, 234);
    width: 300px;
    height: 300px;
    position: absolute;
    right: -270px;
    display: block;
    z-index: 0;
    bottom: -150px;
    opacity: 0.5;
    box-shadow: 0 0 80px #cccccc80;}

.hex-top {position: relative;}
.hex-top:after {
    content: "";
    background: url(/images/UserUploadedImages/32115/bg-hex-half-top.png) center top no-repeat;
    /* border: 1px solid red; */
    position: absolute;
    width: 850px;
    height: 500px;
    left: -200px;
    transform: rotate(-1deg);
    opacity: 1;
    z-index: -1;
    bottom: -640px;
}
.hex-magenta {position: relative;}
.hex-magenta:after {content: ""; opacity: 0.6; background: url(/images/UserUploadedImages/32115/hex-stripe-magenta.png) no-repeat; width: 510px; height: 550px; position: absolute;     z-index: -1;}
.hex-blue {position: relative;     overflow: visible;  
    min-height: 600px;}
html.whowehelp .hex-magenta:after {z-index: 0;}

.hex-blue:before {    content: "";
    background: url(/images/UserUploadedImages/32115/hex-stripe-blue.png) no-repeat;
    width: 510px;
    height: 550px; opacity:    0.7;
    position: absolute;
    z-index: 0;
    opacity: 0.3;
    left: 20%;
    top: 10%;
}
.fade-white {position: relative;}
.fade-white:before {
    content: "";
    border: none;
    height: 100px;
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0;
    background: linear-gradient(to top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
}
.fade-white:before + div {position: relative; z-index: 1;}
.fade-white:after {
    content: "";
    border: none;
    height: 100px;
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
}
.fade-bottom {position: relative;}
.fade-bottom:after {
    content: "";
    border: none;
    height: 150px;
    display: block;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 0;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
}


/*----------default styles----------*/

/* default link styles */
a,
a:link,
a:visited {color:#A40045; text-decoration:none; transition:all 0.2s ease-in-out; font-weight: 600; }
a:hover,
a:focus,
a:active {color:#A40045; text-decoration:none; cursor:pointer; /*border-bottom:1px solid #A40045;*/}
a img {border:none;}

#content a.btn {text-transform: uppercase; font-weight: 600;}
hr {    border: 1px solid #fff;
    opacity: 0;
    display: block;
    clear: both;}

img {max-width: 100%;}

/* defaults */
img {-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none;}
input[type="button"],
input[type="submit"] {-webkit-appearance: none;}
input[type="text"],
input[type="password"] {-webkit-appearance: none;}

p {line-height:1.8; margin:0 0 25px 0; padding:0;}
ul, ol {margin-bottom:25px;}
code {line-height:1.5; margin:0; padding:0; font-size:100%;}
blockquote {    margin: 50px; letter-spacing: -0.5px;
    padding: 0;
    font-size: 125%;
    padding: 0 40px;
    line-height: 1.7;
    font-family: 'Karla';
    font-weight: 500;
    font-style: normal;}

 
blockquote * {font-style: inherit !important;    line-height: 1.8 !important;}
th, td {vertical-align:top;}
strong, b {font-weight:800;}
html.home2020 h3 strong {color: #a40045;}
html.home2020 strong, 
html.home2020 b {font-weight:700;   }
textarea {resize:none;}
legend {color:inherit; text-rendering:optimizeLegibility; font-weight:300; font-size:200%; border-bottom:1px solid #ccc;}

/* default heading styles */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {font-family: "Karla"; font-weight:600; /*font-weight: 400; */ line-height: 120%; padding:0; margin:0 0 25px 0; color:inherit; text-rendering: optimizeLegibility;  letter-spacing: -2px;}
h1,
#content h1[style] {font-size:270% !important;   line-height: 110%;  letter-spacing: -3px; font-family: "Karla" !important;}
h2,
#content h2[style] {font-size:225%  !important;    letter-spacing: -2.5px; font-family: "Karla" !important;}
h3,
#content h3[style] {font-size:215%  !important;  letter-spacing: -2.5px; font-family: "Karla" !important;}
h4,
#content h4[style] {font-size:180%  !important;  letter-spacing: -2px; font-family: "Karla" !important;}
h5,
#content h5[style] {font-size:130%  !important;  line-height: 150%; font-weight: 500; letter-spacing: -1.3px; font-family: "Karla" !important;}
h6,
#content h6[style] {font-size:110%  !important;  line-height: 150%; font-weight: 500; letter-spacing: -1.2px; font-family: "Karla" !important;}
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {font-size: inherit !important;}

h1 a, h1 a:link, h1 a:visited, h1 a:hover, h1 a:focus,
h2 a, h2 a:link, h2 a:visited, h2 a:hover, h2 a:focus,
h3 a, h3 a:link, h3 a:visited, h3 a:hover, h3 a:focus,
h4 a, h4 a:link, h4 a:visited, h4 a:hover, h4 a:focus,
h5 a, h5 a:link, h5 a:visited, h5 a:hover, h5 a:focus,
h6 a, h6 a:link, h6 a:visited, h6 a:hover, h6 a:focus {font-weight:normal; font-weight:600; color:inherit; text-decoration:none !important; border:none;  position: relative;   color: #A40045;}
h1 a:hover, h1 a:focus,
h2 a:hover, h2 a:focus,
h3 a:hover, h3 a:focus,
h4 a:hover, h4 a:focus,
h5 a:hover, h5 a:focus,
h6 a:hover, h6 a:focus {color:#ad197f;}
h1.smaller,
h2.smaller,
h3.smaller,
h4.smaller,
h5.smaller,
h6.smaller {font-size:120%;}

.large {font-size:110% !important;}
.larger {font-size:125% !important;}
.largest {font-size:135% !important;}
.small {font-size:95% !important;}
.smaller {font-size:90% !important;}
.smallest {font-size:85% !important;}
.normal {font-weight:400 !important; font-size:100% !important;}
.bold {font-weight:700 !important;}

/*----forms----*/
.form-control {border-radius:2px; font-size:100%; color:inherit; box-shadow:none;}
.form-control:hover, .form-control:focus {border-color:#333; box-shadow:none;}
.form-control:focus, .form-control:active {border-color:#333; box-shadow:none; background:#eee;}
fieldset.form-inline .form-group {margin-left:0; margin-right:0;}
legend.control-label {font-size:100%; border:0; font-weight:bold;}

/*-----lists-----*/
.no-list {list-style-type:none; margin:0; padding:0;}

/*-----margins and padding-----*/
.no-margin {margin:0 !important;}
.no-margin-top {margin-top:0 !important;}
.no-margin-right {margin-right:0 !important;}
.no-margin-bottom {margin-bottom:0 !important;}
.no-margin-left {margin-left:0 !important;}
.no-padding {padding:0 !important;}
.no-padding-top {padding-top:0 !important;}
.no-padding-right {padding-right:0 !important;}
.no-padding-bottom {padding-bottom:0 !important;}
.no-padding-left {padding-left:0 !important;}

.margin-all {margin:40px;}
.margin-top {margin-top:40px;}
.margin-right {margin-right:40px;}
.margin-bottom {margin-bottom:40px;}
.margin-left {margin-left:40px;}
.padding-all {padding:20px;}
.padding-top {padding-top:20px;}
.padding-right {padding-right:20px;}
.padding-bottom {padding-bottom:20px;}
.padding-left {padding-left:20px;}

.margin-all-mid {margin:40px;}
.margin-top-mid {margin-top:40px;}
.margin-right-mid {margin-right:40px;}
.margin-bottom-mid {margin-bottom:40px;}
.margin-left-mid {margin-left:40px;}
.padding-all-mid {padding:40px;}
.padding-top-mid {padding-top:40px;}
.padding-right-mid {padding-right:40px;}
.padding-bottom-mid {padding-bottom:40px;}
.padding-left-mid {padding-left:40px;}

.margin-all-full {margin:80px;}
.margin-top-full {margin-top:80px;}
.margin-right-full {margin-right:80px;}
.margin-bottom-full {margin-bottom:80px;}
.margin-left-full {margin-left:80px;}
.padding-all-full {padding:80px;}
.padding-top-full {padding-top:80px;}
.padding-right-full {padding-right:80px;}
.padding-bottom-full {padding-bottom:80px;}
.padding-left-full {padding-left:80px;}

.margin-all-max {margin:100px;}
.margin-top-max {margin-top:100px;}
.margin-right-max {margin-right:100px;}
.margin-bottom-max {margin-bottom:100px;}
.margin-left-max {margin-left:100px;}
.padding-all-max {padding:100px;}
.padding-top-max {padding-top:100px;}
.padding-right-max {padding-right:100px;}
.padding-bottom-max {padding-bottom:100px;}
.padding-left-max {padding-left:100px;}

.margin-over {margin-left:-15px !important; margin-right:-15px !important;}

/*-----alignment-----*/
.align-left {text-align:left;}
.align-center {text-align:center;}
.align-right {text-align:right;}
.align-vertical {position:relative; top:50%; transform:translateY(-50%); z-index: 2;}
/* flexbox layout for equal height boxes */
.align {display:flex; flex-direction:row; flex-wrap:wrap;}
.align > div[class*='col-'],
.align > article[class*='col-'],
.align > li[class*='col-'] {margin-left:-0.5px;}
.flex-grow {flex-grow:1;}
.link-cover {position:absolute; top:0; right:15px; bottom:0; left:15px; z-index:100;}

/*-----animations-----*/
.animate,
.animate:before,
.animate:after {transition: all 1s ease-out;}

.animate-fast,
.animate-fast:before,
.animate-fast:after {transition: all .5s ease-out;}

.animate-faster,
.animate-faster:before,
.animate-faster:after {transition: all .2s ease-out;}

.animate-slow,
.animate-slow:before,
.animate-slow:after {transition: all 1.5s cubic-bezier(0, 0, 0.9, 0.06);}

.animate-slower,
.animate-slower:before,
.animate-slower:after {transition: all 2s cubic-bezier(0, 0, 0.9, 0.06);}

/*-----containers-----*/
.block {display:block; padding:15px; position:relative;}
div.center {margin:0 auto; float:none;}
.feature {font-size:150%;}
.full {width:100%;}
.block img {width:100%;}
.block.full img {width:auto;}

/*-----colours-----*/
.primary {color:#21b4c1;}
.secondary {color:#409ec1;}
.tertiary {color:#ccc;}
.highlight {color:#acf8ff;}
.section {}
.shade {color:#f2f6f9;}
.dark {color:#333;}
.light {color:#f4f4f4;}

.text-muted {}
.text-primary {}
.text-success {}
.text-info {}
.text-warning {}
.text-danger {}

/*-----backgrounds-----*/
.bg-primary {background:#A40045; color:#fff;}
.bg-primary a {color:#fff;}
.bg-primary a:hover,
.bg-primary a:focus {border-color:#fff;}
.bg-secondary {/*background:#C30052;*/ background:#a20257; color:#fff;}
.bg-secondary a {color:#fff;}
.bg-secondary a:hover,
.bg-secondary a:focus {border-color:#fff;}
.bg-tertiary {background:#f4f4f4; color:#333;}
.bg-highlight {background:#AD24B0; color:#333;}
.bg-section {background:#fff; color:#333;}
.bg-shade {background:#f8f8f8; color:#333;}
.bg-blue {background:#f5ffff; color:#333;}
.bg-dark {background:#333; color:#fff;}
.bg-dark a {color:#fff;}
.bg-dark a:hover,
.bg-dark a:focus {border-color:#fff;}
.bg-light {background:#eee; color:#333;}
.bg-blue .smallCaps {    color: #6ebcd3;}

.bg-success {}
.bg-info {}
.bg-warning {}
.bg-danger {}

.bg-grad-primary {background: rgb(182,2,77);
background: linear-gradient(41deg, rgba(182,2,77,1) 0%, rgba(104,21,104,1) 100%);}

.bg-grad-secondary {
background: linear-gradient(41deg, rgb(117, 41, 146) 40%, rgb(20, 108, 181) 100%);
}
.bg-grad-tertiary {
    background: linear-gradient(204deg, rgb(76, 218, 208) 0%, rgb(50, 104, 152) 100%);
background: linear-gradient(204deg, rgb(0, 130, 114) 0%, rgb(50, 104, 152) 100%);
}



.bg-grad-highlight {background:linear-gradient(to bottom, #acf8ff 0%,#ffffff 100%);}
.bg-grad-section {background:linear-gradient(to bottom, #ffffff 0%,#aaaaaa 100%);}
.bg-grad-shade {background:linear-gradient(to bottom, #f2f6f9 0%,#ffffff 100%);}
.bg-grad-dark {background:linear-gradient(to bottom, #333333 0%,#ffffff 100%);}
.bg-grad-light {background:linear-gradient(to bottom, #eeeeee 0%,#ffffff 100%);}

.bg-image {background-repeat:no-repeat; background-position:50% 50%; background-size:cover; color:#fff;}
.bg-image h2,
.bg-image h3,
.bg-image h4,
.bg-image h5,
.bg-image h6 {color:#fff;}
.bg-image.bg-hex {color:#fff;}
.bg-image.bg-road {color:#fff;}
.bg-image.bg-hex-pale {color:#333;}
.bg-image.bg-hex-pale h2,
.bg-image.bg-hex-pale h3,
.bg-image.bg-hex-pale h4,
.bg-image.bg-hex-pale h5,
.bg-image.bg-hex-pale h6 {color:#333;}

.bg-repeat {background-repeat:repeat;}

.bg-top-left {background-position:0 0;}
.bg-top-right {background-position:100% 0;}
.bg-bot-left {background-position:0 100%;}
.bg-bot-right {background-position:100% 100%;}

.bg-size-cover {background-size:cover;}
.bg-size-contain {background-size:contain;}
.bg-size-initial {background-size:initial;}
.bg-size-half {background-size:50%;}

/*-----borders-----*/
.border {border:1px solid #ddd;}
.border-none {border:none !important;}
.border-top {border-top:1px solid #ddd;}
.border-right {border-right:1px solid #ddd;}
.border-bottom {  position: relative;  padding: 0 0 15px;
    display: block;
    margin-bottom: 30px;}
.border-bottom:after {    content: "";
    background: #A40045 !important;
    margin: 0;
    display: inline-block;
    width: 70px;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 5px;}
.border-left {border-left:1px solid #ddd;}

.border-primary {border-color:#21b4c1;}
.border-secondary {border-color:#409ec1;}
.border-tertiary {border-color:#ccc;}
.border-highlight {border-color:#acf8ff;}
.border-section {border-color:#fff;}
.border-shade {border-color:#f2f6f9;}
.border-dark {border-color:#333;}
.border-light {border-color:#eee;}

.border-thick {border: 10px solid rgba(233, 233, 233, 0.7)}

.border-rad {border-radius:3px;}
.border-rad-left {border-radius:3px 0 0 3px;}
.border-rad-right {border-radius:0 3px 3px 0;}
.border-rad-top {border-radius:3px 3px 0 0;}
.border-rad-bot {border-radius:0 0 3px 3px;}
.border-circle {border-radius:50%;}

/*-----shadow-----*/
.shadow {box-shadow: 2px 2px 20px 0px rgba(50,50,50,0.2); overflow: hidden;}
.shadow-rev {box-shadow: -2px -2px 20px 0px rgba(50,50,50,0.5); overflow: hidden;}
.shadow-bot {box-shadow: 0px 2px 20px 0px rgba(50,50,50,0.5); overflow: hidden;}

.smallCaps {    text-transform: uppercase;     letter-spacing: 1px; font-family: 'Karla', Arial;
    margin-bottom: 20px;
    display: inline-block;
    color: #999;}
.smallCaps.magenta {color: #af005e;}
.smallCaps.blue {color: #38a6d0 ;}
.smallCaps.green {color: #69ac3d;}

.smallCaps h2 {    font-size: 18px !important;
    letter-spacing: 1px;
    font-weight: 500;}

/*-----buttons-----*/
.btn,
.btn:link,
.btn:visited,
.calendarview-edit-main-calendar #AddAppointment,
#content .RadScheduler .rsAdvancedEdit .rsAdvancedSubmitArea a,
.login-element div.lgn-btn input { font-family: 'Karla', Arial;   border-radius: 40px;
    transition: all 0.2s ease-in-out;
    text-decoration: none !important;
    border: 0;
    padding: 15px 32px; margin: 0 3px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 90%;}
.btn:hover,
.btn:focus,
.btn:active {border-color:#ccc;}
.btn-tertiary:focus,
.btn-tertiary:hover {border-color: none;}
.btn-tertiary:after {width:40px; height:40px; line-height:40px; position:absolute; font-size:32px; font-family:FontAwesome; font-weight:400; text-align:center; background-size:32px; background-repeat:no-repeat; text-rendering: optimizeLegibility; content: "\f105";
    font-size: 130%;
    width: auto;
    height: auto;
    line-height: 100%;
    padding: 0 10px;}
.btn-default,
.btn-default:link,
.btn-default:visited {color:#333; border-color:#ccc; background:#ccc;}
.btn-default:hover,
.btn-default:focus,
.btn-default:active {color:#333; border-color:#ccc; background:#ccc;}
.btn-primary,
.btn-primary:link,
.btn-primary:visited,
.clsFormCreator .add-button,
.calendarview-edit-main-calendar #AddAppointment,
#content .RadScheduler .rsAdvancedEdit div.rsAdvancedSubmitArea a.rsAdvEditSave,
.login-element div.lgn-btn input {color:#fff; border-color:#AF005E; background:#AF005E; box-shadow: 0 0 10px #00000020;}

.btn-primary.white {background: #fff; margin-bottom: 5px;
    border: 2px solid #AF005E;
    color: #AF005E;}
.btn-primary.black {  color: #fff;
    border-color: #000;
    background: #222;
    text-align: left;
    width: auto !important;
    text-transform: inherit;
    margin: 0 5px 10px;}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.clsFormCreator .add-button:hover,
.clsFormCreator .add-button:focus,
.calendarview-edit-main-calendar #AddAppointment:hover,
.calendarview-edit-main-calendar #AddAppointment:focus,
#content .RadScheduler .rsAdvancedEdit div.rsAdvancedSubmitArea a.rsAdvEditSave:hover,
#content .RadScheduler .rsAdvancedEdit div.rsAdvancedSubmitArea a.rsAdvEditSave:focus,
.login-element div.lgn-btn input:hover,
.login-element div.lgn-btn input:focus {color:#fff; border-color:#ad197f; background:#ad197f;}
.clsFormCreator .repeat .delete-button {color:#fff; border-color:#ca0a19; background:#ca0a19;}
.btn-toggle {opacity:0;}
.btn-link,
.btn-link:link,
.btn-link:visited {border:none; letter-spacing:0; background:transparent;}
.btn-link:hover,
.btn-link:focus,
.btn-link:active {background:transparent;}
.btn-warning,
.btn-warning:link,
.btn-warning:visited {color:#333; background:#f0ad4e; border-color:#f0ad4e;}
.btn-warning:hover, .btn-warning.disabled, .btn-warning[disabled] {color:#333; background-color:#ed9c28; border-color:#ed9c28;}
.btn-warning:active, .btn-warning.active {color:#333; background-color:#ed9c28; border-color:#ed9c28;}
.btn-danger,
.btn-danger:link,
.btn-danger:visited {color:#fff; background:#d2322d; border-color:#d2322d;}
.btn-danger:hover, .btn-danger.disabled, .btn-danger[disabled] {background-color:#ce4844; border-color:#ce4844;}
.btn-danger:active, .btn-danger.active {background-color:#ce4844; border-color:#ce4844;}
.btn-success,
.btn-success:link,
.btn-success:visited {color:#fff; background:#32870b; border-color:#32870b;}
.btn-success:hover, .btn-success.disabled, .btn-success[disabled] {background-color:#47a447; border-color:#47a447;}
.btn-success:active, .btn-success.active {background-color:#47a447; border-color:#47a447;}
.btn-info,
.btn-info:link,
.btn-info:visited {background:#67c2ef; border-color:#67c2ef;}
.btn-info:hover, .btn-info.disabled, .btn-info[disabled] {background-color:#39afea; border-color:#39afea;}
.btn-info:active, .btn-info.active {background-color:#30ace9; border-color:#30ace9;}

.btn-secondary,
.btn-secondary:link,
.btn-secondary:visited {color: #fff;
    border-color: #A40045;
        background: rgba(34, 34, 34, 0.9);}
.btn-secondary:hover {background: #111;}
.btn-tertiary,
.btn-tertiary:link,
.btn-tertiary:visited {border-radius: 0; color: #A40045;
      padding: 20px 0 !important;
    border: none !important;}
.btn-highlight,
.btn-highlight:link,
.btn-highlight:visited {color:#333; border-color:#acf8ff; background:#acf8ff;}
.btn-section,
.btn-section:link,
.btn-section:visited {color:#333; border-color:#fff; background:#fff;}
.btn-shade,
.btn-shade:link,
.btn-shade:visited {color:#333; border-color:#f2f6f9; background:#f2f6f9;}
.btn-dark,
.btn-dark:link,
.btn-dark:visited {color:#fff; border-color:#333; background:#333;}
.btn-light,
.btn-light:link,
.btn-light:visited {color:#333; border-color:#eee; background:#eee;}

/*-----circle-----*/
.circle,
p.circle {border-radius:100px; padding:15px; display:inline-block; float:none; width:auto; text-align:centre; min-width:1px;}

/*-----icons-----*/
.icon {position:relative; background-repeat:no-repeat;}
.icon::after {width:40px; height:40px; line-height:40px; position:absolute; font-size:32px; font-family:FontAwesome; font-weight:400; text-align:center; background-size:32px; background-repeat:no-repeat; text-rendering: optimizeLegibility;}
.icon.icon-tiny::after {width:20px; height:20px; line-height:20px; font-size:16px; background-size:16px;}
.icon.icon-small::after {width:30px; height:30px; line-height:30px; font-size:22px; background-size:22px;}
.icon.icon-large::after {width:50px; height:50px; line-height:50px; font-size:40px; background-size:40px;}
.icon.icon-thin::after {font-weight:300;}
.icon.icon-fill::after,
.icon.icon-solid::after {font-weight:900;}

.icon-primary:after {color:#21b4c1;}
.icon-secondary:after {color:#409ec1;}
.icon-tertiary:after {color:#ccc;}
.icon-highlight:after {color:#acf8ff;}
.icon-section:after {color:#fff;}
.icon-shade:after {color:#f2f6f9;}
.icon-dark:after {color:#333;}
.icon-light:after {color:#eee;}

.icon-only {color:#333;}

.icon.icon-top::after {top:0; left:0; right:0; margin:0 auto; text-align:center;}
.icon.icon-top {padding-top:40px !important; background-position:0 0;}
.icon.icon-top.icon-tiny {padding-top:20px !important;}
.icon.icon-top.icon-small {padding-top:30px !important;}
.icon.icon-top.icon-large {padding-top:50px !important;}

.icon.icon-right {padding-right:45px !important; background-position:100% 0; padding-top:10px; padding-bottom:10px;}
.icon.icon-right::after {top:50%; transform:translateY(-50%); right:0;}
.icon.icon-right.icon-tiny {padding-right:25px !important; padding-top:10px; padding-bottom:10px;}
.icon.icon-right.icon-small {padding-right:35px !important; padding-top:10px; padding-bottom:10px;}
.icon.icon-right.icon-large {padding-right:55px !important; padding-top:15px; padding-bottom:15px;}

.icon.icon-bottom::after {bottom:0; left:0; right:0; margin:0 auto; text-align:center;}
.icon.icon-bottom {padding-bottom:40px !important; background-position:0 100%;}
.icon.icon-bottom.icon-tiny {padding-bottom:20px !important;}
.icon.icon-bottom.icon-small {padding-bottom:30px !important;}
.icon.icon-bottom.icon-large {padding-bottom:50px !important;}

.icon.icon-left {padding-left:45px !important; background-position:0 0; padding-top:10px; padding-bottom:10px;}
.icon.icon-left::after {top:50%; transform:translateY(-50%); left:0;}
.icon.icon-left.icon-tiny {padding-left:25px !important; padding-top:10px; padding-bottom:10px;}
.icon.icon-left.icon-small {padding-left:35px !important; padding-top:10px; padding-bottom:10px;}
.icon.icon-left.icon-large {padding-left:55px !important; padding-top:15px; padding-bottom:15px;}

.btn.icon.icon-only {text-indent:-9999px; padding:0 !important; min-height:1px !important; width:34px; height:34px; border:0; overflow:hidden;}
.btn.icon.icon-only::after {top:0; right:0; bottom:0; left:0; text-align:center; text-indent:0; width:100%; height:100%;}
.btn.icon.icon-only.icon-tiny {width:20px; height:20px;}
.btn.icon.icon-only.icon-small {width:30px; height:30px;}
.btn.icon.icon-only.icon-large {width:50px; height:50px;}
.btn.icon.icon-right:not(.icon-only)::after {right:5px;}
.btn.icon.icon-right.icon-tiny:not(.icon-only)::after {}
.btn.icon.icon-right.icon-small:not(.icon-only)::after {}
.btn.icon.icon-right.icon-large:not(.icon-only)::after {}
.btn.icon.icon-left:not(.icon-only)::after {left:5px;}
.btn.icon.icon-left.icon-tiny:not(.icon-only)::after {}
.btn.icon.icon-left.icon-small:not(.icon-only)::after {}
.btn.icon.icon-left.icon-large:not(.icon-only)::after {}

.icon-right-dir::after {content:"\f0da";}
.icon-left-dir::after {content:"\f0d9";}
.icon-tick::after {content:"\f00c";}
.icon-cross::after,
.icon-times::after {content:"\f00d";}
.icon-dir-left::after {content:"\f053";}
.icon-dir-right::after {content:"\f054";}
.icon-dir-up::after {content:"\f0d8";}
.icon-dir-down::after {content:"\f0d7";}
.icon-angle-left::after {content:"\f104";}
.icon-angle-right::after {content:"\f105";}
.icon-angle-up::after {content:"\f106";}
.icon-angle-down::after {content:"\f107";}
.icon-arrow-left::after {content:"\f060";}
.icon-arrow-right::after {content:"\f061";}
.icon-arrow-up::after {content:"\f062";}
.icon-arrow-down::after {content:"\f063";}

.icon-menu::after {content:"\f0c9";}
.icon-search::after {content:"\f002";}
.icon-search.open::after {content:"\f00d";}
.icon-person::after {content:"\f0c0";}
.icon-location::after {content:"\f041";}
.icon-notes::after {content:"\f249";}
.icon-question::after {content:"\f128";}
.icon-pen::after {content:"\f040";}
.icon-cog::after {content:"\f085";}
.icon-design::after {content:"\f1fc";}
.icon-form::after {content:"\f46d";}
.icon-flow::after {content:"\f126";}
.icon-padlock::after {content:"\f023";}
.icon-monitor::after {content:"\f611";}
.icon-phone::after {content:"\f095";}
.icon-tv::after {content:"\f26c";}
.icon-desktop::after {content:"\f108";}
.icon-laptop::after {content:"\f109";}
.icon-mobile::after {content:"\f3cd";}
.icon-tablet::after {content:"\f3fa";}
.icon-certificate::after {content:"\f0a3";}
.icon-cloud::after {content:"\f0c2";}

.icon-detail-table::after {content:"\f1ea";}
.icon-plane::after {content:"\f072";}
.icon-camera::after {content:"\f030";}
.icon-hat::after {content:"\f19d";}
.icon-paper::after {content:"\f15c";}
.icon-calc::after {content:"\f1ec";}
.icon-graph::after {content:"\f080";}
.icon-dress::after {content:"\f553";}
.icon-book::after {content:"\f518";}
.icon-help2::after {content:"\f2fd";}
.icon-sun::after {content:"\f185";}
.icon-gavel::after {content:"\f0e3";}
.icon-website::after {content:"\f37e";}
.icon-search::after {content:"\f002";}
.icon-trolley::after {content:"\f59d";}
.icon-manual::after {content:"\f02d";}
.icon-scales::after {content:"\f24e";}
.icon-board::after {content:"\f46d";}
.icon-location::after {content:"\f3c5";}
.icon-help::after {content:"\f128";}
.icon-handshake::after {content:"\f2b5";}
.icon-chart::after {content:"\f201";}
.icon-bars::after {content:"\f080";}
.icon-envelope::after {content:"\f0e0";}
.icon-network::after {content:"\f0e8";}
.icon-letter::after,
.icon-email::after,
.icon-mail::after {content:"\f2b6";}
.icon-satchel::after {content:"\f0b1";}
.icon-trays::after {content:"\f01c";}
.icon-clock::after {content:"\f34e";}
.icon-dollar::after {content:"\f2e9";}
.icon-speech::after {content:"\f086";}
.icon-stack::after {content:"\f07c";}
.icon-compass::after {content:"\f14e";}
.icon-envelope2::after {content:"\f0e0";}
.icon-cog::after {content:"\f013";}
.icon-person::after {content:"\f007";}
.icon-login::after {content:"\f090";}
.icon-video::after {content:"\f03d";}
.icon-pivot-table::after {content:"\f0ce";}
.icon-bars2::after {content:"\f080";}
.icon-lock::after {content:"\f023";}
.icon-news::after {content:"\f1ea";}
.icon-share::after {content:"\f1e0";}
.icon-clip::after {content:"\f0c6";}
.icon-podcast::after {content:"\f2ce";}
.icon-bulb::after {content:"\f0eb";}
.icon-filter::after {content:"\f0b0";}
.icon-dollar2::after {content:"\f155";}
.icon-building::after {content:"\f1ad";}
.icon-ship::after {content:"\f21a";}
.icon-sign::after {content:"\f277";}
.icon-seedling::after {content:"\f4d8";}
.icon-world::after {content:"\f0ac";}
.icon-link::after {content:"\f0c1";}
.icon-box::after {content:"\f187";}
.icon-pencil::after {content:"\f040";}
.icon-bill::after {content:"\f0d6";}
.icon-female::after {content:"\f221";}
.icon-male::after {content:"\f222";}
.icon-trophy::after {content:"\f091";}
.icon-list::after {content:"\f022";}
.icon-industry::after {content:"\f275";}
.icon-chart-pie::after {content:"\f200";}
.icon-board2::after {content:"\f46d";}
.icon-chat::after {content:"\f4ad";}
.icon-paper-plane::after {content:"\f1d8";}
.icon-pen::after {content:"\f305";}
.icon-arrow-right::after {content:"\f061";}
.icon-edit::after {content:"\f040";}
.icon-update::after {content:"\f040";}
.icon-delete::after {content:"\f1f8";}
.icon-read::after {content:"\f02e";}
.icon-unread::after {content:"\f02e"; font-weight:900;}
.icon-history::after {content:"\f022";}
.icon-action::after {content:"\f2f3";}
.icon-print::after {content:"\f02f";}
.icon-plant::after {content:"\f400";}
.icon-bag::after {content:"\f290";}
.icon-rocket::after {content:"\f135";}
.icon-ticket::after {content:"\f145";}
.icon-bell::after {content:"\f0f3";}
.icon-class::after {content:"\f63d";}
.icon-id::after {content:"\f47f";}
.icon-cake::after {content:"\f1fd";}
.icon-pie::after {content:"\f705";}

.icon-comment::after,
.icon-SocialPost::after {content:"\f075";}
.icon-comment-edit::after {content:"\f4ae";}
.icon-comment-delete::after {content:"\f4b5";}
.icon-like::after {content:"\f164";}
.icon-dislike::after {content:"\f165";}
.icon-votes::after {content:"\f681";}
.icon-mark::after {content:"\f00c";}
.icon-unmark::after {content:"\f00c";}
.icon-people::after,
.icon-users::after,
.icon-SocialGroup::after {content:"\f0c0";}
.icon-SocialComment::after {content:"\f086";}

.icon-import::after {content:"\f093";}
.icon-upload::after {content:"\f093";}
.icon-export::after {content:"\f019";}
.icon-download::after {content:"\f019";}
.icon-preview::after,
.icon-view::after {content:"\f06e";}
.icon-tasks::after {content:"\f0ae";}
.icon-cal-export::after {content:"\f271";}

.icon-facebook::after {content:"\f09a"; font-weight:600;}
.icon-linkedin::after {content:"\f0e1"; font-weight:600;}
.icon-twitter::after {content:"\f099"; font-weight:600;}
.icon-youtube::after {content:"\f167"; font-weight:600;}

.icon-folder::after,
.icon-Folder::after {content:"\f07b";}
.icon-article::after,
.icon-Article::after {content:"\f15b";}
.icon-document::after,
.icon-Document::after,
.icon-doc:after {content:"\f15c";}
.icon-event::after,
.icon-Event::after,
.icon-calendar::after {content:"\f073";}
.icon-image::after,
.icon-Image::after {content:"\f1c5";}

.icon-add::after {content:"\f067";}
.icon-minus::after {content:"\f068";}
.icon-cut::after {content:"\f0c4";}
.icon-copy::after {content:"\f0c5";}
.icon-paste::after {content:"\f0ea";}

/*-----opacity-----*/
.invisible {opacity:0;}
.translucent {opacity:0.8;}
.transparent {opacity:0.4;}

/*-----effects-----*/
.uppercase {text-transform:uppercase;}

/*-----hover-----*/
.hover,
.hover * {position:relative;}
.hover::before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,0); transition:all 0.2s ease-in-out;}
.hover:hover::before,
.hover:focus::before {background:rgba(0,0,0,0.2);}

/*-----overlay-----*/
.overlay,
.overlay * {position:relative; z-index:2; color:#fff;}
.overlay {}
.overlay::before {content:""; display:block; position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; background-color:rgba(0,0,0,0.7); transition:background-color 0.2s ease-in-out;}
.overlay.light::before {background-color:rgba(0,0,0,0.4);}
.overlay.lighter::before {background-color:rgba(0,0,0,0.3);}
.overlay.opaque,
.overlay.opaque * {color:#333;}
.overlay.opaque::before {background-color:rgba(255,255,255,0.8);}
.overlay.opaque.light::before {background-color:rgba(255,255,255,0.6);}
.overlay.opaque.lighter::before {background-color:rgba(255,255,255,0.4);}
.overlay.linear::before {background:linear-gradient(to right, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 100%);}
.overlay.linear.light::before {background:linear-gradient(to right, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);}
.overlay.linear.lighter::before {background:linear-gradient(to right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);}
.overlay.linear.opaque::before {background:linear-gradient(to right, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);}
.overlay.linear.opaque.light::before {background:linear-gradient(to right, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 100%);}
.overlay.linear.opaque.lighter::before {background:linear-gradient(to right, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0) 100%);}

.link-overlay a {display:block; position:absolute; top:0; right:0; bottom:0; left:0; background:transparent; z-index:2; text-indent:-9999px;}
.link-overlay a:hover,
.link-overlay a:focus {text-decoration:none; border:none;}

/*-----arrow-----*/
.arrow {display:block;  /* padding:1.5em !important;height:120px;*/     border: none !important;   text-decoration: none !important;}
.arrow::before {width:0px; height:0px; content:""; position:absolute; top:0;}
.arrow::after {width:0px; height:0px; content:""; position:absolute; bottom:0;}
.arrow-left {}
.arrow-left::before {border-left:60px solid transparent; left:0;}
.arrow-left::after {border-left:60px solid transparent; left:0;}
.arrow-right {}
.arrow-right::before {border-left:60px solid transparent; right:0;}
.arrow-right::after {border-left:60px solid transparent; right:0;}
.block.arrow a,
.block.arrow a:link,
.block.arrow a:visited,
.block.arrow a:active {border-bottom:none;}

/*----------------------------------------
/ dropdowns
----------------------------------------*/
.dropdown {background:#fff; cursor:pointer;}
ul.dropdown,
ol.dropdown {list-style-type:none; max-width:650px; padding:0;}
ul.dropdown > li,
ol.dropdown > li,
.dropdown h2,
.dropdown h3,
.dropdown h4 {font-size:100%; font-weight:400; margin:0; padding:0 35px 0 12px; cursor:pointer; color:#333; position:relative; z-index:2; border:1px solid #ccc; height:34px; line-height:34px;}
.centered ul.dropdown,
.centered ol.dropdown {margin:0 auto; text-align:left;}
ul.dropdown > li::after,
ol.dropdown > li::after,
.dropdown h2::after,
.dropdown h3::after,
.dropdown h4::after {content:"\f0dc"; font-family:'Font Awesome 5 Pro'; font-weight:900; position:absolute; top:0; right:15px; z-index:1; color:#3d3935; font-size:25px; width:15px;}
.dropdown.outline {background:transparent; border:1px solid #d9d9d9;}
.dropdown ol,
.dropdown ul {list-style-type:none; margin:0; padding:0; display:none; position:absolute; top:49px; left:0; right:0; z-index:10; background:#fff; border:1px solid #d9d9d9; color:#3d3935; height:250px; overflow-y:scroll;}
.dropdown ol.open,
.dropdown ul.open {display:block;}
.dropdown.outline ol,
.dropdown.outline ul {background:#fff; border:1px solid #d9d9d9;}
.dropdown ol li,
.dropdown ul li {position:relative; float:none;}
.dropdown ol li a:first-child,
.dropdown ul li a:first-child,
.dropdown ol li a:first-child:link,
.dropdown ul li a:first-child:link,
.dropdown ol li a:first-child:visited,
.dropdown ul li a:first-child:visited {display:block; padding:8px 15px; color:inherit !important; border:none !important;}
.dropdown ol li:hover,
.dropdown ol li:focus,
.dropdown ul li:hover,
.dropdown ul li:focus {background-color:#f5f1ee;}
.dropdown > ol > li > ol > li > a,
.dropdown > ul > li > ul > li > a {padding-left:25px;}
.dropdown > ol > li > ol > li > ol > li > a,
.dropdown > ul > li > ul > li > ul > li > a {padding-left:40px;}

/*----------------------------------------
/ tabs
----------------------------------------*/
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {color:#333;}
.tab-pane {border:1px solid #ddd; border-top:0; padding:15px;}

/*----------------------------------------
/ responsive design
----------------------------------------*/

@media (min-width: 0) and (max-width:991px) {
  body {font-size:14px;}
  .container {width:95%;}
  html body .ui-dialog {width:95% !important;}
  .margin-all-mid {margin:15px;}
  .margin-top-mid {margin-top:15px;}
  .margin-right-mid {margin-right:15px;}
  .margin-bottom-mid {margin-bottom:15px;}
  .margin-left-mid {margin-left:15px;}
  .padding-all-mid {padding:15px;}
  .padding-top-mid {padding-top:15px;}
  .padding-right-mid {padding-right:15px;}
  .padding-bottom-mid {padding-bottom:15px;}
  .padding-left-mid {padding-left:15px;}

  .margin-all-full {margin:30px;}
  .margin-top-full {margin-top:30px;}
  .margin-right-full {margin-right:30px;}
  .margin-bottom-full {margin-bottom:30px;}
  .margin-left-full {margin-left:30px;}
  .padding-all-full {padding:30px;}
  .padding-top-full {padding-top:30px;}
  .padding-right-full {padding-right:30px;}
  .padding-bottom-full {padding-bottom:30px;}
  .padding-left-full {padding-left:30px;}

}

@media (min-width: 0) and (max-width:767px) {
  .container {width:100%;}.align {display:block;}
  .margin-all-full {margin:15px;}
  .margin-top-full {margin-top:15px;}
  .margin-right-full {margin-right:15px;}
  .margin-bottom-full {margin-bottom:15px;}
  .margin-left-full {margin-left:15px;}
  .padding-all-full {padding:15px;}
  .padding-top-full {padding-top:15px;}
  .padding-right-full {padding-right:15px;}
  .padding-bottom-full {padding-bottom:15px;}
  .padding-left-full {padding-left:15px;}
}

@media (min-width: 0) and (max-width:479px) {

}

.hexagon {
    /*position: relative;
  width: 700px; 
  height: 404.15px;
  background-color: #0c84b0;
  margin: 202.07px 0;
  position: absolute;
    z-index: 3;
      opacity: 1;
    -webkit-transform: rotate(35deg); -moz-transform: rotate(35deg); -o-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    top: -80px;
            top: -360px;
    left: 0;
    margin-left: 20%;*/
    
    position: relative;
    width: 700px;
    height: 404.15px;
    background-color: #fff;
    margin: 202.07px 0 0 0;
    position: absolute;
    z-index: 3;
    opacity: 0.7;
    -webkit-transform: rotate(36deg);
    -moz-transform: rotate(36deg);
    -o-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    left: -70px;
    top: -365px;
    /*box-shadow: 0 -100px 100px #000;*/
}
.hexagon:before,
.hexagon:after {
    content: "";
    position: absolute;
    width: 0;
    border-left: 550px solid transparent;
    border-right: 550px solid transparent;
    left: 0;
}
.hexagon:before {
    bottom: 99.7%;
    border-bottom-style: solid;
    border-bottom-width: 202.97px;
    border-bottom-color: #fff;
}
.hexagon:after {
    top: 99.7%;
    width: 0;
    border-top-style: solid;
    border-top-width: 202.97px;
    border-top-color: #fff;
}

@media (max-width: 1200px) {
h1,
#content h1[style] {font-size:240% !important;}
}