/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

        .grid-system-demo-live .row {
                padding-bottom: 0;
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .h1,
        .h2,
        .h3,
        .h4,
        .h5,
        .h6 {
                font-family: inherit;
                color: #3aa2b9;
                margin: 0;
                letter-spacing: 0.5px;
        }

        h5 {
                font-size: 14px;
                font-style: normal;
                font-weight: 600;
                text-transform: uppercase;
                line-height: 24px;
                letter-spacing: 1px;
                margin-bottom: 20px;
        }

        a[href*='https://']:after {
                background: url(../images/images.png) 0 -32px no-repeat;
                content: '';
                display: inline-block;
                width: 15px;
                height: 12px;
                margin: 2px 0 0 4px;
        }

        a {
                color: #3aa2b9;
                text-decoration: none;
        }

        a:hover,
        a:focus {
                color: #286f7f;
                text-decoration: underline;
        }

        a:focus {
                outline: thin dotted;
                outline: 5px auto -webkit-focus-ring-color;
                outline-offset: -2px;
        }

        ol,
        ul {
                padding-left: 0.5rem;
        }

        ol li {
                margin-bottom: 1em;
        }

        #page-content ul li {
                background: url(../images/images.png) -100px -14px no-repeat;
                padding-left: 30px;
                list-style-type: none;
        }

        #topbar .top-menu {
                float: right;
        }

        #topbar.dark {
                background: rgb(255, 255, 255);
                background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(230, 241, 244, 1) 75%);
                border-color: rgba(230, 241, 244, 0.25);
                border-radius: 0.42rem 0.42rem 0.42rem 0.42rem;
        }

        #topbar.topbar-dark .top-menu>li>a,
        #topbar.topbar-dark .social-icons li a,
        #topbar.dark .top-menu>li>a,
        #topbar.dark .social-icons li a {
                color: #256472 !important;
        }

        #mainMenu nav>ul>li>a {
                color: #3aa2b9;
        }

        #mainMenu nav>ul>li:hover>a,
        a:not(.btn):not(.badge):hover {
                color: #256472;
                text-decoration: underline;
        }

        button.btn,
        .btn:not(.close):not(.mfp-close),
        a.btn:not([href]):not([tabindex]),
        .heading-text.heading-section h2:before {
                background-color: #3aa2b9;
                border-color: #3aa2b9;
        }

        button.btn:hover,
        button.btn:focus,
        button.btn:not(:disabled):not(.disabled):active,
        button.btn:not(:disabled):not(.disabled).active,
        .btn:not(.close):not(.mfp-close):hover,
        .btn:not(.close):not(.mfp-close):focus,
        .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled):active,
        .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled).active,
        a.btn:not([href]):not([tabindex]):hover,
        a.btn:not([href]):not([tabindex]):focus,
        a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled):active,
        a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled).active {
                background-color: #256472;
                border-color: #256472;
                color: #fff;
                text-decoration: none;
        }

        #footer .copyright-content {
                background: rgb(255, 255, 255);
                background: linear-gradient(270deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(230, 241, 244, 1) 75%);
                border-radius: 0.42rem 0.42rem 0.42rem 0.42rem;
        }

        #footer,
        .clain {
                background-color: #ffffff;
                margin: 0;
        }

        .clain+.clain {
                margin-top: 0;
        }

        .clain .description {
                position: absolute;
                right: 20px;
                top: 10%;
                margin: 0;
        }

        .clain .description h2 {
                font-size: 28px;
        }

        .clain .description p {
                font-size: 22px;
                color: #3aa2b9;
        }

        .clain img {
                width: 100%;
        }

        @media (max-width: 767px) {

                .clain .description h2,
                .clain .description p,
                .clain .description {
                        font-size: 12px;
                        line-height: 1.2em;
                        right: 5px;
                        top: 0;
                        padding: 0;
                        margin: 0;
                }
        }

        address {
                line-height: 1.5em;
        }

        #footer h5 {
                margin: 20px 0 0 0;
        }

        #scrollTop:after {
                background-color: #3aa2b9;
        }

        .widget a {
                color: #3aa2b9;
                text-decoration: underline;
        }

        .post-thumbnail-entry a {
                text-decoration: underline;
        }

        .small {
                font-size: 80%;
        }