/*============================ GLOBAL CSS START ============================*/ @import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap'); * { margin: 0; padding: 0; --tblr-primary: #0054a6; --tblr-primary-rgb: 0, 84, 166; --tblr-primary-fg: var(--tblr-light); --tblr-primary-darken: #004c95; --tblr-primary-lt: #e6eef6; --tblr-primary-lt-rgb: 230, 238, 246; --tblr-secondary: #667382; --tblr-secondary-rgb: 102, 115, 130; --tblr-secondary-fg: var(--tblr-light); --tblr-secondary-darken: #5c6875; --tblr-secondary-lt: #f0f1f3; --tblr-secondary-lt-rgb: 240, 241, 243; --tblr-success: #2fb344; --tblr-success-rgb: 47, 179, 68; --tblr-success-fg: var(--tblr-light); --tblr-success-darken: #2aa13d; --tblr-success-lt: #eaf7ec; --tblr-success-lt-rgb: 234, 247, 236; --tblr-info: #4299e1; --tblr-info-rgb: 66, 153, 225; --tblr-info-fg: var(--tblr-light); --tblr-info-darken: #3b8acb; --tblr-info-lt: #ecf5fc; --tblr-info-lt-rgb: 236, 245, 252; --tblr-warning: #f76707; --tblr-warning-rgb: 247, 103, 7; --tblr-warning-fg: var(--tblr-light); --tblr-warning-darken: #de5d06; --tblr-warning-lt: #fef0e6; --tblr-warning-lt-rgb: 254, 240, 230; --tblr-danger: #d63939; --tblr-danger-rgb: 214, 57, 57; --tblr-danger-fg: var(--tblr-light); --tblr-danger-darken: #c13333; --tblr-danger-lt: #fbebeb; --tblr-danger-lt-rgb: 251, 235, 235; --tblr-light: #fcfdfe; --tblr-light-rgb: 252, 253, 254; --tblr-light-fg: var(--tblr-dark); --tblr-light-darken: #e3e4e5; --tblr-light-lt: white; --tblr-light-lt-rgb: 255, 255, 255; --tblr-dark: #182433; --tblr-dark-rgb: 24, 36, 51; --tblr-dark-fg: var(--tblr-light); --tblr-dark-darken: #16202e; --tblr-dark-lt: #e8e9eb; --tblr-dark-lt-rgb: 232, 233, 235; --tblr-muted: #667382; --tblr-muted-rgb: 102, 115, 130; --tblr-muted-fg: var(--tblr-light); --tblr-muted-darken: #5c6875; --tblr-muted-lt: #f0f1f3; --tblr-muted-lt-rgb: 240, 241, 243; --tblr-blue: #0054a6; --tblr-blue-rgb: 0, 84, 166; --tblr-blue-fg: var(--tblr-light); --tblr-blue-darken: #004c95; --tblr-blue-lt: #e6eef6; --tblr-blue-lt-rgb: 230, 238, 246; --tblr-azure: #4299e1; --tblr-azure-rgb: 66, 153, 225; --tblr-azure-fg: var(--tblr-light); --tblr-azure-darken: #3b8acb; --tblr-azure-lt: #ecf5fc; --tblr-azure-lt-rgb: 236, 245, 252; --tblr-indigo: #4263eb; --tblr-indigo-rgb: 66, 99, 235; --tblr-indigo-fg: var(--tblr-light); --tblr-indigo-darken: #3b59d4; --tblr-indigo-lt: #eceffd; --tblr-indigo-lt-rgb: 236, 239, 253; --tblr-purple: #ae3ec9; --tblr-purple-rgb: 174, 62, 201; --tblr-purple-fg: var(--tblr-light); --tblr-purple-darken: #9d38b5; --tblr-purple-lt: #f7ecfa; --tblr-purple-lt-rgb: 247, 236, 250; --tblr-pink: #d6336c; --tblr-pink-rgb: 214, 51, 108; --tblr-pink-fg: var(--tblr-light); --tblr-pink-darken: #c12e61; --tblr-pink-lt: #fbebf0; --tblr-pink-lt-rgb: 251, 235, 240; --tblr-red: #d63939; --tblr-red-rgb: 214, 57, 57; --tblr-red-fg: var(--tblr-light); --tblr-red-darken: #c13333; --tblr-red-lt: #fbebeb; --tblr-red-lt-rgb: 251, 235, 235; --tblr-orange: #f76707; --tblr-orange-rgb: 247, 103, 7; --tblr-orange-fg: var(--tblr-light); --tblr-orange-darken: #de5d06; --tblr-orange-lt: #fef0e6; --tblr-orange-lt-rgb: 254, 240, 230; --tblr-yellow: #f59f00; --tblr-yellow-rgb: 245, 159, 0; --tblr-yellow-fg: var(--tblr-light); --tblr-yellow-darken: #dd8f00; --tblr-yellow-lt: #fef5e6; --tblr-yellow-lt-rgb: 254, 245, 230; --tblr-lime: #74b816; --tblr-lime-rgb: 116, 184, 22; --tblr-lime-fg: var(--tblr-light); --tblr-lime-darken: #68a614; --tblr-lime-lt: #f1f8e8; --tblr-lime-lt-rgb: 241, 248, 232; --tblr-green: #2fb344; --tblr-green-rgb: 47, 179, 68; --tblr-green-fg: var(--tblr-light); --tblr-green-darken: #2aa13d; --tblr-green-lt: #eaf7ec; --tblr-green-lt-rgb: 234, 247, 236; --tblr-teal: #0ca678; --tblr-teal-rgb: 12, 166, 120; --tblr-teal-fg: var(--tblr-light); --tblr-teal-darken: #0b956c; --tblr-teal-lt: #e7f6f2; --tblr-teal-lt-rgb: 231, 246, 242; --tblr-cyan: #17a2b8; --tblr-cyan-rgb: 23, 162, 184; --tblr-cyan-fg: var(--tblr-light); --tblr-cyan-darken: #1592a6; --tblr-cyan-lt: #e8f6f8; --tblr-cyan-lt-rgb: 232, 246, 248; --tblr-facebook: #1877f2; --tblr-facebook-rgb: 24, 119, 242; --tblr-facebook-fg: var(--tblr-light); --tblr-facebook-darken: #166bda; --tblr-facebook-lt: #e8f1fe; --tblr-facebook-lt-rgb: 232, 241, 254; --tblr-twitter: #1da1f2; --tblr-twitter-rgb: 29, 161, 242; --tblr-twitter-fg: var(--tblr-light); --tblr-twitter-darken: #1a91da; --tblr-twitter-lt: #e8f6fe; --tblr-twitter-lt-rgb: 232, 246, 254; --tblr-linkedin: #0a66c2; --tblr-linkedin-rgb: 10, 102, 194; --tblr-linkedin-fg: var(--tblr-light); --tblr-linkedin-darken: #095caf; --tblr-linkedin-lt: #e7f0f9; --tblr-linkedin-lt-rgb: 231, 240, 249; --tblr-google: #dc4e41; --tblr-google-rgb: 220, 78, 65; --tblr-google-fg: var(--tblr-light); --tblr-google-darken: #c6463b; --tblr-google-lt: #fcedec; --tblr-google-lt-rgb: 252, 237, 236; --tblr-youtube: #ff0000; --tblr-youtube-rgb: 255, 0, 0; --tblr-youtube-fg: var(--tblr-light); --tblr-youtube-darken: #e60000; --tblr-youtube-lt: #ffe6e6; --tblr-youtube-lt-rgb: 255, 230, 230; --tblr-vimeo: #1ab7ea; --tblr-vimeo-rgb: 26, 183, 234; --tblr-vimeo-fg: var(--tblr-light); --tblr-vimeo-darken: #17a5d3; --tblr-vimeo-lt: #e8f8fd; --tblr-vimeo-lt-rgb: 232, 248, 253; --tblr-dribbble: #ea4c89; --tblr-dribbble-rgb: 234, 76, 137; --tblr-dribbble-fg: var(--tblr-light); --tblr-dribbble-darken: #d3447b; --tblr-dribbble-lt: #fdedf3; --tblr-dribbble-lt-rgb: 253, 237, 243; --tblr-github: #181717; --tblr-github-rgb: 24, 23, 23; --tblr-github-fg: var(--tblr-light); --tblr-github-darken: #161515; --tblr-github-lt: #e8e8e8; --tblr-github-lt-rgb: 232, 232, 232; --tblr-instagram: #e4405f; --tblr-instagram-rgb: 228, 64, 95; --tblr-instagram-fg: var(--tblr-light); --tblr-instagram-darken: #cd3a56; --tblr-instagram-lt: #fcecef; --tblr-instagram-lt-rgb: 252, 236, 239; } .text-primary { --tblr-text-opacity: 1; color: rgba(var(--tblr-primary-rgb), var(--tblr-text-opacity)) !important; } .text-primary-fg { color: var(--tblr-primary-fg) !important; } .text-secondary { --tblr-text-opacity: 1; color: rgba(var(--tblr-secondary-rgb), var(--tblr-text-opacity)) !important; } .text-secondary-fg { color: var(--tblr-secondary-fg) !important; } .text-success { --tblr-text-opacity: 1; color: rgba(var(--tblr-success-rgb), var(--tblr-text-opacity)) !important; } .text-success-fg { color: var(--tblr-success-fg) !important; } .text-info { --tblr-text-opacity: 1; color: rgba(var(--tblr-info-rgb), var(--tblr-text-opacity)) !important; } .text-info-fg { color: var(--tblr-info-fg) !important; } .text-warning { --tblr-text-opacity: 1; color: rgba(var(--tblr-warning-rgb), var(--tblr-text-opacity)) !important; } .text-warning-fg { color: var(--tblr-warning-fg) !important; } .text-danger { --tblr-text-opacity: 1; color: rgba(var(--tblr-danger-rgb), var(--tblr-text-opacity)) !important; } .text-danger-fg { color: var(--tblr-danger-fg) !important; } .text-light { --tblr-text-opacity: 1; color: rgba(var(--tblr-light-rgb), var(--tblr-text-opacity)) !important; } .text-light-fg { color: var(--tblr-light-fg) !important; } .text-dark { --tblr-text-opacity: 1; color: rgba(var(--tblr-dark-rgb), var(--tblr-text-opacity)) !important; } .text-dark-fg { color: var(--tblr-dark-fg) !important; } .text-muted { --tblr-text-opacity: 1; color: rgba(var(--tblr-muted-rgb), var(--tblr-text-opacity)) !important; } .text-muted-fg { color: var(--tblr-muted-fg) !important; } .text-blue { --tblr-text-opacity: 1; color: rgba(var(--tblr-blue-rgb), var(--tblr-text-opacity)) !important; } .text-blue-fg { color: var(--tblr-blue-fg) !important; } .text-azure { --tblr-text-opacity: 1; color: rgba(var(--tblr-azure-rgb), var(--tblr-text-opacity)) !important; } .text-azure-fg { color: var(--tblr-azure-fg) !important; } .text-indigo { --tblr-text-opacity: 1; color: rgba(var(--tblr-indigo-rgb), var(--tblr-text-opacity)) !important; } .text-indigo-fg { color: var(--tblr-indigo-fg) !important; } .text-purple { --tblr-text-opacity: 1; color: rgba(var(--tblr-purple-rgb), var(--tblr-text-opacity)) !important; } .text-purple-fg { color: var(--tblr-purple-fg) !important; } .text-pink { --tblr-text-opacity: 1; color: rgba(var(--tblr-pink-rgb), var(--tblr-text-opacity)) !important; } .text-pink-fg { color: var(--tblr-pink-fg) !important; } .text-red { --tblr-text-opacity: 1; color: rgba(var(--tblr-red-rgb), var(--tblr-text-opacity)) !important; } .text-red-fg { color: var(--tblr-red-fg) !important; } .text-orange { --tblr-text-opacity: 1; color: rgba(var(--tblr-orange-rgb), var(--tblr-text-opacity)) !important; } .text-orange-fg { color: var(--tblr-orange-fg) !important; } .text-yellow { --tblr-text-opacity: 1; color: rgba(var(--tblr-yellow-rgb), var(--tblr-text-opacity)) !important; } .text-yellow-fg { color: var(--tblr-yellow-fg) !important; } .text-lime { --tblr-text-opacity: 1; color: rgba(var(--tblr-lime-rgb), var(--tblr-text-opacity)) !important; } .text-lime-fg { color: var(--tblr-lime-fg) !important; } .text-green { --tblr-text-opacity: 1; color: rgba(var(--tblr-green-rgb), var(--tblr-text-opacity)) !important; } .text-green-fg { color: var(--tblr-green-fg) !important; } .text-teal { --tblr-text-opacity: 1; color: rgba(var(--tblr-teal-rgb), var(--tblr-text-opacity)) !important; } .text-teal-fg { color: var(--tblr-teal-fg) !important; } .text-cyan { --tblr-text-opacity: 1; color: rgba(var(--tblr-cyan-rgb), var(--tblr-text-opacity)) !important; } .text-cyan-fg { color: var(--tblr-cyan-fg) !important; } .text-facebook { --tblr-text-opacity: 1; color: rgba(var(--tblr-facebook-rgb), var(--tblr-text-opacity)) !important; } .text-facebook-fg { color: var(--tblr-facebook-fg) !important; } .text-twitter { --tblr-text-opacity: 1; color: rgba(var(--tblr-twitter-rgb), var(--tblr-text-opacity)) !important; } .text-twitter-fg { color: var(--tblr-twitter-fg) !important; } .text-linkedin { --tblr-text-opacity: 1; color: rgba(var(--tblr-linkedin-rgb), var(--tblr-text-opacity)) !important; } .text-linkedin-fg { color: var(--tblr-linkedin-fg) !important; } .text-google { --tblr-text-opacity: 1; color: rgba(var(--tblr-google-rgb), var(--tblr-text-opacity)) !important; } .text-google-fg { color: var(--tblr-google-fg) !important; } .text-youtube { --tblr-text-opacity: 1; color: rgba(var(--tblr-youtube-rgb), var(--tblr-text-opacity)) !important; } .text-youtube-fg { color: var(--tblr-youtube-fg) !important; } .text-vimeo { --tblr-text-opacity: 1; color: rgba(var(--tblr-vimeo-rgb), var(--tblr-text-opacity)) !important; } .text-vimeo-fg { color: var(--tblr-vimeo-fg) !important; } .text-dribbble { --tblr-text-opacity: 1; color: rgba(var(--tblr-dribbble-rgb), var(--tblr-text-opacity)) !important; } .text-dribbble-fg { color: var(--tblr-dribbble-fg) !important; } .text-github { --tblr-text-opacity: 1; color: rgba(var(--tblr-github-rgb), var(--tblr-text-opacity)) !important; } .text-github-fg { color: var(--tblr-github-fg) !important; } .text-instagram { --tblr-text-opacity: 1; color: rgba(var(--tblr-instagram-rgb), var(--tblr-text-opacity)) !important; } .text-instagram-fg { color: var(--tblr-instagram-fg) !important; } .text-pinterest { --tblr-text-opacity: 1; color: rgba(var(--tblr-pinterest-rgb), var(--tblr-text-opacity)) !important; } .text-pinterest-fg { color: var(--tblr-pinterest-fg) !important; } .text-vk { --tblr-text-opacity: 1; color: rgba(var(--tblr-vk-rgb), var(--tblr-text-opacity)) !important; } .text-vk-fg { color: var(--tblr-vk-fg) !important; } .text-rss { --tblr-text-opacity: 1; color: rgba(var(--tblr-rss-rgb), var(--tblr-text-opacity)) !important; } .text-rss-fg { color: var(--tblr-rss-fg) !important; } .text-flickr { --tblr-text-opacity: 1; color: rgba(var(--tblr-flickr-rgb), var(--tblr-text-opacity)) !important; } .text-flickr-fg { color: var(--tblr-flickr-fg) !important; } .text-bitbucket { --tblr-text-opacity: 1; color: rgba(var(--tblr-bitbucket-rgb), var(--tblr-text-opacity)) !important; } .text-bitbucket-fg { color: var(--tblr-bitbucket-fg) !important; } .text-tabler { --tblr-text-opacity: 1; color: rgba(var(--tblr-tabler-rgb), var(--tblr-text-opacity)) !important; } .text-tabler-fg { color: var(--tblr-tabler-fg) !important; } .bg-gray-50 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-50-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-50-fg { color: #182433 !important; } .bg-gray-100 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-100-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-100-fg { color: #182433 !important; } .bg-gray-200 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-200-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-200-fg { color: #182433 !important; } .bg-gray-300 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-300-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-300-fg { color: #182433 !important; } .bg-gray-400 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-400-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-400-fg { color: #fcfdfe !important; } .bg-gray-500 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-500-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-500-fg { color: #fcfdfe !important; } .bg-gray-600 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-600-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-600-fg { color: #fcfdfe !important; } .bg-gray-700 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-700-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-700-fg { color: #fcfdfe !important; } .bg-gray-800 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-800-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-800-fg { color: #fcfdfe !important; } .bg-gray-900 { --tblr-bg-opacity: .1; background-color: rgba(var(--tblr-gray-900-rgb), var(--tblr-bg-opacity)) !important; } .text-gray-900-fg { color: #fcfdfe !important; } .bg-primary { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-primary-rgb), var(--tblr-bg-opacity)) !important; } .bg-secondary { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-secondary-rgb), var(--tblr-bg-opacity)) !important; } .bg-success { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-success-rgb), var(--tblr-bg-opacity)) !important; } .bg-info { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-info-rgb), var(--tblr-bg-opacity)) !important; } .bg-warning { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-warning-rgb), var(--tblr-bg-opacity)) !important; } .bg-danger { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-danger-rgb), var(--tblr-bg-opacity)) !important; } .bg-light { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-light-rgb), var(--tblr-bg-opacity)) !important; } .bg-dark { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-dark-rgb), var(--tblr-bg-opacity)) !important; } .bg-muted { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-muted-rgb), var(--tblr-bg-opacity)) !important; } .bg-blue { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-blue-rgb), var(--tblr-bg-opacity)) !important; } .bg-azure { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-azure-rgb), var(--tblr-bg-opacity)) !important; } .bg-indigo { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-indigo-rgb), var(--tblr-bg-opacity)) !important; } .bg-purple { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-purple-rgb), var(--tblr-bg-opacity)) !important; } .bg-pink { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-pink-rgb), var(--tblr-bg-opacity)) !important; } .bg-red { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-red-rgb), var(--tblr-bg-opacity)) !important; } .bg-orange { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-orange-rgb), var(--tblr-bg-opacity)) !important; } .bg-yellow { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-yellow-rgb), var(--tblr-bg-opacity)) !important; } .bg-lime { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-lime-rgb), var(--tblr-bg-opacity)) !important; } .bg-green { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-green-rgb), var(--tblr-bg-opacity)) !important; } .bg-teal { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-teal-rgb), var(--tblr-bg-opacity)) !important; } .bg-cyan { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-cyan-rgb), var(--tblr-bg-opacity)) !important; } .bg-facebook { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-facebook-rgb), var(--tblr-bg-opacity)) !important; } .bg-twitter { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-twitter-rgb), var(--tblr-bg-opacity)) !important; } .bg-linkedin { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-linkedin-rgb), var(--tblr-bg-opacity)) !important; } .bg-google { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-google-rgb), var(--tblr-bg-opacity)) !important; } .bg-youtube { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-youtube-rgb), var(--tblr-bg-opacity)) !important; } .bg-vimeo { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-vimeo-rgb), var(--tblr-bg-opacity)) !important; } .bg-dribbble { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-dribbble-rgb), var(--tblr-bg-opacity)) !important; } .bg-github { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-github-rgb), var(--tblr-bg-opacity)) !important; } .bg-instagram { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-instagram-rgb), var(--tblr-bg-opacity)) !important; } .bg-pinterest { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-pinterest-rgb), var(--tblr-bg-opacity)) !important; } .bg-vk { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-vk-rgb), var(--tblr-bg-opacity)) !important; } .bg-rss { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-rss-rgb), var(--tblr-bg-opacity)) !important; } .bg-flickr { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-flickr-rgb), var(--tblr-bg-opacity)) !important; } .bg-bitbucket { --tblr-bg-opacity: 1; background-color: rgba(var(--tblr-bitbucket-rgb), var(--tblr-bg-opacity)) !important; } ul, ol, li { list-style: none; margin: 0; padding: 0; } a { display: inline-block; text-decoration: none; } a:hover { text-decoration: none; } h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; color: var(--colorBlack); } p, span { font-size: 15px; font-weight: 400; margin: 0; color: var(--paraColor); } body { overflow-x: hidden; scroll-behavior: smooth; font-family: var(--bodyFont); } img { width: 100% !important; height: 100% !important; object-fit: cover !important; } input, textarea { width: 100%; padding: 12px 20px; outline: none; resize: none; border: 1px solid var(--borderColor); font-weight: 400; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } input::placeholder, textarea::placeholder { color: #787882; } button { border: none; } :root { --rc-navy:#233742; --rc-navy-dark:#12121C; --rc-navy-light:#324a5985; /* --rc-navy-light:#324A59; */ --rc-gold:#C6A46A; --rc-ink:#2e3b47; --rc-muted:#6c7b88; --rc-tint:#eaf1f7; /* light navy tint */ --rc-border:rgba(35,55,66,.12); --colorPrimary: #233742; --colorSecondary: #c6a46a; --colorOrange: #F5D04A; --colorGreen: #43D477; --colorBlack: #1E1E2F; --colorWhite: #ffffff; --paraColor: #787882; --colorLightBg: #EFEFF8; --ratingColor: #FFA121; --borderColor: rgba(30, 30, 47, 0.10); --bodyFont: "Roboto", sans-serif; } .common_btn, .common_btn_2 { color: var(--colorWhite); background: var(--colorPrimary); font-size: 15px; font-weight: 500; padding: 11px 35px; transition: all 0.3s ease; position: relative; border-left: 1px solid transparent; border-right: 1px solid transparent; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; z-index: 1; text-transform: capitalize; display: inline-block; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .common_btn i, .common_btn_2 i { margin-left: 5px; } .common_btn:after, .common_btn_2:after { position: absolute; content: ""; width: 0; height: 100%; top: 0; right: 0; z-index: -1; background: var(--colorSecondary); transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .common_btn:hover, .common_btn_2:hover { color: var(--colorWhite); } .common_btn:hover:after, .common_btn_2:hover:after { left: -1px; width: 101%; } .common_btn_2 { background: var(--colorWhite); color: var(--colorBlack); border: 1px solid var(--borderColor); } .common_btn_2:after { background: var(--colorPrimary); } .enroll_btn { color: var(--colorPrimary) !important; background: var(--colorWhite) !important; font-size: 15px; font-weight: 500; padding: 11px 35px; transition: all 0.3s ease; position: relative; border-left: 1px solid transparent; border-right: 1px solid transparent; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; z-index: 1; text-transform: capitalize; display: inline-block; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .enroll_btn i { margin-left: 5px; } .enroll_btn:after { position: absolute; content: ""; width: 0; height: 100%; top: 0; right: 0; z-index: -1; background: var(--colorPrimary) !important; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .enroll_btn:hover { color: var(--colorWhite) !important; } .enroll_btn:hover:after { left: -1px; width: 103%; } .subscribe_btn { color: var(--rc-navy) !important; background: var(--colorSecondary) !important; font-size: 15px; font-weight: 500; padding: 11px 35px; transition: all 0.3s ease; position: relative; border-left: 1px solid transparent; border-right: 1px solid transparent; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; z-index: 1; text-transform: capitalize; display: inline-block; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .subscribe_btn i { margin-left: 5px; } .subscribe_btn:after { position: absolute; content: ""; width: 0; height: 100%; top: 0; right: 0; z-index: -1; background: var(--rc-navy-dark) !important; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .subscribe_btn:hover { color: var(--colorWhite) !important; } .subscribe_btn:hover:after { left: -1px; width: 103%; } .wsus__section_heading { text-align: center; } .wsus__section_differences_heading { text-align: center; } .wsus__section_heading h5 { display: inline-block; color: var(--colorPrimary); font-size: 14px; font-weight: 600; text-transform: uppercase; background: var(--colorLightBg); padding: 6px 15px 4px 15px; margin-bottom: 20px; } .wsus__section_heading h2, .wsus__section_heading h2 span { font-size: 44px; font-weight: 600; text-align: center; color: var(--colorPrimary); } .wsus__section_heading h2 span { border: 1px solid var(--colorPrimary); padding: 0px 10px 5px 10px; border-radius: 8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; } .heading_left { text-align: left; } .heading_left h2 { text-align: left; } .slick-dots { display: flex; justify-content: center; margin-top: 50px; gap: 8px; } .slick-dots li button { width: 10px; height: 10px; font-size: 0; background: rgba(3, 6, 17, 0.20); border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .slick-dots li.slick-active button { background: var(--colorPrimary); border-color: var(--colorPrimary); } .nextArrow, .prevArrow { width: 45px; height: 45px; padding: 0; line-height: 44px !important; text-align: center; border: 1px solid var(--borderColor); cursor: pointer; background: var(--colorWhite); border-radius: 50%; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; position: absolute; top: 0; right: 12px; z-index: 1; } .prevArrow { right: auto; left: 12px; } .nextArrow, .nextArrow:hover, .prevArrow:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .title { display: block; color: var(--colorBlack); font-size: 20px; font-weight: 600; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .title:hover { color: var(--colorPrimary); } .read_btn { color: var(--colorBlack); font-size: 15px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .read_btn i { margin-left: 5px; } .read_btn:hover { color: var(--colorPrimary); } .play_btn { width: 45px; height: 45px; line-height: 43px; text-align: center; background: var(--colorPrimary); border-radius: 50%; color: var(--colorWhite); font-size: 13px; margin-right: 20px; position: relative; z-index: 1; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .play_btn img { width: 18px !important; height: 18px !important; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(308deg) brightness(107%) contrast(101%); } .play_btn::after { position: absolute; content: ""; width: 100%; height: 100%; background: var(--colorBlack); top: 0; left: 0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; z-index: -1; animation: playAnimi 2s infinite; -webkit-animation: playAnimi 2s infinite; } @keyframes playAnimi { from { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); opacity: 1; } to { transform: scale(2); -webkit-transform: scale(2); -moz-transform: scale(2); -ms-transform: scale(2); -o-transform: scale(2); opacity: 0; } } .home_3 .wsus__section_heading h5 { color: var(--paraColor); font-weight: 600; position: relative; padding: 0px 0px 0px 30px; background: none; text-transform: uppercase; } .home_4 .nextArrow, .home_4 .nextArrow:hover, .home_4 .prevArrow:hover { background: var(--colorOrange); border-color: var(--colorOrange); color: var(--colorBlack); } /* pagination start */ .wsus__pagination ul { gap: 8px; } .wsus__pagination ul li a { color: var(--colorBlack); font-size: 16px; font-weight: 500; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); width: 40px; height: 40px; line-height: 40px; text-align: center; padding: 0 !important; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border: none; border-radius: 50% !important; -webkit-border-radius: 50% !important; -moz-border-radius: 50% !important; -ms-border-radius: 50% !important; -o-border-radius: 50% !important; } .wsus__pagination ul li a:hover, .wsus__pagination ul li a.active { background: var(--colorPrimary); color: var(--colorWhite); box-shadow: none; } /* pagination end */ /* Preloader start */ #preloader { background-color: #ffffffd9; height: 100%; width: 100%; position: fixed; margin-top: 0px; top: 0px; z-index: 9999; } #preloader .preloader_icon { position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); text-align: center; animation: loadingAnimi 900ms infinite alternate; -webkit-animation: loadingAnimi 900ms infinite alternate; } @keyframes loadingAnimi { 0% { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } 100% { transform: scale(1.2); -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); } } /* Preloader end */ /*============================ GLOBAL CSS END ============================*/ /*============================ HOME PAGE 01 START ============================*/ /* header start */ header { background: var(--colorPrimary); width: 100%; height: 40px; line-height: 40px; padding: 0px 30px; position: fixed; top: 0; left: 0; z-index: 99; } header .wsus__header_left li { padding-right: 25px; margin-right: 25px; position: relative; } header .wsus__header_left li::after { position: absolute; content: ""; width: 1px; height: 20px; background: rgba(255, 255, 255, 0.20); top: 10px; right: 0; } header .wsus__header_left li:last-child { margin: 0; padding: 0; } header .wsus__header_left li:last-child::after { display: none; } header .wsus__header_left li a { color: #ffffff60; font-size: 14px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } header .wsus__header_left li a i { margin-right: 5px; color: var(--colorWhite); } header .wsus__header_right li a i { margin-left: 5px; color: var(--colorWhite); } header .wsus__header_left li a:hover { color: var(--colorWhite); } header .wsus__header_center p { color: #ffffff60; font-size: 14px; font-weight: 500; text-align: center; } header .wsus__header_center p span { color: var(--colorWhite); background: var(--colorPrimary); font-size: 14px; font-weight: 500; padding: 2px 9px; border-radius: 30px; margin-right: 10px; line-height: initial; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; -o-border-radius: 30px; } header .wsus__header_center p a { color: var(--colorWhite); font-size: 15px; font-weight: 500; margin-left: 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } header .wsus__header_center p a:hover { color: var(--colorOrange); } header .wsus__header_right { justify-content: end; } header .wsus__header_right li { position: relative; padding-right: 15px; padding-left: 10px; } header .wsus__header_right li:first-child { padding-right: 15px; } header .wsus__header_right li::after { position: absolute; content: ""; width: 1px; height: 20px; background: rgba(255, 255, 255, 0.20); top: 10px; right: 0; } header .wsus__header_right li:last-child:after { display: none; } header .wsus__header_right li .nice-select { background-color: transparent; border: none; } header .wsus__header_right li .nice-select .current { color: var(--colorWhite); font-size: 14px; font-weight: 600; } header .wsus__header_right li .nice-select:after { border-bottom: 2px solid var(--colorWhite); border-right: 2px solid var(--colorWhite); right: 3px; margin-top: -6px; } header .wsus__header_right li .nice-select .list { margin-top: 0; width: auto; } /* header end */ /* menu start */ .main_menu { height: 80px; padding: 0px 30px; width: 100%; background: var(--colorWhite); position: fixed; top: 40px; left: 0; z-index: 9; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .main_menu .navbar-brand { padding: 0; margin: 0; max-width: 200px; margin-right: 50px; } .main_menu .navbar-brand img { display: inline-block; object-fit: contain !important; width: 100% !important; height: 60px !important; padding: 5px; } .main_menu_2 .navbar-brand { margin-right: 20px; border-right: 1px solid rgba(30, 30, 47, 0.10); padding-right: 15px; } .main_menu .navbar-nav { gap: 40px; line-height: 80px; } .main_menu .navbar-nav .nav-item { position: relative; } .main_menu .navbar-nav .nav-item .nav-link { color: var(--colorBlack); font-size: 15px; font-weight: 500; padding: 0; margin: 0; text-transform: capitalize; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .main_menu .navbar-nav .nav-item:hover .nav-link, .main_menu .navbar-nav .nav-item .nav-link.active { color: var(--colorSecondary); } .main_menu .drop_menu { position: absolute; top: 80%; left: 0; width: 250px; background: var(--colorWhite); line-height: initial; padding: 12px 25px; opacity: 0; visibility: hidden; transition: all linear .25s; -webkit-transition: all linear .25s; -moz-transition: all linear .25s; -ms-transition: all linear .25s; -o-transition: all linear .25s; box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; max-height: 450px; overflow: hidden; overflow-y: auto; z-index: 9; } .main_menu .drop_menu::-webkit-scrollbar { background: var(--colorWhite); width: 3px; height: 30px; } .main_menu .drop_menu::-webkit-scrollbar-thumb { background: var(--paraColor); } .main_menu .drop_menu li a { color: var(--paraColor); font-size: 15px; font-weight: 500; margin: 0; text-transform: capitalize; display: block; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; padding: 12px 0px; position: relative; border-bottom: 1px solid var(--colorWhite); } .main_menu .drop_menu li a::after { position: absolute; content: ""; width: 0px; height: 50%; background: var(--colorPrimary); top: 50%; left: -25px; transform: translateY(-50%); transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; opacity: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .main_menu .drop_menu li a:hover, .main_menu .drop_menu li a.active { color: var(--colorPrimary); } .main_menu .drop_menu li a:hover::after, .main_menu .drop_menu li a.active::after { opacity: 1; width: 4px; } .main_menu .navbar-nav .nav-item:hover .drop_menu { top: 100%; opacity: 1; visibility: visible; } .main_menu .right_menu { display: flex; flex-wrap: wrap; align-items: center; gap: 35px; } .main_menu .right_menu form { border: 1px solid var(--borderColor); align-items: center; } .menu_category { color: var(--colorBlack); font-size: 15px; font-weight: 500; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; cursor: pointer; transition: all linear .3s; border-right: 1px solid var(--borderColor); padding: 11px 22px 11px 20px; margin-right: 10px; position: relative; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .menu_category:hover { color: var(--colorPrimary); } .menu_category i:first-child { color: var(--colorPrimary); } .main_menu .right_menu form .search { display: flex; flex-wrap: wrap; align-items: center; position: relative; margin-right: 5px; } .main_menu .right_menu form .search input { border: none; padding: 6px 40px 6px 10px; width: 350px; } .main_menu .right_menu form .search button { position: absolute; top: 50%; right: 0; width: 35px; height: 35px; background: var(--colorPrimary); color: var(--colorWhite); transition: all linear .3s; transform: translateY(-50%); -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .main_menu .right_menu form .search button:hover { background: var(--colorBlack); } .main_menu .right_menu ul { display: flex; flex-wrap: wrap; align-items: center; padding: 10px 0px; } .main_menu .right_menu ul li .menu_signin { display: flex; flex-wrap: wrap; align-items: center; color: var(--colorBlack); font-size: 15px; font-weight: 500; margin-right: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .main_menu .right_menu ul li .menu_signin:hover { color: var(--colorPrimary); } .main_menu .right_menu ul li .menu_signin span { display: inline-block; margin-right: 5px; width: 17px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .main_menu .right_menu ul li .menu_signin:hover span { filter: brightness(0) saturate(100%) invert(33%) sepia(66%) saturate(2594%) hue-rotate(213deg) brightness(98%) contrast(92%); } .menu_category ul { width: 250px; position: absolute; top: 100%; left: 0; margin-top: 23px; background: var(--colorWhite); box-shadow: 0px 20px 40px 0px rgba(30, 30, 47, 0.10); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; padding: 0 !important; opacity: 0; visibility: hidden; border-top: 1px solid var(--borderColor); z-index: 9; } .menu_category ul::-webkit-scrollbar { background: var(--colorWhite); width: 3px; height: 30px; } .menu_category ul::-webkit-scrollbar-thumb { background: var(--paraColor); } .menu_category ul li { width: 100%; } .menu_category ul li a { position: relative; color: var(--paraColor); font-size: 15px; font-weight: 500; border-bottom: 1px solid rgba(23, 23, 24, 0.10); display: block; padding: 12px 20px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .menu_category ul li:last-child a { border: none; } .menu_category ul li { position: relative; } .menu_category ul li a span { display: inline-block; width: 23px; height: auto; margin-right: 8px; } .menu_category ul li a::after { position: absolute; content: "\f054"; font-family: "Font awesome 5 free"; font-weight: 600; color: var(--colorBlack); font-size: 12px; top: 50%; right: 20px; opacity: 0; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .menu_category ul li:hover>a { color: var(--colorBlack); } .menu_category ul li:hover a::after { opacity: 1; } .menu_category:hover>ul { margin-top: 0; opacity: 1; visibility: visible; } .category_sub_menu { top: 10px !important; left: 100% !important; margin: 0 !important; opacity: 0; visibility: hidden; border: none !important; } .category_sub_menu li a { padding: 12.5px 20px !important; } .category_sub_menu li a::after { display: none !important; } .menu_category ul li:hover .category_sub_menu { top: 0 !important; opacity: 1; visibility: visible; } .main_menu.menu_fix { top: 0; box-shadow: 0px 20px 40px 0px rgb(90 90 106 / 10%); z-index: 999; } @keyframes menu_animate { from { transform: translateY(-100%); -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); } to { transform: translateY(0%); -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); } } /* mobile menu start */ .navbar-toggler { width: 40px; height: 40px; line-height: 40px; background: var(--colorPrimary); color: var(--colorWhite); padding: 0; box-shadow: none !important; border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border: none; } .navbar-toggler.show { background: red; color: var(--colorWhite); } .navbar-toggler .close_icon_close { display: none; } .navbar-toggler.show .close_icon_close { display: inline-block; } .navbar-toggler.show .menu_icon_bar { display: none; } /* mobile menu end */ .mobile_menu_area { display: none; } /* menu end */ /* banner start */ .wsus__banner { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; margin: 120px 30px 0px 30px; padding-left: 125px; padding-right: 80px; height: 700px; position: relative; } .wsus__banner .row { height: 100%; } .wsus__banner_text { position: relative; padding-bottom: 10px; display: flex; flex-direction: column; justify-content: start; align-items: start; } .wsus__banner_text h1 { font-size: 70px; font-weight: 600; line-height: 80px; } .wsus__banner_text p { color: var(--colorBlack); font-size: 16px; font-weight: 400; opacity: .7; max-width: 70%; margin: 20px 0px 45px 0px; } .wsus__banner_text::after { position: absolute; content: ""; background: url(../images/banner_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 70px; height: 52px; top: -70px; left: -30px; animation: banner_animi_1 linear 3s infinite alternate; -webkit-animation: banner_animi_1 linear 3s infinite alternate; } @keyframes banner_animi_1 { from { transform: scale(1)rotate(0deg); -webkit-transform: scale(1)rotate(0deg); -moz-transform: scale(1)rotate(0deg); -ms-transform: scale(1)rotate(0deg); -o-transform: scale(1)rotate(0deg); } to { transform: scale(1.3)rotate(45deg); -webkit-transform: scale(1.3)rotate(45deg); -moz-transform: scale(1.3)rotate(45deg); -ms-transform: scale(1.3)rotate(45deg); -o-transform: scale(1.3)rotate(45deg); } } .wsus__banner::after { position: absolute; content: ""; background: url(../images/banner_shapes_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 85px; height: 100px; bottom: 0px; right: 110px; animation: banner_animi_2 linear 3s infinite alternate; -webkit-animation: banner_animi_2 linear 3s infinite alternate; } @keyframes banner_animi_2 { from { transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); } to { transform: translateX(-40px); -webkit-transform: translateX(-40px); -moz-transform: translateX(-40px); -ms-transform: translateX(-40px); -o-transform: translateX(-40px); } } .wsus__banner::before { position: absolute; content: ""; background: url(../images/banner_shapes_3.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 180px; height: 100px; bottom: -100px; right: 350px; animation: banner_animi_3 linear 1s infinite alternate; -webkit-animation: banner_animi_3 linear 1s infinite alternate; } @keyframes banner_animi_3 { 0% { filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(0%) hue-rotate(235deg) brightness(107%) contrast(107%); } 10% { filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(0%) hue-rotate(235deg) brightness(107%) contrast(107%); } } .wsus__banner_image { position: relative; } .wsus__banner_image .text { position: absolute; bottom: -15px; left: 40px; background: var(--colorWhite); box-shadow: 0px 20px 40px 0px rgba(30, 30, 47, 0.08); padding: 15px 20px 15px 70px; animation: banner_image_animi 1s ease infinite alternate; -webkit-animation: banner_image_animi 1s ease infinite alternate; } @keyframes banner_image_animi { from { transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); } to { transform: translateY(-15px); -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); } } .wsus__banner_image .text h4 { font-size: 15px; font-weight: 500; } .wsus__banner_image .text p { color: var(--colorBlack); font-size: 13px; font-weight: 500; opacity: .6; margin-top: 5px; } .wsus__banner_image .text::after { position: absolute; content: ""; background: url(../images/banner_img_icon.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 37px; height: 30px; top: 20px; left: 20px; box-shadow: 0px 14px 14px 0px rgba(30, 30, 47, 0.20); } /* banner end */ /* about us start */ .wsus__about_img { padding-left: 70px; position: relative; } .wsus__about_img::after { position: absolute; content: ""; background: url(../images/about_shapes.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 70px; height: 78px; bottom: 100px; left: 0; animation: banner_image_animi 1s ease infinite alternate; } .wsus__about_text p { margin-bottom: 20px; } .wsus__about_text ul li { position: relative; color: var(--colorBlack); font-size: 16px; font-weight: 500; line-height: 38px; padding-left: 32px; } .wsus__about_text ul li::after { position: absolute; content: ""; background: url(../images/check_icon_green.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 22px; height: 22px; top: 9px; left: 0; } /* about us end */ /* brand start */ .wsus__brand_slider_area { overflow: hidden; } .wsus__brand_slider_area h6 { text-align: center; font-size: 20px; font-weight: 600; margin-bottom: 45px; } .wsus__brand_slider_area ul { justify-content: space-between; gap: 120px; } .wsus__brand_slider_area ul li { width: 80px; height: 80px; overflow: hidden; text-align: center; } .wsus__brand_slider_area ul li a { display: inline-block; transition: all linear .3s; opacity: .5; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__brand_slider_area ul li a:hover { opacity: 1; } /* brand end */ /* partners start */ .wsus__partners_slider_area { overflow: hidden; } .wsus__partners_slider_area h1 { text-align: center; font-size: 44px; font-weight: 600; margin-top: 30px; margin-bottom: 50px; } .wsus__partners_slider_area ul { justify-content: space-between; gap: 70px; } .wsus__partners_slider_area ul li { width: 300px !important; height: 200px !important; overflow: hidden; text-align: center; } .wsus__partners_slider_area ul li a img { width: 300px !important; height: 200px !important; object-fit: contain !important; } .wsus__partners_slider_area ul li a { display: inline-block; transition: all linear .5s; /* opacity: .5; */ -webkit-transition: all linear .5s; -moz-transition: all linear .5s; -ms-transition: all linear .5s; -o-transition: all linear .5s; } .wsus__partners_slider_area ul li a:hover { opacity: 1; } @keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } /* partners end */ /* category start */ .wsus__category { margin: 0px 30px; padding: 0px 130px; background: var(--colorLightBg); } .wsus__category_item { position: relative; height: 250px; overflow: hidden; display: block; margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .category_slider .wsus__category_item, .category_slider .wsus__category_item_2 { margin: 25px 12px 0 12px; } .wsus__category_item::after { position: absolute; content: ""; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(30, 30, 47, 0.00) 0%, #1E1E2F 100%); top: 0; left: 0; z-index: 1; } .wsus__category_text { position: absolute; width: 100%; bottom: 30px; left: 30px; align-items: center; z-index: 2; } .wsus__category_text .icon { width: 70px; height: 70px; background: var(--colorOrange); border-radius: 50%; overflow: hidden; padding: 15px; margin-right: 15px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__category_text .text { max-width: 80%; } .wsus__category_text .text h5 { color: var(--colorWhite); font-size: 18px; font-weight: 600; margin-bottom: 5px; } .wsus__category_text .text p { color: var(--colorWhite); font-size: 14px; font-weight: 500; opacity: .6; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__category_text .text p i { margin-left: 5px; } .wsus__category_item:hover .text p { opacity: 1; color: var(--colorOrange); } .wsus__category_item:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } /* category end */ /* call to action start */ .wsus__call_to_action { padding: 0px 160px; position: relative; z-index: 1; margin-top: -135px; } .wsus__call_to_action_bg { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; overflow: hidden; } .wsus__call_to_action_text { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } .wsus__call_to_action_text .img { width: 240px; height: 270px; margin-right: 120px; } .wsus__call_to_action_text h3 { color: var(--colorWhite); font-size: 44px; font-weight: 600; line-height: 54px; max-width: 50%; } .wsus__call_to_action_text a { background: var(--colorWhite); color: var(--colorBlack); } /* call to action end */ /* courses start */ .wsus__filter_area ul { border-bottom: 1px solid var(--borderColor); padding-bottom: 20px; gap: 35px; } .wsus__filter_area ul li button { color: var(--paraColor); font-size: 16px; font-weight: 500; padding: 0; margin: 0; position: relative; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__filter_area ul li button::after { position: absolute; content: ""; width: 100%; height: 4px; background: var(--colorPrimary); bottom: -21px; left: 0; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__filter_area ul li button:hover, .wsus__filter_area ul li button.active { background: transparent !important; color: var(--colorBlack) !important; } .wsus__filter_area ul li button.active::after { opacity: 1; } .wsus__single_courses { background: var(--colorWhite); margin-top: 25px; border: 1px solid var(--borderColor); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; position: relative; padding: 10px; overflow: hidden; } .wsus__single_courses_img { height: 210px; overflow: hidden; display: block; position: relative; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_img .main_category, .wsus__single_courses_img .sub_category { position: absolute; bottom: 15px; left: 15px; color: var(--colorBlack); background: var(--colorWhite); font-size: 13px; font-weight: 500; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 3px 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; z-index: 1; } .wsus__single_courses_img .main_category { bottom: 50px; } .wsus__single_courses_img .main_category:hover, .wsus__single_courses_img .sub_category:hover { background: var(--colorOrange); } .wsus__single_courses_img ul { position: absolute; top: 10px; right: -10px; z-index: 9; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_img ul li a { width: 40px; height: 40px; line-height: 40px; background: var(--colorWhite); margin-bottom: 5px; text-align: center; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_img ul li a img { width: 16px !important; height: 16px !important; margin: 0 auto; transform: scale(1) !important; -webkit-transform: scale(1) !important; -moz-transform: scale(1) !important; -ms-transform: scale(1) !important; -o-transform: scale(1) !important; } .wsus__single_courses_img ul li a:hover { background: var(--colorOrange); } .wsus__single_courses:hover .wsus__single_courses_img ul { opacity: 1; right: 10px; } .wsus__single_courses_text { position: relative; padding: 20px 20px 50px 20px; } .wsus__single_courses_text .wishlist { width: 40px; height: 40px; background: var(--colorBlack); border-radius: 50%; position: absolute; top: -20px; right: 20px; overflow: hidden; padding: 11px 10px 11px 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; z-index: 2; display: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__single_courses_text .wishlist:hover { background: var(--colorPrimary); } .wsus__single_courses_text .rating { display: inline-block; border: 1px solid var(--borderColor); color: var(--ratingColor); padding: 3px 10px; margin-bottom: 15px; } .wsus__single_courses_text .rating span { font-size: 15px; font-weight: 500; margin-left: 10px; } .wsus__single_courses_text ul { display: inline-flex; flex-wrap: wrap; background: #EFEFF8; margin-top: 15px; margin-bottom: 18px; } .wsus__single_courses_text ul li { position: relative; color: var(--colorBlack); font-size: 14px; font-weight: 400; padding: 5px 14px 5px 38px; } .wsus__single_courses_text ul li:first-child { border-right: 1px solid rgba(30, 30, 47, 0.14); } .wsus__single_courses_text ul li::after { position: absolute; content: ""; background: url(../images/book_icon.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 16px; height: 16px; top: 7px; left: 14px; } .wsus__single_courses_text ul li:last-child:after { background: url(../images/user_icon_gray.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 16px; height: 16px; } .wsus__single_courses_text .category, .wsus__single_courses_text .category a { display: inline-block; font-size: 15px; font-weight: 400; } .wsus__single_courses_text .category a { border: none; color: var(--paraColor); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-bottom: 1px solid var(--borderColor); } .wsus__single_courses_text .category a:hover { color: var(--colorPrimary); border-color: var(--colorPrimary); } .wsus__single_courses_text .author { display: flex; flex-wrap: wrap; align-items: center; margin-top: 30px; } .wsus__single_courses_text .author .img { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; margin-right: 12px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__single_courses_text .author p { color: var(--colorBlack); font-size: 14px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_text .author:hover p { color: var(--colorPrimary); } .wsus__single_courses_footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 15px 30px 5px 30px; position: relative; } .wsus__single_courses_footer::after { position: absolute; content: ""; width: 110%; height: 1px; background: rgba(30, 30, 47, 0.06); top: 0; left: -20px; } .wsus__single_courses_footer p { color: var(--colorPrimary); font-size: 18px; font-weight: 700; } .wsus__single_courses_footer p del { color: var(--paraColor); font-size: 18px; font-weight: 500; margin-right: 10px; } .wsus__single_courses_img::after { position: absolute; content: ""; width: 100%; height: 100%; border: 50px solid var(--colorWhite); top: 0; right: 0; z-index: 1; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses:hover .wsus__single_courses_img:after { border: 0px solid var(--colorWhite); opacity: .6; } .wsus__single_courses:hover .wsus__single_courses_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } /* courses end */ /* hotline start */ .wsus__hotline { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; padding: 60px 0px; margin-left: 160px; margin-right: 160px; } .wsus__hotline_text { width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; } .wsus__hotline_text .call { text-align: right; } .wsus__hotline_text .mail { text-align: left; } .wsus__hotline_text .call p, .wsus__hotline_text .mail p { color: var(--colorWhite); font-size: 20px; font-weight: 500; text-transform: uppercase; display: inline-flex; flex-wrap: wrap; align-items: center; } .wsus__hotline_text .call p span, .wsus__hotline_text .mail p span { display: inline-block; width: 45px; height: 45px; line-height: 17px; border: 1px solid rgba(255, 255, 255, 0.20); padding: 14px; } .wsus__hotline_text .call a, .wsus__hotline_text .mail a { color: var(--colorWhite); font-size: 26px; font-weight: 500; opacity: .8; display: block; margin-top: 13px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__hotline_text .call a:hover, .wsus__hotline_text .mail a:hover { color: var(--colorOrange); opacity: 1; } .wsus__hotline_text .or { color: var(--colorBlack); text-align: center; font-size: 25px; font-weight: 500; width: 80px; height: 80px; line-height: 80px; background: var(--colorWhite); border-radius: 50%; text-transform: uppercase; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__hotline_text .call p span { margin-left: 15px; } .wsus__hotline_text .mail p span { margin-right: 15px; } /* hotline end */ /* become instructor start */ .wsus__become_instructor { position: relative; } .wsus__become_instructor::after { position: absolute; content: ""; background: url(../images/about_3_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 60px; height: 60px; top: 45px; left: 155px; } .wsus__become_instructor::before { position: absolute; content: ""; background: url(../images/about_3_shapes_4.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 30px; height: 30px; bottom: -30px; left: 240px; } .wsus__become_instructor .wsus__section_heading h5 { color: var(--paraColor); font-weight: 600; position: relative; padding: 0px 0px 0px 30px; background: none; text-transform: capitalize; } .wsus__become_instructor .wsus__section_heading h5::after { position: absolute; content: ""; background: url(../images/book_icon_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 25px; height: 25px; top: -5px; left: -4px; } .wsus__become_instructor_text p { width: 80%; margin-bottom: 45px; } .wsus__become_instructor_img { position: relative; height: 490px; } .wsus__become_instructor_img::after { position: absolute; content: ""; background: url(../images/about_3_shapes_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 80px; height: 80px; top: 50px; right: -110px; animation: banner_animi_1 linear 3s infinite alternate; -webkit-animation: banner_animi_1 linear 3s infinite alternate; } /* become instructor end */ /* instructor start */ .wsus__instructor { position: relative; z-index: 1; margin-left: 30px; margin-right: 30px; } .wsus__instructor::after { position: absolute; content: ""; width: 100%; height: 590px; background: var(--colorLightBg); top: 0; left: 0; z-index: -1; } .wsus__academic_programme { position: relative; padding-bottom: 50px; margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__academic_programme_img { height: 530px; position: relative; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__academic_programme_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__academic_programme_text { text-align: center; position: absolute; width: 90%; bottom: 0; background: var(--colorWhite); left: 5%; padding: 25px 25px 25px 25px; box-shadow: 0px 30px 30px 0px rgba(30, 30, 47, 0.10); border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__academic_programme_text p { text-align: center; font-weight: 500; } .wsus__academic_programme_text ul { justify-content: center; gap: 10px; margin-bottom: 25px; } .wsus__academic_programme_text ul li { width: 30px; height: 30px; overflow: hidden; } .wsus__academic_programme .common_btn_2 { width: 100%; } .wsus__academic_programme:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .wsus__academic_programme:hover .wsus__academic_programme_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } .instructor_slider .wsus__academic_programme { margin: 25px 12px 55px 12px; } /* academic programme end */ /* counter start */ .wsus__counter_bg { background-color: var(--colorPrimary) !important; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; padding: 45px 0; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__single_counter { border-right: 1px solid rgba(255, 255, 255, 0.24); padding: 0px 65px; } .wsus__single_counter h2 { display: block; width: 100%; } .wsus__single_counter h2, .wsus__single_counter h2 span { color: var(--colorWhite); font-size: 44px; font-weight: 600; } .wsus__single_counter p { color: var(--colorWhite); font-weight: 500; text-transform: uppercase; opacity: .7; } /* counter end */ /* faq start */ .wsus__faq_text .wsus__section_heading h2 { color: var(--colorSecondary); font-size: 40px; font-weight: 500; margin-bottom: 10px; } .wsus__faq_img { position: relative; } .wsus__faq_img::after { position: absolute; content: ""; background: url(../images/faq_shapes_3.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 45px; height: 45px; top: 60px; left: -200px; } .wsus__faq_img::before { position: absolute; content: ""; background: url(../images/faq_shapes_4.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 30px; height: 30px; bottom: 250px; left: -70px; animation: banner_animi_2 linear 2s infinite alternate; -webkit-animation: banner_animi_2 linear 2s infinite alternate; } .wsus__faq_text { position: relative; } .accordion-item { margin-top: 12px; border: 1px solid rgba(30, 30, 47, 0.10) !important; border-radius: 10px !important; -webkit-border-radius: 10px !important; -moz-border-radius: 10px !important; -ms-border-radius: 10px !important; -o-border-radius: 10px !important; } .accordion-item button { color: var(--colorPrimary); font-size: 18px; font-weight: 500; transition: all linear .3s; border-radius: 10px !important; background: var(--colorWhite); -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; box-shadow: none; -webkit-border-radius: 10px !important; -moz-border-radius: 10px !important; -ms-border-radius: 10px !important; -o-border-radius: 10px !important; } .accordion-item .accordion-button:not(.collapsed) { color: var(--colorWhite); background-color: var(--colorPrimary); box-shadow: none; } .accordion-button::after { background: var(--colorWhite); background-image: url(../images/arrow_down.png); width: 32px; height: 32px; text-align: center; border: 1px solid rgba(30, 30, 47, 0.12); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; background-position: center; background-repeat: no-repeat; padding: 5px; } .accordion-button:not(.collapsed)::after { background-image: url(../images/arrow_up.png); border-color: var(--colorWhite); } .accordion-button:focus { box-shadow: none; } .accordion-item .accordion-body { padding: 30px 20px; color: var(--colorPrimary); font-size: 15px; font-weight: 400; line-height: 26px; } /* Force bullets ONLY for the programmes list */ .accordion-body ul, .accordion-body ol { list-style: disc !important; /* show disc bullets */ margin: 0 0 .5rem 1.25rem !important; padding-left: 1.25rem !important; /* space so bullets aren’t clipped */ } .accordion-body ul li, .accordion-body ol li{ display: list-item !important; /* ensure markers render */ list-style-position: outside !important; list-style: inherit !important; margin: .25rem 0; } /* In case some theme nukes the marker itself */ .accordion-body ul li::marker, .accordion-body ol li::marker{ content: initial !important; } /* faq end */ /* testimonial start */ .wsus__testimonial { position: relative; /* background: var(--colorLightBg); */ padding: 0px 25px; } .wsus__single_testimonial { background: var(--colorWhite); padding: 30px 40px; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); margin: 10px 12px 10px 12px; position: relative; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__single_testimonial .rating { color: var(--ratingColor); } .wsus__single_testimonial .description { line-height: 20px; margin-top: 10px; margin-bottom: 15px; font-style: italic; display: -webkit-box; -webkit-line-clamp: 2; /* number of lines to show */ -webkit-box-orient: vertical; overflow: hidden; } .wsus__single_testimonial h3 { font-size: 20px; font-weight: 600; } .wsus__single_testimonial h3 span { display: block; font-weight: 500; margin-top: 5px; } .wsus__single_testimonial .testimonial_logo { width: 100px; height: 25px; } .wsus__testimonial_header { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; margin-top: 0px !important; } .wsus__testimonial_header .img { width: 60px; height: 60px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__testimonial .total_review { display: inline-block; background: #E0E0F0; color: var(--colorBlack); font-size: 15px; font-weight: 500; padding: 10px 30px; } .wsus__testimonial .total_review a { color: var(--colorPrimary); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__testimonial .total_review a:hover { color: var(--colorBlack); } /* testimonial end */ /* blog start */ .wsus__single_blog { margin-top: 25px; } .wsus__single_blog_img { position: relative; overflow: hidden; height: 245px; } .wsus__single_blog_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_blog_img .category { position: absolute; top: 20px; left: 20px; color: var(--colorWhite); font-size: 12px; font-weight: 600; text-transform: uppercase; background: var(--colorPrimary); padding: 2px 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; z-index: 2; } .wsus__single_blog_img .category:hover { background: var(--colorOrange); color: var(--colorBlack); } .wsus__single_blog_text .date { color: var(--paraColor); font-size: 13px; font-weight: 500; text-transform: uppercase; padding-left: 20px; position: relative; margin-top: 25px; margin-bottom: 10px; } .wsus__single_blog_text .date::after { position: absolute; content: ""; background: url(../images/calendar_blue.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 15px; height: 15px; top: 2px; left: 0; } .wsus__single_blog_text .title { margin-bottom: 20px; } .wsus__single_blog_text .read_btn i { width: 30px; height: 30px; line-height: 30px; text-align: center; border-radius: 50%; border: 1px solid var(--borderColor); font-size: 14px; background: var(--colorWhite); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__single_blog_text .read_btn:hover i { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .blog_slider .wsus__single_blog { margin: 0px 12px; } .wsus__blog .nextArrow, .wsus__blog .prevArrow { top: -110px; } .wsus__blog .prevArrow { left: auto; right: 67px; } .wsus__single_blog_img::after { position: absolute; content: ""; width: 100%; height: 100%; border: 50px solid var(--colorWhite); top: 0; right: 0; z-index: 1; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_blog:hover .wsus__single_blog_img:after { border: 0px solid var(--colorWhite); opacity: .6; } .wsus__single_blog:hover .wsus__single_blog_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } /* blog end */ /* subscriprion start */ .wsus__subscription { background: #282870; padding: 60px 0px; } .wsus__subscription_text { position: relative; width: 70%; } .wsus__subscription_text::after { position: absolute; content: ""; background: url(../images/subscription_shapes.png); background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; width: 100px; height: 100px; bottom: -60px; right: -240px; animation: about_2_animi_2 linear 7s infinite; -webkit-animation: about_2_animi_2 linear 7s infinite; } .wsus__subscription_text h2 { color: var(--colorWhite); font-size: 30px; font-weight: 600; line-height: 40px; } .wsus__subscription_form { position: relative; overflow: hidden; padding-left: 150px; } .wsus__subscription_form input { padding: 10.3px 20px; } .wsus__subscription_form button { position: absolute; top: 0; right: -1px; height: 100%; } /* subscriprion end */ /* footer start */ footer { background: #030611; } .wsus__footer_top { border-bottom: 1px solid rgba(255, 255, 255, 0.10); } .wsus__footer_top_logo { border-right: 1px solid rgba(255, 255, 255, 0.10); padding: 50px 0px 45px 0px; } .wsus__footer_top_logo a { display: inline-block; width: 145px; margin-bottom: 15px; } .wsus__footer_top_logo p { color: var(--colorWhite); line-height: 26px; opacity: .6; } .wsus__footer_subscribe { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; height: 100%; padding-left: 45px; } .wsus__footer_subscribe h3 { color: var(--colorWhite); font-size: 24px; font-weight: 600; max-width: 350px; } .wsus__footer_subscribe form { width: 370px; position: relative; } .wsus__footer_subscribe form input { border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .wsus__footer_subscribe form button { position: absolute; top: 0; right: 0; padding: 0px 24px; height: 100%; } .wsus__footer_subscribe form button:after { opacity: .2; } .wsus__footer_info { border-right: 1px solid rgba(255, 255, 255, 0.10); padding: 50px 0px 70px 0px; } .wsus__footer_info .call_mail { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 20px; } .wsus__footer_info .call_mail .icon { background: rgba(255, 255, 255, 0.10); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12); width: 45px; height: 45px; line-height: 45px; text-align: center; } .wsus__footer_info .call_mail .icon img { width: 20px !important; height: 20px !important; } .wsus__footer_info .call_mail .text { width: 80%; } .wsus__footer_info .call_mail .text h3 { color: var(--colorWhite); font-size: 16px; font-weight: 500; } .wsus__footer_info .call_mail .text a, .wsus__footer_info .call_mail .text p { color: var(--colorWhite); font-size: 14px; font-weight: 500; opacity: .6; margin-top: 5px; display: block; } .wsus__footer_info h2 { color: var(--colorWhite); font-size: 16px; font-weight: 500; margin-bottom: 12px; margin-top: 35px; } .wsus__footer_info ul { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; } .wsus__footer_info ul li a { display: block; width: 40px; height: 40px; line-height: 40px; text-align: center; color: var(--colorWhite); transition: all linear .3s; background: rgba(255, 255, 255, 0.10); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12); -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__footer_info ul li a:hover { background: var(--colorPrimary); color: var(--colorWhite); } .wsus__footer_link h2 { color: var(--colorWhite); font-size: 20px; font-weight: 700; margin-bottom: 25px; } .wsus__footer_link ul li a { display: block; color: var(--colorWhite); font-weight: 400; opacity: .6; margin-top: 15px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__footer_link ul li a:hover { opacity: 1; color: var(--colorWhite); } .wsus__footer_copyright_area { background: var(--rc-navy-light) !important; padding: 10px 0px; } .wsus__footer_copyright_text { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .wsus__footer_copyright_text p { color: var(--colorWhite); font-size: 14px; opacity: .6; } .wsus__footer_copyright_text p:hover { opacity: 1; } .wsus__logo_area p { font-size: 16px; color: var(--colorWhite); opacity: .6; } .wsus__logo_area h2 { color: var(--colorWhite); font-size: 16px; font-weight: 500; margin-bottom: 12px; margin-top: 40px; } .wsus__logo_area ul { gap: 10px; } .wsus__logo_area ul li a { display: block; width: 40px; height: 40px; line-height: 40px; text-align: center; color: var(--colorWhite); background: rgba(255, 255, 255, 0.10); filter: drop-shadow(0px 4px 3px rgba(30, 30, 47, 0.12)); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__logo_area ul li a:hover { background: var(--colorPrimary); box-shadow: 0px 4px 11px 0px rgba(53, 109, 241, 0.30); } /* footer end */ /*============================ HOME PAGE 01 END ============================*/ /*============================ HOME PAGE 02 START ============================*/ /* header start */ .header_2 { padding: 0px 155px; } /* header end */ /* menu 2 start */ .main_menu_2 { padding: 0px 155px; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12) !important; } .main_menu_2 .right_menu { gap: 20px; } .main_menu_2 .right_menu ul li .menu_signin { width: 45px; height: 45px; border: 1px solid var(--borderColor); position: relative; margin-right: 20px; } .main_menu_2 .right_menu ul li .menu_signin span { margin: 0 auto; width: 20px; } .main_menu_2 .right_menu ul li .menu_signin b { position: absolute; top: -9px; right: -6px; width: 22px; height: 22px; background: var(--colorOrange); text-align: center; line-height: 22px; font-size: 12px; font-weight: 400; border-radius: 50%; color: var(--colorBlack); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .main_menu_2 .common_btn { background: var(--colorOrange); color: var(--colorBlack); padding: 11px 29px; } .main_menu_2 .common_btn:hover { color: var(--colorWhite); } /* menu 2 end */ /* banner 2 start */ .wsus__banner_2 { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; padding: 80px 160px 0px 160px; height: 100vh; position: relative; } .wsus__banner_2 div { height: 100%; } .wsus__banner_text_2 { display: flex; flex-direction: column; justify-content: center; align-items: start; position: relative; padding-bottom: 70px; } .wsus__banner_text_2 h5 { color: rgba(255, 255, 255, 0.70); font-size: 14px; font-weight: 600; text-transform: uppercase; } .wsus__banner_text_2 h5 span { color: var(--colorWhite); font-size: 14px; font-weight: 600; text-transform: uppercase; background: var(--colorPrimary); padding: 5px 10px; position: relative; margin-right: 10px; padding-left: 20px; display: inline-block; } .wsus__banner_text_2 h5 span::after { position: absolute; content: ""; width: 5px; height: 5px; background: var(--colorWhite); top: 10px; left: 10px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__banner_text_2 h1 { color: var(--colorWhite); font-size: 70px; font-weight: 600; line-height: 80px; margin-top: 25px; margin-bottom: 20px; } .wsus__banner_text_2 p { color: var(--colorWhite); font-size: 16px; font-weight: 400; line-height: 26px; opacity: .7; max-width: 80%; margin-bottom: 45px; } .wsus__banner_2_btn_area { height: auto !important; display: flex; flex-wrap: wrap; align-items: center; } .wsus__banner_2_btn_area .common_btn { margin-right: 25px; } .wsus__banner_2_btn_area .common_btn::after { background: none; } .wsus__banner_2_btn_area .play_btn_area { display: flex; flex-wrap: wrap; align-items: center; } .wsus__banner_2_btn_area .play_btn_area h4 { color: var(--colorBlack); font-size: 15px; font-weight: 500; max-width: 140px; } .wsus__banner_image_2 { position: relative; display: flex; flex-direction: column; justify-content: end; } .wsus__banner_image_2 .img { height: 730px !important; position: relative; } .wsus__banner_image_2 .text { height: auto; position: absolute; bottom: 280px; left: -130px; background: var(--colorWhite); padding: 20px 40px 20px 20px; animation: banner_image_animi 1s ease infinite alternate; -webkit-animation: banner_image_animi 1s ease infinite alternate; } .wsus__banner_image_2 .text h4 { color: var(--paraColor); font-size: 14px; font-weight: 400; text-transform: uppercase; margin-bottom: 5px; } .wsus__banner_image_2 .text h4 span { color: var(--colorPrimary); font-size: 24px; font-weight: 600; text-transform: uppercase; } .wsus__banner_image_2 .text img { max-width: 200px; max-height: 40px; } .wsus__banner_2::after { position: absolute; content: ""; background: url(../images/banner_2_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 40px; height: 40px; top: 230px; left: 50px; animation: banner_animi_3 linear 1s infinite alternate; -webkit-animation: banner_animi_3 linear 1s infinite alternate; } .wsus__banner_text_2::after { position: absolute; content: ""; background: url(../images/banner_2_shapes_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 100px; height: 100px; top: 50%; right: -100px; transform: translateY(-50%); animation: banner_2_animi_1 linear 1s infinite alternate; -webkit-animation: banner_2_animi_1 linear 1s infinite alternate; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } @keyframes banner_2_animi_1 { from { margin-right: 0px; } to { margin-right: 10px; } } .wsus__banner_image_2 .img::before { position: absolute; content: ""; background: url(../images/banner_2_shapes_3.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; width: 70px; height: 70px; bottom: 350px; right: 0; } .wsus__banner_image_2 .img::after { position: absolute; content: ""; background: url(../images/banner_2_shapes_4.gif); background-position: center; background-repeat: no-repeat; background-size: cover; width: 35px; height: 35px; bottom: 368px; right: 17px; } /* banner 2 end */ /* headline slider start */ .wsus__headline_slider { position: relative; margin-top: -69px; z-index: 1; } .wsus__headline_slider::after { position: absolute; content: ""; width: 110%; height: 100%; background: var(--colorOrange); top: 0; left: -5%; transform: rotate(-1deg); z-index: -1; -webkit-transform: rotate(-1deg); -moz-transform: rotate(-1deg); -ms-transform: rotate(-1deg); -o-transform: rotate(-1deg); } .wsus__headline_slider .marquee_animi { background: var(--colorBlack); padding: 15px 0px 55px 0px; } .wsus__headline_slider .marquee_animi ul { gap: 120px; } .wsus__headline_slider .marquee_animi ul li { color: var(--colorWhite); font-size: 26px; font-weight: 500; position: relative; text-transform: uppercase; } .wsus__headline_slider .marquee_animi ul li::after { position: absolute; content: ""; background: url(../images/headline_animi_shapes.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 30px; height: 30px; top: 5px; left: -75px; } /* headline slider end */ /* category 2 start */ .wsus__category_item_2 { background: var(--colorLightBg); text-align: center; margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__category_item_2_img { display: block; height: 200px; overflow: hidden; } .wsus__category_item_2_text { padding: 30px; } .wsus__category_item_2_text span { display: block; width: 70px; height: 70px; background: var(--colorPrimary); border-radius: 50%; overflow: hidden; padding: 16px; margin: 0 auto; margin-top: -65px; position: relative; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__category_item_2_text span img { filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(1%) hue-rotate(103deg) brightness(103%) contrast(102%); } .wsus__category_item_2_text .title { font-size: 18px; margin-top: 15px; margin-bottom: 5px; } .wsus__category_item_2_text p { color: var(--colorBlack); font-size: 14px; font-weight: 500; opacity: .6; } .wsus__category_item_2:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .wsus__category_2 .slick-dots { margin-top: 60px; } /* category 2 end */ /* courses 2 start */ .wsus__courses_2 { background: var(--colorLightBg); } .wsus__courses_2 .wsus__section_heading h5, .wsus__event .wsus__section_heading h5 { background: rgba(53, 109, 241, 0.10); } .wsus__single_courses_2 { padding: 0; border: none; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__single_courses_2 .wsus__single_courses_img { height: 200px; position: relative; } .wsus__course_product_page .wsus__single_courses_img::after { display: none; } .wsus__course_product_page .wsus__single_courses_img::before { position: absolute; content: ""; width: 100%; height: 100%; background: #356df1ab; top: 0; left: 0; opacity: 0; z-index: 1; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__course_product_page .wsus__single_courses_img ul { gap: 10px; display: flex; flex-wrap: wrap; position: absolute; justify-content: center; align-items: center; width: 100%; height: 100%; } .wsus__course_product_page .wsus__single_courses_img ul a { border-radius: 50%; background: var(--colorLightBg) !important; box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); margin: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__course_product_page .wsus__single_courses_2:hover .wsus__single_courses_img::before { opacity: 1; } .wsus__course_product_page .wsus__single_courses_2 .wsus__single_courses_img ul li a img { filter: none !important; -webkit-filter: none !important; } .wsus__single_courses_2 .rating { padding: 0; border: none; margin-bottom: 10px; } .wsus__single_courses_2 .rating span { color: var(--colorPrimary); } .wsus__single_courses_2 .wsus__single_courses_text { padding: 20px 25px 30px 25px; } .wsus__single_courses_2 .wsus__single_courses_text ul li:last-child:after { background: url(../images/clock_icon_gray.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 16px; height: 16px; } .wsus__related_courses .wsus__single_courses_2 .wsus__single_courses_img ul li a img { margin: 13px auto; } .wsus__single_courses_2 .author { gap: 12px; margin-top: 15px; } .wsus__single_courses_2 .author .img { margin-right: 0px; } .wsus__single_courses_2 .author .text p { margin-bottom: 5px; } .wsus__single_courses_2 .text .author_list { background: none; margin: 0; } .wsus__single_courses_2 .text .author_list li { font-size: 12px; color: var(--paraColor); padding: 0; padding-right: 10px; margin-right: 10px; border-right: 1px solid rgba(30, 30, 47, 0.14); line-height: 13px; } .wsus__single_courses_2 .text .author_list li::after { display: none; } .wsus__single_courses_2 .text .author_list li:last-child { margin: 0; padding: 0; border: none; } .wsus__single_courses_2 .wsus__single_courses_footer { padding: 15px 0px 15px 0px; margin: 0px 25px 0px 25px; border-top: 1px solid rgba(30, 30, 47, 0.10); } .wsus__single_courses_2 .wsus__single_courses_footer::after { display: none; } .wsus__single_courses_2 .wsus__single_courses_footer a { background: var(--colorOrange); color: var(--colorBlack); font-size: 14px; padding: 7px 23px; } .wsus__single_courses_2 .wsus__single_courses_footer a:hover { color: var(--colorWhite); } .wsus__single_courses_2 .wsus__single_courses_img ul li a { background: var(--colorBlack); } .wsus__single_courses_2 .wsus__single_courses_img ul li a img { filter: brightness(0) saturate(100%) invert(95%) sepia(100%) saturate(14%) hue-rotate(213deg) brightness(104%) contrast(104%); } .wsus__single_courses_2 .wsus__single_courses_img ul li a:hover { background: var(--colorPrimary); } /* courses 2 end */ /* features start */ .wsus__features_item { background: var(--colorWhite); padding: 35px 30px 40px 30px; margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__features_item .icon { width: 60px; height: 60px; } .wsus__features_item h3 { font-size: 18px; font-weight: 600; margin-top: 45px; margin-bottom: 15px; } .wsus__features_item p { line-height: 22px; margin-bottom: 80px; } .wsus__features_item.orange { background: #FDF3CE; border: 1px solid rgba(218, 171, 0, 0.10); } .wsus__features_item.cyan { border: 1px solid rgba(0, 174, 229, 0.10); background: #D8F6FF; } .wsus__features_item.pink { border: 1px solid rgba(229, 0, 135, 0.10); background: #FFE5F4; } .wsus__features_item.blue { border: 1px solid rgba(128, 47, 222, 0.10); background: #E8E2F7; } .wsus__features_item:hover { background: var(--colorOrange); transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } /* features end */ /* about 2 start */ .wsus__about_2 { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } .wsus__about_2_img { position: relative; z-index: 1; } .wsus__about_2_img::after { position: absolute; content: ""; background: url(../images/about_2_shapes.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 95px; height: 115px; top: 110px; right: -20px; z-index: -1; animation: about_2_animi_1 linear 1s infinite alternate; -webkit-animation: about_2_animi_1 linear 1s infinite alternate; } @keyframes about_2_animi_1 { from { transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); } to { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } } .wsus__about_2_img .video { position: absolute; top: 100px; left: -85px; width: 220px; height: 160px; } .wsus__about_2_img .video a { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 50px; height: 50px; line-height: 51px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } .wsus__about_2_text { position: relative; } .wsus__about_2_text::after { position: absolute; content: ""; background: url(../images/about_2_shapes_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 50px; height: 50px; top: 250px; right: -120px; animation: about_2_animi_2 linear 7s infinite; -webkit-animation: about_2_animi_2 linear 7s infinite; } @keyframes about_2_animi_2 { from { transform: rotate(0); -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); } to { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); } } .wsus__about_2_text::before { position: absolute; content: ""; background: url(../images/about_2_shapes_3.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 50px; height: 50px; bottom: -25px; right: auto; left: -90px; animation: banner_image_animi 1s ease infinite alternate; -webkit-animation: banner_image_animi 1s ease infinite alternate; } .wsus__about_2_text ul { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-top: 30px; margin-bottom: 45px; } .wsus__about_2_text ul li { color: var(--colorBlack); font-size: 15px; font-weight: 500; line-height: 38px; padding-left: 30px; position: relative; width: 50%; } .wsus__about_2_text ul li::after { position: absolute; content: "\f00c"; font-family: "font awesome 5 free"; font-weight: 600; font-size: 10px; color: var(--colorBlack); width: 20px; height: 20px; line-height: 20px; text-align: center; background: var(--colorOrange); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; top: 8px; left: 0; } /* about 2 end */ /* related course start */ .wsus__related_courses { background: var(--colorLightBg); } .related_course_slider .wsus__single_courses { margin: 0px 12px 0px 12px; } .wsus__related_courses .wsus__section_heading h5 { background: rgba(53, 109, 241, 0.10); } .wsus__related_courses .slick-dots { margin-top: 30px; margin-bottom: 3px; } /* related course end */ /* event start */ .wsus__event { background: var(--colorLightBg); } .wsus__event .container { position: relative; } .wsus__single_event { background: var(--colorWhite); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12); display: flex; flex-wrap: wrap; align-items: center; margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_event_img { width: 235px; overflow: hidden; height: 230px; position: relative; } .wsus__single_event_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_event_img span { position: absolute; bottom: 15px; left: 15px; background: var(--colorOrange); color: var(--colorBlack); font-size: 14px; font-weight: 500; padding: 4px 10px 2px 32px; } .wsus__single_event_img span::after { position: absolute; content: ""; background: url(../images/calendar_black.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 15px; height: 15px; top: 6px; left: 10px; } .wsus__single_event_text { max-width: 63%; padding: 25px; } .wsus__single_event_text ul { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin-bottom: 10px; } .wsus__single_event_text ul li { color: var(--paraColor); font-size: 14px; font-weight: 400; } .wsus__single_event_text ul li i { color: var(--colorPrimary); font-size: 16px; margin-right: 5px; } .wsus__single_event_text .title { margin-bottom: 40px; } .wsus__event .common_btn { position: absolute; top: 45px; right: 12px; } .wsus__single_event_img::after { position: absolute; content: ""; width: 100%; height: 100%; border: 50px solid var(--colorWhite); top: 0; right: 0; z-index: 1; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_event:hover .wsus__single_event_img:after { border: 0px solid var(--colorWhite); opacity: .4; } .wsus__single_event:hover .wsus__single_event_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } /* event end */ /* instructor 2 start */ .wsus__single_instructor_2 { background: #E5E5F6; text-align: center; margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .instructor_2_slider .wsus__single_instructor_2 { margin: 25px 12px 0px 12px; } .wsus__single_instructor_2_img { position: relative; height: 365px; overflow: hidden; } .wsus__single_instructor_2_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__instructor_2_social_icon { position: absolute; bottom: 5px; right: 20px; height: 40px; } .wsus__instructor_2_social_icon span { display: inline-block; width: 45px; height: 45px; line-height: 45px; text-align: center; background: var(--colorOrange); color: var(--colorBlack); cursor: pointer; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__instructor_2_social_icon .icon { transform: scaleY(.5); transform-origin: bottom; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; opacity: 0; visibility: hidden; position: absolute; bottom: 40px; -webkit-transform: scaleY(.5); -moz-transform: scaleY(.5); -ms-transform: scaleY(.5); -o-transform: scaleY(.5); } .wsus__instructor_2_social_icon .icon li a { width: 45px; height: 45px; line-height: 45px; text-align: center; background: var(--colorOrange); color: var(--colorBlack); margin-bottom: 6px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__instructor_2_social_icon:hover .icon { opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } .wsus__instructor_2_social_icon .icon li a:hover { background: var(--colorWhite); } .wsus__single_instructor_2_text { padding: 25px; } .wsus__single_instructor_2_text .title { text-align: center; } .wsus__single_instructor_2_text .designation { font-weight: 500; margin-top: 2px; margin-bottom: 10px; text-align: center; } .wsus__single_instructor_2_text .rating { color: var(--ratingColor); text-align: center; } .wsus__single_instructor_2_text .rating span { font-size: 15px; font-weight: 500; margin-left: 5px; } .wsus__instructor_2 .slick-dots { margin-top: 60px; } .wsus__single_instructor_2:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .wsus__single_instructor_2:hover img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } /* instructor 2 end */ /* blog 2 start */ .wsus__blog_2 .container { position: relative; } .wsus__single_blog_2 { background: var(--colorLightBg); margin-top: 25px; } .wsus__single_blog_2_img { height: 315px; overflow: hidden; position: relative; } .wsus__single_blog_2_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_blog_2_img .category { position: absolute; top: 20px; left: 20px; color: var(--colorWhite); font-size: 12px; font-weight: 600; text-transform: uppercase; background: var(--colorPrimary); padding: 2px 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; z-index: 2; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_blog_2_img .category:hover { background: var(--colorOrange); color: var(--colorBlack); } .wsus__single_blog_2_text { padding: 25px 30px 30px 30px; } .wsus__single_blog_2_text ul { margin-bottom: 17px; } .wsus__single_blog_2_text ul li { color: var(--paraColor); font-size: 14px; font-weight: 500; border-right: 1px solid rgba(30, 30, 47, 0.14); padding-right: 15px; margin-right: 15px; line-height: 15px; } .wsus__single_blog_2_text ul li span { display: inline-block; width: 17px; margin-right: 5px; position: relative; top: -2px; } .wsus__single_blog_2_text ul li:last-child { border: none; margin: 0; padding: 0; } .wsus__single_blog_2_text p { color: rgba(30, 30, 47, 0.70); font-size: 15px; font-weight: 400; line-height: 26px; border-top: 1px solid rgba(30, 30, 47, 0.10); padding-top: 20px; margin-top: 20px; margin-bottom: 20px; } .wsus__blog_2 .common_btn { position: absolute; top: 45px; right: 12px; } .wsus__single_blog_2_img::after { position: absolute; content: ""; width: 100%; height: 100%; border: 50px solid var(--colorWhite); top: 0; right: 0; z-index: 1; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_blog_2:hover .wsus__single_blog_2_img:after { border: 0px solid var(--colorWhite); opacity: .6; } .wsus__single_blog_2:hover .wsus__single_blog_2_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } /* blog 2 end */ .footer_2 { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } .footer_2 .wsus__footer_link { padding-top: 45px; padding-left: 45px; } .footer_2 .wsus__footer_instagram { padding-top: 45px; } /*============================ HOME PAGE 02 END ============================*/ /*============================ HOME PAGE 03 START ============================*/ .header_3 { padding: 0px 160px; } /* menu 3 start */ .main_menu_3 { top: 40px; padding: 0px 160px; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); animation: none !important; } .main_menu_3 .navbar-brand { margin-right: 20px; } .main_menu_3 .menu_category { border-radius: 6px; background: rgba(30, 30, 47, 0.10); padding: 12px 20px; border: none; margin: 0; align-items: initial; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .main_menu_3 .menu_category .icon { display: inline-block; width: 18px; height: 18px; margin-right: 5px; } .main_menu_3 .menu_category:hover .icon { filter: brightness(0) saturate(100%) invert(38%) sepia(33%) saturate(7247%) hue-rotate(214deg) brightness(100%) contrast(90%); } .main_menu_3 .menu_category ul { border-top: 0; } .main_menu_3 .right_menu { gap: 20px; } .main_menu_3 .right_menu .menu_search_btn { display: inline-block; width: 18px; cursor: pointer; } .main_menu_3 .right_menu ul li .menu_signin, .main_menu_4 .right_menu ul li .menu_signin { position: relative; border-right: 1px solid rgba(30, 30, 47, 0.20); padding-right: 40px; margin-right: 25px; } .main_menu_3 .right_menu ul li .menu_signin span, .main_menu_4 .right_menu ul li .menu_signin span { margin-right: 0; width: auto; } .main_menu_3 .right_menu ul li .menu_signin b, .main_menu_4 .right_menu ul li .menu_signin b { position: absolute; top: -8px; right: 29px; width: 22px; height: 22px; background: var(--colorPrimary); text-align: center; line-height: 22px; font-size: 12px; font-weight: 400; border-radius: 50%; color: var(--colorWhite); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .main_menu_4 .right_menu ul li .admin, .main_menu_3 .right_menu ul li .admin { color: var(--colorBlack); text-transform: capitalize; font-size: 15px; font-weight: 500; margin-right: 20px; display: flex; flex-wrap: wrap; align-items: center; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .main_menu_4 .right_menu ul li .admin span, .main_menu_3 .right_menu ul li .admin span { display: inline-block; width: 17px; position: relative; top: -1px; margin-right: 5px; } .main_menu_4 .right_menu ul li .admin:hover, .main_menu_3 .right_menu ul li .admin:hover { color: var(--colorPrimary); } .main_menu_4 .right_menu ul li .admin:hover span, .main_menu_3 .right_menu .menu_search_btn:hover, .main_menu_3 .right_menu ul li .admin:hover span { filter: brightness(0) saturate(100%) invert(38%) sepia(33%) saturate(7247%) hue-rotate(214deg) brightness(100%) contrast(90%); } .wsus__menu_3_search_area { width: 100%; height: 100%; background: #ffffffeb; position: fixed; top: 0; left: 0; z-index: 999; display: flex; justify-content: center; align-items: center; transform: scale(.85); opacity: 0; visibility: hidden; -webkit-transform: scale(.85); -moz-transform: scale(.85); -ms-transform: scale(.85); -o-transform: scale(.85); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__menu_3_search_area form { box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; padding: 30px; width: 650px; position: relative; background: var(--colorWhite); } .wsus__menu_3_search_area form input { border: 1px solid var(--borderColor); padding: 15px 35px; } .wsus__menu_3_search_area form button { position: absolute; top: 35px; right: 35px; } .wsus__menu_3_search_area form span { position: absolute; top: -50px; right: 0; color: var(--paraColor); font-size: 20px; cursor: pointer; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__menu_3_search_area form span:hover { color: red; } .wsus__menu_3_search_area.show_search { transform: scale(1); opacity: 1; visibility: visible; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } /* menu 3 end */ /* banner 3 star */ .wsus__banner_3 { padding: 120px 160px 0px 161px; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; height: 100vh; position: relative; border-bottom: 1px solid #eee; /* overflow: hidden; */ } .wsus__banner_3 div { height: 100%; } .wsus__banner_3_text { padding-top: 120px; padding-bottom: 170px; } .wsus__banner_3_text h5 { color: var(--paraColor); font-size: 16px; font-weight: 400; position: relative; padding-left: 30px; } .wsus__banner_3_text h1 { font-size: 80px; font-weight: 600; line-height: 90px; padding-right: 50px; margin-top: 15px; margin-bottom: 20px !important; color: var(--colorPrimary); } .wsus__banner_3_text h2 { font-size: 60px; font-weight: 600; line-height: 70px; padding-right: 50px; margin-top: 0 !important; margin-bottom: 20px !important; color: var(--colorPrimary); } .wsus__banner_3_text h1 span { color: var(--colorSecondary); } .wsus__banner_3_text .description { font-size: 16px; line-height: 26px; max-width: 80%; } .wsus__banner_3_text .rating { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 40px; margin-bottom: 20px; height: auto; } .wsus__banner_3_text .rating p { color: var(--colorPrimary); } .wsus__banner_3_text .rating span { opacity: .5; color: var(--colorBlack); text-transform: uppercase; } .wsus__banner_3_text_bottom { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; height: auto !important; } .wsus__banner_3_text_bottom .img { width: 110px; } .wsus__banner_3_text_bottom h4 { font-size: 14px; font-weight: 600; } .wsus__banner_3_text_bottom h4 span { display: block; font-size: 12px; margin-top: 5px; } .wsus__banner_3_img { position: relative; margin-top: 40px; } .wsus__banner_3_img .img { height: 750px; position: relative; } .wsus__banner_3_img .text { height: auto; position: absolute; top: 320px; left: -155px; background: var(--colorWhite); padding: 15px 20px 15px 70px; border-radius: 6px; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); animation: banner_image_animi 1s ease infinite alternate; -webkit-animation: banner_image_animi 1s ease infinite alternate; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__banner_3_img .text h4 { font-size: 15px; font-weight: 500; } .wsus__banner_3_img .text p { color: var(--colorBlack); font-size: 13px; font-weight: 500; opacity: .6; margin-top: 5px; } .wsus__banner_3_img .text::after { position: absolute; content: ""; background: url(../images/banner_img_icon.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 37px; height: 30px; top: 20px; left: 20px; box-shadow: 0px 14px 14px 0px rgba(30, 30, 47, 0.20); } .wsus__banner_features { position: absolute; bottom: -65px; left: 50%; width: 1250px; justify-content: space-between; gap: 15px; z-index: 2; background: var(--colorWhite); padding: 10px; border: 1px solid #eee; border-radius: 15px; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); -webkit-border-radius: 15px; -moz-border-radius: 15px; -ms-border-radius: 15px; -o-border-radius: 15px; } .wsus__banner_features li { width: 32.4%; padding: 15px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__banner_features li .icon { width: 80px; height: 80px; padding: 15px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__banner_features li .text { width: 73%; height: auto; } .wsus__banner_features li .text h4 { font-size: 18px; font-weight: 600; } .wsus__banner_features li .text p { line-height: 22px; margin-top: 5px; } .wsus__banner_features li.green { background: #D5F8EF; } .wsus__banner_features li.green .icon { background: #14B789; } .wsus__banner_features li.pink { background: #FFE5F4; } .wsus__banner_features li.pink .icon { background: #E50087; } .wsus__banner_features li.sky { background: #D8F6FF; } .wsus__banner_features li.sky .icon { background: #00AEE5; } .wsus__banner_3_img .circle_box { position: absolute; top: 140px; right: -35px; width: 150px; height: 150px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); border-radius: 50%; padding: 5px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__banner_3_img .circle_box svg { font-size: 11px; font-weight: 500; text-transform: uppercase; animation: circle_animi linear 25s infinite; -webkit-animation: circle_animi linear 25s infinite; } @keyframes circle_animi { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); } to { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); } } .wsus__banner_3_img .circle_box::after { position: absolute; content: ""; width: 50px; height: 50px; background: url(../images/banner_3_img_shapes.png); background-position: center; background-repeat: no-repeat; background-size: cover; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } /* banner 3 end */ /* features 3 start */ .wsus__features_3 .wsus__features_item { border-radius: 10px; border: none; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__features_item_3 { background: var(--colorLightBg); height: 100% !important; margin-top: 25px; padding: 35px 30px 0px 30px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__features_item_3 .icon { width: 70px; height: 70px; padding: 15px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__features_item_3 a { display: block; font-size: 18px; margin-top: 30px; margin-bottom: 15px; max-width: 80%; } .wsus__features_item_3 p { margin-bottom: 55px; } .wsus__features_item_3 span { color: var(--colorBlack); font-size: 14px; font-weight: 500; border-radius: 6px; background: var(--colorWhite); box-shadow: 0px 1px 3px 0px rgba(30, 30, 47, 0.20); padding: 5px 14px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__features_item_3:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } /* features 3 end */ /* about us 3 start */ .wsus__about_3 { position: relative; } .wsus__about_3_img { position: relative; text-align: center; } .wsus__about_3_img .about_3_large { width: 480px !important; height: auto !important; } .wsus__about_3_img .text { height: auto; position: absolute; bottom: 110px; left: 0; background: var(--colorWhite); padding: 20px 40px 20px 20px; border-radius: 10px; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); animation: banner_image_animi 1s ease infinite alternate; -webkit-animation: banner_image_animi 1s ease infinite alternate; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__about_3_img .text h4 { color: var(--paraColor); font-size: 14px; font-weight: 400; text-transform: uppercase; margin-bottom: 5px; } .wsus__about_3_img .text h4 span { color: var(--colorPrimary); font-size: 24px; font-weight: 600; text-transform: uppercase; } .wsus__about_3_img .text img { max-width: 200px; max-height: 40px; } .wsus__about_3_img .circle_box { position: absolute; top: 55px; right: 55px; width: 150px; height: 150px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); border-radius: 50%; padding: 5px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__about_3_img .circle_box svg { font-size: 11px; font-weight: 500; text-transform: uppercase; animation: circle_animi linear 25s infinite; -webkit-animation: circle_animi linear 25s infinite; } /* academic partners start */ .wsus__about_3_img h3 { color: var(--colorPrimary); font-size: 20px; font-weight: 700; margin-top: 10px; margin-bottom: 0; } .wsus__about_3_img h3 span { color: var(--colorPrimary); font-size: 16px; font-weight: 400; text-transform: uppercase; } .wsus__about_3_text { position: relative; } .wsus__about_3_text p { line-height: 26px; } .wsus__about_3_text ul { margin-top: 25px; margin-bottom: 50px; } .wsus__about_3_text ul li { position: relative; color: var(--colorBlack); font-size: 15px; font-weight: 400; padding-left: 30px; margin-top: 13px; } /* about us 3 end */ /* courses 3 start */ .wsus__courses_3 .wsus__section_heading h5 { background: none; } .wsus__filter_area { text-align: center; } .wsus__courses_3 .wsus__filter_area ul { border: 1px solid var(--borderColor); padding: 0; gap: 10px; display: inline-flex; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__courses_3 .wsus__filter_area ul li button::after { display: none; } .wsus__courses_3 .wsus__filter_area ul li button { color: var(--colorBlack); font-size: 15px; padding: 6px 24px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__courses_3 .wsus__filter_area ul li button:hover, .wsus__courses_3 .wsus__filter_area ul li button.active { background: var(--colorPrimary) !important; color: var(--colorWhite) !important; } .wsus__courses_3 { background: var(--colorLightBg); } .wsus__single_courses_3 { border-radius: 10px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; overflow: hidden; } .wsus__single_courses_3_img { position: relative; height: 200px; overflow: hidden; } .wsus__single_courses_3_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_3_img ul { position: absolute; top: 10px; left: -10px; z-index: 9; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_3_img ul li a { width: 40px; height: 40px; line-height: 40px; background: var(--colorWhite); margin-bottom: 5px; text-align: center; border-radius: 6px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_courses_3_img ul li a:hover { background: var(--colorOrange); } .wsus__single_courses_3_img ul li a img { width: 16px !important; height: 16px !important; margin: 0 auto; transform: scale(1) !important; -webkit-transform: scale(1) !important; -moz-transform: scale(1) !important; -ms-transform: scale(1) !important; -o-transform: scale(1) !important; } .wsus__single_courses_3:hover .wsus__single_courses_3_img ul { opacity: 1; left: 10px; } .wsus__single_courses_3_img { position: relative; } .wsus__single_courses_3_img .course-cover-link{ position:relative; inset:0; display:block; z-index:5; } .wsus__single_courses_3_img::after { position: absolute; content: ""; width: 100%; height: 100%; border: 50px solid var(--colorWhite); top: 0; right: 0; z-index: 1; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_3_img .time { position: absolute; top: 20px; right: 0; color: var(--colorWhite); font-size: 14px; font-weight: 500; background: var(--colorPrimary); border-radius: 6px 0px 0px 6px; padding: 4px 16px; -webkit-border-radius: 6px 0px 0px 6px; -moz-border-radius: 6px 0px 0px 6px; -ms-border-radius: 6px 0px 0px 6px; -o-border-radius: 6px 0px 0px 6px; } .wsus__single_courses_text_3 { padding: 25px; } .wsus__single_courses_text_3 .rating_area { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; /* margin-top: 17px; */ margin-bottom: 10px; } .wsus__single_courses_text_3 .rating_area a { color: var(--colorWhite); background: var(--colorPrimary); font-size: 14px; font-weight: 500; padding: 3px 15px; border-radius: 6px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_courses_text_3 .rating_area a:hover { background: var(--colorBlack); color: var(--colorWhite); } .wsus__single_courses_text_3 .rating_area p { color: var(--ratingColor); } .wsus__single_courses_text_3 .rating_area p span { color: var(--colorBlack); font-size: 14px; font-weight: 400; margin-left: 5px; } .wsus__single_courses_text_3 ul { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 15px; margin-bottom: 18px; } .wsus__single_courses_text_3 ul li { position: relative; color: var(--colorBlack); font-size: 14px; font-weight: 400; padding-left: 22px; } .wsus__single_courses_text_3 ul li::after { position: absolute; content: ""; background: url(../images/book_icon.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 16px; height: 16px; top: 2px; left: 0; } .wsus__single_courses_text_3 ul li:last-child:after { background: url(../images/user_icon_gray.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 16px; height: 16px; } .wsus__single_courses_text_3 .author { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; /* margin-bottom: 30px; */ } .wsus__single_courses_text_3 .author .img { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__single_courses_text_3 .author h4 { font-size: 14px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_courses_3_footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 15px 25px; border-top: 1px solid rgba(30, 30, 47, 0.10); } .wsus__single_courses_3_footer a { border: 1px solid rgba(30, 30, 47, 0.14); background: var(--colorWhite); color: var(--colorBlack); padding: 6px 15px; } .wsus__single_courses_3_footer p { color: var(--colorBlack); font-size: 18px; font-weight: 700; } .wsus__single_courses_3_footer p del { color: var(--paraColor); margin-right: 5px; font-size: 15px; } .wsus__single_courses_3:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .wsus__single_courses_3:hover .wsus__single_courses_3_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } .wsus__single_courses_3:hover .wsus__single_courses_3_img:after { border: 0px solid var(--colorWhite); opacity: .6; } .wsus__single_courses_3 .author:hover h4 { color: var(--colorPrimary); } /* courses 3 end */ /* offer start */ .wsus__offer { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } .wsus__offer_img { height: 400px; margin-top: 25px; } .wsus__offer_text { padding-left: 55px; } .wsus__offer_text h2 { color: var(--colorWhite); font-size: 40px; font-weight: 600; } .wsus__offer_text form { border-radius: 10px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); overflow: hidden; position: relative; margin-top: 30px; max-width: 90%; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__offer_text form input { padding: 18px 20px; } .wsus__offer_text form button { position: absolute; top: 8px; right: 8px; } /* offer end */ /* team start */ .wsus__team_heading_area_btn { text-align: right; } .wsus__team_bg { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; position: relative; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; } .wsus__team_large_slider { position: relative; bottom: -8px; padding-top: 12px; } .wsus__team_slider_img { padding-left: 80px; height: 465px; margin-top: 20px; } .wsus__team_slider_text { padding-left: 120px; padding-bottom: 20px; } .wsus__team_slider_text .rating { display: inline-block; border-radius: 6px; border: 1px solid rgba(30, 30, 47, 0.10); padding: 2px 6px; color: var(--ratingColor); -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__team_slider_text .rating span { font-weight: 500; margin-left: 5px; } .wsus__team_slider_text h3 { font-size: 20px; font-weight: 600; margin-top: 20px; margin-bottom: 10px; } .wsus__team_slider_text .list { margin-bottom: 20px; } .wsus__team_slider_text .list li { color: var(--colorBlack); font-size: 14px; font-weight: 400; opacity: .6; padding-right: 10px; margin-right: 10px; position: relative; } .wsus__team_slider_text .list li:last-child { margin: 0; padding: 0; } .wsus__team_slider_text .list li::after { position: absolute; content: ""; width: 1px; height: 15px; background: rgba(30, 30, 47, 0.14); top: 0; right: 0; } .wsus__team_slider_text .list li:last-child:after { display: none; } .wsus__team_slider_text .badge { gap: 10px; margin: 25px 0px 40px 0px; padding: 0; } .wsus__team_slider_text .badge li { width: 30px; height: 30px; overflow: hidden; } .wsus__team_slider_text .common_btn { background: var(--colorBlack); } .wsus__team_slider_text .common_btn:after { background: var(--colorPrimary); } .wsus__team_small_img_area { width: 130px; height: 100%; border-radius: 20px; background: #DCDCED; position: absolute; top: 0; right: 0; text-align: center; padding: 55px 30px 60px 40px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; } .wsus__team_small_img { border: 2px solid var(--colorWhite); width: 70px; height: 70px; border-radius: 12px; overflow: hidden; cursor: pointer; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; } .wsus__team .nextArrow { top: -77px; right: 27px; } .wsus__team .prevArrow { top: auto; bottom: -72px; left: 22px; } .slick-slide.slick-current .wsus__team_small_img { border-color: var(--colorPrimary); } /* team end */ /* video start */ .wsus__video { height: 910px; position: relative; } .wsus__video .play_btn { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 160px; height: 160px; line-height: 160px; box-shadow: none; background: rgba(30, 30, 47, 0.10); border: 1px solid rgba(255, 255, 255, 0.30); backdrop-filter: blur(4px); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } .wsus__video .play_btn::after { position: absolute; content: ""; background: url(../images/play_btn_text.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 130px; height: 130px; top: 14px; left: 14px; animation: about_2_animi_2 linear 15s infinite; -webkit-animation: about_2_animi_2 linear 15s infinite; } .wsus__video .text { position: absolute; left: 160px; bottom: -45px; background: rgba(30, 30, 47, 0.60); backdrop-filter: blur(7px); max-width: 530px; border-radius: 10px; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__video .text p { padding: 35px 35px 45px 35px; color: var(--colorWhite); font-size: 15px; font-weight: 400; line-height: 26px; } .wsus__video .text a { color: var(--colorBlack); background: var(--colorOrange); width: 100%; font-size: 15px; font-weight: 500; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 11px 25px; } /* video end */ .wsus__testimonial_text { margin-top: 25px; height: 585px; position: relative; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 30px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; display: flex; flex-direction: column; justify-content: space-between; } .wsus__testimonial_text .top .rating { color: var(--ratingColor); margin-bottom: 15px; } .wsus__testimonial_text .top .description { color: rgba(30, 30, 47, 0.70); line-height: 26px; } .wsus__testimonial_text .bottom .photo img { width: 50px !important; height: 50px !important; border-radius: 50%; margin-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__testimonial_text .bottom .photo h2 { font-size: 16px; } .wsus__testimonial_text .bottom .photo h2 span { display: block; color: var(--colorBlack); opacity: .6; font-size: 13px; font-weight: 500; text-transform: uppercase; margin-top: 5px; } .wsus__testimonial_text .bottom p { color: var(--colorBlack); opacity: .6; font-size: 13px; font-weight: 500; text-transform: uppercase; margin-top: 55px; } /* testimonial 2 end */ /* blog 3 start */ .wsus__blog_3_heading_area_btn { text-align: right; } .wsus__single_blog_3 { /* padding: 25px 25px 40px 25px; */ border-radius: 10px; border: 1px solid rgba(30, 30, 47, 0.14); margin-top: 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; overflow: hidden; } .wsus__single_blog_3_img { position: relative; height: 310px; } .wsus__single_blog_3_img::after { position: absolute; content: ""; width: 100%; height: 100%; border: 50px solid var(--colorWhite); top: 0; right: 0; z-index: 1; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_blog_3_img img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_blog_3_img a { position: absolute; top: 15px; left: 15px; background: var(--colorPrimary); color: var(--colorWhite); font-size: 12px; font-weight: 600; text-transform: uppercase; border-radius: 6px; padding: 2px 8px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_blog_3_text { padding: 25px; } .wsus__single_blog_3_text ul { gap: 25px; margin-bottom: 10px; } .wsus__single_blog_3_text ul li { color: var(--paraColor); font-size: 13px; font-weight: 500; text-transform: uppercase; } .wsus__single_blog_3_text ul li span { display: inline-block; margin-right: 2px; width: 17px; } .wsus__single_blog_3_text .title { font-size: 22px; } .wsus__single_blog_3_text .photo_area { gap: 10px; align-items: center; margin-top: 25px; } .wsus__single_blog_3_text .photo_area .img { width: 45px; height: 45px; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__single_blog_3_text .photo_area h4 { color: var(--colorBlack); font-size: 16px; font-weight: 600; } .wsus__single_blog_3_text .photo_area h4 span { display: block; color: var(--colorBlack); opacity: .6; font-size: 15px; font-weight: 500; margin-bottom: 3px; } .wsus__single_blog_3:hover { transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); } .wsus__single_blog_3:hover .wsus__single_blog_3_img img { transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); } .wsus__single_blog_3:hover .wsus__single_blog_3_img:after { border: 0px solid var(--colorWhite); opacity: .6; } /* blog 3 end */ /* footer 3 start */ .footer_3_overlay { background: var(--rc-navy); } .wsus__footer_3_logo_area .logo { display: inline-block; width: 150px; height: 150px; margin-bottom: 15px; } .wsus__footer_3_logo_area .logo img { display: inline-block; margin-bottom: 15px; object-fit: contain !important; width: 100% !important; height: 100% !important; padding: 5px; } .wsus__footer_3_logo_area p { color: var(--colorWhite); line-height: 26px; opacity: .6; } .wsus__footer_3_logo_area h2 { color: var(--colorWhite); font-size: 16px; font-weight: 500; margin-top: 25px; margin-bottom: 10px; } .wsus__footer_3_logo_area ul { gap: 10px; } .wsus__footer_3_logo_area ul li a { width: 40px; height: 40px; line-height: 40px; text-align: center; border-radius: 6px; background: rgba(255, 255, 255, 0.06); color: var(--colorWhite); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__footer_3_logo_area ul li a:hover { color: var(--colorWhite); background: var(--colorPrimary); box-shadow: 0px 4px 11px 0px rgba(53, 109, 241, 0.30); } .footer_3 .wsus__footer_link { padding: 0px; } .wsus__footer_3_subscribe h3 { color: var(--colorWhite); font-size: 20px; font-weight: 700; margin-bottom: 30px !important; margin-top: 0 !important; } .wsus__footer_3_subscribe form { position: relative; border-radius: 8px; overflow: hidden; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; } .wsus__footer_3_subscribe form input { padding: 11px 20px; } .wsus__footer_3_subscribe form button { position: absolute; top: 0; right: -1px; border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; padding: 0px 23px; height: 100%; } .wsus__footer_3_subscribe form button:after { border-radius: 0 !important; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; } .wsus__footer_3_subscribe ul { margin-top: 0px; } .wsus__footer_3_subscribe ul li { display: flex; flex-wrap: nowrap; align-items: center; margin-bottom: 20px; } .wsus__footer_3_subscribe ul li .icon { width: 45px; height: 45px; line-height: 14px; text-align: center; border-radius: 6px; padding: 14px; margin-right: 12px; background: rgba(255, 255, 255, 0.06); color: var(--colorWhite); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__footer_3_subscribe ul li .text { width: 85%; } .wsus__footer_3_subscribe ul li .text h4 { color: var(--colorWhite); font-size: 16px; font-weight: 500; margin-top: 0 !important; margin-bottom: 0 !important; } .wsus__footer_3_subscribe ul li .text a, .wsus__footer_3_subscribe ul li .text p { display: block; color: var(--colorWhite); font-size: 14px; font-weight: 500; opacity: .6; margin-top: 5px !important; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .footer_3 .wsus__footer_copyright_area { background: rgba(255, 255, 255, 0.06); } /* footer 3 end */ /*============================ HOME PAGE 03 END ============================*/ /*============================ HOME PAGE 04 START ============================*/ /* menu start */ .home_4 .common_btn { color: var(--colorBlack); background: var(--colorOrange); } .home_4 .common_btn:hover { color: var(--colorWhite); } .main_menu_4 { box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); } .main_menu_4 .navbar-brand { margin-right: 20px; } .main_menu_4 .menu_category { border-right: 0; border-left: 1px solid var(--borderColor); padding: 11px 60px 11px 20px; margin: 0; padding-right: 0; } .main_menu_4 .menu_category ul { border-top: none; } .main_menu_4 .right_menu ul li .menu_signin { padding-right: 33px; margin-right: 20px; } .main_menu_4 .right_menu ul li .menu_signin b { right: 23px; } /* menu end */ /* banner 4 start */ .wsus__banner_4 { margin: 0; padding: 0; height: auto; background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; overflow: hidden; } .wsus__banner_4_text { padding-top: 87px; } .wsus__banner_4_text h1, .wsus__banner_4_text h1 span { color: var(--colorBlack); font-size: 80px; font-weight: 600; position: relative; } .wsus__banner_4_text h1 span { border: 1px solid var(--colorOrange); background: var(--colorWhite); padding: 0px 10px; line-height: 80px; display: inline-block; } .wsus__banner_4_text h1::after { position: absolute; content: ""; background: url(../images/banner_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 70px; height: 52px; top: -40px; left: -40px; animation: banner_animi_1 linear 3s infinite alternate; -webkit-animation: banner_animi_1 linear 3s infinite alternate; } .wsus__banner_4_text p { color: rgba(30, 30, 47, 0.70); font-size: 16px; line-height: 26px; max-width: 90%; margin-top: 20px; margin-bottom: 40px; } .wsus__banner_4_text form { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); position: relative; max-width: 550px; } .wsus__banner_4_text form input { padding: 15.5px 20px; } .wsus__banner_4_text form button { position: absolute; top: 6px; right: 6px; width: 55px; height: 45px; line-height: 45px; text-align: center; background: var(--colorOrange); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__banner_4_text form button:hover { background: var(--colorBlack); color: var(--colorWhite); } .wsus__banner_image_4 { padding-left: 46px; } .wsus__banner_image_4 .img { height: 600px; margin-top: 180px; position: relative; right: -140px; } .wsus__banner_image_4 .text { bottom: 230px; } /* banner 4 end */ /* category 4 start */ .wsus__category_4, .wsus__category_4 .container { position: relative; } .wsus__single_category_4 { margin-top: 25px; display: flex; flex-wrap: wrap; align-items: center; gap: 20px; padding: 10px; border: 1px solid rgba(30, 30, 47, 0.10); background: rgba(217, 217, 217, 0.00); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__single_category_4 .icon { width: 80px; height: 70px; background: #e2ebfe; padding: 17px 23px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_category_4 .icon img { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__single_category_4 .text h4 { font-size: 18px; font-weight: 600; } .wsus__single_category_4 .text p { font-size: 14px; font-weight: 500; color: var(--colorBlack); opacity: .6; margin-top: 5px; } .wsus__single_category_4:hover { border-color: var(--colorPrimary); box-shadow: 0px 10px 30px 0px rgba(30, 30, 47, 0.20); } .wsus__single_category_4:hover .icon { background: var(--colorPrimary); } .wsus__single_category_4:hover .icon img { filter: brightness(0) saturate(100%) invert(100%) sepia(12%) saturate(3%) hue-rotate(261deg) brightness(111%) contrast(100%); } .wsus__category_4::before { position: absolute; content: ""; background: url(../images/category_4_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 100px; height: 260px; top: 155px; left: 0; filter: brightness(0) saturate(100%) invert(39%) sepia(51%) saturate(5685%) hue-rotate(214deg) brightness(99%) contrast(91%); } .wsus__category_4::after { position: absolute; content: ""; background: url(../images/category_4_shapes_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 45px; height: 265px; top: 20px; right: 0; filter: brightness(0) saturate(100%) invert(39%) sepia(51%) saturate(5685%) hue-rotate(214deg) brightness(99%) contrast(91%); } /* category 4 end */ /* top courses start */ .wsus__top_courses { position: relative; } .home_4 .wsus__single_courses { border: none; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); } .home_4 .wsus__single_courses_text .wishlist { display: block; } .home_4 .wsus__global_courses .wsus__single_courses_text .wishlist { padding: 8px 10px 12px 10px; } .wsus__top_courses .wsus__single_courses_img ul li a img { transform: translate(0) !important; margin-top: 12px; -webkit-transform: translate(0) !important; -moz-transform: translate(0) !important; -ms-transform: translate(0) !important; -o-transform: translate(0) !important; } .top_courses_slider .wsus__single_courses { margin: 10px 12px; } .home_4 .wsus__single_courses_text ul { background: #E2F3CD; } .home_4 .wsus__single_courses_footer::after { height: 5px; top: -6px; } .top_courses_slider .nextArrow, .top_courses_slider .prevArrow { right: 12px; top: -95px; } .top_courses_slider .prevArrow { left: auto; right: 67px; } .wsus__top_courses::before { position: absolute; content: ""; background: url(../images/top_courses_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 70px; height: 70px; top: 30px; left: 130px; } .wsus__top_courses::after { position: absolute; content: ""; background: url(../images/faq_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 40px; height: 40px; bottom: 300px; right: 130px; } /* top courses end */ /* call to action 4 start */ .wsus__call_to_action_4 { position: relative; background: var(--colorLightBg); } .wsus__call_to_action_4 ul li { width: 30%; margin-right: 10px; margin-left: 10px; display: flex; flex-wrap: wrap; align-items: center; } .wsus__call_to_action_4 ul li .img { width: 100%; height: 450px; } .wsus__call_to_action_4 ul li .text { padding: 25px; padding-top: 0px !important; width: 100%; } .wsus__call_to_action_4 ul li .text h4 { font-size: 24px; font-weight: 600; line-height: 32px; margin-bottom: 25px; margin-top: 20px !important; } .wsus__call_to_action_4 ul li .text a:hover { border-color: var(--colorPrimary); background: var(--colorWhite); } /* call to action 4 end */ /* global courses start */ .wsus__global_courses .wsus__filter_area ul { border-bottom: 0; padding-bottom: 0; gap: 6px; } .wsus__global_courses .wsus__filter_area ul li button { color: var(--colorBlack); font-size: 15px; border: 1px solid var(--borderColor); font-weight: 500; border-radius: 0 !important; padding: 5px 15px; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; } .wsus__global_courses .wsus__filter_area ul li button:hover, .wsus__global_courses .wsus__filter_area ul li button.active { background: var(--colorOrange) !important; border-color: var(--colorOrange) !important; } .wsus__global_courses .wsus__filter_area ul li button::after { display: none; } /* global courses end */ /* quality courses start */ .quality_course_slider_item { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; padding: 50px 160px; position: relative; overflow: hidden; } .wsus__quality_courses .wsus__section_heading h2 span { background: var(--colorWhite); } .wsus__quality_courses_text { display: flex; flex-direction: column; justify-content: center; align-items: start; height: 100%; } .wsus__quality_courses_text p { max-width: 75%; margin-bottom: 40px; font-size: 16px; font-weight: 400; line-height: 26px; } .wsus__quality_courses_img { height: 670px; position: relative; left: -130px; bottom: -50px; } .wsus__quality_courses .wsus__single_courses_3 { margin: 10px 12px 0px 12px; } .wsus__quality_courses .wsus__single_courses_3:hover { transform: translate(0); -webkit-transform: translate(0); -moz-transform: translate(0); -ms-transform: translate(0); -o-transform: translate(0); } .wsus__quality_courses .nextArrow, .wsus__quality_courses .prevArrow { top: 50%; right: -40px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .wsus__quality_courses .prevArrow { left: -40px; } .home_4 .slick-dots li button { border: none; background: rgba(30, 30, 47, 0.16); } .home_4 .slick-dots li.slick-active button { width: 40px; background: var(--colorBlack); } .wsus__quality_courses .wsus__single_courses_3_img ul li a img { margin-top: 12px; } .wsus__quality_courses .wsus__single_courses_3_img { height: 230px; } /* quality courses end */ /* instructor 4 start */ .wsus__instructor_4 .wsus__single_instructor_img { height: 475px; } .wsus__instructor_4 .wsus__single_instructor { padding-bottom: 0; margin: 25px 12px 0px 12px; } .wsus__instructor_4 .wsus__single_instructor .rating { color: var(--ratingColor); } .wsus__instructor_4 .wsus__single_instructor_text { bottom: 20px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__instructor_4 .wsus__single_instructor_text a, .wsus__instructor_4 .wsus__single_instructor_text p { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__instructor_4 .wsus__single_instructor:hover .wsus__single_instructor_text { background: var(--colorBlack); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__instructor_4 .wsus__single_instructor:hover .wsus__single_instructor_text a, .wsus__instructor_4 .wsus__single_instructor:hover .wsus__single_instructor_text p { color: var(--colorWhite); } .wsus__instructor_4 .slick-dots { margin-top: 40px; } /* instructor 4 end */ /* video 4 start */ .wsus__video_4 { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; padding: 0px 160px; } .wsus__video_4_img { position: relative; height: 665px; margin-top: 75px; } .wsus__video_4_img img { height: 100% !important; } .wsus__video_4_img a { position: absolute; width: 240px; height: 240px; line-height: 240px; border-radius: 270px; border: 1px solid rgba(255, 255, 255, 0.30); background: rgba(255, 255, 255, 0.10); backdrop-filter: blur(20px); box-shadow: none !important; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); z-index: 3; margin-right: 0; -webkit-border-radius: 270px; -moz-border-radius: 270px; -ms-border-radius: 270px; -o-border-radius: 270px; } .wsus__video_4_img a img { width: 90px !important; height: 90px !important; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__video_4_img a::after { position: absolute; content: ""; width: 160px; height: 160px; background: var(--colorWhite); border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } /* video 4 end */ /* testimonial 4 start */ .wsus__testimonial_4 { position: relative; } .wsus__testimonial_4_top_rating { align-items: center; justify-content: end; gap: 5px; } .wsus__testimonial_4_top_rating .icon { width: 45px; height: 45px; } .wsus__testimonial_4_top_rating .text span { display: block; font-size: 13px; color: var(--ratingColor); margin-bottom: 5px; } .wsus__testimonial_4_top_rating .text h4 { font-size: 16px; font-weight: 500; } .wsus__testimonial_4_bg { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } .wsus__testimonial_4_img { width: 350px; height: 450px; margin-left: 50px; margin-top: 30px; margin-bottom: -10px; } .wsus__testimonial_4_text { padding-right: 130px; padding-top: 15px; position: relative; } .wsus__testimonial_4_text::after { position: absolute; content: ""; background: url(../images/testimonial_4_shapes_5.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 70px; height: 40px; bottom: -20px; right: 120px; } .wsus__testimonial_4_text .rating { color: var(--ratingColor); } .wsus__testimonial_4_text .description { color: var(--colorBlack); font-size: 20px; line-height: 38px; opacity: .8; margin-top: 20px; margin-bottom: 50px; } .wsus__testimonial_4_text h3 { font-size: 22px; font-weight: 600; } .wsus__testimonial_4_text .designation { color: var(--colorBlack); opacity: .7; font-weight: 600; text-transform: uppercase; margin-top: 10px; } .wsus__testimonial_4 .wsus__section_heading { position: relative; } .wsus__testimonial_4 .wsus__section_heading::before { position: absolute; content: ""; background: url(../images/testimonial_4_shapes.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 90px; height: 90px; top: -15px; right: -100px; z-index: -1; } .wsus__testimonial_4::before { position: absolute; content: ""; background: url(../images/testimonial_4_shapes_4.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 50px; height: 100px; top: 120px; left: 0; z-index: -1; } .wsus__testimonial_4::after { position: absolute; content: ""; background: url(../images/testimonial_4_shapes_3.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 130px; height: 130px; bottom: 100px; right: 0; z-index: -1; } .testimonial_4_slider .nextArrow, .testimonial_4_slider .prevArrow { right: -12px; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .testimonial_4_slider .prevArrow { right: auto; left: -12px; } /* testimonial 4 end */ /* blog 4 start */ .blog_4 { background: var(--colorLightBg); padding-left: 25px; padding-right: 25px; } .wsus__single_blog_4 { margin-top: 25px; display: flex; flex-wrap: wrap; align-items: center; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); border-radius: 10px; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .blog_4_slider .wsus__single_blog_4 { margin: 0px 12px; } .wsus__single_blog_4_img { display: block; width: 100% !important; height: 300px !important; position: relative; overflow: hidden; } .wsus__single_blog_4_img .date { position: absolute; top: 20px; left: 20px; color: var(--colorWhite); font-size: 14px; font-weight: 500; background: var(--colorPrimary); padding: 4px 10px 3px 28px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_blog_4_img .date::after { position: absolute; content: ""; background: url(../images/calendar_black.png); background-position: center; background-repeat: no-repeat; background-size: contain; width: 15px; height: 15px; top: 7px; left: 9px; filter: brightness(0) saturate(100%) invert(96%) sepia(88%) saturate(0%) hue-rotate(1deg) brightness(107%) contrast(100%); } .wsus__single_blog_4_text { width: 100% !important; height: 100% !important; } .wsus__single_blog_4_text ul { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 12px; } .wsus__single_blog_4_text ul li { color: var(--paraColor); font-size: 14px; font-weight: 400; border: 1px solid rgba(30, 30, 47, 0.10); display: flex; flex-wrap: wrap; align-items: center; padding: 2px 8px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__single_blog_4_text ul li span { display: inline-block; position: relative; top: -1px; margin-right: 3px; width: 17px; } .wsus__single_blog_4_text .title { font-size: 22px; } .wsus__single_blog_4_text p { line-height: 26px; margin-top: 10px; margin-bottom: 27px; } .wsus__single_blog_4_text .common_btn_2 { padding: 11px 35px } .wsus__single_blog_4_text .common_btn_2:hover { border-color: var(--colorOrange); color: var(--colorBlack); } .wsus__single_blog_4_text .common_btn_2::after { background: var(--colorOrange); } .blog_4_slider .nextArrow, .blog_4_slider .prevArrow { top: -100px; right: 290px; } .blog_4_slider .prevArrow { left: auto; right: 345px; } /* blog 4 end */ /* blog differences start */ .blog_differences { background: var(--colorLightBg); padding-left: 25px; padding-right: 25px; } .wsus__single_blog_differences { margin-top: 25px; display: flex; flex-wrap: wrap; align-items: center; background: transparent; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .blog_differences_slider .wsus__single_blog_differences { margin: 0px 12px; } .wsus__single_blog_differences_img { display: block; width: 100% !important; height: 500px !important; position: relative; overflow: hidden; border-radius: 10px; } .wsus__single_blog_differences_text { width: 100% !important; height: 100% !important; } .wsus__single_blog_differences_text .title { font-size: 22px; padding-top: 5px !important; text-align: center; } .wsus__single_blog_differences_text p { line-height: 26px; margin-top: 10px; margin-bottom: 27px; } .blog_differences_slider .nextArrow, .blog_differences_slider .prevArrow { top: -100px; right: 0px; } .blog_differences_slider .prevArrow { left: auto; right: 60px; } /* blog differences end */ /* footer 4 start */ .footer_4 { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; } .footer_4 .wsus__footer_3_logo_area ul li a { border: 1.5px solid rgba(255, 255, 255, 0.20); background: transparent; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .footer_4 .wsus__footer_3_logo_area ul li a:hover { background: var(--colorOrange); border-color: var(--colorOrange); color: var(--colorBlack); } .footer_4 .wsus__footer_link { padding-top: 0; padding-left: 0; } .wsus__footer_4_download h3, .wsus__footer_instagram h3 { color: var(--colorWhite); font-size: 20px; font-weight: 700; margin-bottom: 30px; } .wsus__footer_4_download ul { gap: 20px; } .wsus__footer_4_download ul li { width: 100%; } .wsus__footer_4_download ul li a { border: 1px solid rgba(255, 255, 255, 0.20); color: var(--colorWhite); font-size: 15px; font-weight: 500; display: inline-flex; flex-wrap: wrap; align-items: center; padding: 10px 18px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__footer_4_download ul li a span { margin-right: 10px; width: 20px; position: relative; top: -2px; transition: all linear.3s; -webkit-transition: all linear.3s; -moz-transition: all linear.3s; -ms-transition: all linear.3s; -o-transition: all linear.3s; } .wsus__footer_4_download ul li a:hover { background: var(--colorOrange); color: var(--colorBlack); border-color: var(--colorOrange); } .wsus__footer_4_download ul li a:hover span { filter: brightness(0) saturate(100%) invert(9%) sepia(10%) saturate(2363%) hue-rotate(201deg) brightness(95%) contrast(92%); } .wsus__footer_instagram { padding-left: 40px; } .wsus__footer_instagram ul { gap: 10px; } .wsus__footer_instagram ul li a { position: relative; width: 80px; height: 80px; display: block; } .wsus__footer_instagram ul li a span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--colorOrange); display: flex; justify-content: center; align-items: center; color: var(--colorBlack); font-size: 24px; opacity: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__footer_instagram ul li a:hover span { opacity: 1; } /* footer 4 end */ /*============================ HOME PAGE 04 END ============================*/ /*=============================== HOME PAGE 05 DARK START ===============================*/ .home_dark { background: #0D1229; } .home_dark h1, .home_dark h2, .home_dark h3, .home_dark h4, .home_dark h5, .home_dark h6 { color: var(--colorWhite); } .home_dark p, .home_dark span { color: #C4C4CC; } .home_dark .wsus__banner_image .text h4 { color: var(--colorBlack); } .home_dark header { background: var(--colorPrimary); } .home_dark header .wsus__header_left li a { color: #ffffffc2; } .home_dark header .wsus__header_left li a:hover { color: var(--colorWhite); } .home_dark header .wsus__header_center p { color: #ffffffc2; } .home_dark .main_menu { background: #0D1229; } .home_dark .main_menu .navbar-nav .nav-item .nav-link { color: var(--colorWhite); } .home_dark .main_menu .navbar-nav .nav-item:hover .nav-link, .home_dark .main_menu .navbar-nav .nav-item .nav-link.active { color: var(--colorPrimary); } .home_dark .main_menu .right_menu form { background: #3A3A55; } .home_dark .main_menu .right_menu form .search input { background: none; color: var(--colorWhite); } .home_dark .main_menu .right_menu form .search input::placeholder { color: var(--colorWhite); } .home_dark .menu_category { color: var(--colorWhite); border-color: #616177; } .home_dark .main_menu .right_menu ul li .menu_signin { color: var(--colorWhite); } .home_dark .right_menu ul li .menu_signin:hover span { filter: brightness(0) saturate(100%) invert(100%) sepia(20%) saturate(403%) hue-rotate(43deg) brightness(108%) contrast(104%); } .home_dark .wsus__banner::before { background: url(../images/banner_shapes_3.1.png); background-position: center; background-repeat: no-repeat; background-size: cover; animation: none; -webkit-animation: none; } .home_dark .wsus__about_text ul li { color: var(--colorWhite); } .home_dark .wsus__category { background: #3A3A55; } .home_dark .wsus__filter_area ul li button:hover, .home_dark .wsus__filter_area ul li button.active { color: var(--colorWhite) !important; } .home_dark .wsus__filter_area ul { border-color: #252A3E; } .home_dark .wsus__single_courses { background: transparent; border: 1px solid #2F3347; } .home_dark .wsus__single_courses_footer::after { background: #2F3347; } .home_dark .wsus__single_courses_text .rating span { color: #787882; } .home_dark .title { color: var(--colorWhite); } .home_dark .wsus__single_courses_text ul { background: #3A3A55; } .home_dark .wsus__single_courses_text ul li { color: var(--colorWhite); } .home_dark .wsus__single_courses_text ul li::after { filter: brightness(0) saturate(100%) invert(82%) sepia(2%) saturate(1342%) hue-rotate(202deg) brightness(90%) contrast(80%); } .home_dark .wsus__single_courses_text .category, .home_dark .wsus__single_courses_text .category a { color: #787882; } .home_dark .wsus__single_courses_text ul li:first-child { border-color: #56566D; } .home_dark .wsus__single_courses_text .category a:hover { color: var(--colorWhite); border-color: var(--colorWhite); } .home_dark .wsus__single_courses_text .author p { color: var(--colorWhite); } .home_dark .wsus__single_courses_footer p { color: var(--colorPrimary); } .home_dark .read_btn { color: var(--colorWhite); } .home_dark .wsus__hotline_text .call p span, .home_dark .wsus__hotline_text .mail p span { background: rgba(255, 255, 255, 0.10); border: none; } .home_dark .wsus__become_instructor::after { filter: brightness(0) saturate(100%) invert(99%) sepia(30%) saturate(48%) hue-rotate(199deg) brightness(118%) contrast(100%); } .home_dark .wsus__become_instructor::before { filter: brightness(0) saturate(100%) invert(78%) sepia(10%) saturate(1351%) hue-rotate(20deg) brightness(87%) contrast(87%); -webkit-filter: brightness(0) saturate(100%) invert(78%) sepia(10%) saturate(1351%) hue-rotate(20deg) brightness(87%) contrast(87%); } .home_dark .wsus__instructor::after { background: #3A3A55; } .home_dark .wsus__single_instructor_text .title { color: var(--colorBlack); } .home_dark .wsus__single_instructor_text p { color: #787882; } .home_dark .slick-dots li button { border: 1px solid #474B5C; } .home_dark .accordion-item { border-color: #252A3E !important; background: none; } .home_dark .accordion-item button { background: #0D1229; color: var(--colorWhite); } .home_dark .accordion-button::after { background: rgba(255, 255, 255, 0.10); background-image: url(../images/arrow_down_2.png); background-position: center; background-repeat: no-repeat; border: none; } .home_dark .wsus__faq_text::after, .home_dark .wsus__faq_text::before { filter: brightness(0) saturate(100%) invert(52%) sepia(90%) saturate(2310%) hue-rotate(352deg) brightness(92%) contrast(89%); } .home_dark .wsus__testimonial { background: #3A3A55; } .home_dark .wsus__single_testimonial { background: #0D1229; } .home_dark .wsus__single_testimonial::after { filter: brightness(0) saturate(100%) invert(20%) sepia(15%) saturate(1196%) hue-rotate(201deg) brightness(96%) contrast(87%); } .home_dark .wsus__single_testimonial .description, .home_dark .wsus__single_testimonial h3 span { color: #787882; } .home_dark .nextArrow, .home_dark .prevArrow { background: rgba(255, 255, 255, 0.10); color: var(--colorWhite); } .home_dark .nextArrow, .home_dark .nextArrow:hover, .home_dark .prevArrow:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .home_dark .wsus__single_blog_text .read_btn i { background: rgba(255, 255, 255, 0.10); } .home_dark .wsus__single_blog_text .read_btn:hover i { background: var(--colorPrimary); } /*=============================== HOME PAGE 05 DARK END ===============================*/ /*============================ ABOUT US START ============================*/ .wsus__features_3 .wsus__section_heading h5, .wsus__about_3_text .wsus__section_heading h5 { color: var(--paraColor); font-weight: 600; position: relative; padding: 0px 0px 0px 30px; background: none; text-transform: capitalize; } .wsus__features_3 .wsus__section_heading h5::after, .wsus__about_3_text .wsus__section_heading h5::after { position: absolute; content: ""; background-position: center; background-repeat: no-repeat; background-size: cover; width: 25px; height: 25px; top: -5px; left: -4px; } .wsus__about_3_text .common_btn { border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__about_3_text .common_btn::after { border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__about_counter .wsus__counter_bg { border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } /*============================ ABOUT US END ============================*/ /*============================ COURSES PAGE START ============================*/ .wsus__page_courses_header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 10px; } .wsus__page_courses_header p { color: var(--colorBlack); font-size: 16px; } .wsus__page_courses_header p span { color: var(--colorPrimary); font-size: 16px; } .wsus__page_courses_header form { display: flex; flex-wrap: wrap; align-items: center; width: 300px; gap: 10px; justify-content: end; } .wsus__page_courses_header .nice-select { max-width: 200px; border: 1px solid rgba(30, 30, 47, 0.20); } .wsus__page_courses_header .nice-select:after { margin-top: -6px; right: 20px; } .wsus__sidebar { padding: 40px 30px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__sidebar h3 { font-size: 20px; font-weight: 600; margin-top: 32px; padding-bottom: 5px; } .wsus__sidebar_search { position: relative; margin-bottom: 10px; } .wsus__sidebar_search input { padding: 12px 15px; } .wsus__sidebar_search button { position: absolute; top: 7px; right: 7px; background: var(--colorWhite); width: 35px; height: 35px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__sidebar_search button img { width: 15px !important; height: 15px !important; } .wsus__sidebar_search button:hover { background: var(--colorOrange); } .wsus__sidebar_category { border-bottom: 1px solid rgba(30, 30, 47, 0.10); padding-bottom: 30px; } .wsus__sidebar_category ul li { position: relative; color: var(--colorBlack); font-size: 15px; font-weight: 400; display: block; margin-top: 15px; cursor: pointer; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; overflow: hidden; } .wsus__sidebar_category ul li:hover, .wsus__sidebar_category ul li.active { color: var(--colorPrimary); } .wsus__sidebar_category ul li::after, .wsus__sidebar_category ul li::before { position: absolute; content: ""; background: url(../images/minus_icon.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 10px; height: 10px; top: 6px; right: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__sidebar_category ul li::before { transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); } .wsus__sidebar_category ul li.active::before { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); } .wsus__sidebar_sub_category { height: 0; overflow: hidden; overflow-y: auto; padding-left: 5px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__sidebar_sub_category::-webkit-scrollbar { background: var(--colorWhite); width: 3px; height: 10px; } .wsus__sidebar_sub_category::-webkit-scrollbar-thumb { background: var(--colorWhite); } .wsus__sidebar_course_level { border-bottom: 1px solid rgba(30, 30, 47, 0.10); padding-top: 10px; padding-bottom: 20px; } .wsus__sidebar_course_level .form-check { margin-top: 4px; } .wsus__sidebar_course_level input { padding: 0; width: 16px; height: 16px; border: 1px solid rgba(30, 30, 47, 0.14); } .wsus__sidebar_course_level h1,h2,h3,h4,h5,h6 { margin-bottom: 10px !important; margin-top: 10px !important; } .wsus__sidebar_course_level label { color: var(--paraColor); font-size: 14px; font-weight: 400; cursor: pointer; } .wsus__sidebar_course_level label i { color: var(--ratingColor); } .wsus__single_courses_2 .title { font-size: 17px; } /*============================ COURSES PAGE END ============================*/ /*============================ COURSES DETAILS START ============================*/ .wsus__courses_details_area .nav { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 8px; gap: 8px; display: inline-flex; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__courses_details_area .nav li button { background: #F0F5F9; color: var(--colorBlack); font-size: 16px; font-weight: 500; opacity: .7; border-radius: 8px !important; padding: 7px 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 8px !important; -moz-border-radius: 8px !important; -ms-border-radius: 8px !important; -o-border-radius: 8px !important; } .wsus__courses_details_area .nav li button:hover, .wsus__courses_details_area .nav li button.active { opacity: 1; background: var(--colorPrimary); color: var(--colorWhite); } .box_area { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 10px 40px 40px 40px; border-radius: 10px; color: var(--paraColor); line-height: 1.5; } .box_area h1,h2,h3,h4 { margin-top: 30px !important ; margin-bottom: 15px !important; } .box_area h5,h6 { margin-top: 20px; margin-bottom: 10px; } .box_area p { margin-bottom: 10px; } /* restore normal lists only inside course content */ .box_area ul, .box_area ol { list-style: revert; /* bring back disc/decimal */ margin: 0 0 1rem 1.5rem; /* standard indent */ padding-left: 1.5rem; } .box_area li { display: list-item; /* ensure markers render */ list-style-position: outside; margin: .25rem 0; font-size: 15px; } /* nicer nested lists */ .box_area ul ul { list-style: circle; margin-top: .25rem; } .box_area ol ol { list-style: lower-alpha; margin-top: .25rem; } /* if your editor injected inline list-style:none, force it back */ .box_area ul, .box_area ol, .box_area li { list-style: inherit !important; } .box_area li::marker { content: initial !important; } /* --- Blockquote: restore & style only inside .box_area --- */ .box_area blockquote{ display: block !important; /* undo any display:none/flex resets */ margin: 1rem 0 !important; padding: .75rem 1rem .75rem 1.25rem !important; border-left: 4px solid #C6A46A; /* RC gold accent */ background: rgba(35,55,66,.04); /* soft navy tint */ color: var(--paraColor); font-style: italic; border-radius: 6px; } /* some editors wrap blockquote text in

— keep spacing tidy */ .box_area blockquote > p{ margin: 0 !important; color: inherit; } /* if your theme zeroes quotes or markers, bring them back */ .box_area blockquote::before, .box_area blockquote::after{ content: none !important; /* rely on border style, not quotes */ } /* ensure nested lists inside blockquote render normally */ .box_area blockquote ul, .box_area blockquote ol{ list-style: revert !important; margin: .5rem 0 .5rem 1.25rem !important; padding-left: 1.25rem !important; } .box_area blockquote li{ display: list-item !important; list-style-position: outside !important; } /* show real numbers for ordered lists inside the course content */ .box_area ol { list-style-type: decimal !important; list-style-position: outside !important; display: block !important; margin: 0 0 1rem 1.5rem; padding-left: 1.5rem; } .box_area ol > li { display: list-item !important; /* critical: re-enable markers */ list-style-type: decimal !important; margin: .25rem 0; } /* if any theme rule draws custom bullets, neutralize it here */ .box_area ol > li::before, .box_area ol > li::after { content: none !important; } .wsus__courses_sidebar { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 25px; position: relative; margin-top: -295px; overflow: hidden; z-index: 3; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__courses_sidebar_video { overflow: hidden; position: relative; height: 270px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__courses_sidebar_video a { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80px; height: 82px; line-height: 80px; box-shadow: none !important; background: var(--colorPrimary); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } .wsus__courses_sidebar_video a img { width: 25px !important; height: 25px !important; transform: rotate(0deg) !important; -webkit-transform: rotate(0deg) !important; -moz-transform: rotate(0deg) !important; -ms-transform: rotate(0deg) !important; -o-transform: rotate(0deg) !important; } .wsus__courses_sidebar_video a:hover { background: var(--colorOrange); } .wsus__courses_sidebar_video a:hover img { filter: brightness(0) saturate(100%) invert(0%) sepia(95%) saturate(0%) hue-rotate(176deg) brightness(96%) contrast(107%); -webkit-filter: brightness(0) saturate(100%) invert(0%) sepia(95%) saturate(0%) hue-rotate(176deg) brightness(96%) contrast(107%); } .wsus__courses_sidebar_price { font-size: 34px; font-weight: 600; display: flex; flex-wrap: wrap; align-items: center; margin-top: 30px; } .wsus__courses_sidebar_price del { color: var(--colorBlack); font-size: 16px; font-weight: 400; opacity: .5; margin-right: 10px; } .wsus__courses_sidebar_list_info ul { margin-top: 35px; } .wsus__courses_sidebar_list_info ul li { display: flex; flex-wrap: wrap; align-items: center; color: var(--paraColor); font-size: 15px; font-weight: 400; justify-content: space-between; margin-top: 15px; } .wsus__courses_sidebar_list_info ul li p { display: flex; flex-wrap: wrap; align-items: center; color: var(--paraColor); } .wsus__courses_sidebar_list_info ul li p span { width: 18px; margin-right: 10px; position: relative; top: -1px; } .wsus__courses_sidebar_share_btn { margin-top: 20px; } .wsus__courses_sidebar_share_btn a { width: 100%; text-align: center; padding: 13px 20px; } .wsus__courses_sidebar_share_btn a i { margin-left: 0; margin-right: 5px; } .wsus__courses_sidebar_share_area { display: flex; flex-wrap: wrap; align-items: center; margin-top: 20px; gap: 10px; } .wsus__courses_sidebar_share_area span { color: var(--colorBlack); font-weight: 600; } .wsus__courses_sidebar_share_area ul { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; } .wsus__courses_sidebar_share_area ul li a { width: 40px; height: 40px; line-height: 40px; text-align: center; border: 1px solid var(--borderColor); border-radius: 50%; transition: all linear .3s; font-size: 14px; color: var(--colorBlack) !important; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__courses_sidebar_share_area ul li a:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite) !important; } .wsus__courses_sidebar_info { margin-top: 35px; } .wsus__courses_sidebar_info h3 { font-size: 20px; font-weight: 600; margin-bottom: 20px; } .wsus__courses_sidebar_info ul li { display: flex; flex-wrap: wrap; align-items: center; margin-top: 13px; } .wsus__courses_sidebar_info ul li span { width: 20px; margin-right: 10px; position: relative; top: -1px; } .wsus__courses_sidebar_instructor { padding-top: 30px; margin-top: 35px; position: relative; } .wsus__courses_sidebar_instructor::after { position: absolute; content: ""; width: 125%; height: 1px; background: rgba(30, 30, 47, 0.10); top: 0; left: -45px; } .wsus__courses_sidebar_instructor .image_area { margin-bottom: 20px; } .wsus__courses_sidebar_instructor .img { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; margin-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__courses_sidebar_instructor .text h3 { font-size: 14px; font-weight: 500; } .wsus__courses_sidebar_instructor .text p, .wsus__courses_sidebar_instructor .text p span { font-size: 12px; } .wsus__courses_sidebar_instructor .text p span { border-right: 1px solid rgba(3, 6, 17, 0.14); padding-right: 10px; margin-right: 10px; } .wsus__courses_sidebar_instructor ul { gap: 10px; } .wsus__courses_sidebar_instructor ul li { width: 30px; height: 30px; overflow: hidden; } .wsus__courses_review_input h3, .wsus__courses_review h3, .wsus__courses_instructor h3 { font-size: 24px; font-weight: 600; margin-top: 25px; margin-bottom: 25px; } .wsus__courses_instructor_img { height: 320px; border-radius: 10px; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__courses_instructor_text h4 { font-size: 20px; font-weight: 600; } .wsus__courses_instructor_text .designation { color: var(--colorBlack); opacity: 0.6; font-size: 15px; font-weight: 500; margin-top: 5px; margin-bottom: 15px; } .wsus__courses_instructor_text .list { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; } .wsus__courses_instructor_text .list li { display: flex; flex-wrap: wrap; align-items: center; color: var(--colorBlack); font-size: 14px; font-weight: 400; } .wsus__courses_instructor_text .list li b { color: var(--paraColor); font-size: 15px; font-weight: 500; } .wsus__courses_instructor_text .list li strong { background: var(--colorOrange); color: var(--colorBlack); font-size: 15px; font-weight: 500; padding: 2px 11px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; } .wsus__courses_instructor_text .list li span { display: inline-block; width: 16px; margin-right: 5px; } .wsus__courses_instructor_text .list li i { color: var(--ratingColor); margin-right: 5px; } .wsus__courses_instructor_text .badge { margin-top: 25px; padding: 0; gap: 10px; } .wsus__courses_instructor_text .badge li { width: 30px; height: 30px; } .wsus__courses_instructor_text .description { font-size: 14px; line-height: 22px; margin-top: 18px; } .wsus__courses_instructor_text .link { gap: 10px; margin-top: 30px; } .wsus__courses_instructor_text .link li a { width: 40px; height: 40px; text-align: center; line-height: 40px; border-radius: 50%; border: 1px solid rgba(30, 30, 47, 0.14); color: var(--paraColor); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__courses_instructor_text .link li a:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .wsus__courses_review .total_review { background: #F3F5F9; padding: 40px 40px 50px 40px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__courses_review .total_review h2 { color: var(--colorPrimary); font-size: 60px; font-weight: 500; text-align: center; } .wsus__courses_review .total_review p { color: var(--ratingColor); text-align: center; margin-top: 5px; margin-bottom: 10px; } .wsus__courses_review .total_review h4 { text-align: center; font-size: 15px; font-weight: 500; } .wsus__courses_review .review_bar { padding-left: 30px; } .wsus__courses_review .review_bar_single { position: relative; padding: 15px 40px 15px 50px; } .wsus__courses_review .review_bar_single p { position: absolute; top: 8px; left: 0; } .wsus__courses_review .review_bar_single p i { color: var(--ratingColor); } .wsus__courses_review .review_bar_single .qnty { position: absolute; top: 9px; right: 0; } .wsus__course_single_reviews { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 40px; } .wsus__single_review_img { width: 60px; height: 60px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__single_review_text { max-width: 90%; } .wsus__single_review_text h4 { font-size: 16px; font-weight: 600; } .wsus__single_review_text h6 { color: var(--paraColor); font-size: 15px; font-weight: 400; text-transform: uppercase; margin-top: 7px; margin-bottom: 20px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; } .wsus__single_review_text h6 span { color: var(--ratingColor); font-size: 14px; } .wsus__single_review_text p { font-size: 14px; } .wsus__courses_review_input h3 { margin-bottom: 7px; } .wsus__courses_review_input .select_rating { color: var(--colorBlack); font-size: 15px; font-weight: 500; margin-top: 14px; gap: 10px; } .wsus__courses_review_input form input, .wsus__courses_review_input form textarea { border: 1px solid rgba(30, 30, 47, 0.10); margin-top: 20px; } .wsus__courses_review_input .form-check { margin-top: 10px; margin-bottom: 25px; } .wsus__courses_review_input .form-check input { padding: 0; margin-top: 3px; border: 1px solid rgba(30, 30, 47, 0.10); } .wsus__courses_review_input .form-check label { color: var(--paraColor); font-size: 14px; font-weight: 400; } /*============================ COURSES DETAILS END ============================*/ /*============================ INSTRUCTOR FINDER START ============================*/ .instructor_finder_header { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 15px 15px 15px 30px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 15px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .instructor_finder_header .check_list { gap: 30px; } .instructor_finder_header .nice-select { width: 100%; max-width: 200px; border-radius: 6px; border: 1px solid rgba(30, 30, 47, 0.10); height: 40px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .instructor_finder_header .nice-select:after { margin-top: -6px; right: 20px; } .wsus__instructor_finder_sidebar h3 { font-size: 20px; font-weight: 600; margin-bottom: 5px; } .instructor_finder_list { margin-top: 25px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); display: flex; flex-wrap: wrap; align-items: center; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .instructor_finder_img { display: block; height: 250px; } .instructor_finder_img img { object-fit:contain !important; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .instructor_finder_text { width: 68%; padding: 30px; position: relative; } .instructor_finder_text .title { display: block; color: var(--colorBlack); font-size: 24px; font-weight: 600; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .instructor_finder_text .subtitle { display: block; color: var(--colorBlack); font-size: 16px; font-weight: 600; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .instructor_finder_text a { margin-bottom: 10px !important; } .instructor_finder_text .list { display: flex !important; flex-wrap: wrap !important; align-items: center !important; margin-top: 15px; margin-bottom: 25px; } .instructor_finder_text .list li { color: var(--paraColor); font-size: 14px; font-weight: 400; margin-right: 15px; padding-right: 15px; line-height: 15px; } .instructor_finder_text ul { list-style: disc !important; /* show disc bullets */ margin: 0 0 .5rem 1.25rem !important; padding-left: 1.25rem !important; /* space so bullets aren’t clipped */ } .instructor_finder_text li { width: 100% !important; display: list-item !important; /* ensure markers render */ list-style-position: outside !important; list-style: inherit !important; margin: .25rem 0; } /*============================ INSTRUCTOR FINDER END ============================*/ /*============================ INSTRUCTOR DETAILS START ============================*/ .instructor_details_content { margin-top: 0; padding: 25px; } .instructor_details_content .instructor_finder_img { width: auto; padding-right: 30px; } .instructor_details_content .instructor_finder_text { width: 100%; padding: 0; } .instructor_details_content .badges { margin-top: 30px; margin-bottom: 35px; } .instructor_details_content .overview { gap: 35px; border-top: 1px solid rgba(30, 30, 47, 0.12); padding-top: 40px; margin-top: 35px; } .instructor_details_content .overview li { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; } .instructor_details_content .overview li .icon { width: 50px; height: 50px; padding: 11px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .instructor_details_content .overview li .text { display: flex; flex-wrap: wrap; align-items: end; gap: 5px; } .instructor_details_content .overview li .text h2 { font-size: 34px; font-weight: 600; line-height: 36px; } .instructor_det_tabs { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 8px; gap: 8px; display: inline-flex; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .instructor_det_tabs li button { color: var(--paraColor); font-size: 16px; font-weight: 500; border: 1px solid rgba(30, 30, 47, 0.14); padding: 6px 25px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px !important; -webkit-border-radius: 6px !important; -moz-border-radius: 6px !important; -ms-border-radius: 6px !important; -o-border-radius: 6px !important; } .instructor_det_tabs li button.active, .instructor_det_tabs li button:hover { background: var(--colorPrimary); color: var(--colorWhite); } .instructor_details_about { padding: 10px 50px 50px 50px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); margin-top: 25px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .instructor_details_about h1, .instructor_details_about h2, .instructor_details_about h3, .instructor_details_about h4, .instructor_details_about h5, .instructor_details_about h6 { font-weight: 600; margin-top: 40px; } .instructor_details_about h1 { font-size: 32px; } .instructor_details_about h2 { font-size: 28px; } .instructor_details_about h3 { font-size: 24px; } .instructor_details_about h4 { font-size: 20px; } .instructor_details_about h5 { font-size: 18px; } .instructor_details_about h6 { font-size: 16px; } .instructor_details_about p { margin-top: 25px; } .instructor_details_about ul, .instructor_details_about ol { margin-top: 25px; } .instructor_details_about ul li, .instructor_details_about ol li { position: relative; color: var(--paraColor); font-size: 18px; font-weight: 400; line-height: 38px; padding-left: 20px; } .instructor_details_about ul li::after, .instructor_details_about ol li::after { position: absolute; content: ""; width: 8px; height: 8px; background: var(--colorPrimary); border-radius: 50%; top: 14px; left: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .instructor_details_about .skills { gap: 8px; } .instructor_details_about .skills li { padding: 0; } .instructor_details_about .skills li::after { display: none; } .instructor_details_about .skills li a { color: var(--paraColor); font-size: 15px; font-weight: 500; border: 1px solid rgba(30, 30, 47, 0.14); padding: 0px 14px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .instructor_details_about .skills li a:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .wsus__single_product { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 20px; margin-top: 25px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__single_product_img { height: 240px; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__single_product_text { text-align: center; padding-top: 20px; padding-bottom: 10px; } .wsus__single_product_text h3 { color: var(--colorPrimary); font-size: 18px; font-weight: 700; margin-top: 10px; margin-bottom: 12px; } .wsus__single_product_text h3 del { font-weight: 500; color: var(--paraColor); margin-right: 5px; } .wsus__single_product_text p { color: var(--ratingColor); } .wsus__single_product_text p span { color: var(--colorBlack); font-size: 14px; margin-left: 5px; } .instructor_details_blog .wsus__single_blog_3 { background: var(--colorWhite); border-radius: 0; border: none; box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .instructor_details_blog .wsus__single_blog_3_img { border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .instructor_details_bagdes, .instructor_details_meeting { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 30px; margin-top: 25px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .instructor_details_bagdes { padding-top: 0; } .instructor_details_bagdes h3, .instructor_details_meeting h3 { font-size: 24px; font-weight: 600; line-height: 26px; } .instructor_details_bagdes_item { border: 1px solid rgba(30, 30, 47, 0.10); padding: 40px; margin-top: 25px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .instructor_details_bagdes_item .img { width: 100px; height: 100px; overflow: hidden; margin: 0 auto; } .instructor_details_bagdes_item h4 { font-size: 18px; font-weight: 600; text-align: center; margin-top: 25px; margin-bottom: 5px; } .instructor_details_bagdes_item p { color: var(--colorBlack); text-align: center; opacity: .6; font-size: 14px; font-weight: 500; } .instructor_details_meeting .calendar { box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); margin-top: 25px; } .instructor_details_meeting .nice-select { border-radius: 6px; border: 1px solid rgba(30, 30, 47, 0.14); width: 100%; margin-top: 25px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .instructor_details_meeting .nice-select:after { right: 20px; } .instructor_details_meeting textarea { border: 1px solid rgba(30, 30, 47, 0.14); margin-top: 25px; } .instructor_details_meeting button { margin-top: 20px; } /*============================ INSTRUCTOR DETAILS END ============================*/ /*============================ BLOG PAGE END ============================*/ .wsus__blog_page .wsus__single_blog_2 { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); border-radius: 10px; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } /*============================ BLOG PAGE END ============================*/ /*============================ BLOG DETAILS START ============================*/ .wsus__blog_details_thumb { height: 450px; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__blog_details_header { border-bottom: 1px solid rgba(30, 30, 47, 0.20); margin-top: 20px; padding-bottom: 0px; margin-bottom: 30px; } .wsus__blog_details_header ul { gap: 25px; } .wsus__blog_details_header ul li { display: flex; flex-wrap: wrap; align-items: center; } .wsus__blog_details_header ul li span { display: inline-block; width: 19px; margin-right: 5px; position: relative; top: -2px; } .wsus__blog_details_header ul li .author { width: 35px; height: 35px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__blog_details_header h2 { font-size: 34px; font-weight: 700; line-height: 50px; margin-top: 20px; } .wsus__blog_details_text p { font-size: 16px; line-height: 26px; } .wsus__blog_details_text h1, .wsus__blog_details_text h2, .wsus__blog_details_text h3, .wsus__blog_details_text h4, .wsus__blog_details_text h5, .wsus__blog_details_text h6 { font-weight: 600; margin-top: 30px; } .wsus__blog_details_text h1 { font-size: 32px; } .wsus__blog_details_text h2 { font-size: 28px; } .wsus__blog_details_text h3 { font-size: 24px; } .wsus__blog_details_text h4 { font-size: 20px; } .wsus__blog_details_text h5, .wsus__blog_details_text h6 { font-size: 16px; } .wsus__blog_details_text p { margin-top: 20px; } .wsus__blog_details_text ul, .wsus__blog_details_text ol { display: flex; flex-wrap: wrap; justify-content: space-between; position: relative; margin-top: 20px; } .wsus__blog_details_text ul li, .wsus__blog_details_text ol li { color: var(--paraColor); font-size: 15px; font-weight: 500; line-height: 38px; width: 50%; padding-left: 30px; position: relative; } .wsus__blog_details_text ul li::after, .wsus__blog_details_text ol li::after { position: absolute; content: ""; background: url(../images/check_icon_green_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 20px; height: 20px; top: 10px; left: 0; } .blog_det_center_img { height: 460px; overflow: hidden; margin-top: 25px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .details_quot_text { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 40px 45px 40px 120px; margin-top: 55px; color: var(--paraColor); font-size: 16px; font-weight: 400; line-height: 28px; position: relative; margin-bottom: 35px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .details_quot_text::after { position: absolute; content: ""; background: url(../images/blog_det_quot.png); width: 50px; height: 40px; top: 45px; left: 50px; } .details_quot_text h4 { font-size: 15px; font-weight: 500; margin: 0; margin-top: 18px; padding-left: 40px; position: relative; } .details_quot_text h4::after { position: absolute; content: ""; width: 30px; height: 3px; background: var(--colorOrange); top: 8px; left: 0; } .wsus__blog_det_tags_share { justify-content: space-between; align-items: center; } .wsus__blog_det_tags_share ul { gap: 8px; } .wsus__blog_det_tags_share ul li span { color: var(--colorBlack); font-size: 20px; font-weight: 600; margin-right: 10px; text-transform: capitalize; } .wsus__blog_det_tags_share .tags li a { color: var(--paraColor); font-size: 15px; font-weight: 500; border: 1px solid rgba(30, 30, 47, 0.14); padding: 3px 13px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__blog_det_tags_share .tags li a:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .wsus__blog_det_tags_share .share li a { font-size: 16px; color: var(--paraColor); width: 40px; height: 40px; line-height: 40px; text-align: center; border: 1px solid rgba(30, 30, 47, 0.14); border-radius: 50%; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__blog_det_tags_share .share li a:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } .wsus__blog_det_author { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 12px; display: flex; flex-wrap: wrap; align-items: center; margin-top: 60px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__blog_det_author .img { width: 215px; height: 245px; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__blog_det_author .text { width: 65%; padding: 25px 25px 25px 60px; } .wsus__blog_det_author .text h3 { font-size: 18px; font-weight: 600; } .wsus__blog_det_author .text h5 { color: var(--paraColor); font-size: 13px; font-weight: 600; text-transform: uppercase; margin-top: 5px; margin-bottom: 20px; } .wsus__blog_det_author .text p { font-size: 14px; line-height: 25px; } .wsus__blog_det_author .text ul { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin-top: 30px; } .wsus__blog_det_author .text ul li a { font-size: 16px; color: var(--paraColor); border-radius: 50%; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__blog_det_author .text ul li a:hover { color: var(--colorPrimary); } .wsus__blog_comment_area h2 { font-size: 24px; font-weight: 600; } .wsus__blog_single_comment { display: flex; flex-wrap: wrap; gap: 15px; margin-top: 35px; border-bottom: 1px solid rgba(30, 30, 47, 0.14); padding-bottom: 30px; } .wsus__blog_single_comment .img { width: 50px; height: 50px; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__blog_single_comment .text { width: 92%; } .wsus__blog_single_comment .text h4 { font-size: 16px; font-weight: 600; } .wsus__blog_single_comment .text h6 { color: var(--paraColor); font-size: 14px; font-weight: 500; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: 5px; margin-bottom: 25px; } .wsus__blog_single_comment .text h6 a { color: var(--colorBlack); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__blog_single_comment .text h6 a:hover { color: var(--colorPrimary); } .wsus__blog_single_comment .text p { color: var(--paraColor); font-size: 14px; font-weight: 400; line-height: 25px; } .single_comment_reply { margin-left: 65px; } .single_comment_reply .text { width: 91%; } .wsus__blog_comment_input_area h2 { font-size: 24px; font-weight: 600; } .wsus__blog_comment_input_area p { line-height: 26px; margin-top: 5px; margin-bottom: 10px; } .wsus__blog_comment_input_area form input, .wsus__blog_comment_input_area form textarea { border: 1px solid rgba(30, 30, 47, 0.14); margin-top: 20px; } .wsus__blog_comment_input_area .form-check { margin-top: 10px; margin-bottom: 30px; } .wsus__blog_comment_input_area .form-check input { padding: 0; margin-top: 4px; } .wsus__blog_comment_input_area .form-check label { color: var(--paraColor); font-size: 15px; font-weight: 400; } .wsus__sidebar_blog_category, .wsus__sidebar_recent_post { border-top: 1px solid rgba(30, 30, 47, 0.10); padding-top: 25px; margin-top: 30px; } .wsus__sidebar_blog_category h3, .wsus__sidebar_recent_post h3 { margin: 0; margin-bottom: 20px; } .wsus__sidebar_recent_post ul { gap: 25px; } .wsus__sidebar_recent_post ul li { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; } .wsus__sidebar_recent_post ul li .img { width: 90px; height: 100px; overflow: hidden; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__sidebar_recent_post ul li .text { width: 69%; } .wsus__sidebar_recent_post ul li .text p { font-size: 14px; font-weight: 500; margin-bottom: 10px; } .wsus__sidebar_recent_post ul li .text p span { display: inline-block; width: 17px; margin-right: 5px; } .wsus__sidebar_recent_post ul li .text a { font-size: 16px; line-height: 24px; } .wsus__sidebar_blog_category { border-bottom: 1px solid rgba(30, 30, 47, 0.10); margin-bottom: 35px; padding-bottom: 30px; } .wsus__sidebar_blog_category h3 { margin-bottom: 5px; } .wsus__sidebar_blog_category ul li a { border-bottom: 1px solid rgba(30, 30, 47, 0.10); color: var(--paraColor); font-size: 15px; font-weight: 500; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: 13px 0px 13px 21px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; position: relative; } .wsus__sidebar_blog_category ul li a::after { position: absolute; content: "\f054"; font-family: "font awesome 5 free"; font-weight: 600; font-size: 14px; color: var(--paraColor); top: 14px; left: 0; z-index: 1; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__sidebar_blog_category ul li a span { font-size: 15px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__sidebar_blog_category ul li a:hover { color: var(--colorPrimary); } .wsus__sidebar_blog_category ul li a:hover span, .wsus__sidebar_blog_category ul li a:hover::after { color: var(--colorPrimary); } .wsus__sidebar_blog_category ul li:last-child a { border-bottom: 0; padding-bottom: 0; } .wsus__sidebar_blog_author { position: relative; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .wsus__sidebar_blog_author .text { position: absolute; top: 0; left: 0; text-align: center; padding: 45px; } .wsus__sidebar_blog_author .text h3, .wsus__sidebar_blog_author .text h3 span { color: var(--colorWhite); text-align: center; font-size: 20px; font-weight: 800; line-height: 30px; margin: 0; } .wsus__sidebar_blog_author .text h3 span { color: var(--colorOrange); } .wsus__sidebar_blog_author .text a { background: var(--colorOrange); color: var(--colorBlack); margin-top: 12px; } .wsus__sidebar_blog_author .text a:hover { background: var(--colorBlack); color: var(--colorWhite); } .wsus__sidebar_blog_tags h3 { margin-bottom: 15px; } .wsus__sidebar_blog_tags ul { gap: 8px; } .wsus__sidebar_blog_tags ul li a { border: 1px solid rgba(30, 30, 47, 0.14); color: var(--paraColor); font-size: 15px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; padding: 3px 13px; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .wsus__sidebar_blog_tags ul li a:hover { background: var(--colorPrimary); border-color: var(--colorPrimary); color: var(--colorWhite); } /*============================ BLOG DETAILS END ============================*/ /*============================ PRODUCT PAGE START ============================*/ .wsus__course_product_page .title { margin-bottom: 25px; } .wsus__course_product_page .wsus__sidebar_course_level h3 { margin-top: 0; } /*============================ PRODUCT PAGE END ============================*/ /*============================ PRODUCT DETAILS SDTART ============================*/ .product_slider_small { margin-left: 0; } .product_slider_small_item { width: 80px; height: 90px; background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 8px 15px; margin: 5px 0px; border: 1px solid var(--colorWhite); border-radius: 6px; } .product_slider_small_item img { border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; } .wsus__product_details_img { margin-right: 65px; } .product_slider_large_item { height: 630px; margin-left: 17px; margin-top: 5px; border-radius: 10px; overflow: hidden; } .wsus__product_details_text .rating { border: 1px solid rgba(30, 30, 47, 0.10); background: rgba(30, 30, 47, 0.00); display: inline-block; padding: 2px 7px; color: var(--ratingColor); border-radius: 6px; } .wsus__product_details_text .rating span { margin-left: 5px; font-weight: 500; } .wsus__product_details_text h2 { font-size: 34px; font-weight: 600; margin-top: 20px; margin-bottom: 15px; } .wsus__product_details_text .description { color: rgba(30, 30, 47, 0.70); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .wsus__product_details_text .price { color: var(--colorPrimary); font-size: 26px; display: flex; flex-wrap: wrap; align-items: center; margin-top: 20px; margin-bottom: 27px; } .wsus__product_details_text .price del { color: var(--paraColor); font-size: 20px; font-weight: 500; margin-right: 10px; } .wsus__product_details_text .stock { color: #43D477; font-size: 14px; font-weight: 500; position: relative; padding-left: 23px; } .wsus__product_details_text .stock::after { position: absolute; content: "\f00c"; font-family: "font awesome 5 free"; font-size: 7px; font-weight: 600; width: 15px; height: 15px; line-height: 15px; background: #43D477; color: var(--colorWhite); top: 1px; left: 0; text-align: center; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__product_details_text .wsus__btn_area { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 25px; margin-bottom: 35px; } .wsus__product_details_text .qnty { width: 90px; height: 46px; position: relative; border: 1px solid rgba(30, 30, 47, 0.10); overflow: hidden; border-radius: 6px; } .wsus__product_details_text .qnty input { width: auto; padding: 0; padding-left: 19px; font-weight: 600; color: var(--colorBlack); border: none; } .wsus__product_details_text .qnty input::placeholder { color: var(--colorBlack); } .wsus__product_details_text .qnty button { position: absolute; top: 0; right: 0; width: 35px; height: 50%; border-left: 1px solid rgba(30, 30, 47, 0.10); background: var(--colorWhite); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__product_details_text .qnty button:hover { background: var(--colorPrimary); color: var(--colorWhite); } .wsus__product_details_text .qnty .bottom_arrow { top: auto; bottom: 0; } .wsus__product_details_text .wishlist { width: 45px; height: 45px; text-align: center; line-height: 42px; background: var(--colorWhite); border: 1px solid rgba(30, 30, 47, 0.10); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; } .wsus__product_details_text .wishlist img { width: 17px !important; height: auto !important; } .wsus__product_details_text .wishlist:hover { background: var(--colorOrange); border-color: var(--colorOrange); } .wsus__product_details_text .common_btn_2 { background: var(--colorOrange); color: var(--colorBlack); border-color: var(--colorOrange); } .wsus__product_details_text .common_btn_2:after { background: var(--colorBlack); } .wsus__product_details_text .common_btn_2:hover { background: var(--colorBlack); border-color: var(--colorBlack); color: var(--colorWhite); } .wsus__product_details_text .list li { color: var(--paraColor); font-size: 15px; font-weight: 500; margin-top: 10px; } .wsus__product_details_text .list li span { color: var(--colorBlack); font-size: 15px; font-weight: 500; margin-right: 5px; } .product_slider_small .slick-current .product_slider_small_item { border-color: var(--colorPrimary); } .peoduct_details_description, .peoduct_details_additional_info, .peoduct_details_reviews { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 50px; border-radius: 10px; } .peoduct_details_description h2, .peoduct_details_additional_info h2, .peoduct_details_reviews h2 { font-size: 24px; font-weight: 600; } .peoduct_details_description p { margin-top: 20px; } .peoduct_details_additional_info ul { margin-top: 20px; } .peoduct_details_additional_info ul li { color: var(--paraColor); font-size: 18px; font-weight: 400; line-height: 38px; position: relative; padding-left: 20px; } .peoduct_details_additional_info ul li span { font-size: 18px; display: inline-block; width: 200px; } .peoduct_details_additional_info ul li::after { position: absolute; content: ""; width: 8px; height: 8px; background: var(--colorPrimary); top: 15px; left: 0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } /*============================ PRODUCT DETAILS END ============================*/ /*============================ CONTACT US START ============================*/ .wsus__contact_info { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); text-align: center; margin-top: 25px; border-radius: 10px; height: 100% !important; padding: 40px 40px; } .wsus__contact_info .icon { width: 80px; height: 80px; margin: 0 auto; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__contact_info h3 { text-align: center; margin-top: 15px !important; margin-bottom: 60px !important; } .wsus__contact_info h4 { text-align: center; font-size: 18px; font-weight: 500; margin-top: 35px; margin-bottom: 5px !important; } .wsus__contact_info p, .wsus__contact_info a { display: block; text-align: center; line-height: 26px; color: var(--paraColor); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__contact_info a:hover { color: var(--colorPrimary); } .wsus__contact_form_area { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 20px; border-radius: 10px; } .wsus__contact_form_img { margin-right: 30px; border-radius: 10px; overflow: hidden; } .wsus__contact_form h4 { font-size: 24px; font-weight: 600; } .wsus__contact_form p { margin-top: 8px; margin-bottom: 15px; } .wsus__contact_form input, .wsus__contact_form textarea { border: 1px solid rgba(30, 30, 47, 0.14); margin-top: 20px; } .wsus__contact_form button { margin-top: 25px; } .wsus__contact_map { margin-left: 300px; margin-right: 300px; height: 570px; } .wsus__contact_map iframe { width: 100%; height: 100%; border-radius: 10px; overflow: hidden; } /*============================ CONTACT US END ============================*/ /*============================ SIGN IN START ============================*/ .wsus__sign_in { height: 100vh; overflow: hidden; position: relative; } .wsus__sign_img { width: 100%; height: 100vh; position: relative; overflow: hidden; } .wsus__sign_img a { position: absolute; top: 40px; left: 40px; z-index: 1; } .wsus__sign_form_area { margin-right: 25px; } .wsus__sign_form_area .nav { display: inline-flex; flex-wrap: wrap; } .wsus__sign_form_area .nav li button { color: var(--colorBlack); font-size: 15px; font-weight: 500; background: #D9E2E9; padding: 9px 32px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-right: 1px solid #D9E2E9; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .wsus__sign_form_area .nav li button:hover, .wsus__sign_form_area .nav li button.active { background: var(--colorPrimary); color: var(--colorWhite); } .wsus__sign_form_area h2 { font-size: 30px; font-weight: 600; line-height: 22px; } .wsus__sign_form_area h2 span { font-size: 30px; font-weight: 600; color: var(--colorPrimary); } .wsus__sign_form_area .new_user { line-height: 26px; margin-top: 10px; margin-bottom: 10px; } .wsus__sign_form_area .new_user a { color: var(--colorPrimary); font-size: 15px; font-weight: 400; line-height: 26px; text-decoration-line: underline; } .wsus__sign_form_area .new_user a:hover { color: var(--colorBlack); text-decoration: none; } .wsus__sign_form_area form { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 60px 50px; } .wsus__login_form_input { margin-top: 20px; } .wsus__login_form_input label { color: var(--colorBlack); font-size: 14px; font-weight: 500; align-items: center; margin-bottom: 5px; } .wsus__login_form_input label a { color: var(--colorPrimary); font-size: 14px; font-weight: 500; text-decoration-line: underline; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__login_form_input label a:hover { color: var(--colorBlack); } .wsus__login_form_input input, .wsus__login_form_input textarea { border: 1px solid rgba(30, 30, 47, 0.14); border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; padding-top: 6px; padding-bottom: 6px; padding-left: 10px; padding-right: 10px; color:var(--colorBlack); } .wsus__login_form_input .form-check input { padding: 0; margin-top: 2px; border: 1px solid rgba(30, 30, 47, 0.14); } .wsus__login_form_input .form-check label { color: #62626E; font-size: 14px; font-weight: 400; display: block; } .wsus__login_form_input .form-check label a { font-weight: 400; } .wsus__login_form_input .form-check label a:hover { text-decoration: none; } .wsus__login_form_input button { width: 100%; margin-top: 25px; } .wsus__sign_form_area .or { color: var(--paraColor); font-size: 13px; font-weight: 500; text-transform: uppercase; text-align: center; position: relative; margin-top: 25px; margin-bottom: 25px; } .wsus__sign_form_area .or::after, .wsus__sign_form_area .or::before { position: absolute; content: ""; width: 46%; height: 1px; background: rgba(30, 30, 47, 0.10); top: 9px; left: 0; } .wsus__sign_form_area .or::before { left: auto; right: 0; } .wsus__sign_form_area .social_login { gap: 10px; justify-content: center; } .wsus__sign_form_area .social_login li a { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); color: var(--colorBlack); font-size: 15px; font-weight: 500; padding: 14px 40px 12px 40px; width: 100%; text-align: center; flex-wrap: wrap; } .wsus__sign_form_area .social_login li a span { display: inline-block; width: 20px; position: relative; margin-right: 5px; } .wsus__sign_form_area .create_account { text-align: center; margin-top: 35px; } .wsus__sign_form_area .create_account a { color: var(--colorPrimary); font-size: 15px; font-weight: 400; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__sign_form_area .create_account a:hover { color: var(--colorBlack); text-decoration: underline; } .wsus__sign_in .back_btn { position: absolute; top: 60px; right: 60px; color: var(--colorBlack); font-size: 15px; font-weight: 500; text-decoration-line: underline; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__sign_in .back_btn:hover { color: var(--colorPrimary); text-decoration: none; } /*============================ SIGN IN END ============================*/ /*============================ ERROR PAGE START ============================*/ .wsus__error_page { text-align: center; } .wsus__error_page .img { height: 520px; overflow: hidden; } .wsus__error_page h2 { text-align: center; font-size: 44px; font-weight: 700; text-transform: uppercase; margin-top: 60px; margin-bottom: 23px; } .wsus__error_page a i { margin-left: 0; margin-right: 5px; } /*============================ ERROR PAGE END ============================*/ /*============================ FORUM PAGE START ============================*/ .forum_header { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; margin-left: 30px; margin-right: 30px; padding: 130px 130px; border-radius: 10px; } .forum_header_text h4 { color: var(--colorPrimary); font-size: 48px; font-weight: 600; } .forum_header_text h1 { font-size: 60px; font-weight: 600; } .forum_header_text p { color: var(--colorBlack); font-size: 16px; font-weight: 400; line-height: 26px; opacity: .7; margin-top: 20px; margin-bottom: 45px; } .forum_header_text form { background: var(--colorWhite); box-shadow: 0px 6px 30px 0px rgba(3, 18, 33, 0.14); position: relative; border-radius: 10px; } .forum_header_text form i { position: absolute; font-size: 16px; color: var(--colorBlack); top: 50%; left: 25px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .forum_header_text form input { padding: 18px 50px; } .forum_header_text form button { position: absolute; top: 8px; right: 8px; } .wsus__counter_2 .wsus__single_counter { position: relative; display: flex; flex-wrap: wrap; justify-content: center; padding: 0; gap: 15px; } .wsus__counter_2 .wsus__single_counter .icon { width: 40px; height: 40px; margin-top: 10px; } .wsus__forum_categories { position: relative; } .wsus__forum_categories .container { position: relative; } .wsus__forum_categories::before { position: absolute; content: ""; background: url(../images/category_4_shapes_1.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 100px; height: 260px; left: 0px; bottom: 0px; filter: brightness(0) saturate(100%) invert(39%) sepia(51%) saturate(5685%) hue-rotate(214deg) brightness(99%) contrast(91%); } .wsus__forum_categories_item { border: 1px solid rgba(30, 30, 47, 0.10); padding: 20px; display: flex; flex-wrap: wrap; gap: 20px; margin-top: 25px; border-radius: 10px; } .wsus__forum_categories_item .icon { width: 70px; height: 70px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__forum_categories_item .text { width: 75%; } .wsus__forum_categories_item .text a { font-size: 18px; margin-bottom: 10px; } .wsus__forum_categories_item .text p { font-size: 14px; line-height: 24px; } .wsus__forum_topic { background: var(--colorLightBg); } .wsus__forum_topic_item { background: var(--colorWhite); box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 30px; display: flex; flex-wrap: wrap; gap: 25px; margin-top: 25px; border-radius: 10px; } .wsus__forum_topic_item .icon { width: 70px; height: 70px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__forum_topic_item .text { width: 92%; } .wsus__forum_topic_item .text p { border-bottom: 1px solid rgba(30, 30, 47, 0.10); margin-top: 5px; padding-bottom: 23px; margin-bottom: 20px; } .wsus__forum_topic_footer { justify-content: space-between; align-items: center; } .forum_topic_left { display: flex; flex-wrap: wrap; align-items: center; gap: 35px; } .forum_topic_left .img { width: 85px; position: relative; } .forum_topic_left .img span { position: absolute; top: 0; right: -20px; width: 35px; height: 35px; text-align: center; line-height: 32px; border-radius: 50%; border: 2px solid rgba(30, 30, 47, 0.14); background: var(--colorWhite); font-size: 14px; font-weight: 500; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .forum_topic_left ul li { color: var(--paraColor); font-size: 14px; font-weight: 500; padding-right: 15px; margin-right: 15px; border-right: 1px solid rgba(30, 30, 47, 0.14); } .forum_topic_left ul li:last-child { padding-right: 0; margin-right: 0; border: none; } .forum_topic_left ul li img { width: 17px !important; height: auto !important; margin-right: 5px; margin-top: -4px; } .forum_topic_left ul li a { color: var(--colorPrimary); font-size: 14px; font-weight: 500; } .forum_topic_right { gap: 16px; } .forum_topic_right li { color: var(--paraColor); font-size: 14px; font-weight: 500; } .forum_topic_right li i { color: var(--colorBlack); font-size: 16px; margin-right: 5px; } .wsus__different_category { border: 1px solid rgba(30, 30, 47, 0.14); padding: 25px 35px 40px 25px; border-radius: 10px; } .wsus__different_category .small_heading { font-size: 22px; font-weight: 600; margin-bottom: 20px; } .wsus__different_forum_item { background: var(--colorLightBg); margin-bottom: 15px; padding: 20px 30px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; border-radius: 10px; } .wsus__different_forum_left { display: inline-flex; flex-wrap: wrap; gap: 20px; } .wsus__different_forum_left .img { width: 50px; height: 50px; border-radius: 50%; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__different_forum_left .text a { font-size: 18px; } .wsus__different_forum_center ul { gap: 50px; min-width: 140px; } .wsus__different_forum_center ul li { text-align: center; } .wsus__different_forum_center ul li h4 { text-align: center; font-size: 16px; font-weight: 600; margin-bottom: 5px; } .wsus__different_forum_right { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 10px; min-width: 350px; } .wsus__different_forum_right .img { width: 40px; height: 40px; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__different_forum_right .text p { font-size: 14px; color: #030611; opacity: .7; } .wsus__different_forum_right .text ul li { font-size: 14px; font-weight: 500; color: #4F5159; } .wsus__different_forum_right .text ul li a { color: var(--colorPrimary); font-size: 14px; font-weight: 500; transition: all linear .3s; margin-right: 5px; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__different_forum_right .text ul li a:hover { text-decoration: underline; } .wsus__different_forum_right .text ul li:last-child { border-left: 1px solid rgba(30, 30, 47, 0.14); padding-left: 10px; margin-left: 10px; } .wsus__forum_call_to_action { background-position: center !important; background-repeat: no-repeat !important; background-size: cover !important; margin-left: 160px; margin-right: 160px; border-radius: 10px; } .wsus__forum_call_to_action_img { width: 380px; height: 525px; margin-top: -110px; } .wsus__forum_call_to_action_text h3 { color: var(--colorWhite); font-size: 44px; font-weight: 600; line-height: 54px; text-transform: uppercase; } .wsus__forum_call_to_action_text ul { gap: 10px; margin-top: 40px; } .wsus__forum_call_to_action_text ul li a { color: var(--colorBlack); font-size: 15px; font-weight: 500; padding: 11px 31px 10px 31px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; } .wsus__forum_call_to_action_text ul li a span { display: inline-block; width: 20px; position: relative; top: -1px; } .wsus__forum_call_to_action_text ul li a.create { background: var(--colorWhite); } .wsus__forum_call_to_action_text ul li a.browse { background: var(--colorBlack); color: var(--colorWhite); } .wsus__forum_call_to_action_text ul li a:hover { background: var(--colorOrange); color: var(--colorBlack); } /*============================ FORUM PAGE END ============================*/ /*=============================== FORUM CREATE TOPIC START ===============================*/ .forum_create_topic_input { margin-bottom: 23px; } .forum_create_topic_input label { color: var(--colorBlack); font-size: 14px; font-weight: 500; margin-bottom: 5px; width: 100%; display: block; } .forum_create_topic_input input, .forum_create_topic_input textarea { border: 1px solid rgba(30, 30, 47, 0.14); font-size: 14px; font-weight: 400; } .forum_create_topic_input .file { display: inline-flex; flex-wrap: wrap; align-items: center; width: 380px; position: relative; } .forum_create_topic_input .file label { width: 80px; height: 47px; background: var(--colorOrange); margin: 0; text-align: center; line-height: 48px; cursor: pointer; border-radius: 6px 0px 0px 6px; } .forum_create_topic_input .file label img { width: 20px !important; height: 20px !important; display: inline-block; } .forum_create_topic_input .file p { max-width: 300px; border: 1px solid rgba(30, 30, 47, 0.14); font-size: 14px; font-weight: 400; width: 100%; padding: 0px 20px; height: 47px; line-height: 47px; border-radius: 0px 6px 6px 0px; } .forum_create_topic_input .file button { position: absolute; bottom: 0; right: -60px; width: 47px; height: 47px; line-height: 38px; text-align: center; background: var(--colorOrange); color: var(--colorBlack); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; } .forum_create_topic_input .file button:hover { background: var(--colorBlack); color: var(--colorWhite); } .forum_create_topic_input .nice-select { border-radius: 6px; border: 1px solid rgba(30, 30, 47, 0.14); font-size: 14px; height: 47px; line-height: 47px; margin-bottom: 23px; } .forum_create_topic_input .nice-select:after { right: 20px; } .forum_create_topic_input .current { color: var(--colorBlack); } .forum_terms_and_rules { background: var(--colorLightBg); padding: 50px; position: relative; margin-top: 7px; border-radius: 6px; } .forum_terms_and_rules h3 { font-size: 18px; font-weight: 600; } .forum_terms_and_rules p { font-size: 14px; } .forum_terms_and_rules a { position: absolute; top: 50%; right: 50px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } /*=============================== FORUM CREATE TOPIC END ===============================*/ /*=============================== FORUM SINGLE TOPIC START ===============================*/ .wsus__forum_single_topic_area { border: 1px solid rgba(30, 30, 47, 0.14); padding: 20px; overflow: hidden; border-radius: 10px; } .single_topic_sidebar { background: var(--colorLightBg); padding-top: 60px; padding-bottom: 100px; margin-right: 50px; position: relative; height: 100%; border-radius: 10px; overflow: hidden; } .single_topic_sidebar_banner { width: 100%; height: 125px; position: absolute; top: 0; left: 0; z-index: 1; } .single_topic_sidebar .author_img { width: 120px; height: 120px; border-radius: 50%; overflow: hidden; margin: 0 auto; border: 1px solid var(--colorWhite); filter: drop-shadow(0px 20px 30px rgba(23, 23, 24, 0.12)); position: relative; z-index: 2; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .single_topic_sidebar h4 { text-align: center; font-size: 20px; font-weight: 600; margin-top: 15px; margin-bottom: 5px; } .single_topic_sidebar h6 { color: var(--paraColor); text-align: center; font-size: 15px; font-weight: 400; } .single_topic_sidebar .badge { background: rgba(23, 23, 24, 0.10); width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; padding: 10px; border-radius: 0; margin-top: 25px; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .single_topic_sidebar .badge li { width: 50px; height: 50px; background: var(--colorWhite); padding: 11px; border-radius: 6px; } .single_topic_sidebar .list { padding: 35px; } .single_topic_sidebar .list li { color: var(--paraColor); font-size: 15px; font-weight: 400; line-height: 34px; display: flex; flex-wrap: wrap; justify-content: space-between; } .single_topic_text .top { position: relative; padding-bottom: 20px; border-bottom: 1px solid rgba(30, 30, 47, 0.14); } .single_topic_text .top p, .single_topic_text .top a, .single_topic_text p b { font-size: 14px; font-weight: 500; color: var(--paraColor); } .single_topic_text .top p span, .single_topic_text .top a span { display: inline-block; width: 17px; margin-right: 5px; } .single_topic_text p b { border-left: 1px solid #D9D9D9; padding-left: 5px; margin-left: 5px; } .single_topic_text .top ul { gap: 12px; } .single_topic_text .top ul li a:hover { color: var(--colorPrimary); } .single_topic_text .top ul li:last-child a { border-radius: 100px; background: rgba(30, 30, 47, 0.06); padding: 6px 21px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; } .single_topic_text .top ul li:last-child a:hover { background: var(--colorOrange); color: var(--colorBlack); } .single_topic_text .center h4 { font-size: 15px; font-weight: 400; margin-top: 40px; margin-bottom: 35px; } .single_topic_text .center ul, .single_topic_text .center ol { padding-left: 15px; } .single_topic_text .center ul li, .single_topic_text .center ol li { list-style: decimal; color: var(--colorBlack); font-size: 15px; font-weight: 400; margin-top: 30px; } .single_topic_text .center ul li span, .single_topic_text .center ol li span { line-height: 26px; } .single_topic_text .topic_header { border: 1px solid rgba(30, 30, 47, 0.14); padding: 20px; border-radius: 10px; margin-top: 10px; } .single_topic_text .topic_header h5 { color: var(--colorBlack); font-size: 15px; font-weight: 400; margin-bottom: 25px; padding-left: 65px; position: relative; } .single_topic_text .topic_header h5 span { display: block; margin-top: 5px; font-size: 14px; } .single_topic_text .topic_header h5::after { position: absolute; content: ""; background: url(../images/topic_quot_icon.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 50px; height: 50px; top: -4px; left: 0; } /*=============================== FORUM SINGLE TOPIC END ===============================*/ /*=============================== FORUM CATEGORY LIST START ===============================*/ .forum_category_header { background: var(--colorWhite); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); padding: 20px 20px 20px 25px; border-radius: 10px; } .forum_category_header_left h3 { font-size: 18px; font-weight: 600; margin-bottom: 10px; } .forum_category_header_left ul { gap: 8px; } .forum_category_header_left ul li a { color: var(--paraColor); font-size: 14px; font-weight: 500; border: 1px solid rgba(30, 30, 47, 0.14); padding: 1px 8px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 4px; } .forum_category_header_left ul li a:hover { color: var(--colorWhite); background: var(--colorPrimary); border-color: var(--colorPrimary); } .forum_category_header_right { justify-content: flex-end; } .forum_category_header_right .rearch { position: relative; margin-right: 35px; } .forum_category_header_right .rearch input { border: 1px solid rgba(3, 6, 17, 0.10); width: 350px; margin-right: 5px; } .forum_category_header_right .rearch button { width: 50px; height: 50px; background: var(--colorPrimary); color: var(--colorWhite); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; } .forum_category_header_right .rearch button:hover { background: var(--colorBlack); } .forum_category_header_right .common_btn_2 { background: var(--colorOrange); border-color: var(--colorOrange); padding: 13px 35px; } .forum_category_header_right .common_btn_2:hover { border-color: var(--colorPrimary); } .forum_category_header_right .common_btn_2:hover span { filter: brightness(0) saturate(100%) invert(99%) sepia(0%) saturate(20%) hue-rotate(83deg) brightness(104%) contrast(100%); } .forum_category_header_right .common_btn_2 span { display: inline-block; position: relative; } .wsus__forum_category_list .wsus__different_forum_center ul { justify-content: center; } .wsus__forum_category_list .wsus__different_forum_left .text ul { margin-top: 5px; } .wsus__forum_category_list .wsus__different_forum_left .text ul li { color: var(--paraColor); font-size: 15px; font-weight: 400; } .wsus__forum_category_list .wsus__different_forum_left .text ul li:last-child { border-left: 1px solid rgba(30, 30, 47, 0.14); padding-left: 10px; margin-left: 10px; font-size: 14px; font-weight: 500; } .wsus__forum_category_list .wsus__different_forum_right .text p { font-size: 15px; font-weight: 400; } .wsus__forum_category_list .wsus__different_forum_left .img { width: 60px; height: 60px; } .wsus__forum_category_list .wsus__different_forum_right { min-width: 250px; } .wsus__forum_user { background: var(--colorWhite); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); padding: 35px 25px; margin-top: 30px; border-radius: 10px; } .wsus__forum_user h3 { font-size: 20px; font-weight: 600; } .wsus__forum_user ul li { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; margin-top: 20px; } .wsus__forum_user ul li .img { width: 50px; height: 50px; overflow: hidden; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__forum_user ul li .text { width: 74%; } .wsus__forum_user ul li .text a { font-size: 15px; font-weight: 500; margin-bottom: 5px; } .wsus__forum_user ul li .text p, .wsus__forum_user ul li .text p span { font-size: 14px; } .wsus__forum_user ul li .text p span { border-left: 1px solid rgba(30, 30, 47, 0.14); padding-left: 5px; margin-left: 5px; } /*=============================== FORUM CATEGORY LIST END ===============================*/ /*=============================== PRICING PLAN START ===============================*/ .wsus__pricing .wsus__section_heading p { margin-top: 15px; } .wsus__pricing .nav { display: inline-flex; justify-content: center; position: relative; width: 65px; height: 20px; margin-left: 10px; border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; background: rgba(30, 29, 48, 0.10); } .wsus__pricing .nav li button { background: none !important; position: relative; width: 30px; height: 30px; border-radius: 50%; margin-top: -5px; } .wsus__pricing .nav li button span { color: var(--paraColor) !important; font-size: 16px; font-weight: 500; text-transform: uppercase; padding: 0; background: none !important; position: absolute; top: 5px; left: -115px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__pricing .nav li:last-child button span { left: auto; right: -100px; } .wsus__pricing .nav li button.active { background: var(--colorPrimary) !important; } .wsus__pricing_area { /* background: var(--colorLightBg); */ margin-top: 45px; /* padding: 15px 0px 40px 0px; */ border-radius: 10px; } .wsus__single_pricing { margin-top: 25px; padding: 50px 35px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 10px; background: var(--colorLightBg); } .wsus__single_pricing h3 { font-size: 20px; font-weight: 500; } .wsus__single_pricing h2 { font-size: 44px; font-weight: 600; margin-top: 20px; margin-bottom: 5px; } .wsus__single_pricing h2 span { font-size: 16px; font-weight: 500; } .wsus__single_pricing p { font-size: 15px; font-weight: 400; line-height: 26px; } .wsus__single_pricing a { width: 100%; text-align: center; border: none !important; box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); display: block; margin-top: 35px; margin-bottom: 40px; } .wsus__single_pricing ul { min-height: 230px; } .wsus__single_pricing ul li { position: relative; color: var(--paraColor); font-size: 16px; font-weight: 400; padding-left: 30px; margin-top: 15px; } .wsus__pricing_tabs_area { position: relative; } .wsus__pricing_tabs_area p { color: #C83140; font-size: 16px; font-weight: 500; line-height: 20px; width: 160px; text-align: left; position: absolute; top: 0; right: -180px; } .wsus__pricing_tabs_area p::after { position: absolute; content: ""; background: url(../images/pricing_arrow.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 65px; height: 18px; top: -5px; left: -75px; } .wsus__single_pricing ul li::after { position: absolute; content: ""; background: url(../images/check_icon_green_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 20px; height: 20px; top: 2px; left: 0; } .wsus__single_pricing.active, .wsus__single_pricing:hover { background: var(--colorWhite); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); } .wsus__single_pricing.active a, .wsus__single_pricing:hover a { box-shadow: none; background: var(--colorPrimary); color: var(--colorWhite); border: 1px solid var(--colorPrimary); width: 100%; } .wsus__single_pricing a:hover { box-shadow: none; } .wsus__forum_single_topic_replay h6 { color: var(--colorBlack); font-size: 18px; font-weight: 500; margin-bottom: 10px; } .wsus__forum_single_topic_input { border: 1px solid rgba(30, 30, 47, 0.14); padding: 20px 30px; overflow: hidden; border-radius: 10px; } .wsus__forum_single_topic_input .popup { background: var(--colorLightBg); padding: 40px; margin-bottom: 25px; position: relative; border-radius: 10px; } .wsus__forum_single_topic_input .popup h5 { font-size: 16px; font-weight: 400; } .wsus__forum_single_topic_input .popup p { font-size: 16px; font-weight: 400; margin-top: 10px; } .wsus__forum_single_topic_input .popup .delete_popup { position: absolute; top: 50%; right: 40px; transform: translateY(-50%); cursor: pointer; font-size: 20px; color: var(--colorBlack); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .wsus__forum_single_topic_input .popup.hide_popup { display: none; } .wsus__forum_single_topic_input textarea { color: var(--colorBlack); font-size: 16px; font-weight: 400; padding: 20px; } .wsus__forum_single_topic_input textarea::placeholder { color: var(--colorBlack); } /*=============================== PRICING PLAN END ===============================*/ /*=============================== CART VIEW START ===============================*/ .cart_list { border-right: 1px solid rgb(8 5 33 / 8%) !important; border-left: 1px solid rgb(8 5 33 / 8%) !important; overflow: hidden; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .cart_list_description p { font-size: 18px !important; font-style: italic !important; font-weight: 500 !important; color: var(--colorBlack) !important; padding: 20px 10px !important; border: none !important; margin-bottom: 20px !important; } .cart_list table { width: 100%; } .cart_list table tbody tr { border-top: 1px solid var(--colorLightBg); padding: 20px 20px !important; } .cart_list table tbody tr:last-child { border-bottom: 1px solid rgb(8 5 33 / 8%) !important; } .cart_list table tr th { font-size: 18px; font-weight: 600 !important; text-transform: capitalize; color: var(--colorBlack); padding: 10px 20px !important; background: linear-gradient(180deg, rgba(35,55,66,.06), rgba(35,55,66,.03)), var(--rc-tint); } .cart_list table tr td { font-size: 16px; font-weight: 400; color: var(--colorBlack); padding: 10px 20px !important; } .cart_list table tr td ul { list-style: disc; padding-left: 20px; margin-top: 10px; } .cart_list table tr td ul li { font-size: 16px; font-weight: 400; color: var(--colorBlack); padding-left: 20px; margin-top: 10px; } .cart_list table tbody tr td a { color: var(--paraColor); text-transform: capitalize; font-size: 14px; display: block; } .cart_list table tbody tr td a { font-size: 18px; font-weight: 500; color: var(--colorBlack); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .cart_list table tbody tr td a:hover { color: var(--colorPrimary); } .cart_list table tbody tr td.pro_icon a { font-size: 24px; color: var(--paraColor); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .cart_list table tbody tr td.pro_icon a:hover { color: red; } /* restore normal lists only inside cart table content */ .cart_list td ul, .cart_list td ol { list-style: revert; /* bring back disc/decimal */ margin: 10px 0 10px 15px !important; /* standard indent */ padding-left: 1.5rem !important; } .cart_list td ul li { display: list-item; /* ensure markers render */ list-style-position: outside; margin: 0 !important; font-size: 15px !important; color: var(--paraColor) !important; padding: 0px !important; } /* force back if something set list-style:none inline or via other rules */ .cart_list td ul, .cart_list td ol, .cart_list td li { list-style: inherit !important; } .cart_list td li::marker { content: initial !important; } .continue_shopping { margin-top: 30px; } .continue_shopping a { font-size: 16px; padding: 16px 26px; } .total_price { margin-top: 20px; } .total_price h4 { font-size: 20px; font-weight: 600; text-transform: capitalize; } .total_price h4 span { font-size: 18px; font-weight: 700; text-transform: capitalize; color: var(--colorPrimary); margin-left: 14px; } .subtotal_area h5 { font-size: 20px; font-weight: 600; text-transform: capitalize; display: flex; flex-wrap: wrap; justify-content: space-between; } .subtotal_area h5 span { font-size: 18px; font-weight: 700; text-transform: capitalize; color: var(--colorPrimary); } .subtotal_area h6 { font-size: 16px; font-weight: 500; text-transform: capitalize; color: var(--colorBlack); margin-top: 25px; text-align: left; } .subtotal_area p { line-height: 26px; text-transform: capitalize; margin-top: 15px; margin-bottom: 28px; text-align: left; border-bottom: 1px solid var(--borderColor); padding-bottom: 30px; } .subtotal_area { margin-top: 25px; text-align: right; background: var(--colorLightBg); padding: 35px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .subtotal_area a { margin-top: 40px; padding: 15px 30px; } /*=============================== CART VIEW END ===============================*/ /*================================ CHECKOUT START ================================*/ .billing_details h4 { font-size: 24px; font-weight: 500; } .billing_details form { margin-top: 5px; } .billing_input { margin-top: 24px; } .billing_input label { font-size: 16px; font-weight: 400; margin-bottom: 7px; color: var(--colorBlack); text-transform: capitalize; } .billing_input input { padding: 17px 20px; /* border-radius: 0; */ transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; /* -webkit-border-radius: 0; */ -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .billing_input input::placeholder, .billing_input textarea::placeholder { color: #72798bbd; } .billing_input .form-control:focus { color: var(--colorBlack); background-color: transparent; outline: 0; box-shadow: none; } .billing_input .select2-container .select2-selection--single { height: 60px; } .billing_input .select2-container--default .select2-selection--single { background-color: transparent; border: 1px solid var(--borderColor); border-radius: 6px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; /* -webkit-border-radius: 0px; */ -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; } .billing_input .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 60px; } .billing_input .select2-container--default .select2-selection--single .select2-selection__arrow b { border-bottom: 1px solid var(--paraColor); border-right: 1px solid var(--paraColor); width: 9px; height: 9px; margin-top: 9px; right: 23px; } .order_summary { padding: 28px 30px 23px 30px; margin-top: 88px; border: 1px solid var(--borderColor); border-radius: 10px; } .order_summary h6 { font-size: 24px; font-weight: 600; text-transform: capitalize; } .order_summary .price { padding-top: 7px; margin-top: 15px; border-top: 1px solid var(--borderColor); } .order_summary p { display: flex; justify-content: space-between; text-transform: capitalize; margin-top: 12px; color: var(--colorBlack); } .order_summary p span { color: var(--colorBlack); } .order_summary h5 { display: flex; justify-content: space-between; font-size: 18px; font-weight: 500; text-transform: capitalize; margin-top: 20px; padding-top: 25px; border-top: 1px solid rgb(233, 236, 238); } .order_summary h5 span { font-size: 18px; font-weight: 500; color: var(--colorBlack); } .coupon_submit { position: relative; margin-top: 25px; background: var(--colorLightBg); border-radius: 6px; } .coupon_submit input { padding: 15px 115px 15px 20px; background: var(--colorLightBg); border: none; } .coupon_submit button { position: absolute; top: 10px; right: 13px; padding: 6px 18px; font-weight: 500; background: var(--paraColor); } .order_summary a { width: 100%; font-size: 16px; font-weight: 500; text-align: center; margin-top: 30px; text-transform: capitalize; } /*================================ CHECKOUT END ================================*/ /*================================ PAYMENT START ================================*/ .payment_mathod { width: 100%; height: 110px; text-align: center; background: var(--colorLightBg); margin-top: 25px; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 10px; } .payment_mathod img { max-width: 120px !important; max-height: 50px !important; } .total_payment_price { margin-top: 25px; padding: 35px 30px 30px 30px; background: var(--colorLightBg); border-radius: 10px; } .total_payment_price h4 { font-size: 20px; font-weight: 700; letter-spacing: -0.36px; text-transform: uppercase; display: flex; flex-wrap: wrap; justify-content: space-between; } .total_payment_price h4 span { font-size: 20px; font-weight: 700; color: var(--colorBlack); } .total_payment_price ul { margin-top: 35px; } .total_payment_price ul li { font-size: 16px; font-weight: 400; text-transform: capitalize; margin-top: 10px; padding-bottom: 10px; display: flex; flex-wrap: wrap; justify-content: space-between; } .total_payment_price ul li span { font-weight: 400; color: var(--colorBlack); } .total_payment_price a { width: 100%; text-align: center; margin-top: 30px; } .payment .modal .modal-dialog { width: 100%; max-width: 600px; } .payment .modal .modal-content { padding: 34px 40px; border-radius: 10px; } .payment .modal .modal-content p { line-height: 26px; } .modal_iteam { margin-top: 23px; margin-bottom: 9px; } .modal_iteam li { font-size: 16px; font-weight: 400; text-transform: capitalize; position: relative; padding-left: 30px; margin-bottom: 13px; color: var(--paraColor); } .modal_iteam li::after { position: absolute; content: ""; top: 2px; left: 0; width: 20px; height: 20px; background: url(../images/check_mark_2.png); background-size: cover; background-position: center; background-repeat: no-repeat; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .single_form { margin-bottom: 24px; } .single_form label { display: block; margin-bottom: 10px; font-size: 16px; font-weight: 400; text-transform: capitalize; color: var(--colorBlack); } .single_form:nth-child(2) { margin-bottom: 17px; } .single_form .nice-select { border-radius: 6px; height: 50px; line-height: 48px; padding-left: 18px; padding-right: 30px; border: 1px solid #E4E7E9; color: var(--paraColor); } .single_form .nice-select:after { width: 9px; height: 9px; margin-top: -7px; right: 20px; border-bottom: 2px solid var(--paraColor); border-right: 2px solid var(--paraColor); } .single_form .nice-select:focus { border-color: #E4E7E9; } .single_form .nice-select .list { width: 100%; border-radius: 3px; margin-top: 1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; } .modal .modal-footer { justify-content: space-between; border-top: 0; } .modal_closs_btn { padding: 10px 20px; background: red; } .modal_closs_btn:hover { background: var(--colorSecondary); } .payment .modal-footer { padding: 0; margin-top: 30px; } .payment .modal-footer button { border: none; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .payment .priceing_condition { margin-bottom: 0px; } .payment .priceing_condition li:last-child { margin-bottom: 0; } /*================================ PAYMENT END ================================*/ /*================================ BLOG LIST VIEW START ================================*/ .wsus__blog_list_item { background: var(--colorWhite); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); margin-top: 25px; } .wsus__blog_list_img { position: relative; height: 315px; overflow: hidden; } .wsus__blog_list_img a { position: absolute; top: 25px; left: 25px; color: var(--colorWhite); font-size: 12px; font-weight: 600; text-transform: uppercase; background: var(--colorPrimary); padding: 2px 10px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; z-index: 2; } .wsus__blog_list_text { padding: 20px 60px 20px 15px; } .wsus__blog_list_text ul { gap: 15px; margin-bottom: 15px; } .wsus__blog_list_text ul li { font-size: 14px; font-weight: 500; color: var(--paraColor); border-right: 1px solid var(--borderColor); padding-right: 20px; } .wsus__blog_list_text ul li:last-child { border: none; padding: 0; } .wsus__blog_list_text ul li span { display: inline-block; margin-top: -1px; margin-right: 5px; } .wsus__blog_list_text p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; border-top: 1px solid var(--borderColor); margin-top: 25px; padding-top: 27px; margin-bottom: 20px; } /*================================ BLOG LIST VIEW END ================================*/ /*================================ COURSE VIDEO START ================================*/ .wsus__course_header { background: var(--colorPrimary); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; position: fixed; width: 100%; padding: 18px 30px; top: 0; left: 0; z-index: 9; } .wsus__course_header a, .wsus__course_header p { color: var(--colorWhite); font-size: 16px; font-weight: 500; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; margin: 0; } .wsus__course_header a i { margin-right: 5px; } .wsus__course_header a:hover { color: var(--tg-theme-secondary); } .wsus__course_video_player { width: 75%; padding-top: 60px; } .wsus__course_sidebar { width: 25%; background: var(--tg-common-color-gray-2); height: 100vh; overflow: hidden; overflow-y: auto; position: fixed; top: 0; right: 0; padding-top: 60px; } .wsus__course_sidebar .video_heading { border-bottom: 1px solid rgb(30 30 47 / 15%) !important; color: var(--colorBlack); font-size: 16px; font-weight: 500; padding: 20px 20px; width: 100%; position: fixed; top: 60px; z-index: 9999; background: var(--colorLightBg); } .wsus__course_sidebar .accordion-item { margin-top: 0; border: none !important; border-bottom: 1px solid rgb(30 30 47 / 15%) !important; border-radius: 0 !important; } .wsus__course_sidebar .accordion-item button { background: var(--colorLightBg) !important; flex-wrap: wrap; color: var(--colorBlack) !important; } .wsus__course_sidebar .accordion-item button:focus { box-shadow: none; } .wsus__course_sidebar .accordion-item button b { color: var(--tg-heading-color) !important; font-size: 15px; font-weight: 400; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__course_sidebar .accordion-item button span { color: var(--tg-heading-color) !important; font-size: 12px; font-weight: 500; position: absolute; top: 20px; right: 60px; } .wsus__course_sidebar .accordion-button::after { background: transparent; border: none; background-image: var(--bs-accordion-btn-icon); width: 17px; height: 17px; } .wsus__course_sidebar .accordion-body { border-top: 1px solid rgb(30 30 47 / 15%) !important; padding: 25px 20px 7px 20px; } .wsus__course_sidebar .form-check { margin-bottom: 15px; } .wsus__course_sidebar .form-check input { border: 1px solid rgba(30, 30, 47, 0.70); padding: 0; /* border-radius: 0; */ width: 15px; height: 15px; margin-top: 7px; } .wsus__course_sidebar .form-check label { color: var(--tg-heading-color); font-size: 15px; font-weight: 400; } .wsus__course_sidebar .form-check label span { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; font-size: 12px; font-weight: 500; } .wsus__course_sidebar .form-check label span img { width: 16px !important; height: auto !important; } .wsus__course_sidebar .dropdown { margin-top: -35px; text-align: right; margin-bottom: 5px; position: relative; } .wsus__course_sidebar .dropdown button { color: var(--colorBlack); font-size: 13px; font-weight: 500; background: var(--colorWhite) !important; border: 1px solid rgba(30, 30, 47, 0.20); padding: 5px 20px; box-shadow: none; transition: all linear .3s; border-radius: 50px !important; } .wsus__course_sidebar .dropdown button i { color: var(--tg-heading-color); margin-right: 3px; } .wsus__course_sidebar .dropdown-menu { border-radius: 0 !important; border: 1px solid rgba(30, 30, 47, 0.20); } .wsus__course_sidebar .dropdown-menu.show { display: block; width: auto; min-width: 130px; max-width: 350px; transform: translate(0) !important; top: 32px !important; right: 0 !important; left: auto !important; -webkit-transform: translate(0) !important; -moz-transform: translate(0) !important; -ms-transform: translate(0) !important; -o-transform: translate(0) !important; } .wsus__course_sidebar .dropdown-menu li a { font-size: 13px; position: relative; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; padding-left: 35px; } .wsus__course_sidebar .accordion-button:not(.collapsed) p { font-weight: 500; } .wsus__course_sidebar .accordion { height: 100%; overflow: hidden; overflow-y: auto; } .wsus__course_sidebar .accordion::-webkit-scrollbar { background: var(--tg-common-color-white); width: 6px; height: 30px; } .wsus__course_sidebar .accordion::-webkit-scrollbar-thumb { background: var(--tg-heading-color); } .video-js .vjs-big-play-button { background-color: var(--colorPrimary); } .video-js { height: 700px; } .video_tabs_area .nav-pills { justify-content: center; border-bottom: 1px solid var(--bs-border-color); } .video_tabs_area .nav-pills .nav-link { color: var(--tg-heading-color); font-size: 15px; font-weight: 600; border-radius: 0; } .video_tabs_area .nav-pills .nav-link:hover, .video_tabs_area .nav-pills .nav-link.active { background: none; color: var(--colorPrimary); } .video_about { padding: 30px; } .video_about h1 { font-size: 24px; margin-bottom: 10px; } .video_about .short_description { max-width: 45%; margin-bottom: 0; color: var(--colorBlack); } .video_about table { margin-bottom: 0; margin-top: 30px; } .video_about table tr { border-top: 1px solid var(--bs-border-color); } .video_about table tr td { padding: 15px 0px; min-width: 250px; } .video_about table tr td p { margin-bottom: 5px; color: var(--colorBlack); } .video_about table tr td .table_btn { background: var(--colorPrimary); color: var(--colorWhite); padding: 7px 20px; border-radius: 50px; transition: all linear .3s; } .video_about table tr td .table_btn:hover { background: var(--colorBlack); } .video_about table tr td ul, .video_about table tr td ol { padding-left: 17px; } .video_about table tr td ul li, .video_about table tr td ol li { font-size: 16px; font-weight: 400; list-style: initial; color: var(--colorBlack); line-height: 30px; } .video_about table tr td p a { color: var(--colorPrimary); } .video_announcement { padding: 30px; } .video_announcement h1 { font-size: 24px; text-align: center; margin-bottom: 0; } .video_announcement p { color: var(--tg-heading-color); text-align: center; width: 50%; margin: 0 auto; margin-top: 10px; } .video_review { padding: 30px; } .video_review .course-review-head { border-top: 0; border-bottom: 1px solid #DFDFDF; padding-top: 40px; margin: 0; padding-bottom: 40px; } .video_qna { padding: 30px; } .video_qna .video_qna_top { justify-content: space-between; align-items: center; } .video_qna .video_qna_top form { position: relative; width: 550px; border: 1px solid #D3D2DF; border-radius: 100px; overflow: hidden; } .video_qna .video_qna_top form input { width: 100%; padding: 7px 25px; border: none; } .video_qna .video_qna_top form button { position: absolute; top: 2px; right: 2px; width: 38px; height: 38px; border: none; background: var(--tg-theme-primary); color: var(--tg-common-color-white); border-radius: 50%; } .video_qna .video_qna_top form button:hover { background: var(--tg-heading-color); color: var(--tg-common-color-white); } .video_qna .video_qna_top ul { list-style: none; gap: 20px; padding: 0; margin: 0; } .video_qna .video_qna_top ul li { padding-right: 10px; border-radius: 100px; position: relative; display: flex; flex-wrap: wrap; align-items: center; } .video_qna .video_qna_top ul li p { color: var(--tg-heading-color); margin: 0; font-size: 15px; font-weight: 600; margin-right: 10px; } .video_qna .video_qna_top ul li .select_box { border-radius: 100px; border: 1px solid #D3D2DF; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; } .video_qna .video_qna_top ul li select { width: 250px; padding: 10px; outline: none; position: relative; border: none; margin-right: 10px; border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -ms-border-radius: 100px; -o-border-radius: 100px; } .video_qna .video_qna_top ul li select::after { position: absolute; content: ""; } .video_qna_list { margin-top: 30px; } .video_qna_list h3 { font-size: 24px; margin-bottom: 20px; } .video_qna_list_item { display: flex; flex-wrap: wrap; background: #ebeaff33; padding: 25px; margin-top: 20px; border: 1px solid rgb(30 30 47 / 6%); border-radius: 10px; } .video_qna_list_item .img { width: 50px; height: 50px; border-radius: 50%; overflow: hidden; margin-right: 15px; } .video_qna_list_item .text { width: 95%; position: relative; } .video_qna_list_item .text a { color: var(--colorBlack); font-size: 18px; font-weight: 600; display: block; } .video_qna_list_item .text a:hover { color: var(--tg-theme-primary); } .video_qna_list_item .text p { color: var(--colorBlack); font-size: 15px; font-weight: 400; } .video_qna_list_item .text ul { list-style: none; display: flex; padding: 0; margin: 0; gap: 15px; } .video_qna_list_item .text ul li { font-size: 13px; font-weight: 500; color: var(--colorBlack); } .video_qna_list_item .text ul li a { font-size: 13px; font-weight: 500; color: var(--tg-theme-primary); } .video_qna_list_item .text ul li a:hover { color: var(--tg-heading-color); } .video_qna_list_item .text span { position: absolute; bottom: 0; right: 0; font-size: 15px; font-weight: 600; } .video_qna_list_item .text span i { margin-left: 2px; } .qna_details_area { display: none; } .qna_details_area h4, .qna_details_area .flow { color: var(--tg-heading-color); font-size: 16px; font-weight: 600; display: block; margin-top: 20px; } .qna_details_area .flow:hover { color: var(--tg-theme-primary); } .qns_details_list_item { padding: 5px 100px; background: none; border: none; } .qns_details_list_item .text { width: 94%; } .qns_details_list_item .text span { display: block; position: initial; color: var(--tg-heading-color); font-size: 13px; font-weight: 600; } .qns_details_list_item .dot { position: absolute; top: 0; right: 0; color: var(--tg-heading-color); font-size: 12px; font-weight: 600; cursor: pointer; width: 25px; height: 25px; background: #edecff; text-align: center; border-radius: 50%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .qns_details_list_item .dot:hover { background: var(--tg-theme-primary); color: var(--tg-common-color-white); } .qns_details_list_item .dot ul { position: absolute; top: 25px; right: 0; flex-wrap: wrap; background: #edecff; width: 125px; padding: 15px; border-radius: 6px; display: flex; transform: scaleY(.5); transform-origin: top; opacity: 0; visibility: hidden; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; -webkit-transform: scaleY(.5); -moz-transform: scaleY(.5); -ms-transform: scaleY(.5); -o-transform: scaleY(.5); } .qns_details_list_item .dot ul li { width: 100%; text-align: left; } .qns_details_list_item .dot ul li a { color: var(--tg-heading-color); } .qns_details_list_item .dot ul li a:hover { color: var(--tg-theme-primary); } .qns_details_list_item .dot:hover ul { opacity: 1; transform: scaleY(1); visibility: visible; -webkit-transform: scaleY(1); -moz-transform: scaleY(1); -ms-transform: scaleY(1); -o-transform: scaleY(1); } .qna_details_reply { padding: 0px 100px; } .qna_details_reply form { margin-top: 25px; margin-bottom: 15px; } .qna_details_reply form textarea { width: 100%; border: 1px solid var(--bs-border-color); border-radius: 10px; padding: 15px; } .video_qna.hide_qna_list .qna_list_area { display: none; } .video_qna.hide_qna_list .qna_details_area { display: block; } .video_review h2 { font-size: 24px; margin-bottom: 0; } .video_review_imput { margin-top: 55px; } .video_review_imput p { margin-top: 7px; } .video_review_imput p span { color: var(--tg-heading-color); text-transform: capitalize; font-weight: 600; font-size: 15px; margin-right: 10px; } .video_review_imput p i { font-size: 15px; cursor: pointer; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .video_review_imput p i:hover { color: #F8BC24; } .video_review_imput form textarea { width: 100%; border: 1px solid var(--bs-border-color); border-radius: 10px; padding: 15px; } .wsus__course_sidebar .accordion { padding-bottom: 130px; } .wsus__course_sidebar { padding-top: 120px; } .wsus__course_sidebar .dropdown button i { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__course_sidebar .dropdown:hover button, .wsus__course_sidebar .dropdown:hover i { color: var(--colorBlack); } .wsus__course_sidebar .dropdown ul { margin: 0; list-style: none; background: #fff; border: 1px solid #f5f5f5; box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15); width: 250px; position: absolute; top: 100%; right: 0; z-index: 9; padding: 11px 25px; transform-origin: top; opacity: 0; visibility: hidden; transform: scaleY(.5); -webkit-transform: scaleY(.5); -moz-transform: scaleY(.5); -ms-transform: scaleY(.5); -o-transform: scaleY(.5); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 6px; } .wsus__course_sidebar .dropdown ul li a { font-size: 15px; font-weight: 400; text-align: left; padding: 5px 0px; position: relative; padding-left: 20px; color: var(--colorBlack); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__course_sidebar .dropdown ul li a::after { position: absolute; content: "\f019"; font-family: "font awesome 5 free"; font-weight: 600; font-size: 12px; top: 7px; left: 0; color: var(--tg-heading-color); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__course_sidebar .dropdown ul li a:hover, .wsus__course_sidebar .dropdown ul li a:hover:after { color: var(--colorPrimary); } .wsus__course_sidebar .dropdown:hover ul { opacity: 1; visibility: visible; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); } .wsus__course_sidebar .dropdown { display: inline-block; float: right; } .video_course_content .wsus__course_sidebar { position: initial; width: 100%; padding-top: 0; } .video_course_content .video_heading { position: initial; } .vjs-icon-play:before, .video-js .vjs-play-control .vjs-icon-placeholder:before, .video-js .vjs-big-play-button .vjs-icon-placeholder:before { content: "\f101"; } .video_review .course-review-head { border-top: 0; border-bottom: 1px solid #DFDFDF; padding-top: 40px; margin: 0; padding-bottom: 40px; display: flex; align-items: center; gap: 30px; } .course-review-head .review-author-thumb { width: 80px; height: 80px; overflow: hidden; flex: 0 0 auto; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .course-review-head .review-author-content .author-name { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; justify-content: space-between; margin-bottom: 12px; } .course-review-head .review-author-content .author-name .name { margin-bottom: 0; display: flex; align-items: center; gap: 10px 20px; font-size: 18px; font-weight: 500; } .course-review-head .review-author-content .author-name .name span { font-size: 14px; font-weight: 400; } .course-review-head .review-author-content .author-name .author-rating { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 3px; color: var(--ratingColor); } .course-review-head .review-author-content .title { margin-bottom: 12px; font-size: 18px; } .course-review-head .review-author-content p { margin-bottom: 0; } /*================================ COURSE VIDEO END ================================*/ /*============================ DASHBOARD START ============================*/ /* dashboard sidebar start */ .wsus__dashboard_sidebar { margin-top: 0px; } .wsus__dashboard_sidebar_top { height: 280px; padding: 60px 20px 20px 20px; background: var(--colorWhite); box-shadow: 0px 3px 3px 0px rgba(23, 23, 24, 0.10); position: relative; border-radius: 10px; overflow: hidden; } .wsus__dashboard_sidebar_top .dashboard_banner { position: absolute; width: 100%; height: 120px; top: 0; left: 0; z-index: 1; } .wsus__dashboard_sidebar_top .img { width: 120px; height: 120px; margin: 0 auto; position: relative; z-index: 2; } .wsus__dashboard_sidebar_top .img img { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__dashboard_sidebar_top h4 { font-size: 20px; font-weight: 600; text-align: center; margin-top: 13px; text-transform: capitalize; } .wsus__dashboard_sidebar_top p { display: block; margin-top: 5px; text-transform: capitalize; text-align: center; } .wsus__dashboard_sidebar_menu { margin-top: 20px; margin-bottom: 30px; box-shadow: 0px 3px 3px 0px rgba(23, 23, 24, 0.10); border-radius: 10px; overflow: hidden; } .wsus__dashboard_sidebar_menu li a { display: flex; flex-wrap: wrap; font-size: 15px; font-weight: 500; padding: 13px 20px; color: var(--paraColor); text-transform: capitalize; background: var(--colorWhite); border-bottom: 1px solid var(--borderColor); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__dashboard_sidebar_menu li:last-child a { border-bottom: none; } .wsus__dashboard_sidebar_menu li a:hover, .wsus__dashboard_sidebar_menu li a.active { color: var(--colorWhite); background: var(--colorPrimary); border-color: #a6bef8; } .wsus__dashboard_sidebar_menu li a .img { width: 15px; height: 15px; margin-right: 10px; position: relative; top: -2px; left: 0; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__dashboard_sidebar_menu li a:hover .img, .wsus__dashboard_sidebar_menu li a.active .img { filter: brightness(0) saturate(100%) invert(99%) sepia(0%) saturate(7200%) hue-rotate(50deg) brightness(109%) contrast(100%); } /* dashboard sidebar start */ /* dashboard overview start */ .wsus__dash_earning { margin-top: 0px; padding: 28px 30px 28px 30px; background: var(--colorWhite); box-shadow: 0px 3px 3px 2px rgba(23, 23, 24, 0.10); border-radius: 10px; } .wsus__dash_earning h6 { font-size: 14px; font-weight: 500; color: var(--paraColor); text-transform: uppercase; } .wsus__dash_earning h3 { font-size: 26px; font-weight: 700; margin-top: 16px; } .wsus__dash_earning p { font-size: 13px; font-weight: 400; color: var(--colorPrimary); margin-top: 10px; } .wsus__dashboard_content { margin-bottom: 30px; background: var(--colorWhite); box-shadow: 0px 3px 3px 0px rgba(23, 23, 24, 0.10); border-radius: 10px; overflow: hidden; } .wsus__dashboard_content_top { padding: 15px 30px 15px 30px; border-bottom: 1px solid var(--borderColor); background: var(--colorLightBg); } .wsus__dashboard_heading h5 { font-size: 20px; font-weight: 600; text-transform: capitalize; } .wsus__dashboard_heading p { margin-top: 5px; } .wsus__dashboard_chat_graps { margin-top: 30px; } .wsus__dashboard_graph { padding: 20px; background: var(--colorWhite); box-shadow: 0px 3px 3px 0px rgba(23, 23, 24, 0.10); border-radius: 10px; } .wsus__dashboard_graph h5 { font-size: 18px; font-weight: 600; text-transform: capitalize; } .wsus__dashboard_graph .example-two { margin-top: 16px; } .wsus__dashboard_graph .simple-bar-graph__columns { height: 250px !important; } .wsus__dashboard_barfiller { padding: 25px 25px 25px 25px; background: var(--colorWhite); box-shadow: 0px 3px 3px 0px rgba(23, 23, 24, 0.10); border-radius: 10px; } .wsus__dashboard_barfiller h5 { font-size: 18px; font-weight: 600; text-transform: capitalize; } .wsus__dashboard_barfiller .single_bar { margin-top: 22px; } .wsus__dashboard_barfiller .single_bar p { font-size: 13px; } .wsus__dashboard_barfiller .barfiller { height: 18px; background: rgb(239, 239, 248); border-radius: 6px; margin-top: 4px; overflow: initial; } .wsus__dashboard_barfiller .barfiller .fill { border-radius: 6px !important; background: var(--colorPrimary) !important; } .wsus__dashboard_barfiller .barfiller .fill.orrange { background: #E88222 !important; } .wsus__dashboard_barfiller .barfiller .fill.megenda { background: #B432E1 !important; } .wsus__dashboard_barfiller .barfiller .fill.merun { background: #D93D50 !important; } .wsus__dashboard_barfiller .barfiller .tip { left: auto !important; right: 0; background: none; color: var(--paraColor); margin-top: -23px; font-size: 12px; font-weight: 500; } .wsus__dashboard_barfiller .barfiller .tip:after { display: none; } .wsus__dash_course_table { margin-top: 0px; border-radius: 10px; overflow: hidden; } .wsus__dash_course_table .table { margin: 0; } .wsus__dash_course_table .table tr th { font-size: 14px; font-weight: 500; padding: 10px 10px 10px 15px !important; color: var(--paraColor); background-color: var(--colorLightBg); text-transform: uppercase; border-bottom: none !important; } .wsus__dash_course_table .table tr th, .wsus__dash_course_table .table tr td { padding: 10px 10px 10px 15px; /* display: flex; */ /* flex-direction: column; */ /* justify-content: center; */ border-bottom: 1px solid var(--borderColor); min-width: 120px; vertical-align: middle; } .wsus__dash_course_table .table tr:last-child td { border-bottom: none !important; } .wsus__dash_course_table .image img { height: 120px !important; width: 120px !important; border-radius: 10px; object-fit: contain !important; } .wsus__dash_course_table .action a { width: 30px; height: 30px; line-height: 30px; font-size: 14px; text-align: center; background: var(--colorLightBg); border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__dash_course_table .action .edit { background: var(--colorGreen); color: var(--colorWhite); } .wsus__dash_course_table .action .del { background: red; color: var(--colorWhite); } .wsus__dash_course_table .action .edit:hover { background: #159F46; } .wsus__dash_course_table .action .del:hover { background: #bf0707; } .wsus__dash_course_table .image_category { position: relative; } .wsus__dash_course_table .main_category, .wsus__dash_course_table .sub_category { position: absolute; left: 12px; bottom: 50px; font-size: 12px; font-weight: 500; padding: 4px 12px; color: var(--colorBlack); background: var(--colorWhite); box-shadow: 0px 4px 3px 0px rgba(30, 30, 47, 0.12), 0px 2px 10px 0px rgba(30, 30, 47, 0.10); } .wsus__dash_course_table .sub_category { bottom: 12px; } .wsus__dash_course_table .rating span { font-size: 14px; font-weight: 500; color: var(--colorPrimary); } .wsus__dash_course_table .details a { font-size: 17px; margin-top: 12px; } /* dashboard overview end */ /* dashboard profile start */ .wsus__dashboard_profile { display: flex; flex-wrap: wrap; align-items: center; padding: 0px 30px 10px 30px; } .wsus__dashboard_profile .img { width: 120px !important; height: 120px; } .wsus__dashboard_profile .img img { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__dashboard_profile .text { margin-left: 20px; } .wsus__dashboard_profile .text h6 { font-size: 20px; font-weight: 600; text-transform: capitalize; } .wsus__dashboard_profile .text p { margin-top: 5px; line-height: 22px; } .wsus__dashboard_profile_info li { font-size: 14px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; padding: 15px 30px 15px 30px; border-bottom: 1px solid var(--borderColor); } .wsus__dashboard_profile_info li:last-child { border: none; } .wsus__dashboard_profile_info li span { width: 130px; display: inline-block; font-size: 14px; font-weight: 400; text-transform: capitalize; } /* dashboard profile end */ /* dashboard courses start */ .wsus__dash_course_searchbox { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 30px 40px 20px 30px; } .wsus__dash_course_searchbox .input { position: relative; } .wsus__dash_course_searchbox .input input { width: 270px; padding: 10px 35px 10px 20px; border: 1px solid var(--borderColor); } .wsus__dash_course_searchbox .input button { position: absolute; top: 12px; right: 15px; font-size: 14px; background: transparent; } .wsus__dash_course_searchbox .nice-select { border-radius: 6px; border: 1px solid var(--borderColor); height: 46px; line-height: 42px; width: 200px !important; padding-left: 15px; } .wsus__dash_course_searchbox .nice-select:after { margin-top: -5px; right: 15px; } .wsus__dash_course_table .status p { width: 60px; font-size: 13px; font-weight: 500; text-align: center; padding: 2px 0px; color: var(--colorWhite); border-radius: 4px; } .wsus__dash_course_table .status .active { background: #159F46; } .wsus__dash_course_table .status .draft { background: #E79520; } .wsus__dash_course_table .status .inactive { background: #E53935; } .wsus__dash_course_table .status .Pending { background: #E79520; } .wsus__dash_course_table .status .delete { background: #E53935; } /* dashboard courses end */ /* dashboard review start */ .wsus__dash_reviews_searchbox .selector_1 { width: 270px; } .wsus__dash_reviews_searchbox .selector_1 .nice-select, .wsus__dash_reviews_searchbox .selector .nice-select { width: 100% !important; border-radius: 6px; } .wsus__dash_reviews_searchbox .selector { width: 200px; } .wsus__dash_reviews { padding: 0px 30px 40px 30px; } .wsus__dash_reviews .wsus__course_single_reviews { margin-top: 50px; } .wsus__dash_reviews .wsus__single_review_img { width: 50px; height: 50px; } .wsus__dash_reviews .wsus__single_review_text h6 { font-size: 14px; font-weight: 500; text-transform: capitalize; } .wsus__dash_reviews .wsus__single_review_text p { line-height: 24px; } .dash_review_reply { font-size: 12px; font-weight: 500; padding: 3px 16px; margin-top: 15px; color: var(--colorBlack); background: var(--colorLightBg); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; border-radius: 4px; } .dash_review_reply:hover { background: var(--colorOrange); } /* dashboard review end */ /* dashboard order start */ .wsus__dash_order_table .table { margin: 0; } .wsus__dash_order_table .table tr th { font-size: 14px; font-weight: 500; color: var(--paraColor); text-transform: uppercase; border-top: none !important; } .wsus__dash_order_table .table tr th, .wsus__dash_order_table .table tr td { padding: 20px 10px; border-bottom: none; border-top: 1px solid var(--borderColor); vertical-align: middle; min-width: 125px; } .wsus__dash_order_table .details { padding-left: 30px !important; } .wsus__dash_order_table .method { text-align: start; } .wsus__dash_order_table .details .rating { color: var(--ratingColor); } .wsus__dash_order_table .details .rating span { color: var(--colorPrimary); margin-left: 5px; font-weight: 500; } .wsus__dash_order_table .details a { font-size: 16px; margin-top: 10px; } .wsus__dash_order_table .sale p, .wsus__dash_order_table .invoice p, .wsus__dash_order_table .date p, .wsus__dash_order_table .method p { font-size: 16px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; } .wsus__dash_order_table .icon a { width: 20px; height: 20px; margin-left: 30px; } .wsus__dash_order_table .icon a:hover img { filter: brightness(0) saturate(100%) invert(37%) sepia(49%) saturate(4327%) hue-rotate(213deg) brightness(96%) contrast(97%); } /* dashboard order end */ /* dashboard invoice start */ .wsus__invoice_top { padding: 40px 60px 0px 60px; overflow: hidden; } .wsus__invoice_logo { width: 150px; } .wsus__invoice_heading { text-align: end; margin-top: 20px; position: relative; } .wsus__invoice_heading h2 { font-size: 50px; font-weight: 600; text-transform: uppercase; color: rgba(23, 23, 24, 0.50); } .wsus__invoice_heading::after { position: absolute; content: ""; top: 20px; left: -60px; width: 680px; height: 20px; background: rgba(23, 23, 24, 0.10); } .wsus__invoice_description { padding: 12px 60px 0px 60px; } .wsus__invoice_description h4 { font-size: 21px; font-weight: 500; text-transform: capitalize; margin-bottom: 28px; } .wsus__invoice_address h5 { font-size: 16px; font-weight: 500; text-transform: capitalize; } .wsus__invoice_address p { width: 55%; line-height: 26px; margin-top: 12px; } .wsus__invoice_date { text-align: end; } .wsus__invoice_date h5 { display: flex; flex-wrap: wrap; justify-content: space-between; font-size: 16px; font-weight: 500; text-transform: capitalize; } .wsus__invoice_date h5 span { font-size: 15px; font-weight: 400; } .wsus__invoice_date .date { margin-top: 14px; } .wsus__invoice_table { padding: 75px 60px 0px 60px; } .wsus__invoice_table .table { margin: 0; border-right: 1px solid var(--borderColor); border-left: 1px solid var(--borderColor); } .wsus__invoice_table .table tr { display: flex; } .wsus__invoice_table .table tr th { font-size: 15px; font-weight: 500; padding: 8px 0px 8px 0px !important; text-transform: capitalize; border-top: none !important; background: var(--colorBlack); color: var(--colorWhite); } .wsus__invoice_table .table tr th, .wsus__invoice_table .table tr td { padding: 20px 0px 20px 0px; display: flex; flex-direction: column; justify-content: center; border-top: none; border-bottom: 1px solid var(--borderColor); } .wsus__invoice_table .serial { min-width: 100px; width: 10%; text-align: center; } .wsus__invoice_table .description { min-width: 240px; width: 55%; } .wsus__invoice_table .price { min-width: 100px; width: 10%; } .wsus__invoice_table .quantity { min-width: 120px; width: 15%; text-align: center; } .wsus__invoice_table .total { min-width: 120px; width: 10%; text-align: center; } .wsus__invoice_final_total { padding: 16px 95px 30px; } .wsus__invoice_final_total_right { text-align: right; } .wsus__invoice_final_total_right h6 { font-size: 15px; font-weight: 400; text-transform: capitalize; margin-bottom: 12px; } .wsus__invoice_final_total_right h6 span { color: var(--colorBlack); margin-left: 10px; } .wsus__invoice_final_total_right h5 { font-size: 16px; font-weight: 500; text-transform: capitalize; margin-top: 33px; } .wsus__invoice_final_total_right h5 span { font-size: 16px; font-weight: 500; margin-left: 10px; color: var(--colorBlack); } .wsus__invoice_bottom { margin-top: 175px; padding: 13px 95px 13px 95px; border-top: 1px solid var(--borderColor); } .wsus__invoice_bottom p { font-size: 15px; text-transform: capitalize; } .wsus__invoice_bottom p span { padding-left: 20px; margin-left: 20px; border-left: 1px solid var(--borderColor); } /* dashboard invoice end */ /* dashboard student start */ .wsus__dashboard_searchbox { display: flex; flex-wrap: wrap; margin: 30px 40px 0px 30px; } .wsus__dashboard_searchbox input { width: 79%; border: 1px solid var(--borderColor); } .wsus__dashboard_searchbox button { margin-left: 20px; } .wsus__dash_student_table .table { margin: 0; } .wsus__dash_student_table .table tr th { font-size: 14px; font-weight: 500; padding: 35px 0px 5px 30px !important; color: var(--paraColor); text-transform: uppercase; border-top: none !important; } .wsus__dash_student_table .table tr th, .wsus__dash_student_table .table tr td { padding: 20px 0px 20px 30px; border-bottom: none; border-top: 1px solid var(--borderColor); } .wsus__dash_student_table .table tr th input, .wsus__dash_student_table .name input { width: 13px; height: 13px; padding: 0; margin-right: 20px; border: 1px solid rgba(23, 23, 24, 0.40); } .wsus__dash_student_table th.name input { margin-top: 4px; } .wsus__dash_student_table .form-check-input:focus, .wsus__dash_payout_table .form-check-input:focus { border-color: rgba(23, 23, 24, 0.40); outline: 0; box-shadow: none; } .wsus__dash_student_table .form-check-input:checked, .wsus__dash_payout_table .form-check-input:checked { background-color: var(--colorPrimary); border-color: var(--colorPrimary); } .wsus__dash_student_table .name { display: flex; flex-wrap: wrap; align-items: center; } .wsus__dash_student_table .name input { margin-top: 8px; } .wsus__dash_student_table .name .form-check-inline { margin-right: 0; } .wsus__dash_student_table .name .img { width: 45px !important; height: 45px !important; } .wsus__dash_student_table .name .img img { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__dash_student_table .name a { font-size: 15px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; margin-left: 15px; } .wsus__dash_student_table .date p, .wsus__dash_student_table .progres p, .wsus__dash_student_table .location p { font-size: 15px; font-weight: 500; color: var(--colorBlack); } /* dashboard student end */ /* dashboard payout start */ .wsus__dash_payout_top { padding: 25px 40px 0px 30px; } .wsus__dash_payout_top h5 { font-size: 20px; font-weight: 600; color: var(--colorBlack); text-transform: capitalize; } .wsus__dash_payout_selector { display: flex; flex-wrap: wrap; margin-top: 20px; } .wsus__dash_payout_selector .selector { width: 30.5%; margin-right: 10px; } .wsus__dash_payout_selector .nice-select { border-radius: 6px; border: solid 1px var(--borderColor); height: 46px; line-height: 44px; } .wsus__dash_payout_selector .nice-select:after { margin-top: -5px; right: 20px; } .wsus__dash_payout_selector .payout_print { width: 46px; height: 46px; line-height: 46px; text-align: center; border: 1px s olid var(--borderColor); } .wsus__dash_payout_selector .payout_print img { width: 20px !important; height: 20px !important; } .wsus__dash_payout_table .table { margin: 0; } .wsus__dash_payout_table .table tr th { font-size: 14px; font-weight: 500; padding: 25px 0px 10px 30px !important; color: var(--paraColor); text-transform: uppercase; border-top: none !important; } .wsus__dash_payout_table .table tr th, .wsus__dash_payout_table .table tr td { padding: 20px 0px 20px 30px; border-bottom: none; border-top: 1px solid var(--borderColor); vertical-align: middle; } .wsus__dash_payout_table .id p, .wsus__dash_payout_table .date p, .wsus__dash_payout_table .amount p, .wsus__dash_payout_table .method p { font-size: 16px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; } .wsus__dash_payout_table .status p { font-size: 13px; font-weight: 600; width: 60px; height: 20px; line-height: 20px; text-align: center; color: var(--colorWhite); background: #159F46; text-transform: capitalize; border-radius: 4px; } .wsus__dash_payout_table .status .pending { background: #E79520; } .wsus__dash_payout_table .checkbox input { width: 13px; height: 13px; padding: 0; border: 1px solid rgba(23, 23, 24, 0.40); } .wsus__dash_payout_table .form-check { margin-bottom: 0; } .wsus__dash_payout_table .form-check-inline { margin-right: 0; } /* dashboard payout end */ /* dashboard support start */ .wsus__support_nav { gap: 10px; padding: 40px 30px 0px 30px; } .wsus__support_nav li button { font-size: 15px; font-weight: 500; padding: 12px 30px; color: var(--colorBlack); text-transform: capitalize; background: rgba(23, 23, 24, 0.10); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__support_nav li button:hover { color: var(--colorWhite); background: var(--colorPrimary); } .nav-pills .nav-link { border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .nav-pills .nav-link.active, .nav-pills .show>.nav-link { color: var(--colorWhite); background-color: var(--colorPrimary); } .wsus__dash_support_table .table { margin: 0; } .wsus__dash_support_table .table tr th { font-size: 14px; font-weight: 500; padding: 20px 0px 5px 30px !important; color: var(--paraColor); text-transform: uppercase; border-top: none !important; } .wsus__dash_support_table .table tr th, .wsus__dash_support_table .table tr td { padding: 20px 0px 20px 30px; border-bottom: none; border-top: 1px solid var(--borderColor); } .wsus__dash_support_table .details p { font-size: 14px; font-weight: 400; color: var(--colorBlack); } .wsus__dash_support_table .details p a { margin-right: 10px; color: var(--colorPrimary); } .wsus__dash_support_table .priority p, .wsus__dash_support_table .status p { width: 80px; height: 24px; text-align: center; line-height: 24px; background: #159F46; color: var(--colorWhite); text-transform: capitalize; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; } .wsus__dash_support_table .priority .red, .wsus__dash_support_table .status .red { background: #E53935; } .wsus__dash_support_table .priority .yellow, .wsus__dash_support_table .status .yellow { background: #E79520; } .wsus__dash_support_table .category p { font-size: 15px; font-weight: 500; text-transform: capitalize; color: var(--colorBlack); } /* dashboard support end */ /* dashboard profile edit start */ .wsus__dashboard_profile_delete .common_btn { background: #E53935; } .wsus__dashboard_profile_avatar .img { position: relative; } .wsus__dashboard_profile_avatar .img label { position: absolute; width: 30px; height: 30px; text-align: center; line-height: 25px; border-radius: 50%; bottom: 7px; right: 0px; font-size: 13px; cursor: pointer; transition: all linear.3s; background: var(--colorWhite); border: 1px solid var(--borderColor); -webkit-transition: all linear.3s; -moz-transition: all linear.3s; -ms-transition: all linear.3s; -o-transition: all linear.3s; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__dashboard_profile_avatar .img label img { width: 13px !important; height: 10px !important; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; } .wsus__dashboard_profile_avatar .img label:hover { background: var(--colorPrimary); } .wsus__dashboard_profile_avatar .img label:hover img { filter: brightness(0) saturate(100%) invert(99%) sepia(5%) saturate(1700%) hue-rotate(284deg) brightness(115%) contrast(100%); -webkit-filter: brightness(0) saturate(100%) invert(99%) sepia(5%) saturate(1700%) hue-rotate(284deg) brightness(115%) contrast(100%); } .wsus__dashboard_profile_update { padding: 17px 30px 30px 30px; } .wsus__dashboard_profile_update_btn { margin-top: 30px; } /* dashboard profile edit end */ /* dashboard security start */ .wsus__dashboard_email_change { padding: 30px 30px 0px 30px; } .wsus__dashboard_email_change h6, .wsus__dashboard_password_change h6 { font-size: 20px; font-weight: 600; text-transform: capitalize; } .wsus__dashboard_email_change p, .wsus__dashboard_password_change p { font-size: 15px; font-weight: 400; margin-top: 10px; } .wsus__dashboard_email_change p a { color: var(--colorPrimary); } .wsus__dashboard_email_change form { margin-top: 17px; } .wsus__dashboard_email_change_input label { font-size: 14px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; } .wsus__dashboard_email_change_input input { margin-top: 5px; border: 1px solid var(--borderColor); } .wsus__dashboard_email_change_btn { margin-top: 20px; } .wsus__dashboard_password_change { padding: 35px 30px 50px 30px; } .wsus__dashboard_password_change form { margin-top: 5px; } .wsus__dashboard_password_change_input { margin-top: 12px; } .wsus__dashboard_password_change_input label { font-size: 14px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; } .wsus__dashboard_password_change_input input { margin-top: 5px; border: 1px solid var(--borderColor); } .wsus__dashboard_password_change_btn { margin-top: 20px; } /* dashboard security end */ /* dashboard social profilw start */ .wsus__dashboard_social_profile { padding: 0px 30px 30px 30px; } .wsus__dashboard_social_profile_input { margin-top: 33px; } .wsus__dashboard_social_profile_input label { font-size: 14px; font-weight: 500; color: var(--colorBlack); text-transform: capitalize; } .wsus__dashboard_social_profile_input input { margin-top: 5px; border: 1px solid var(--borderColor); } .wsus__dashboard_social_profile_btn { margin-top: 30px; } /* dashboard social profilw end */ /* dashboard notification start */ .wsus__dashboard_notification { padding: 28px 30px 28px 30px; border-bottom: 1px solid var(--borderColor); } .wsus__dashboard_notification h5 { font-size: 15px; font-weight: 500; text-transform: capitalize; } .wsus__dashboard_notification .form-check { margin-top: 18px; } .wsus__dashboard_notification label { font-size: 15px; font-weight: 400; margin-left: 10px; margin-top: 6px; color: var(--paraColor); } .wsus__dashboard_notification .form-check-input:focus { border-color: #86b7fe; outline: 0; box-shadow: none; } /* dashboard notification end */ /* dashboard account linked start */ .wsus__dashboard_account { padding: 30px; } .wsus__dashboard_account_remove { display: flex; flex-wrap: wrap; } .wsus__dashboard_account_remove .img { width: 50px; height: 50px; } .wsus__dashboard_account_remove .img img { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .wsus__dashboard_account_remove .text { margin-left: 20px; } .wsus__dashboard_account_remove .text h5 { font-size: 18px; font-weight: 500; } .wsus__dashboard_account_remove .text p { margin-top: 12px; width: 100%; } .wsus__dashboard_account_remove .text a { font-size: 15px; font-weight: 500; padding: 11px 35px; color: var(--colorWhite); margin-top: 25px; background: rgba(23, 23, 24, 0.50); transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .wsus__dashboard_account_remove .text a:hover { background: red; } .wsus__dashboard_account_link { margin-top: 40px; } .wsus__dashboard_account_link .text a { background: transparent; color: var(--colorBlack); border: 1px solid var(--paraColor); } .wsus__dashboard_account_link .text a:hover { color: var(--colorWhite); background: var(--colorPrimary); border-color: var(--colorPrimary); } /* dashboard account linked end */ /*============================ DASHBOARD END ============================*/ /*================================= BECOME AN INSTRUCTOR START =================================*/ .become_instructor_page_text p { margin-top: 20px; } .become_instructor_page_text h1, .become_instructor_page_text h2, .become_instructor_page_text h3, .become_instructor_page_text h4, .become_instructor_page_text h5, .become_instructor_page_text h6 { font-weight: 600; margin-top: 30px; } .become_instructor_page_text h1 { font-size: 30px; } .become_instructor_page_text h2 { font-size: 26px; } .become_instructor_page_text h3 { font-size: 22px; } .become_instructor_page_text h4 { font-size: 18px; } .become_instructor_page_text h5, .become_instructor_page_text h6 { font-size: 16px; } .become_instructor_page_text ul, .become_instructor_page_text ol { margin-top: 20px; } .become_instructor_page_text ul li, .become_instructor_page_text ol li { font-size: 14px; font-weight: 400; margin: 15px 0px; padding-left: 30px; position: relative; color: var(--paraColor); } .become_instructor_page_text ul li::after, .become_instructor_page_text ol li::after { position: absolute; content: ""; background: url(../images/check_icon_green_2.png); background-position: center; background-repeat: no-repeat; background-size: cover; width: 20px; height: 20px; top: 0px; left: 0; } .become_instructor_page_form h2 { font-weight: 600; margin-bottom: 30px; font-size: 22px; } .become_instructor_page_form { box-shadow: 0px 2px 10px 0px rgba(30, 30, 47, 0.10), 0px 4px 3px 0px rgba(30, 30, 47, 0.12); padding: 40px; margin-top: 35px; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .become_instructor_page_form .wsus__login_form_input { margin-top: 0; margin-bottom: 20px; } .become_instructor_page_form .nice-select { border-radius: 6px; border: 1px solid var(--borderColor) !important; font-size: 14px; height: 50px; line-height: 50px; margin-bottom: 20px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .become_instructor_page_form .nice-select:after { margin-top: -6px; right: 22px; } .become_instructor_page_form .nice-select .option.selected { font-weight: 400; } .become_instructor_page_form .current { color: var(--colorBlack); } .become_instructor_page_form input[type=file]::file-selector-button { margin-right: 10px; border: none; background: var(--colorPrimary); padding: 6px 15px; color: var(--colorWhite); cursor: pointer; transition: linear .2s ease-in-out; border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; -webkit-transition: background .2s ease-in-out; -moz-transition: linear .2s ease-in-out; -ms-transition: linear .2s ease-in-out; -o-transition: linear .2s ease-in-out; } .become_instructor_page_form input[type=file]::file-selector-button:hover { background: #0d45a5; } @media (min-width: 1200px) and (max-width: 1399.99px) { .become_instructor_page_form { padding: 30px; } } @media (max-width: 575.99px) { .become_instructor_page_form { padding: 20px; } } /*================================= BECOME AN INSTRUCTOR END =================================*/ .wsus__student_reviews .wsus__single_testimonial { margin: 25px 0px 0px 0px; } .wsus__dashboard_heading.relative { position: relative; } .wsus__dashboard_heading.relative .common_btn { position: absolute; top: 0; right: 0; } /*================================= DASHBOARD ADD COURSE START =================================*/ .dashboard_add_courses { padding: 30px; } .dashboard_add_courses .nav-pills { gap: 10px; margin-bottom: 25px; border-bottom: 1px solid var(--borderColor); padding-bottom: 10px; } .dashboard_add_courses .nav-pills .nav-item .nav-link { background: var(--colorLightBg); color: var(--colorBlack); padding: 10px 20px !important; border-radius: 8px !important; transition: all linear .3s; font-size: 15px; font-weight: 500; -webkit-border-radius: 8px !important; -moz-border-radius: 8px !important; -ms-border-radius: 8px !important; -o-border-radius: 8px !important; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .dashboard_add_courses .nav-pills .nav-item .nav-link:hover { color: var(--colorPrimary); } .dashboard_add_courses .nav-pills .nav-item .nav-link.active { background: var(--colorPrimary); color: var(--colorWhite); } .add_course_basic_info_input, .add_course_more_info_input { margin-bottom: 20px; } .add_course_basic_info_input label, .add_course_more_info_input label { display: inline-block; font-size: 15px; font-weight: 500; color: var(--colorBlack); margin-bottom: 3px; } .add_course_basic_info_input label b { text-transform: capitalize; font-weight: 400; font-size: 14px; color: var(--paraColor); } .add_course_basic_info_input input, .add_course_more_info_input input { font-size: 16px; } .add_course_basic_info_input p, .add_course_more_info_input p { margin-top: 5px; } .add_course_basic_info_input input[type=file] { padding: 0; } .add_course_basic_info_input input[type=file]::file-selector-button { margin-right: 20px; border: none; background: var(--colorPrimary); height: 49px; padding: 0px 20px; color: var(--colorLightBg); cursor: pointer; transition: background .3s ease-in-out; -webkit-transition: background .3s ease-in-out; -moz-transition: background .3s ease-in-out; -ms-transition: background .3s ease-in-out; -o-transition: background .3s ease-in-out; } .add_course_basic_info_input input[type=file]::file-selector-button:hover { background: #1245bd; } .add_course_basic_info_input .nice-select { border-radius: 6px; border: solid 1px var(--borderColor) !important; height: 50px; line-height: 48px; margin-bottom: 20px; -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; } .add_course_basic_info_input .nice-select .current { font-size: 16px; color: var(--colorBlack); } .add_course_basic_info_input .nice-select:after { right: 18px; } .add_course_more_info_checkbox { margin-bottom: 27px; } .add_course_more_info_checkbox .form-check { padding-left: 0; } .add_course_more_info_checkbox .form-check input { padding: 0; float: right; border-color: #d5d2d2; } .add_course_more_info_checkbox .form-check label { display: block; font-size: 16px; color: var(--colorBlack); margin: 10px 0px; } .add_course_more_info_radio_box { border: 1px solid var(--borderColor); border-radius: 10px; padding: 25px 25px 15px 25px; margin-bottom: 25px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; } .add_course_more_info_radio_box h3 { font-size: 18px; font-weight: 600; margin-bottom: 25px; border-bottom: 1px solid var(--borderColor); padding-bottom: 5px; } .add_course_more_info_radio_box label { display: block; font-size: 16px; color: var(--colorBlack); margin: 10px 0px; } .add_course_more_info_radio_box input { padding: 0; border-color: #d5d2d2; } .add_course_content .accordion-header { position: relative; } .add_course_content .accordion-item .accordion-button:not(.collapsed) { color: var(--colorPrimary); background-color: var(--colorLightBg); box-shadow: none; } .add_course_content .accordion-item button { display: inline-block; background: var(--colorWhite); padding-right: 130px; padding-left: 55px; position: relative; } .add_course_content .accordion-item button span { color: var(--colorBlack); font-size: 18px; font-weight: 500; } .add_course_content .accordion-item button::before { position: absolute; content: "\f07c"; font-family: "font awesome 5 free"; font-size: 16px; font-weight: 600; width: 35px; height: 35px; line-height: 35px; text-align: center; background: var(--colorPrimary); color: var(--colorWhite); top: 7px; left: 12px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .add_course_content .accordion-button::after { background: var(--bs-accordion-btn-icon) !important; background-position: center !important; background-repeat: no-repeat !important; border: none; width: 15px; height: 15px; position: absolute; margin-left: 15px; top: 19px; } .add_course_content_action_btn { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 5px 10px; position: absolute; top: 6px; right: 15px; z-index: 9; } .add_course_content_action_btn .dropdown-menu { z-index: 99; } .add_course_content_action_btn .dropdown-menu li a { transition: all linear .3s; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -ms-transition: all linear .3s; -o-transition: all linear .3s; } .add_course_content_action_btn .dropdown-menu li a:hover { background: none; color: var(--colorPrimary); } .add_course_content_action_btn .edit { font-size: 18px; color: var(--colorBlack); } .add_course_content_action_btn .del { font-size: 18px; color: red; } .add_course_content_action_btn .arrow { font-size: 18px; color: var(--colorPrimary); } .add_course_content_action_btn .dropdown-toggle { white-space: nowrap; background: var(--colorPrimary) !important; border: none; padding: 3px 10px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; } .add_course_content .item_list { display: flex; flex-direction: column; gap: 12px; } .add_course_content .item_list li { color: var(--colorBlack); font-size: 18px; font-weight: 500; border-radius: 8px; border: 1px solid var(--borderColor); padding: 13px 50px 13px 55px; position: relative; -webkit-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; } .add_course_content .item_list li span { color: var(--colorBlack); font-size: 18px; font-weight: 500; } .add_course_content .item_list li::before { position: absolute; content: "\f03d"; font-family: "font awesome 5 free"; font-size: 16px; font-weight: 600; width: 35px; height: 35px; line-height: 35px; text-align: center; background: var(--colorPrimary); color: var(--colorWhite); top: 7px; left: 12px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; } .add_course_content .item_list .add_course_content_action_btn { top: 13px; } /*================================= DASHBOARD ADD COURSE END =================================*/ .wsus__dashboard .container { max-width: 1700px; } .wsus__course_sidebar .accordion-item button { border-radius: 0px !important; -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; -ms-border-radius: 0px !important; -o-border-radius: 0px !important; } .label-required::after { content: ' *'; color:crimson; font-weight: bold; } /* ========================================================= DataTable Format (pagination + inputs/selects) ======================================================= */ /* Pagination ------------------------------------------------ */ .dataTables_wrapper .dataTables_paginate { margin: 0; } .dataTables_wrapper .dataTables_paginate .pagination { gap: .25rem; } /* Base look */ .dataTables_wrapper .dataTables_paginate .page-link { padding: .25rem .55rem; border-radius: .5rem; background-color: #f8fafc; border: 1px solid #dee2e6; color: #334155; line-height: 1.2; } /* Hover (all items) */ .dataTables_wrapper .dataTables_paginate .page-item:not(.disabled) .page-link:hover { color: #182433; border-color: #182433; background-color: #eef2f6; } /* Active page number */ .dataTables_wrapper .dataTables_paginate .page-item.active .page-link { background-color: #182433; border-color: #182433; color: #fff; } /* Outline style for First/Prev/Next/Last (clickable state) */ .dataTables_wrapper .dataTables_paginate .page-item.first .page-link, .dataTables_wrapper .dataTables_paginate .page-item.previous .page-link, .dataTables_wrapper .dataTables_paginate .page-item.next .page-link, .dataTables_wrapper .dataTables_paginate .page-item.last .page-link { background-color: transparent; color: #182433; } /* Disabled */ .dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link { background-color: #f1f3f5; border-color: #e9ecef; color: #adb5bd; } /* Remove focus ring / halo on pager links */ .dataTables_wrapper .dataTables_paginate .page-link, .dataTables_wrapper .dataTables_paginate .page-link:hover, .dataTables_wrapper .dataTables_paginate .page-link:focus, .dataTables_wrapper .dataTables_paginate .page-link:focus-visible, .dataTables_wrapper .dataTables_paginate .page-link:active { box-shadow: none !important; outline: none !important; } /* Length menu ------------------------------------------------ */ .dataTables_wrapper .dataTables_length label { margin: 0; display: inline-flex; align-items: center; gap: .5rem; } /* The select itself */ .dataTables_wrapper .dataTables_length select.form-select { min-width: 72px; padding: .25rem 2rem .25rem .5rem; height: 32px; border-radius: .5rem; line-height: 1.2; } .dataTables_wrapper .dataTables_length select.form-select:focus { border-color: #182433; box-shadow: none; } .dataTables_wrapper .dataTables_length select.form-select:hover { border-color: #182433; } /* ========================================================= GLOBAL input/select styling INSIDE DataTables (header filters, footer filters, and any other controls) ======================================================= */ /* Size & typography for ALL controls in the wrapper */ .dataTables_wrapper .form-control, .dataTables_wrapper .form-select, .dataTables_wrapper textarea.form-control { font-size: 0.85rem; /* <- increase text size */ line-height: 1.25; height: 32px; /* unified compact height */ padding-top: .20rem; /* compact vertical padding */ padding-bottom: .20rem; border-radius: .5rem; } .dataTables_wrapper .form-control::placeholder { font-size: inherit; opacity: .65; } /* Remove blue glow on focus for ALL inputs/selects in DT */ .dataTables_wrapper .form-control:focus, .dataTables_wrapper .form-select:focus, .dataTables_wrapper textarea.form-control:focus, .dataTables_wrapper .form-control:focus-visible, .dataTables_wrapper .form-select:focus-visible { box-shadow: none !important; outline: 0 !important; border-color: #d0d5dd !important; /* neutral; tweak if you want darker */ } /* ========================================================= Header filters (the ones you inject via .dt-filter) ======================================================= */ .dataTables_wrapper .dt-filter { height: 30px; /* a touch smaller than global */ font-size: 0.85rem; line-height: 1.2; padding-top: .20rem; padding-bottom: .20rem; } /* Header selects: keep right padding for caret */ select.dt-filter.form-select { padding-right: 2rem; } /* Tabler variable helpers (optional) */ select.dt-filter.form-select { --tblr-input-padding-y: .200rem; --tblr-input-btn-padding-y: .200rem; } /* DataTables Buttons: white text only */ .dataTables_wrapper .dt-buttons .btn { color: #fff !important; } .dataTables_wrapper .dt-buttons .btn:hover, .dataTables_wrapper .dt-buttons .btn:focus { color: #fff !important; } .page-title-hero{ background: linear-gradient(180deg, rgba(35,55,66,.06), rgba(35,55,66,.03)), var(--rc-tint); color: var(--rc-ink); border-left: 6px solid var(--rc-gold); border-right: 6px solid var(--rc-gold); border-radius: 10px; box-shadow: 0 6px 20px rgba(35,55,66,.06); padding: 28px 12px; } .page-title-hero .title{ margin:0; font-weight:800; letter-spacing:.2px; color: var(--rc-navy); font-size: clamp(28px,3vw,38px); } .page-title-hero .subtitle{ margin:6px 0 0; color: var(--rc-muted); }