.os-doc-container{display:grid;margin-bottom:20px}
.os-doc-detail {margin-top: 30px;padding-bottom: 40px;margin-bottom: 20px;background-color:#eee;padding:10px;display:flex;}
.os-doc-detail ul {list-style: disc;}
.os-doc-detail ul li {margin-left: 25px;}
.os-doc-detail iframe {width: 100%;height: 700px;margin-bottom: 15px;}
.os-doc-tags{color: grey;font-size: 13px;}
.od-doc-results {margin-top: 20px;}
.od-doc-results ul {list-style: none;}
.od-doc-results ul li {border-bottom: dotted;padding: 10px 0px 25px;margin-bottom: 5px;}
.od-doc-label label {font-weight: bold;padding: 5px 0px 10px;}
.od-doc-filteroptions span {padding-left: 4px;}
.od-doc-category{margin-left:15px;}
.od-doc-searchbox {width: 65%;float: left;position:relative;}
.od-doc-filteroptions {width: 35%;float: left;padding-top:8px;text-align:center;}
.od-doc-btn {background-color: #c81432;color: #fff;border: none;float: left;margin: 0;padding: 12px 15px;border-radius: 0 5px 5px 0 !important;}
.od-doc-catbox {background-color: #26bd38;color: #fff;display: table;margin-top: 10px;padding: 5px;}
.od-doc-catbox.hplc {background: #7a8bf2;border-color: #7a8bf2;}
.od-doc-keyword {width: 400px;}
.od-doc-suggest-dropdown {margin:42px 0px 0px 2px !important}
input[type="search"].od-doc-keyword,
input[type="text"].od-doc-keyword {width: calc(100% - 50px);float: left;height: 41px;border: 1px solid #ddd;padding: 8px;vertical-align: middle;box-shadow: none;background-color:#fff;}
.bottomBorderRow {width: 100%;float: left;padding: 15px 0;margin: 10px 0;border-bottom: 1px solid #ccc;}
span.clearSearch {position: absolute;right: 65px;top: 10px;font-size: 14px;font-weight: normal;color: #ccc;display: none;}
i.fa.fa-close.closeHint {position: relative;cursor: pointer;}
span.closeTooltip {width: 60px;height: 25px;background: #ccc;color: #fff;padding: 5px 10px;position: absolute;text-align: center;bottom: -41px;line-height: 14px;font-size: 14px;left: -28px;display: none;}
.tooltipArrow {border-left: 7px solid transparent;border-right: 7px solid transparent;border-bottom: 7px solid #ccc;position: absolute;bottom: -17px;left: -1px;display: none;}
.closeHint:hover .closeTooltip,.closeHint:hover .tooltipArrow {display: block;}
i.fa.fa-close.closeHint::after {content: '';position: absolute;bottom: -17px;border-left: 5px solid transparent;border-right: 5px solid transparent;border-bottom: 5px solid #ccc;display: none;}
.includeKeyword {display:none;margin: 0px 0px 20px;}
.includeKeyword p {margin-top: 10px;margin-bottom: 0;}
@media screen and (max-width: 640px) {
    .os-doc-detail {padding-bottom: 15px;}
    .od-doc-label.checkbox-label {margin-top: 20px}
    .od-doc-label.checkbox-label label {float: left;}
    /*.od-doc-chklist {float: left;margin-left: 25px;}*/
}

/*Application Search Detail*/
.od-doc-grid {display: block;}
.od-doc-box {float: left;position: relative;margin: 0 0 40px 0px;box-sizing: border-box;border-radius: 8px;border: 1px solid #ccc;width: calc(50% - 20px );}
.od-doc-box__title {font-weight: 600;border-bottom: 1px solid #ccc;text-align: center;width: 100%;padding: 15px;font-size: 16px;min-height:80px;}
.od-doc-box .title {font-weight: 600;border-bottom: 1px solid #ccc;text-align: center;width: 100%;padding: 15px;font-size: 16px;min-height:80px;}
.od-doc-box:nth-child(2n+1) {clear: both;margin-right: 40px;}
.od-doc-box .picture {float: left;width: 40%;padding: 20px;}
.od-doc-box .picture img {height: auto;border:1px solid #ccc;background-color:#eee;}
.od-doc-box .info {float: left;width: 60%;}
.od-doc-box .info .info-section {margin-top:10px;}
.od-doc-box .into label {font-weight: 600;width: 50%;}
.div-table {display: table;width: 100%;border-spacing: 5px;}
.div-table-row {display: table-row;width: auto;clear: both;}
.div-table-col {float: left; display: table-column;}
.div-table-col.caption {width: 30%;font-weight: 600;color: #808080;}
.div-table-col.info {width: 70%}
.div-table-col.info a {font-weight: normal;text-decoration: underline;color: #808080;}
.od-dm-app {width: 180px;margin-bottom: 20px;}
.od-doc-totalitems {font-weight:600;text-transform:lowercase;font-size: 14px;padding-bottom: 15px;}
.od-doc-pagingoptions {display:none;}
.od-doc-btnshowall {
    background: linear-gradient(to bottom,#f9f9f9 5%,#e9e9e9 100%);
    background-color: #f9f9f9;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 4px;
    border: 1px solid #dcdcdc;
    display: inline-block;
    cursor: pointer;
    font-family: arial;
    padding: 4px 20px;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff;
    width: 100%;
    font-weight: 700;
    color:#666;
}
.od-doc-loading {text-align:center;display:none;}

.ajax-loading-block-window {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100% !important;
    height: 100% !important;
    margin: 0;
    background-color: rgba(255,255,255,.75);
    display: block;
    bottom: 0;
    right: 0;
}

@media screen and (max-width: 1024px) /*Mobile & Tablet*/
{
    .od-doc-searchbox, .od-doc-filteroptions {width:100%}
    .os-document-summary .docproduct{width:100% !important;padding-left:25px !important;margin-top:10px;}
}

@media screen and (min-width: 1261px) /*Desktop*/
{
    .fp-iframe {height:1250px !important}
}

@media screen and (min-width: 1180px) /*From Tablet Horizontal*/
{
    .od-doc-box .info .info-section {min-height:240px;}
}

@media screen and (max-width: 480px) /*Mobile*/
{
    .od-resource__blogsubtitle {margin:0px !important;text-align:center}
    .div-table-col.info, .div-table-col.caption {width:100%;text-align:left}
    .od-doc-filteroptions, .od-doc-searchbox{width:100%}
    .od-doc-box .picture img {height:140px}
    .od-doc-searchbox {width:100%}
    .os-doc-detail {display:block/*position: sticky;top: 45px;z-index: 100*/}
    .od-doc-category {margin-left:10px}
    .od-doc-box .title {min-height: auto}
    .od-doc-box .info .info-section {min-height:auto;margin-bottom: 10px;line-height:22px}
    .od-doc-totalitems {text-align:center}

    /*Used: \Plugins\Odegi.Plugin.DocumentManagement\Views\DocumentDetail.cshtml*/
    .os-document-summary .cat {
        border-right: none !important
    }
    .os-document-summary .docno{border-right:none !important}
    .os-document-summary .column{margin-top: 15px;}
    .fp-iframe {height:550px !important}
    .od-doc-btnshowall {padding: 10px 20px;margin: 30px 0px 0px;text-transform:uppercase;font-weight:normal !important;color:#000 !important;}
}

@media screen and (max-width: 1023px) {
    .od-doc-box{width:100%;}
    .od-doc-box .picture img {height:auto}
    .od-doc-box .info .info-section {margin-bottom:20px;padding-right:20px}
}

@media (min-width: 781px) and (max-width: 1024px) {
    .od-doc-box .picture img {height:auto}
    .od-doc-box .info .info-section {margin-bottom:20px;padding-right:20px}
}

/*Used: \Plugins\Odegi.Plugin.DocumentManagement\Views\DocumentDetail.cshtml*/
.os-video-content {position: relative;width: 100%;height: 100%;padding-bottom: 56.25%}
.os-video-content iframe{position:absolute}
.os-document-detail iframe {width: 100%;height: 100%;margin-bottom: 15px;}
.os-document-summary {width: 100%;border: 1px solid #ccc;display: table;padding: 20px 0px;}
.os-document-summary div {text-align:center;}
.os-document-summary .cat{width: 13%;float:left;border-right:1px solid #ccc;}
.os-document-summary .docno{width: 16%;float:left;border-right:1px solid #ccc;}
.os-document-summary .docproduct{width: 50%;float: left;text-align: left;padding-left: 20px}
.os-document-summary .compound{width: 20%;float:left;border-right: 1px solid #ccc;}
.os-document-summary .column{width: 15%;float:right;}
.os-document-summary label {font-weight:600;vertical-align:top}
.os-document-keywordlist {width:25%; float:left;margin-top:15px;}
.os-document-keywordlist ul {margin-top:10px;}
.os-document-keywordlist li {list-style-type:none;line-height:20px;}
.os-document-keywordlist p {text-align:initial}

@media only screen and (min-width: 768px) and (max-width: 999px) { /*Tablet (Range)*/
    .os-document-summary .cat{width: 20%}
    .os-document-summary .docno{width: 23%}
    .os-document-summary .compound{width: 25%}
    .os-document-summary .column{width: 25%}
}

@media (min-width: 1261px){
    .os-document-bc {max-width: 1300px;margin: auto;text-align: left;padding-left:20px;}
    .topic-page .page-body {padding-top: 0px !important;}
}

@media only screen and (min-width: 768px) and (max-width: 1024px) { /*Tablet (Range)*/
    .os-document-keywordlist {width:50%}                                                                    
}


.od-resource-commets {list-style:none !important}
.od-resource-commets li {margin: 0px 0px 20px 0px;}
.od-resource__blogsubtitle {margin:0px 0px 35px}

.od-resource__blog .page-title {margin-bottom:0px;padding-bottom:10px}
.od-share-post {float:right;list-style:none;margin:0px !important}
.od-share-post li {display: inline-block;margin-left:5px}
.od-share-post a {display: block;width: 32px;height: 32px;background-image: url(../img/share-sprite.png);background-repeat: no-repeat}
.od-share-post .facebook a {background-position: 0 0}
.od-share-post .twitter a {background-position: -32px 0}
.od-share-post .linkedin a {background-position: -96px 0}


.os-resource__tags {margin-top:20px;padding-left: 1rem;}

/*right & left sections */

.od-resource__message{display:block;color:green;padding:20px 0px}
.od-resource__sectionleft{display:block;float:left}
.od-resource__sectionright{display:block;float:right}
/*.od-resource__sectionright .product-grid .item-box{width:100% !important}*/
.od-resource__usercomment{line-height:45px}
@media screen and (max-width: 480px) /*Mobile*/
{
    .od-resource__sectionleft{width:100%}
    .od-resource__sectionright{width:100%;margin-top:30px}
    .od-resource__sectionright .product-grid .item-box {width: calc(50% - 10px) !important;margin: 0px 0px 10px 10px}
    .od-resource__relatedproducts {display:block;font-weight: lighter;text-align: center;text-transform: uppercase;padding: 10px 10px 30px 10px}
}   
@media screen and (min-width: 481px) /*Desktop*/
{
    .od-resource__sectionleft {width:85%}
    .od-resource__sectionright {width:15%;padding-left:20px}
    .od-resource__sectionright .product-grid .item-box {width: 100% !important}
    .od-resource__relatedproducts {display:none}
}