/*@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');*/

* {
    font-family: 'Helvetica-Light', Arial, 'Roboto-Regular', Sans-Serif;
    /*font-family: 'Roboto', sans-serif!important;*/
    border-radius:2px!important;
}

body {
    background-image: none;
}

:focus {
    outline: none;
}

a {
    color: rgb(78,75,74);
}


a:hover, a:focus, a.current {
    /*color: #65a729!important;*/
    color: rgb(78,75,74) !important;
}

.Rtf a {
    color: rgb(78,75,74);
}

.green {
    /*color: #65a729;*/
    color: rgb(78,75,74);
}

button {
    font-size: 1.2rem;
    border: 1px solid rgb(78,75,74);
    background-color: rgb(78,75,74);
    padding: 10px 15px;
}

/* BUTTONS */
.button {
    font-size: 1.2rem;
    /*background-color: #65a729;*/
    background-color: rgb(78,75,74);
    border-radius: 5px !important;
    padding: 10px 15px;
}

    button:hover, button:focus, .button:hover, .button:focus {
        background-color: rgb(78,75,74);
        /*background-color: #65a729;*/
        color: white !important;
    }

    .button.green {
        /*background-color: #65a729;*/
        background-color: rgb(78,75,74);
        color: #ffffff;
    }

    .button.round {
        border-radius: 5px;
    }

    .button.video-button {
        padding: 9px;
        padding-bottom: 14px;
        padding-left: 2rem;
        padding-right: 2rem;
    }


    input, select, input:hover, select:hover {
        background-color: white;
    }


        input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus,
        input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus,
        input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus,
        input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus,
        input[type="url"]:focus, textarea:focus {
            background: white;
            border-color: #ccc;
            outline: none;
            -webkit-box-shadow: none;
            box-shadow: none;
        }

        input[type="text"], input[type="password"],
        input[type="date"], input[type="datetime"],
        input[type="datetime-local"], input[type="month"],
        input[type="week"], input[type="email"], input[type="number"],
        input[type="search"], input[type="tel"], input[type="time"],
        input[type="url"], textarea {
            -webkit-appearance: none;
            background-color: #fff;
            font-family: inherit;
            border: 1px solid #ccc;
            -webkit-box-shadow: none;
            box-shadow: none;
            color: rgba(0,0,0,0.75);
            display: block;
            font-size: 0.875rem;
            margin: 0 0 1rem 0;
            padding: 0.5rem;
            height: 2.3125rem;
            width: 100%;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            -webkit-transition: -webkit-box-shadow 0.45s,border-color 0.45s ease-in-out;
            -moz-transition: -moz-box-shadow 0.45s,border-color 0.45s ease-in-out;
            transition: box-shadow 0.45s,border-color 0.45s ease-in-out;
        }

    a.navibutton {
        border-radius: 15px;
        background-image: none;
        /*background-repeat: repeat-x;*/
        background-color: rgb(78,75,74);
        color: #fff !important;
        text-decoration: none !important;
        padding: 0px 18px 0px 18px;
        font-size: 14px;
        margin-right: 7px;
        line-height: 24px;
        display: inline-block;
        margin-bottom: 10px;
    }

    ol > li:before {
        position: absolute;
        top: 0px;
        left: -30px;
        width: 25px;
        padding-top: 2px;
        height: 25px;
        text-align: center;
        color: #fff;
        border-radius: 20px;
        background-color: rgb(78,75,74);
        content: counter(li-counter);
        counter-increment: li-counter;
    }

    /* FLAGS */
    .header .web-languages a {
        margin: 20px 4px 0 0;
    }



    .menu-btn {
        display: inline-block;
        /*background-color: #f7f7f7;*/
        color: white;
        border-radius: 5px;
        font-size: 1.2rem !important;
    }

    /* HEADER MENU */
    .top-header {
        max-width: 1400px;
    }

    .header {
        min-height: 90px;
        margin: 0 auto 20px auto;
        z-index: 8000;
        position: relative;
    }

        .header .logo {
            width: 88px;
            height: 105px;
            display: block;
            background: url('/Theme/gfx/tropica-grey-logo-2019.png') no-repeat;
            margin: 15px 0 0 0;
            opacity: 1;
            background-size: contain;
        }

        .header .web-topmenu {
            text-align: left;
            padding-top: 0;
            padding-bottom: 30px;
        }

            .header .web-topmenu a {
                display: inline-block;
                margin: 10px 0;
                padding: 10px 15px;
                font-size: 20px;
                font-family: 'Helvetica-Light', Arial, 'Roboto-Regular', Sans-Serif;
                /*font-weight: 300;*/
            }

            .header .web-topmenu .inline {
                display: inline-block;
                /*padding-top:4px;*/
            }

                .header .web-topmenu .inline.right {
                    float: right;
                    /*padding-top:0;*/
                }

        .header .topsearchbox {
            max-width: 50%;
            height: 20px;
            border: 0px;
            -webkit-border-radius: 0;
            border-radius: 0;
            padding: 15px 0;
            margin: -25px 0 0 15px;
            background: transparent;
            -webkit-transition: all 300ms linear;
            -ms-transition: all 300ms linear;
            transition: all 300ms linear;
        }

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

        .header .topsearchbox {
            max-width: 92%;
            height: 20px;
            border: 0px;
            -webkit-border-radius: 0;
            border-radius: 0;
            padding: 15px;
            margin: 15px 0 15px 15px;
            background: transparent;
            -webkit-transition: all 300ms linear;
            -ms-transition: all 300ms linear;
            transition: all 300ms linear;
            border-bottom: 1px solid lightgray;
        }
    }

    .header .topsearchbox:focus {
        background: rgba(255,255,255,0.4);
        padding-left: 15px;
    }

    .center-align-content {
        position: relative;
        float: left;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    /* FRONTPAGE */
    .frontpage .header {
        height: calc(100vh);
        background-repeat: no-repeat;
        background-position: top center;
        border: none;
        border-radius: 0;
        margin: 0;
        position: relative;
        text-align: left;
        padding: 0px;
        padding-top: calc(20vh);
        /*padding-top: calc(30vh - 130px);*/
        margin-top: -130px;
        z-index: 1;
    }

        .frontpage .header h2 {
            font-size: 26pt;
            margin-top: 10px;
            padding-top: 0px;
            margin-bottom: 20px;
        }

    .frontpage .wrapper-front {
        max-width: 1200px;
        margin: 0 auto;
    }

        .frontpage .wrapper-front.padding {
            padding: 100px 0 0 0;
        }

    /* BG COLORS */
    .bg-grey {
        background-color: rgb(78,75,74);
        color: white;
    }



    /* Layout List */
    .layout-list .layout-item .title {
        padding-top: 10px;
        font-weight: normal;
        font-size: 1.2rem;
    }

    .layout-list .layout-item .image {
        margin-bottom: 10px;
        border: none;
        border-radius: 2px;
        background-color: #f7f7f7;
        width: 100%;
        min-height: 150px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        height: 150px;
    }


    .layout-list .layout-item {
        margin-bottom: 0;
        min-height: 260px;
    }

    /* Video TABS */
    .video-tabs {
        overflow: hidden;
        margin-bottom: 40px !important;
    }

    .video-image {
        display: grid;
        margin-bottom: 10px;
        border: none;
        border-radius: 2px;
        background-color: #f7f7f7;
        width: 100%;
        min-height: 360px;
        height: auto;
        background-size: cover;
    }

    .video-overlay {
        position: relative;
        height: 100%;
        width: 100%;
        margin-top: -80px;
    }

    .video-tabs .video-overlay {
        margin-top: 0;
    }

    .video-tabs .text-center {
        min-height: 40px;
    }

    .video-icon {
        display: inline-block;
        width: 30px;
        height: 30px;
        margin-bottom: -10px;
        background-image: url('/theme/gfx/video-grey.png');
        background-position: center;
        background-size: contain;
    }

    .video-icon-button {
        display: inline-block;
        width: 30px;
        height: 30px;
        margin-bottom: -10px;
        background-image: url('/theme/gfx/video-white.png');
        background-position: center;
        background-size: contain;
    }


    .video-img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        display: block;
        width: 100px;
        height: 100px;
        background-image: url('/theme/gfx/video-white.png');
        background-position: center;
        background-size: contain;
    }

    .video-img-small {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        display: block;
        width: 50px;
        height: 50px;
        background-image: url('/theme/gfx/video-white.png');
        background-position: center;
        background-size: contain;
    }
    /*image img{
    clear:both;
}

.image img.center {
    position: relative;
    float: left;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}*/

    .plant-details .mainimage {
        border: none;
    }

    .plant-list .plant-item {
        border-bottom: none;
        margin-bottom: 15px;
    }

        .plant-list .plant-item .plant-description {
            height: auto;
        }

    .dealer-list .dealer-item a {
        color: rgb(78,75,74);
    }

    .article-list .article-item .link {
        color: rgb(78,75,74);
    }

    /* Content */
    .contentBox {
        background-color: white !important;
    }

    /*.contentBox:hover {
        box-shadow: 0 0 20px #f7f7f7;
        border: 1px solid #f7f7f7;
    }*/



    /* FOOTER */
    .footer {
        width: 100%;
        min-height: 300px;
        height: auto;
        /*background: #f7f7f7;*/
        background: white;
        position: relative;
        border-top: rgb(78,75,74) solid 1px;
    }

        .footer .footerwrapper {
            background: white;
            max-width: 1200px;
            min-height: 1px;
            margin: 0 auto;
            padding: 40px 15px 0 15px;
        }


    /* LOGIN */

    body.loginPage {
        background: url('/Theme/gfx/green-aqua-finish.jpg') no-repeat top center;
        background-size: cover;
    }

        body.loginPage .loginform {
            background-color: rgba(255,255,255,0.8);
            margin-right: 40px;
            padding: 0 20px;
            box-sizing: border-box;
        }

            body.loginPage .loginform table {
                width: 100%;
            }

        body.loginPage .helpform {
            background-color: rgba(255,255,255,0.8);
            padding-top: 20px;
            box-sizing: border-box;
        }



    .loginControl {
        margin-bottom: 0;
    }

        .loginControl input[type=text], .loginControl input[type=password] {
            height: 30px;
            padding: 5px;
            border: 1px solid #999;
            background-color: transparent;
            border-radius: 5px;
            width: 100%;
        }

        .loginControl input[type=submit] {
            height: auto;
            padding: 10px 15px;
            border: 1px solid rgb(78,75,74);
            width: 100px;
        }

    .contentLogin .loginHelp {
        background-color: transparent;
        border-radius: 10px;
        padding: 20px;
        overflow: auto;
    }

    .loginControl .buttonfield {
        margin-top: 0px;
    }

    .plant-search {
        padding: 10px;
    }

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}