﻿
.summary_block {
    position: relative;
    border: 1px solid #ddd;
    margin-bottom: 10px;
    -moz-box-shadow: 0 0 4px #eee;
    -webkit-box-shadow: 0 0 4px #eee;
    box-shadow: 0 0 4px #eee;
    clear: both;
    min-height: 10px;
}

    .summary_block .inner {
        position: relative;
        padding: 20px 260px 20px 20px;
        border: 1px solid white;
        background: #F6F6F6;
        background: -webkit-gradient(linear, 0 0, 0 100%, from(#FCFCFC), to(#F0F0F0));
        background: -moz-linear-gradient(100% 100% 90deg, #F0F0F0, #FCFCFC);
        clear: both;
    }

        .summary_block .inner.noimg {
            padding-right: 20px;
        }

            .summary_block .inner.noimg p.rightimg {
                padding-right: 260px;
            }

        .summary_block .inner.noexpand {
            padding-bottom: 10px;
        }

    .summary_block h2 {
        margin-top: 0px;
        font-size: 20px;
    }

    .summary_block p.summarytext,
    .intro_block p.summarytext {
        font-size: 1.25rem;
        line-height: 1.5em;
    }

    .summary_block .fullwidth {
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        line-height: 0px;
    }

    .summary_block .note {
        padding: 5px 20px;
        border: 1px solid white;
        background: #F6F6F6;
        background: -webkit-gradient(linear, 0 0, 0 100%, from(#FCFCFC), to(#F0F0F0));
        background: -moz-linear-gradient(100% 100% 90deg, #F0F0F0, #FCFCFC);
        clear: both;
    }


.main_top {
    margin-top: -20px;
}


.img_boxed {
    padding: 6px;
    background-color: White;
    border: 1px solid #ddd;
}

.key_image {
    position: absolute;
    right: 10px;
    top: 10px;
    padding: 6px;
    background-color: White;
    border: 1px solid #ddd;
}


div.info_block {
    margin: 0 0 20px 0;
    clear: both;
    overflow: auto;
}

div.bordered_block {
    margin: 0 0 20px 0;
    clear: both;
    overflow: auto;
    border: 1px solid #e4e4e4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
}

div.bordered_block_bg {
    margin: 0 0 20px 0;
    padding: 20px;
    clear: both;
    overflow: hidden;
    border: 1px solid #e4e4e4;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fafafa), to(#dddddd) );
    background: -moz-linear-gradient(top, #fafafa 5%, #dddddd);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fafafa', endColorstr='#dddddd');
}

div.info_block h2:first-child {
    margin-top: 0px;
}

.bordered_block h3 {
    margin-top: 1em;
}



.summary_block .inner .half_width {
    width: 335px;
    min-height: 10px;
    position: relative;
}



/* ---  intro_block - key features  --- */

div.intro_block {
    margin: 20px 0 30px 0;
}

    div.intro_block h3 {
        color: #000;
    }





#keypoints {
}

    #keypoints.alignright {
        margin: -10px 15px 20px 60px;
        width: 290px;
        float: right;
    }

    #keypoints div.featureheader .rightcol {
        float: right;
        padding: 0 0 5px 100px;
    }

    #keypoints div.feature {
        padding: 5px 0px 5px 0px;
        border-bottom: 1px solid #e4e4e4;
        clear: both;
        overflow: auto;
    }

    #keypoints.noborder div.feature {
        border-bottom: none;
        padding: 10px 0;
    }

    #keypoints div.feature h3,
    #keypoints div.feature h3 a {
        margin: 0em;
        font-size: 14px;
        line-height: 1.4em;
        padding-top: 3px;
        color: #666;
    }

        #keypoints div.feature h3,
        #keypoints div.feature h3 a {
            color: #08c;
        }

    #keypoints.dark div.feature h3,
    #keypoints.dark div.feature h3 a {
        color: #000;
    }

    #keypoints div.feature p {
        margin: 0em;
        padding-top: 3px;
    }

    #keypoints div.feature.leftcol p {
        margin-left: 44px;
    }

    #keypoints div.feature .rightcol,
    #keypoints div.feature.rightcol span.tick,
    #keypoints div.feature.rightcol span.tickgrey,
    #keypoints div.feature.rightcol span.box,
    #keypoints div.feature.rightcol span.cross {
        float: right;
    }

    #keypoints div.feature .leftcol,
    #keypoints div.feature.leftcol span.tick,
    #keypoints div.feature.leftcol span.tickgrey,
    #keypoints div.feature.leftcol span.box,
    #keypoints div.feature.leftcol span.cross {
        float: left;
    }
    
  

.full_width {
    width: auto !important;
}


/* ---  expand  --- */

.sec_exp_about {
    display: inline-block;
    min-width: 100px;
    background: #e3e3e3;
    border: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -moz-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -ms-box-shadow: inset 0 0 1px 1px #f6f6f6;
    -o-box-shadow: inset 0 0 1px 1px #f6f6f6;
    box-shadow: inset 0 0 1px 1px #f6f6f6;
    color: #333;
}

    .sec_exp_about:hover {
        color: #222;
        border: 1px solid #3c7fb1;
        background: #eaf6fd; /* #d9d9d9 */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaf6fd', endColorstr='#afdef8');
        background: -webkit-gradient(linear, left top, left bottom, from(#eaf6fd), to(#afdef8));
        background: -webkit-linear-gradient(top, #eaf6fd, #afdef8);
        background: -moz-linear-gradient(top, #eaf6fd, #afdef8);
        background: -ms-linear-gradient(top, #eaf6fd, #afdef8);
        background: -o-linear-gradient(top, #eaf6fd, #afdef8);
        background: linear-gradient(top, #eaf6fd, #afdef8);
        cursor: pointer;
        color: #222;
        cursor: pointer;
    }

    .sec_exp_about p {
        margin: 0;
        padding: 0 10px 0 22px;
        height: 20px;
        line-height: 20px;
        font-size: 12px;
    }

        .sec_exp_about p.collapsed {
            background-image: url(/images/arrow_down.png);
            background-position: 7px 7px;
            background-repeat: no-repeat;
        }

        .sec_exp_about p.expanded {
            background-image: url(/images/arrow_up.png);
            background-position: 7px 7px;
            background-repeat: no-repeat
        }





/* --------------- detail_block ------------------ */


.detail_block {
    margin: 0 0 50px 0;
    overflow: hidden;
}

    .detail_block .half_width {
        width: 335px;
        min-height: 10px;
        position: relative;
        margin: 0 20px 10px 20px;
    }

    .detail_block .full_width {
        width: 720px;
        min-height: 10px;
        position: relative;
        margin: 0 20px 10px 20px;
        clear: both;
        overflow: hidden;
    }


    .detail_block.bordered {
        padding: 20px;
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        margin-top: -10px;
        margin-bottom: 10px;
        clear: both;
        overflow: hidden;
        position: relative;
    }

        .detail_block.bordered.nopadding {
            padding: 0px;
        }

        .detail_block.bordered h2:first-child {
            margin: 0px;
        }

    /* --------------- detail_block.features ------------------ */


    .detail_block.features {
        padding: 0px;
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        margin-top: -10px;
    }

        .detail_block.features h2 {
            margin-bottom: 16px;
            font-size: 20px;
        }

        .detail_block.features h3 {
            font-weight: bold;
        }



/* MOBILE SITE */
@media screen and (max-width: 960px) {
    .mob .summary_block .inner,
    .mob .summary_block .inner.noimg {
        padding: 10px 5px 20px 5px;
    }

        .mob .summary_block .inner.noexpand {
            padding-bottom: 10px;
        }

    .mob .detail_block.bordered {
        padding: 20px 5px 20px 5px;
    }

        .mob .detail_block.bordered h2:first-child {
            margin-top: 0em;
        }

    .mob .detail_block.features {
        margin-top: 0px;
    }

        .mob .detail_block.features .section,
        .mob .detail_block .full_width,
        .mob .detail_block .half_width {
            padding: 10px 5px 20px 5px;
            margin: 0px;
            width: auto;
        }

    .mob .img_boxed {
        padding: 0px;
    }

    .mob .key_image {
        position: inherit;
        right: auto;
        top: 0px;
        left: 0px;
        margin-bottom: 10px;
        padding: 0px;
    }

    .mob .summary_block .inner.noimg p.rightimg {
        padding: 0px;
    }

    .mob #keypoints.alignright {
        margin: 20px 5px 5px 5px;
        width: auto;
        float: none;
    }

    .mob div.bordered_block_bg {
        padding: 5px;
        background: none;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        -o-border-radius: 0px;
        border-radius: 0px;
    }

    .mob .main_top {
        margin-top: inherit;
    }
}
