/* ========================================================================== #Transitions ========================================================================== */ #pjWrapperFileSharing .pjFsBtn, #pjWrapperFileSharing .pjFsDropdown .pjFsBtnSecondary .caret, #pjWrapperFileSharing .pjFsThumb, #pjWrapperFileSharing .pjFsThumb > a, #pjWrapperFileSharing .pjFsThumb .pjFsThumbTitle, #pjWrapperFileSharing .pjFsThumbImage img, #pjWrapperFileSharing .pjFsThumbIcon, #pjWrapperFileSharing .pjFsPagination a, #pjWrapperFileSharing .pjFsTableUploads .table tr, #pjWrapperFileSharing .pjFsTableUploads .table td { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } /* ========================================================================== #Animations ========================================================================== */ @-webkit-keyframes hvr-pulse-grow { to { -webkit-transform: scale(1.1); transform: scale(1.1); } } @keyframes hvr-pulse-grow { to {-webkit-transform: scale(1.1); transform: scale(1.1); } } /* ========================================================================== #General ========================================================================== */ #pjWrapperFileSharing { font-family: 'Open Sans', sans-serif; } #pjWrapperFileSharing .pjFsContainer { padding: 0; } #pjWrapperFileSharing .pjFsMain { padding: 15px; border: 0; -webkit-box-shadow: none; box-shadow: none; } #pjWrapperFileSharing .pjFsEmptyResult { margin: 0; padding: 10px 0; text-align: center; } /* ========================================================================== #Buttons ========================================================================== */ #pjWrapperFileSharing .pjFsBtn { display: inline-block; float: none; padding: 0; height: 37px; border-radius: 0; font-size: 15px; line-height: 35px; text-transform: capitalize; vertical-align: middle; } #pjWrapperFileSharing .pjFsBtn:hover { text-decoration: none; } #pjWrapperFileSharing .pjFsBtnPrimary { border: 1px solid #147dd0; } #pjWrapperFileSharing .pjFsBtnSecondary { border: 1px solid #c2d2e0; } #pjWrapperFileSharing .pjFsBtnLink { font-size: 14px; line-height: 1.57; } #pjWrapperFileSharing .pjFsBtnBack .fa { font-size: 12px; vertical-align: middle; } /* ========================================================================== #pjFsHead ========================================================================== */ #pjWrapperFileSharing .pjFsHead { padding: 20px 0; border-bottom: 2px solid #e1e5e9; background: none; } #pjWrapperFileSharing .pjFsHead .pjFsBtn + .pjFsBtn { margin-left: 5px; } #pjWrapperFileSharing .pjFsHead .pjFsBtnPrimary { padding: 0 40px; } #pjWrapperFileSharing .pjFsHead .pjFsBtnSecondary { padding: 0 35px; } #pjWrapperFileSharing .pjFsDropdown { padding: 5px 0 0 20px; } #pjWrapperFileSharing .pjFsDropdown:first-of-type { padding-left: 0; } #pjWrapperFileSharing .pjFsDropdown p { display: inline-block; margin: 0; padding-right: 5px; font-size: 13px; line-height: 1.69; vertical-align: middle; } #pjWrapperFileSharing .pjFsDropdown .pjFsBtn { margin: 0; } #pjWrapperFileSharing .pjFsDropdown .pjFsBtnSecondary { min-width: 65px; height: 28px; padding: 0 25px 0 10px; font-size: 13px; line-height: 28px; text-align: left; } #pjWrapperFileSharing .pjFsDropdown.open .pjFsBtnSecondary { z-index: 1001; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; } #pjWrapperFileSharing .pjFsDropdown .pjFsBtnSecondary .caret { position: absolute; top: 50%; right: 10px; margin-top: -1px; border-width: 5px; } #pjWrapperFileSharing .pjFsDropdown.open .pjFsBtnSecondary .caret { -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } #pjWrapperFileSharing .pjFsDropdown .dropdown-menu { right: 0; left: auto; float: none; max-width: 320px; margin-top: -1px; border-radius: 0; } #pjWrapperFileSharing .pjFsDropdown .dropdown-menu li { padding: 0; } #pjWrapperFileSharing .pjFsDropdown .dropdown-menu a { overflow: hidden; padding: 2px 10px; text-transform: capitalize; } /* ========================================================================== #pjFsBody ========================================================================== */ #pjWrapperFileSharing .pjFsBody { padding: 20px 0; } /* ========================================================================== #pjFsThumbs ========================================================================== */ #pjWrapperFileSharing .pjFsThumb { margin: 0 0 10px; padding: 0; } #pjWrapperFileSharing .pjFsThumb > a { display: block; overflow: hidden; width: 100%; border: 1px solid transparent; text-decoration: none; } #pjWrapperFileSharing .pjFsThumb > a:hover { -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, .4); box-shadow: 0 0 7px rgba(0, 0, 0, .4); } #pjWrapperFileSharing .pjFsThumbImage { overflow: hidden; width: 100%; height: 150px; padding: 10px 0; text-align: center; -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, .1); box-shadow: 0 2px 3px rgba(0, 0, 0, .1); } #pjWrapperFileSharing .pjFsThumb > a:hover .pjFsThumbImage { -webkit-box-shadow: none; box-shadow: none; } #pjWrapperFileSharing .pjFsThumbImageInner { overflow: hidden; display: inline-block; max-width: 100%; max-height: 100%; } #pjWrapperFileSharing .pjFsThumbImage img { max-width: 100%; height: auto; } #pjWrapperFileSharing .pjFsThumb > a:hover .pjFsThumbImage img { transform: scale(1.1); } #pjWrapperFileSharing .pjFsThumb .caption { overflow: hidden; border-top: 1px solid transparent; } #pjWrapperFileSharing .pjFsThumb .pjFsThumbTitle { float: left; margin: 0; padding-top: 3px; font-size: 13px; line-height: 1.2; width: 65%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #pjWrapperFileSharing .pjFsThumb .pjFsThumbActions { margin-right: -5px; text-align: right; } #pjWrapperFileSharing .pjFsThumbIcon { display: inline-block; padding: 0 2px; border: 0; background: none; font-size: 16px; opacity: 0; } #pjWrapperFileSharing .pjFsThumb:hover .pjFsThumbIcon { opacity: 1; } #pjWrapperFileSharing .pjFsThumbStar:hover, #pjWrapperFileSharing .pjFsThumbStarChecked { opacity: 1; } /* ========================================================================== #pjFsTableUploads ========================================================================== */ #pjWrapperFileSharing .pjFsTableUploads { overflow-x: visible; } #pjWrapperFileSharing .pjFsTableUploads .table { border-collapse: separate; } #pjWrapperFileSharing .pjFsTableUploads .table tr[data-href] { cursor: pointer; } #pjWrapperFileSharing .pjFsTableUploads .table tr:hover { -webkit-box-shadow: 0 0 7px rgba(0, 0, 0, .4); box-shadow: 0 0 7px rgba(0, 0, 0, .4); } #pjWrapperFileSharing .pjFsTableUploads .table tr:first-of-type:hover { -webkit-box-shadow: none; box-shadow: none; } #pjWrapperFileSharing .pjFsTableUploads .table th, #pjWrapperFileSharing .pjFsTableUploads .table td { font-size: 13px; line-height: 1.2; } #pjWrapperFileSharing .pjFsTableUploads .table th { border-top: 0; border-bottom: 1px solid #e2e3e3; } #pjWrapperFileSharing .pjFsTableUploads .table td { padding: 10px; border: 1px solid transparent; border-right-width: 0; border-left-width: 0; vertical-align: middle; } #pjWrapperFileSharing .pjFsTableUploads .table td:first-of-type { border-left-width: 1px; } #pjWrapperFileSharing .pjFsTableUploads .table td:last-of-type { border-right-width: 1px; } #pjWrapperFileSharing .pjFsTableUploads .table td:first-of-type .fa { margin-right: 8px; font-size: 17px; } #pjWrapperFileSharing .pjFsTableUploads .pjFsTableActions { text-align: right; } #pjWrapperFileSharing .pjFsTableUploads .table tr:hover .pjFsThumbIcon { opacity: 1; } /* ========================================================================== #pjFsFormNewFile ========================================================================== */ #pjWrapperFileSharing .pjFsFormNewFile { text-align: center; } #pjWrapperFileSharing .pjFsAddFile { padding-top: 20px; } #pjWrapperFileSharing .pjFsAddFile .pjFsBtnPrimary { height: 58px; padding: 0 60px; font-size: 22px; line-height: 56px; } #pjWrapperFileSharing .pjFsAddFile .pjFsBtnDisabled { display: none; } #pjWrapperFileSharing .pjFsAddFile .pjFsBtnUpload { position: relative; overflow: hidden; display: inline-block; } #pjWrapperFileSharing .pjFsAddFile .pjFsBtnUpload span.pjFsAddLabel{ display: inline-block} #pjWrapperFileSharing .pjFsAddFile .pjFsBtnUpload span.pjFsDropLabel{ display: none} #pjWrapperFileSharing .pjFsBtnUpload input { position: absolute; top: 0; right: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; } #pjWrapperFileSharing .pjFsBtnUpload input::-webkit-file-upload-button { cursor: pointer; } #pjWrapperFileSharing .pjFsAddFile.pjFsAddFileAdded .pjFsBtnDisabled { display: inline-block; } #pjWrapperFileSharing .pjFsAddFile.pjFsAddFileAdded .pjFsBtnUpload { display: none; } #pjWrapperFileSharing .pjFsAddFile p { margin: 20px 0 0; font-size: 13px; line-height: 1.2; } #pjWrapperFileSharing .pjFsAddFile .pjFsUploadedFiles { margin: 0; padding: 10px 0 5px; font-size: 14px; } #pjWrapperFileSharing .pjFsAddFile .pjFsBtnSecondary { display: none; height: 32px; padding: 0 10px; font-size: 13px; line-height: 30px; text-transform: none; } #pjWrapperFileSharing .pjFsAddFile.pjFsAddFileAdded .pjFsBtnSecondary { display: inline-block; } #pjWrapperFileSharing .pjFsAddFile.pjFsReadyForDrop .pjFsBtnUpload { height: 116px; padding: 0 120px; line-height: 94px; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; } #pjWrapperFileSharing .pjFsAddFile.pjFsReadyForDrop .pjFsBtnUpload span.pjFsAddLabel { display: none; } #pjWrapperFileSharing .pjFsAddFile.pjFsReadyForDrop .pjFsBtnUpload span.pjFsDropLabel { display: inline-block; } /*#pjWrapperFileSharing .pjFsAddFile.pjFsReadyForDrop .pjFsBtnUpload:after { content: 'Drop file(s) here'; }*/ #pjWrapperFileSharing .pjFsAddFile.pjFsReadyForDrop .pjFsBtnUpload.pjFsBtnReadyForDrop { -webkit-animation-name: hvr-pulse-grow; animation-name: hvr-pulse-grow; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; animation-direction: alternate; } #pjWrapperFileSharing .pjFsAddFileText { margin: 0; padding: 10px 0; text-align: center; } /* ========================================================================== #pjFsForm ========================================================================== */ #pjWrapperFileSharing .pjFsForm .pjFsFormTitle { padding-bottom: 40px; margin: 0; font-size: 24px; line-height: 1.17; font-weight: bold; text-transform: uppercase; } #pjWrapperFileSharing .pjFsForm label { font-size: 14px; line-height: 1.57; font-weight: normal; } #pjWrapperFileSharing .pjFsForm .form-control { height: 42px; padding: 0 10px; border: 1px solid #c7cdd3; border-radius: 0; font-size: 14px; line-height: 1.57; } #pjWrapperFileSharing .pjFsForm .form-group { padding-bottom: 35px; margin: 0; } #pjWrapperFileSharing .pjFsForm .help-block { margin: 0; } #pjWrapperFileSharing .pjFsForm .has-error .help-block { padding-top: 5px; } #pjWrapperFileSharing .pjFsForm .pjFsFormActions .pjFsBtnPrimary { width: 210px; height: 42px; font-size: 18px; line-height: 42px; text-align: center; } /* ========================================================================== #pjFsFormLogin ========================================================================== */ #pjWrapperFileSharing .pjFsFormLogin .pjFsFormAside p { font-size: 14px; line-height: 2; } /* ========================================================================== #pjFsFoot ========================================================================== */ #pjWrapperFileSharing .pjFsFoot { padding: 0; border: 0; background: none; } #pjWrapperFileSharing .pjFsPagination .pagination { margin: 0; } #pjWrapperFileSharing .pjFsPagination li, #pjWrapperFileSharing .pjFsPagination a { display: inline-block; float: none; } #pjWrapperFileSharing .pjFsPagination li { padding-right: 5px; } #pjWrapperFileSharing .pjFsPagination a { min-width: 26px; height: 26px; margin: 0; padding: 0 8px; border: 1px solid #c2d2e0; font-size: 13px; line-height: 24px; text-align: center; border-radius: 0; text-transform: capitalize; } /* ========================================================================== #pjFsProductData ========================================================================== */ #pjWrapperFileSharing .pjFsProductData { margin: 0; } #pjWrapperFileSharing .pjFsProductData li { margin: 0; padding: 0; border: 0; border-bottom: 1px solid #e2e3e3; border-radius: 0; } #pjWrapperFileSharing .pjFsProductData dl { margin: 0; font-size: 0; } #pjWrapperFileSharing .pjFsProductData dt, #pjWrapperFileSharing .pjFsProductData dd { display: inline-block; float: none; width: 50%; min-width: 0; margin: 0; padding: 10px 5px; font-size: 14px; line-height: 1.2; vertical-align: middle; } #pjWrapperFileSharing .pjFsProductData dl.pjFsThumbPreview{display: block; margin: 0 auto; width: 180px;} #pjWrapperFileSharing .pjFsProductData dl.pjFsThumbPreview a{display: block; margin-bottom: 10px;} #pjWrapperFileSharing .pjFsProductData .pjFsThumbActions { padding: 10px 0; text-align: center; } #pjWrapperFileSharing .pjFsProductData .pjFsThumbActions .pjFsThumbIcon { opacity: 1; } /* ========================================================================== #pjFsComments ========================================================================== */ #pjWrapperFileSharing .pjFsComments { padding-top: 20px; } #pjWrapperFileSharing .pjFsComments .pjFsCommentsHead { padding-bottom: 10px; } #pjWrapperFileSharing .pjFsCommentsHead .pjFsCommentsTitle { margin: 0; font-size: 36px; line-height: 1.2; font-weight: bold; text-transform: uppercase; } #pjWrapperFileSharing .pjFsCommentsBody { padding-bottom: 30px; } #pjWrapperFileSharing .pjFsComments ul { margin: 0; } #pjWrapperFileSharing .pjFsComments .pjFsComment { margin: 0; padding: 20px 0; border: 0; border-bottom: 1px solid #e2e3e3; } #pjWrapperFileSharing .pjFsComment p, #pjWrapperFileSharing .pjFsComment .pjFsCommentTitle, #pjWrapperFileSharing .pjFsComment .pjFsCommentMeta { margin: 0; } #pjWrapperFileSharing .pjFsComment .pjFsCommentTitle { font-size: 18px; line-height: 1.05; text-transform: capitalize; padding-bottom: 2px; } #pjWrapperFileSharing .pjFsComment .pjFsCommentMeta { padding-bottom: 10px; font-size: 13px; line-height: 1.2; font-style: italic; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormHead { overflow: hidden; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormTitle, #pjWrapperFileSharing .pjFsFormComment .form-group { padding-bottom: 10px; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormTitle { display: inline-block; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormHead .pjFsFormActions { float: right; padding: 0; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormHead .pjFsFormActions .pjFsBtnLink { margin: 0; padding: 2px 3px; } #pjWrapperFileSharing .pjFsFormComment label { text-transform: capitalize; } #pjWrapperFileSharing .pjFsFormComment textarea.form-control { height: 160px; padding: 10px; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormFoot { padding: 10px 0; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormActions { padding-top: 10px; text-align: center; } #pjWrapperFileSharing .pjFsForm .pjFsFormCaptcha .form-control, #pjWrapperFileSharing .pjFsForm .pjFsFormCaptcha img { display: inline-block; vertical-align: middle; } #pjWrapperFileSharing .pjFsForm .pjFsFormCaptcha .form-control { width: 180px; } /* ========================================================================== .Modal ========================================================================== */ .modal-backdrop.fade { opacity: 0; filter: alpha(opacity=0); } .modal-backdrop.fade.in { opacity: 0.5; filter: alpha(opacity=50); } /* ========================================================================== #Responsive ========================================================================== */ @media only screen and ( max-width: 900px ) { /*767*/ /* ========================================================================== #pjFsHead ========================================================================== */ #pjWrapperFileSharing .pjFsHead { padding-bottom: 0; } #pjWrapperFileSharing .pjFsHead .pull-left, #pjWrapperFileSharing .pjFsHead .pull-right { float: none; width: 100%; padding-bottom: 20px; } #pjWrapperFileSharing .pjFsHead .pull-left .pjFsBtnSecondary { padding: 0 20px; } /* ========================================================================== #pjFsTableUploads ========================================================================== */ #pjWrapperFileSharing .pjFsTableUploads { overflow-x: auto; } /* ========================================================================== #pjFsThumbs ========================================================================== */ #pjWrapperFileSharing .pjFsThumbIcon { opacity: 1; } /* ========================================================================== #pjFsForm ========================================================================== */ #pjWrapperFileSharing .pjFsForm .pjFsFormTitle { padding-bottom: 15px; } #pjWrapperFileSharing .pjFsForm .form-group { padding-bottom: 10px; } /* ========================================================================== #pjFsComments ========================================================================== */ #pjWrapperFileSharing .pjFsComments .pjFsComment { padding: 10px 0; } #pjWrapperFileSharing .pjFsComments .pjFsComment:first-of-type { padding-top: 0; } #pjWrapperFileSharing .pjFsCommentsBody { padding-bottom: 10px; } } @media only screen and ( max-width: 680px ) { /* ========================================================================== #pjFsThumbs ========================================================================== */ #pjWrapperFileSharing .pjFsThumbs { padding: 0 5px; } #pjWrapperFileSharing .pjFsThumbs .col-xs-4 { width: 50%; padding: 0 5px; } } @media only screen and ( max-width: 480px ) { /* ========================================================================== #pjFsHead ========================================================================== */ #pjWrapperFileSharing .pjFsHead .pull-left .pjFsBtn { padding: 0 10px; } /* ========================================================================== #pjFsThumbs ========================================================================== */ #pjWrapperFileSharing .pjFsThumb .caption { padding: 5px; } #pjWrapperFileSharing .pjFsThumb .pjFsThumbTitle { float: none; width: 100%; } #pjWrapperFileSharing .pjFsThumb .pjFsThumbActions { text-align: left; } /* ========================================================================== #pjFsAddFile ========================================================================== */ #pjWrapperFileSharing .pjFsAddFile .pjFsBtnPrimary { height: 37px; padding: 0 30px; line-height: 35px; } /* ========================================================================== #pjFsComments ========================================================================== */ #pjWrapperFileSharing .pjFsFormComment .pjFsFormHead .pjFsFormActions li { padding: 0 5px 0 0; } #pjWrapperFileSharing .pjFsFormComment .pjFsFormHead .pjFsFormActions .pjFsBtnLink { padding: 0; } } @media only screen and ( max-width: 380px ) { /* ========================================================================== #General ========================================================================== */ body { min-width: 320px; } /* ========================================================================== #pjFsHead ========================================================================== */ #pjWrapperFileSharing .pjFsDropdown + .pjFsDropdown{ padding-left: 4px; } #pjWrapperFileSharing .pjFsDropdown p { padding-right: 0px; } #pjWrapperFileSharing .pjFsHead .pull-left .pjFsBtn { padding: 0 10px; } #pjWrapperFileSharing .pjFsHead .pjFsBtnBack { margin-top: 10px; } #pjWrapperFileSharing .pjFsDropdown .dropdown-menu { max-width: 280px; } #pjWrapperFileSharing .pjFsDropdown:first-of-type .dropdown-menu { right: auto; left: 0; } #pjWrapperFileSharing .pjFsMain { padding: 10px; } #pjWrapperFileSharing .pjFsThumbs { margin: 0 -10px; } #pjWrapperFileSharing .pjFsHead .pjFsBtn + .pjFsBtn {margin-left: 2px; } /* ========================================================================== #pjFsThumbs ========================================================================== */ #pjWrapperFileSharing .pjFsThumb .caption { padding: 5px; } #pjWrapperFileSharing .pjFsThumb .pjFsThumbTitle { font-size: 12px; } #pjWrapperFileSharing .pjFsThumb .pjFsThumbTitle .fa { display: none; } /* ========================================================================== #pjFsForm ========================================================================== */ #pjWrapperFileSharing .pjFsForm .pjFsFormTitle { font-size: 18px; } #pjWrapperFileSharing .pjFsForm .pjFsFormActions .pjFsBtnLink { margin-top: 10px; padding: 0; } /* ========================================================================== #pjFsComments ========================================================================== */ #pjWrapperFileSharing .pjFsCommentsHead .pjFsCommentsTitle { font-size: 24px; } #pjWrapperFileSharing .pjFsComment .pjFsCommentTitle { font-size: 16px; } }