/* Tools */
.relative { position:relative; }
.v-center { position:absolute;  top: 60%; transform:translateY(-50%); left:0; right:0; }
.img-centered { text-align:center; margin:0 auto; }
.highlight { color:#5594ad; }
.uppercase { text-transform:uppercase }
.no-margin { margin:0!important; }
.no-padding { padding:0!important;}
/* End */

/* Body */

/* Stops IOS from overridding the colour for links when displayed on a IOS device */
.appleLinksWhite a {
    color: #ffffff !important;
    text-decoration: none;
}

.sub-heading a {
    color: #ffffff !important;
    text-decoration: none;
}


* {
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Open Sans', sans-serif;
    font-size:14px;
}

h1, h2, h3, h4, p, a, input {
    font-family: 'Open Sans', sans-serif;
    color:#00171f;
}

h1, h2, h3, h4 {
    font-weight:300;
    margin-bottom:15px;
}

p { font-weight:300; }

button,
button:focus {
    outline:0;
}

th {
	width: 25%;
}

.material-icons.md-30 { font-size: 30px; }
.material-icons.green500 { color: #8BC34A; }
.material-icons.neutral { color: #9E9E9E; }


/* End of body */

/* Re-usables */
.IDD {
    padding-left: 15%;
    padding-right: 15%;
    margin-bottom: 50px;
    text-align: center;
}

a {
    cursor:pointer;
}
.modal-button {
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}
a:hover { text-decoration:initial; }
.btn-primary {
    background:#ef7f29;
    color:#fff;
    padding:10px 15px;
    border-radius:0;
    border-color:transparent;
}
.btn-secondary {
    background:#5594ad;
    color:#fff;
    padding:10px 15px;
    border-radius:0;
    border-color:transparent;
    text-transform:uppercase;
}
.btn-secondary:hover {
    background:#487e93;
    color:#fff;
}
.btn-primary:hover {
    background:#f19a37;
    border-color:transparent;
    color:#fff;
}
.login-btn-ghost {
    background: #ef7f29;
    margin: 0px 0px;
}

    .login-btn-ghost:hover {
        background: #f68c3a !important;
        color: #fff !important;
    }

.link-primary:hover a {
    color:#fff!important;
}
.btn-ghost {
    border:2px solid #ef7f29;
    color:#fff;
    border-radius:0;
    text-transform:uppercase
}
.btn-ghost:hover {
    background:#ef7f29;
}
.link-ghost { border:2px solid #ef7f29; color:#fff; padding:0px 15px; text-transform:uppercase; }
.navbar-nav .link-ghost a { font-weight:bold; color:#ffffff; }
.link-ghost:hover { background:#ef7f29; }
.navbar-nav .link-ghost:hover a { color:#fff; }
.navbar-nav .link-primary { 
    background:#ef7f29; 
    margin:0px 15px; 
    color:#fff; 
    padding:2px 15px; 
}

.navbar-nav .link-primary:hover { 
    background:#f68c3a; 
   /* margin:0px 15px; */
    color:#fff; 
    padding:2px 15px; 
}

.navbar-nav .link-primary a { 
    color:#fff; 
}

.btn-primary, .btn-ghost, .link-ghost, .link-primary, .btn-secondary, .export-cta {
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition:.5s;
    cursor:pointer;
}

.content-promo {
    width: 1140px;
}

.center-promo {
    padding-left: 15%;
    padding-right: 15%;
    margin-bottom: 70px;
    text-align: center;
}

.promo-info {
    padding: 80px 0px; 
    margin-top: 30px; 
    margin-bottom: 70px; 
    position: relative; 
    background-color: rgb(96, 125, 139);
}

.promo-info h3 {
    text-align: center; 
    color: rgb(255, 255, 255); 
    line-height: 45px;
}

.promo-info::after {
    content: '';
    position: absolute;
    bottom: -29px;
    right: 0;
    left: 0;
    height: 30px;
    width: 100%;
    background: url(triangle.png) no-repeat;
    background-position: center top;
    z-index: 1;
}


.feature-promo {
    height: 150px;
    padding: 20px;
    padding-top: 30px; 
    text-align: center; 
    background-color: rgb(96, 125, 139);
}

.feature-promo h4 {
    color: rgb(255, 255, 255);
    padding-bottom: 5px;
}

.content-center {
    margin: auto;
}

.icon-text {
    display: inline-block;
    vertical-align: 13px;
}

.mobile-icon-support {
    animation: opacityPulse 2s ease-out;
    animation-iteration-count: infinite; 
    opacity: 1;
}

@-webkit-keyframes opacityPulse {
    0% {opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {opacity: 0.0;}
}

.icon-arrow {
    display: none;
}

/* End of re-usables */

/* Icon */

.circle {

    width: 50px;
    height: 50px;
    background: #ddeaef;
    -moz-border-radius: 50px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
    margin: auto;
    padding-top: 8px;
}

/* End of Icon */

button.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

button.accordion.active, button.accordion:hover {
    background-color: #ddd;
}

div.panel {
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

button.accordion:after {
    content: '\02795'; /* Unicode character for "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
}

button.accordion.active:after {
    content: "\2796"; /* Unicode character for "minus" sign (-) */
}

#features h2 {
    margin-top:115px;
    margin-bottom:0px;
}

.feature-text-container {
   text-align: justify;
    -moz-text-align-last: left;
    text-align-last: left;
    padding-left: 10px;
    padding-right: 10px;
}

#feature-row, #faq-row, #cta-row, #pricing-row, #price-row, #trial-row, #product-breakdown,
#overview-row { padding:75px 0 75px; }

#feature-row { padding-top:60px; }

#cta-row p,
#cta-row h2,
#cta-row a {
    color:#fff;
}

#cta-row p {
    margin-bottom:30px;
}

hr.divider {
    border: none;
    margin: 30px 0;
}

.feature-panel {
    padding-top: 25px;
    padding-bottom: 25px;
}

.feature-panel img.main {
    margin-bottom:30px;
}

.feature-panel h4 {
    margin-bottom:15px;
}

.info-panel img.main {
    margin-bottom:30px;
}

.info-panel h4 {
    margin-bottom:15px;
    text-align: center;
    font-size: 22px;
    line-height: 30px;
}

.panel-image-container {
   /* height: 60px;*/
}

.icon-image-container {
    height: 80px;
    text-align: center;
}

.learn-more {
    font-size:16px;
    font-weight:600;
    color:#0f5da6;
}

.learn-more img {
    width:6px;
    margin-left:15px;
}

#overview-row .cpd-overview,
#overview-row .cpd-activities,
#overview-row .cpd-status {
    margin-bottom: 75px;
}

#overview-row a {
    color:#ef7f29;
}

.above-footer {
/*    background:url('bottom-image.jpg') no-repeat;*/
    background-color:#34373C;
    background-size:cover;
    background-position:center;
}

.above-footer .btn {
    width:200px;
}

.cpd-point img {
    padding:30px 0 15px;
}

/* Icon 1 */

#nav-icon4 {
    width: 30px;
    height: 18px;
    position: relative;
    margin: 12px auto;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}

#nav-icon4 span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: #ffffff;
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

/* Icon 4 */


#nav-icon4 span:nth-child(1) {
    top: 0px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

#nav-icon4 span:nth-child(2) {
    top: 8px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

#nav-icon4 span:nth-child(3) {
    top: 16px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
}

#nav-icon4.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: -5px;
    left: 8px;
}

#nav-icon4.open span:nth-child(2) {
    width: 0%;
    opacity: 0;
}

#nav-icon4.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 8px;
}

.faded-strip {
/*    background-color:rgba(255,255,255,0.6);*/
    background-color:#34373C;
    position:relative;
    z-index:99999;
}

.navbar-inverse .navbar-toggler {
    border:0px solid transparent;
}

.navbar-toggleable-md { padding-top:15px; padding-bottom:15px; }

button.navbar-toggler {
    padding:0;
}

.navbar-light .navbar-nav .nav-link,
.navbar-nav .nav-link {
    color:#ffffff;
    text-transform:uppercase;
    font-size:14px;
    font-weight:bold;
    letter-spacing:1px;
}

.navbar-collapse {
    width: 100%;
    text-align: center;
    z-index: 99998;
    position: relative;
}

.modal-open .modal {
    z-index: 99999;
}

.nav-item {
    margin:0 10px;
}

.nav-item-selected {
    border-bottom-color: rgb(255, 255, 255);
    border-bottom-width: 3px;
    border-bottom-style: solid;
}

footer {
    padding:30px 0;
    background:#111111;
}

footer p {
    color:#fff;
    font-size:14px;
    text-align: center;
}
/* End nav */

.containing-image {
    background:url('main-image.jpg') no-repeat;
    min-height: 500px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:100vh;
}

.containing-image h1 {
    color:#fff;
    padding-bottom:15px;
}

.containing-image .sub-heading {
    font-size:18px;
    color:#fff;
    padding-bottom:75px;
}

.pricing.containing-image {
    background:url('pricing-image.jpg') no-repeat;
    min-height: 400px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:410px;
}

#price-row .panel {
    max-height:100%;
    padding:15px 0 5px;
}

.trial.containing-image {
    background:url('trial-image.jpg') no-repeat;
    min-height: 400px;
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:410px;
}

.trial.containing-image .sub-heading,
.pricing.containing-image .sub-heading {
    padding-bottom:0;
}

.trial-text {
    height:183px;
}

.scroll-to {
    position:absolute;
    bottom:10%;
    left:0;
    right:0;
}

.down-arrow {
    background:url('down-arrow.png') no-repeat;
    width:53px;
    height:53px;
    margin:0 auto;
}

.grey-strip {
    background:#d2d2d2;
}

/* Modal */
.form-control {
    border-radius:0;
}

label .required {
    color:red;
}

.required {
    color:red;
}
.modal-content {
    border-radius:0;
    padding:20px 30px 30px 30px;
}

.modal-content p a {
    color:#5594ad;
    text-decoration:underline;
}

.modal-content .btn-secondary {
    margin:0 15px;
}

.modal-content p,
.modal-content label {
    font-size:14px;
}

.close {
    color:#ff0000;
    float:right;
}

.modal-header,
.modal-footer{
    border:0px solid transparent;
}

.modal-header {
    padding-bottom:0;
}

.vertical-alignment-helper {
    display:table;
    height: 100%;
    width:100%;
    max-width:530px;
    margin:0 auto;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}
.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
}

/* End of modal */

/* Pricing */


.panel {
    background:#fff;
    padding:15px 0;
}

.feature-list {
    list-style-type:none;
}

.feature-list li  {
    font-weight:600;
    font-size:14px;
    margin-bottom:10px;
}

.panel a {
    color:#5594ad;
    font-size:14px;
}

.table td, .table th {
    vertical-align: middle;
}

.table thead th {
    font-weight: 600;
    font-size: 16px;
    padding: 20px;
    border: 0px solid transparent;
    text-align: left;
}

.table tbody td {
    font-weight:400;
    font-size:14px;
}

.table tbody tr:nth-child(odd) {
    background: #F5F5F5;
}

td.img-centered {
    width: 260px;
}

.col-des {
    font-weight: 300;
    font-size: 14px; 
}

#product-breakdown h3 {
    margin-bottom:45px;
}

#product-breakdown h4 {
    margin-bottom:30px;
}

.text-row {
    padding-top:30px;
}

.bottom-image {
    background:url('bottom-image.jpg') no-repeat;
    background-position:center;
    background-size:cover;
    padding:90px 0;
}

.bottom-image img {
    width:6px;
    margin-left:5px;
}

.bottom-image p,
.bottom-image h4,
.bottom-image a {
    color:#fff;
}

/* End of pricing */

/* Learn feature page */
.learn {
    background:#1b3037;
}

.learn h1 { color:#fff; font-size:30px; }

.learn .sub-heading { 
    color:#fff; 
    font-size:18px; 
    line-height:30px;
    padding-top: 60px; 
}
.learn .feature-tabs a {
    color:#ffffff;
}

.learn .nav-tabs {
    border: 0px solid transparent;
    display: initial;
    width: initial;
    margin: 30px 0 60px;
}

.learn .tab-pane h1 {
    margin:20px 0 15px;
}

/*.learn .tab-text {
    padding:0px 48px;
}*/

.learn .tab-text {
        padding: 0px 248px;
        text-align: center;
        padding-bottom: 50px;
    }

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover,
.nav-tabs .nav-link {
    border:0px solid transparent;
}

a.nav-link:hover {
    color:#ef7f29;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition:.5s;
}

.navbar-brand {
    width:260px;
}

.nav-tabs .nav-item {
    display: inline-block;
}

.learn .nav-tabs a.active {
    background:transparent;
    color:#fff;
    border:0px solid transparent;
}

.learn .nav-tabs a img {
    visibility:hidden;
    float: left;
    margin-top: 7px;
    position: relative;
    left: -5px;
    width: 6px;
}

.learn .nav-tabs a.active img {
    visibility:visible;
}

.nav-tabs-container {
    /*margin: 45px auto 45px;
    text-align: center;*/
    margin: auto;
    max-width: 1024px;
    margin-top: 45px;
    margin-bottom: 45px;
    text-align: center;
}

.learn .feature-image {
    text-align: center;
}

.learn .feature-image-mobile {
    display: none;
}

.tabs-container {
   /* height:630px;*/
}

.export-cta-position {
    padding-top: 10px;
}

.export-cta-padding {
    position: absolute;
    left: 50%;
    margin-left: -65px;
}

.export-cta {
   /* float: right;*/
    color: #ffffff;
    padding-top: 0px;
    background: #46a4bf;
    padding: 5px 10px;
    background-image: url('/go/assess/about/files/pdf-icon.png');
    background-repeat: no-repeat;
    background-position-x: 109px;
    background-position-y: 7px;
    width: 131px;
    text-align: left;
}

.export-cta span {
    font-size: 14px;
}

.export-cta a {
    color: #ffffff;
}

.export-cta:visited {
    color: #ffffff;
}


.export-cta:hover {
    background: #53bedd;
    background-image: url('/go/assess/about/files/pdf-icon.png');
    background-repeat: no-repeat;
    background-position-x: 109px;
    background-position-y: 7px;
    width: 131px;
    text-align: left;
}

/* End of learn feature page */

.animation-element {
    opacity: 0;
    position: relative;
}
/*animation element sliding left*/

.animation-element.slide-left {
    opacity: 0;
    -moz-transition: all 500ms linear;
    -webkit-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
    -moz-transform: translate3d(-100px, 0px, 0px);
    -webkit-transform: translate3d(-100px, 0px, 0px);
    -o-transform: translate(-100px, 0px);
    -ms-transform: translate(-100px, 0px);
    transform: translate3d(-100px, 0px, 0px);
}

.animation-element.slide-left.in-view {
    opacity: 1;
    -moz-transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    transform: translate3d(0px, 0px, 0px);
}
/*animation slide left styled for testimonials*/

.animation-element.slide-left.testimonial {
    float: left;
    width: 47%;
    margin: 0% 1.5% 3% 1.5%;
    background: #F5F5F5;
    padding: 15px;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
    border: solid 1px #EAEAEA;
}
.animation-element.slide-left.testimonial:hover,
.animation-element.slide-left.testimonial:active{
    box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.25);
}

.animation-element.slide-left.testimonial:nth-of-type(odd) {
    width: 48.5%;
    margin: 0% 1.5% 3.0% 0%;
}

.animation-element.slide-left.testimonial:nth-of-type(even) {
    width: 48.5%;
    margin: 0% 0% 3.0% 1.5%;
}

.animation-element.slide-left.testimonial .header{
    float: left;
    width: 100%;
    margin-bottom: 10px;
}
.animation-element.slide-left.testimonial .left{
    float: left;
    margin-right: 15px;
}
.animation-element.slide-left.testimonial .right{
    float: left;
}

.animation-element.slide-left.testimonial img {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    box-shadow: 0px 1px 3px rgba(51, 51, 51, 0.5);
}

.animation-element.slide-left.testimonial h3 {
    margin: 0px 0px 5px 0px;
}

.animation-element.slide-left.testimonial h4 {
    margin: 0px 0px 5px 0px;
}

.animation-element.slide-left.testimonial .content {
    float: left;
    width:100%;
    margin-bottom: 10px;
}

.animation-element.slide-left.testimonial .rating{}

.animation-element.slide-left.testimonial i {
    color: #aaa;
    margin-right: 5px;
}

.fade-in {
    opacity:0;
}



/*media queries for small devices*/
@media screen and (max-width: 678px){
    /*testimonials*/
    .animation-element.slide-left.testimonial,
    .animation-element.slide-left.testimonial:nth-of-type(odd),
    .animation-element.slide-left.testimonial:nth-of-type(even){
        width: 100%;
        margin: 0px 0px 20px 0px;
    }
    .animation-element.slide-left.testimonial .right,
    .animation-element.slide-left.testimonial .left,
    .animation-element.slide-left.testimonial .content,
    .animation-element.slide-left.testimonial .rating{
        text-align: center;
        float: none;
    }
    .animation-element.slide-left.testimonial img{
        width: 85px;
        height: 85px;
        margin-bottom: 5px;
    }

}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {
    h2 { margin-top:30px; }
    #feature-row, #faq-row, #cta-row, #pricing-row, #trial-row, #price-row, #product-breakdown,
    #overview-row { padding:60px 0; }
    .image-container {
        height:250px;
    }
    .faded-strip {
/*        background:rgba(255,255,255,0.9);*/
    background-color:#34373C;
    }
    .navbar-collapse .nav-item {
        margin-bottom:15px;
    }
    .cii {
        margin-bottom:15px;
    }
    .biba {
        margin-top:15px;
    }
    body, p, a {
        font-size:14px;
    }
    .navbar-brand {
        width:165px;
    }
}

/*bounce up animation for the subject*/

.bounce-up {
    opacity: 0;
    -moz-transition: all 700ms ease-out;
    -webkit-transition: all 700ms ease-out;
    -o-transition: all 700ms ease-out;
    transition: all 700ms ease-out;
    -moz-transform: translate3d(0px, 200px, 0px);
    -webkit-transform: translate3d(0px, 200px, 0px);
    -o-transform: translate(0px, 200px);
    -ms-transform: translate(0px, 200px);
    transform: translate3d(0px, 200, 0px);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
}

.bounce-up.in-view {
    opacity: 1;
    -moz-transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    transform: translate3d(0px, 0px, 0px);
}

.subject {
    float: left;
    width: 100%;
    margin: 0% 1.33% 2.66% 1.33%;
    background: #F5F5F5;
    padding: 15px;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
    border: solid 1px #EAEAEA;
}

.subject:hover,
.subject:active {
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.25);
}

.subject .header {
    margin: 8px 0px;
}

.subject .header .date,
.subject .header .category {
    margin: 0px;
    clear: none;
    width: 50%;
}

.subject .header .date i,
.subject .header .category i {
    margin-right: 5px;
    color: #333;
    -moz-transition: all 400ms linear;
    -webkit-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    transition: all 400ms linear;
}

.subject .header .date {
    float: left;
    text-align: left;
}

.subject .header .category {
    float: right;
    text-align: right;
}
/*subject icon at top*/

.subject .icon {
    position: absolute;
    top: -20px;
    left: 50%;
    left: calc(50% - 20px);
}

.subject .icon i {
    width: 40px;
    height: 40px;
    color: rgb(255, 255, 255);
    font-size: 150%;
    border-radius: 50%;
    text-align: center;
    padding: 7px;
}
/*Category color / icon color*/

.subject .category-color {
    height: 7px;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}

.subject.design .category-color,
.subject.design .icon i {
    background: #c0392b;
}

.subject.development .category-color,
.subject.development .icon i {
    background: #16a085;
}

.subject.photography .category-color,
.subject.photography .icon i {
    background: #2980b9;
}
/*hovering over subject*/

.subject.development:hover .header i {
    color: #16a085;
}

.subject.design:hover .header i {
    color: #c0392b;
}

.subject.photography:hover .header i {
    color: #2980b9;
}

.subject .title {
    margin: 12px 0px;
    border-bottom: dashed 1px #ccc;
    padding-bottom: 10px;
}

.subject .content {
    margin-bottom: 8px;
}

.subject .enrole {
    position: relative;
    color: #333;
    padding: 5px 12px;
    cursor: pointer;
    float: right;
    display: inline-block;
    border: solid 1px #ccc;
    -moz-transition: all 400ms linear;
    -webkit-transition: all 400ms linear;
    -o-transition: all 400ms linear;
    transition: all 400ms linear;
}

.subject .enrole:hover,
.subject .enrole:active {
    background: #222;
    color: #fff;
}

#overview-row.container {
    width:1020px;
}


/*media queries for small devices*/

@media screen and (max-width: 678px) {
    .main-container {
        margin: 20px 15px;
    }
    .animation-element,
    .animation-element:nth-of-type(3n-1),
    .animation-element:nth-of-type(3n-2),
    .animation-element:nth-of-type(3n-0) {
        width: 100%;
        margin: 0px 0px 30px 0px;
    }
    .subject .header .date,
    .subject .header .category {
        width: 100%;
        margin-bottom: 10px;
        text-align: center;
    }

    .navbar-brand {
        width:160px;
    }

    .pricing.containing-image,
    .trial.containing-image,
    .containing-image {
        background-attachment:local;
        background-size:initial;
    }

    .scroll-to {
        bottom:15%;
    }

    .learn .row,
    #overview-row .row {
        margin-left:initial;
        margin-right:initial;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767px) {
    .trial-block {
        margin-top: 60px;
    }
    .faded-strip {
/*        background:rgba(255,255,255,0.9);*/
    background-color:#34373C;
    }
    .navbar-collapse .nav-item {
        margin-bottom:15px;
    }
    .image-container {
        height: 250px;
    }
    body, p, a {
        font-size:16px;
        line-height: 26px;
    }
    .navbar-brand {
        width:160px;
    }
    .modal-content .col-10,
    .modal-content input,
    .modal-content label {
        max-width:100%;
        width:100%;
        /* -webkit-box-flex: 0; */
        -webkit-flex: initial;
        -ms-flex: initial;
        /* flex: 0 0 83.333333%; */
    }

    .form-check-label .form-check-input {
        width: 30px;
    }

    .navbar-toggleable-md {
        padding-top:5px;
        padding-bottom:10px;
    }

    .bottom-image .col-md-6 {
        margin-bottom:45px;
    }

    .bottom-image .col-md-6:last-child {
        margin-bottom:0;
    }

    .trial-text {
        height: 190px;
    }
   /* .feature-text-container {
        height:80px!important;
    }*/
    .trial-text:nth-child(2) {
        height: 150px;
    }
    #overview-row .cpd-overview, #overview-row .cpd-activities, #overview-row .cpd-status {
        margin-bottom:30px;
    }

    #overview-row .cpd-overview img,
    #overview-row .cpd-activities img,
    #overview-row .cpd-status img {
        margin-top:30px;
    }

    #nav-icon4 {
        margin:11px auto;
    }
    #price-row .col-sm-12 {
        margin-bottom:30px;
    }

    #price-row .col-sm-12:last-child {
        margin-bottom:0;
    }

    .bottom-image .col-sm-12 {
        margin-bottom:60px;
    }

    .bottom-image .col-sm-12:last-child {
        margin-bottom:0;
    }

    .learn .sub-heading {
        font-size:16px;
    }

    .nav-tabs .nav-item {
        width:100%;
    }

   /* .learn .tab-text {
        padding:0 15px;
    }*/

    .learn .tab-text {
        padding: 0px 248px;
        text-align: center;
        padding-bottom: 50px;
    }

    .learn .nav-tabs a img {
        float: initial;
        margin-top: -2px;
        position: relative;
        left: -5px;
        width: 6px;
    }

    .bottom-text-container {
        height: 160px!important;
    }

    .center-promo {
        padding-left: 0%;
        padding-right: 0%;
    }

}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991px) {
    .faded-strip {
/*        background:rgba(255,255,255,0.9);*/
    background-color:#34373C;
    }
    .navbar-collapse .nav-item {
        width: 60%;
        margin: 0 auto 15px;
    }
    .trial-text {
        height:228px;
    }

  /*  #trial-row .col-sm-12:last-child .trial-text {
        height:150px;
    }*/

    .bottom-text-container {
        height: 180px;
    }

    .feature-panel { margin-bottom:45px; }

    #features h2 { margin-top:60px; }

    #feature-row, #faq-row, #cta-row, #pricing-row, #price-row, #trial-row, #product-breakdown, #overview-row {
        padding:60px 0;
    }


    .info-panel { margin-top: 35px; margin-bottom:35px; }

    #info h2 { margin-top:60px; }

    #info-row, #faq-row, #cta-row, #pricing-row, #price-row, #trial-row, #product-breakdown, #overview-row {
       /* padding:60px 0;*/
    }



    #pricing-row {
        padding:60px 0 30px;
    }

    #faq-row {
        padding:45px 0 60px;
    }

    .feature-text-container {
       /* height:190px;*/
    }

    #cta-row .col-sm-12 {
        margin-bottom:45px;
    }

    #cta-row .col-sm-12:last-child {
        margin-bottom:0;
    }

    .cii {
        margin-bottom:20px;
    }

    .biba {
        margin-top:15px;
    }

    .tabs-container {
        /*height: 515px;*/
    }

    .feature-text-container {
      /*  height:110px!important;*/
    }

    .pricing.containing-image,
    .containing-image {
        background-attachment:initial;
    }
}
/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199px) {

    .learn .tab-text {
        padding:0 135px;
        text-align: center;
        padding-bottom: 50px;
    }

    .navbar-brand {
        width:160px;
    }
}

@media screen and (min-width: 320px) and (max-width:580px ) {
    .feature-text-container {
        /*height:80px!important;*/
    }
    #product-breakdown .row {
        margin-left:0;
        margin-right:0;
    }
}

/* Bit of a hack */
@media screen and (min-width:768px) and (max-width:1199px) {
    .bottom-image h4 {
        height:40px;
    }
}

@media (max-width: 1199px) { #overview-row.container {width:850px;} }
@media (max-width: 1090px) { #overview-row.container {width:100%; padding-left: 20px; padding-right: 20px;} }
@media (max-width: 845px) { #overview-row.container {width:100%; padding-left: 20px; padding-right: 20px;} }
@media (max-width: 768px) { 
    .nav-item {
        margin: 0;
    }
    .learn .tab-text {
        padding: 0px;
        text-align: center;
        padding-bottom: 50px;
    }
    .learn .sub-heading {
        font-size: 16px;
        line-height: 26px;
    }
}
@media (max-width: 766px) {
  /*  .feature-image {
        display: none;
    }

    .learn .feature-image-mobile {
        display: inline-block;
    }*/
    .nav-tabs-container {
        text-align: left;
    }
}

div.above-footer {
    page-break-before: always;
}

div.seven {
    page-break-before: always;
}


@media (max-width: 450px) {
.icon-arrow {
    display: inline-block !important;
}

}