/*GERAL*/
	
body{ font-family: 'Roboto', sans-serif; margin: 0;font-size: 16px;}
.flex-container{display: flex;}
.space-between{justify-content: space-between;}
.align-items{align-items: center;}
.flex-end{align-items: flex-end;}
*{box-sizing:border-box;}
h1, h2, h3, h4,h5, figure,p{margin:0;}
a{text-decoration: none; color: inherit;}
h3{font-size:inherit;}

.container{width:100%; max-width:1100px;margin:0 auto;padding:0 2%;}
.row{margin:0 -15px; display: flex; flex-wrap: wrap;}

/*COLUNAS*/

.col{padding:0 15px;/*border:1px solid #F00;*/}

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}


/*LOGIN PAGE*/
.login{height:100vh;}
    /*title*/
.login-title{width: 40%; justify-content: center;padding: 0 4%;}
.logo-login img{width: 250px;}
.login-title-content p{margin-top: 50px; font-size: 1em;}

.login-footer{font-size:0.8em; position:absolute; width:40%; bottom:0; left:0; padding:2em;}
.login-footer img{ width:60%; }

    /*form*/

.login-form{}
.login-form-content{width:100%; padding: 7.5%; }
.input-element{width: 100%;display:block; padding: 0.75em 1em; margin-bottom: 1em; border:1px solid #acabab52; color:#666; font-size: 1.25em; border-radius: 10px;}
.login-form h2{color:#666; margin-bottom: 1.5em; text-align: center; font-size:2em; }
.btn-element{width: 100%; display: block; padding: 10px 15px; font-size: 1.5em; border-radius: 5px; border:none; background-color:#9857F3; color: #FFF; font-family:'IBM Plex Sans', sans-serif; font-weight: 500;}
.forgot-password{margin-top: 1em;text-align: center;}
.forgot-password a{font-size: 1em; text-decoration: underline;}
.btn-register{margin-top: 3em; text-align: center;}
.btn-register a{display:inline-block; padding: 10px 15px; font-size: 1.25em; border-radius: 5px;background-color: #000;color: #FFF; font-weight: 500; text-align: center;}

.login-error-msg{ background:#fa7c73; color:#FFF; padding:0.5em 1em; margin-bottom:0.5em; }
.register-success-msg{ background:#34b34f; color:#FFF; padding:0.5em 1em; margin-bottom:0.5em; }

/*REGISTER*/

.register-form{background-color: #f2f2f2; padding:30px 2%;}
.register-form-content{width:50%; min-width: 600px; margin:0 auto; padding: 30px 40px;background-color:#FFF; border-radius: 10px;}

.register-title{padding-bottom: 20px; align-items: flex-start;}
.logo-register img{width: 200px;}
.register-form h2{color:#666;text-align: right; font-size: 1.1em;}

.interests h3, .select-district h3, .select-job h3{color:#666; font-size:1em; padding: 20px 0;}
.interests-item {padding-bottom: 5px;}
.interests-item label{font-size: 0.8em;}
.terms{ padding:30px 0 20px 0; }
.terms label{font-size: 0.8em;}
.terms a{text-decoration: underline; color:#f84d4a;}

.selector-box{padding: 10px 5px; border: #d6d6d6;}

/* HOME */ 
.home-intro{   background:url('../img/home_header.jpg') no-repeat left top; background-size: cover; }
.intro-wrapper{ padding:45px 0 45px 75px; }
.intro-logo{ width:250px; }
.intro-logo img{ width:100%; margin-left:-16%; }
.home-intro header{ padding:60px 0 0 0; color:#383838; }
.home-intro header h2{ font-size:3em; font-weight:400; }
.home-intro header p{ font-size:1.25em; font-weight:300; margin:1em 0 1.25em 0 ; width:30%; line-height: 1.5em; }
.home-intro header a{ display:inline-block; font-size:1.25em; background:#9857F3; color:#FFF; padding:0.75em 1.25em; border-radius:0.2em; box-shadow:0 0 5px rgba(0,0,0,0.3); transition: 0.3s;}
.home-intro header a i{ margin-left:0.25em; font-size:0.9em; vertical-align: middle; transition: 0.3s;}
.home-intro header a:hover{ background:#a773f0; }
.home-intro header a:hover i{ margin-left:0.5em; }
.home-intro-logos{ margin-top:80px; width:275px; }
.home-intro-logos img{width:100%;}

.home-about{ display:flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; flex-direction: row-reverse; padding:4em; background:#a45edf; }
.about-left{ width:55%; }
.about-right{ width:40%; background:#FFF; }
.about-left h2{ color:#FFF; font-size:3em; font-weight:400; line-height: 1.1em;  }
.about-left h2 span{ font-weight: 700; }
.home-video-wrapper{ position:relative; padding-top:56.25%; margin-top:30px; }
.home-video-wrapper iframe{ position: absolute; top:0; left:0; width:100%; height:100%; }

.home-specs{  }
.home-spec-item{ display:flex; flex-wrap: wrap; justify-content: center; padding:4em 125px; }
.home-spec-item figure{ width:40%; margin:0 2.5%; }
.home-spec-item figure img{ width:100%; }
.home-spec-item header{ width:40%; color:#383838; margin:0 2.5%;  } 
.home-spec-item header h2{ position:relative; font-size:1.9em; padding-top:1.25em; }
.home-spec-item header h2::before{ content:' '; display:block;  position:absolute; top:0; left:0; background:#FF3D3D; height:0.35em; width:3.5em; }
.home-spec-item:nth-child(2) header h2::before{ background:#61BFB7;}
.home-spec-item:nth-child(2){ background:#FFF;}
.home-spec-item:nth-child(3) header h2::before{ background:#383838;}
.home-spec-item header p{  font-size:1.2em; margin-top:1em; line-height: 1.6em; }

.home-footer{ padding:3em 4em; background:#FFF; display:flex; flex-wrap: wrap; justify-content: space-between; position:relative; }
.home-footer-left{ color: #383838; font-size:0.9em; width:50%; line-height: 1.6em;  }
.home-footer-left img{max-width:100%;}

.home-footer-right{ text-align:right; }
.home-footer-links a{ color:#a45edf; margin-left:2em; }
.home-footer-right a.footer-button{ display:inline-block; font-size:1.25em; background:#9857F3; color:#FFF; padding:0.75em 1.25em; border-radius:0.2em; box-shadow:0 0 5px rgba(0,0,0,0.3); margin:0;}
.home-footer-right a.footer-button i{ margin-left:0.25em; font-size:0.9em; vertical-align: middle;}
.footer-end{ background:#a45edf; height:1.5em; }
.home-footer-right img{ display:inline-block; width:150px; margin-bottom:15px;  }
.footer-logo{ position:absolute; bottom:4em; right:3em; text-align:right;}


/*TOP-SITE*/
.top-site{position:fixed; width:100%; top:0; left:0; padding: 13px 2%; z-index: 1; background-color: rgba(255,255,255,0.95); z-index:99;}
.bg-top-site{background-color: rgba(255,255,255,0.8);}

.logo img{width: 120px; display: block;}
.top-site-left{ width: 50%;}
.top-site-right{ width: 50%; justify-content: right; }
.input-search{ width: 100%;display:block;padding: 10px 15px; border:1px solid #acabab52; color:#666; font-size: 1em; border-radius: 10px; margin-bottom: 30px; }


/*input box*/
.add-post, #add-post-video{margin: 15px 0;}
.add-post-input, #video-input{font-family: inherit; width: 100%;display:block;padding: 10px 15px; border:1px solid #acabab52; color:#acababad; font-size: 1em; border-radius: 10px; resize: none; }
#add-post-video{}
#video-input{display:none;}
#add-video-holder{position:relative;width:100%;padding-top:56%;margin:15px 0;display:none;}
#add-video-holder iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
.post-youtube-video{position:relative;width:100%;padding-top:56%;margin:15px 0;}
.post-youtube-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;}
#insert-post-textarea{ height:5em; outline: none; background:#f4f4f4;}

/*icons*/
.links-add-post{display: inline-block;}
.add-post-icon{margin-right: 5px; color:#BBB;}
.add-post-icon i{ vertical-align: middle; }
.add-post-icon span{font-size: 0.65em; }
.btn-post{display: inline-block; margin-top: 10px; padding: 10px 20px; font-size: 0.9em; border-radius: 20px; border:none; background-color:#9857F3; color: #FFF; font-family:inherit; font-weight: 500;}
.add-post-icon{font-size: 1.2em;}
.add-post-icon:hover{opacity: 0.8;}

.read-more-link{ color:#9857F3; font-weight:bold; text-decoration: underline;}


/*send-message
.send-message a{margin-left: 30px; width: 35px; height: 35px; background-color: #f84d4a; border-radius:50%; justify-content: center;transition: 0.3s;}
.send-message a:hover{opacity:0.9;}

.send-message img{width: 15px;}*/

/*perfil*/

#menu-bars{font-size: 1.4em; font-weight: 500; margin: 0 10px; color: rgb(146, 146, 146); transition: 0.2s; cursor: pointer;}
#menu-bars:hover{color:#9857F3;}

.top-buttons{ display:flex; }
.notifications-button{ position:relative; height:40px; width:40px; border-radius:50%; background:#EEE; text-align:center; padding-top: 8px; transition:0.3s;}
.notifications-button:hover{ background:#DDD; }
.notification-icon{ font-size:1.25em; color:#666; cursor: pointer;  }
.notification_number{ position:absolute; top:0; right:0; transform:translate(30%,-30%); font-size:0.75em; background:#ff3d3d; color:#FFF; width:1.75em; height:1.75em; padding-top:0.25em; text-align:center; border-radius:50%; display:none;  }
#notification-list{ position:absolute; z-index:99; min-height:100px; width:400px; height:400px; top:100%; right:0; margin-top:0.5em; background:#f2f2f2; box-shadow: 0 0 10px rgba(0,0,0,0.25); overflow-y:scroll; display:none;  }
#notification-list span{ display:inline-block; padding:1em; }
.notification-item{  }
.notification-item a{ display:block; padding:1em; text-align:left; border-bottom:1px solid #CCC; transition:0.2s;}
.notification-item a:hover{ background:#DDD; }
.notification-item a i{ color:#9857F3; margin-right:0.5em; font-size:1.25em; }
.new-notification{ background:#ded3ed; }
.notification-time{ font-size:0.8em; margin:0.25em 0 0 2.5em; color:#666; }
.notification-wrap{display:flex; align-items:flex-start; }

#perfil-btn{position:relative;cursor: pointer;}
#perfil-btn i{ display:none; position:absolute; bottom:10px; left:100%; line-height:0;}
.top-profile{position:relative;}

.user-image-top, .user-image {width: 40px; height: 40px; border-radius: 50%; display: block; overflow: hidden;}
.user-image-top img, .user-image img{width: 100%; height:100%; object-fit: cover;}

.menu{position:relative;}
.perfil-links{display: none; position:absolute; background:#FFF; z-index:99; text-align:right;right:0; top:100%; box-shadow:0 0 10px rgba(0,0,0,0.25); margin-top:0.5em;}
.perfil-links a{display:block; margin:1em 1em; white-space: nowrap;}
.user-name{font-size: 0.9em; color: #FF3E3E;}
.user-image-top{margin-left: 15px;}

/*MENU - MAIN*/

.main-menu, .search-column{position: sticky; top:90px;}
.main-menu a{display:block; font-weight: 400; margin-bottom:20px;transition: 0.2s; text-align: center; }
.main-menu a:hover, .main-menu a.active-side-menu{color:#9857F3;}
.main-menu i{font-size: 2em;}
.main-menu p{font-size: 0.65em; margin-top:8px;}
#main-menu a:hover{ text-decoration: underline;}
.bottom-main-menu{ border-top:1px solid #CCC;background:#EEE;padding:0.5em 0; color:#333;}

/*TOP SPACE*/
.top-space{padding-top: 90px;}

/*BG PAGES*/
.page-bg-grey{background-color:#f2f2f2}
.page-bg-white{background-color:#f2f2f2}
.page-bg-light{background-color: #FFF;}

/*POST*/
.post, .red-list{background-color: #FFF;margin-bottom:50px; padding:0 20px; border-left: 1px solid #d6d6d6;}
.red-list{position: relative;}
.user-header{color: #000;}
.user-link{font-weight: 600; font-size: 0.9em; margin:0 10px;}

/* Nuno */
.post{transition:opacity 1s;}
.post-like{cursor: pointer;}
.post-like:hover i, .post-like:hover div{ color:#9857F3; transition:0.3s; }
.add-post input[type="file"]{ display:none; }
.add-post .add-post-icon{cursor: pointer; color:#9857F3; margin-right:0.5em;}
.add-post .add-post-icon:hover{color:#9857F3;}
#add-post-image{display:none; margin:1em 0 0 0; height:300px;}
#add-post-image img{width:100%; height:100%; object-fit: cover;}
.post-content .post-image{width:100%; margin:0;}
.post-content .post-image img{ width:100%; }
#add-post-link{margin:1em 0 0 0; display:none;}
#add-post-link figure{}
#add-post-link figure img{}
#add-post-link .add-post-domain{margin-bottom:0.25em; font-weight:300; font-size:0.9em;}
#add-post-tags{margin-top:1em; display:none; font-size:0.9em; font-family: inherit; color:#666;}
.post-has-like, .post-has-like i{ color:#9857F3 !important; }

.post-message-link2{width: 100%;}
.post-message-link2 .post-content{width:100%;}
.post-content .post-message-link2 figure{width: 100%;}
.post-content .post-message-link2 img {width: 100%; display: block;}
.post-content .post-message-link2 header{width: 100%; padding: 20px; background-color: #f2f2f2; color: #333; border-radius:0;}
.post-message-link2 header a{display:inline-block; font-size: 1em; font-weight: 500; margin-bottom:0.25em;}
.post-message-link2 p{font-size: 0.8em;}
.post-message-link2 .add-post-domain{margin-bottom:0.25em; font-weight:300; font-size:0.9em;}

/*bookmark*/


.bookmark a, .bookmark{transition: 0.3s;}
.bookmark a:hover, .bookmark:hover{color:#9857F3;}
.bookmark-icon{font-size: 1.2em; cursor: pointer;}
.bookmark-icon .fa-solid{color:#9857F3;}
.book-red{position: absolute; top:20px; right: 20px; z-index: 1;}
.post-trash-icon{ font-size: 1.2em; cursor: pointer; transition: 0.3s; margin-left:0.5em; color:#666;}
.post-trash-icon:hover{color:#9857F3;}
.top-header-red-page .bookmark-icon{ margin-left:1em; }


/*tags*/

.tags, .tags-side{display: flex; flex-wrap: wrap;}
.tags-link{background-color: #000; font-size: 0.7em; color: #FFF; padding: 4px 8px; border-radius: 5px; font-weight: 500;margin: 0 4px 4px 0; display: block;}
.tags{margin-top: 20px;}
.tags-side{margin-top: 15px;}


/*post message*/

.post-message{margin: 15px 0;font-weight: 400; font-size: 1em; line-height: 1.4em; color: #383737;}
.post-message-link{width: 100%;}
.post-message-link figure{width: 20%;}
.post-message-link img {width: 100%; display: block;}
.post-message-link header{width: 80%; padding: 20px; background-color: #f2f2f2; color: #666; border-radius: 0 10px 10px 0;}
.post-message-link a{font-size: 0.9em; font-weight: 500;}
.post-message-link p{font-size: 0.8em;}


/*interation*/

.post-interaction{margin: 20px 0 15px 0; font-size: 0.7em; font-weight: 500; color:#666;}
.post-likes div{ }
.post-interaction i{font-size: 1.3em;}
.likes-total, .comments-total{margin-left: 5px;}
.comments-total{ display:inline-block !important; margin-top:2px; }
.post-comments{margin-left: 15px; cursor: pointer;}
.post-comments i{  }
.post-comments:hover, .post-comments:hover i{ color:#9857F3;}
.post-comment-item{ display:flex; flex-wrap: wrap; padding:0.5em 0; }
.comment-avatar{ width:30px; height:30px; overflow:hidden; border-radius:50%; }
.comment-avatar img{ width:30px; }
.post-comment-item .comment-username{font-weight: 600; font-size: 1em; margin-bottom:0.25em; }
.post-comment-item .comment-content{ background:#f2f2f2; padding:0.75em; border-radius:10px; max-width: calc(100% - 40px);  }
.post-comment-item .comment-message{  }
.comment-delete{ font-size:0.7em; cursor: pointer; text-decoration:underline; margin:auto 0 0 1em; }

.fa-thumbs-up, .fa-comment{color: #d6d6d6; transition:0.3s;}
.fa-thumbs-up:hover, .fa-comment:hover{color:#9857F3;}

.post-comment-box{ padding:10px 0; margin-top:15px; display:none; border-top:1px solid #CCC;}
.insert-comment-form{ background:#f2f2f2; margin:15px 0;}
.insert-comment-form textarea{ font-family: inherit; width: 100%; display: block; padding: 10px 15px; border: 1px solid #acabab52; background:#f2f2f2; font-size: 1em; border-radius: 10px; resize: none;}
.post-comments{}
.post-comments-list{}
.see-comments-link{ color:#666; display:inline-block; font-size:0.9em; margin:15px 0 15px 0; font-weight: bold; }

/* POst popup */
#post-view{display:none; position:fixed; top:0; left:0; background:rgba(0,0,0,0.8); width:100%; height:100%; z-index:99;}
#post-view-content{ position:absolute; width:80%; height:80%; overflow-y:scroll; top:10%; left:10%; background:#FFF; box-shadow:0 0 10px rgba(0,0,0,0.5); display:flex; flex-wrap: wrap;}
#post-view-post{ width:50%; padding:1em 0; }
#post-view-post .post{border:none;}
#post-view-meta{ width:50%;}


/*RECURSOS PAGE LIST*/
.post-content{width:100%; position: relative;}
.post-content figure{width: 45%; min-height: 100px; }
.post-content img {width: 100%; height: 100%; object-fit:cover; display: block;}
.post-content header{width: 55%;width: 80%; padding: 20px; background-color: #f2f2f2; color: #555; border-radius: 0 10px 10px 0;}

.more-red{margin-bottom: 20px;}
.more-red header{background-color: #f2f2f2; border-radius:10px;padding: 15px;}
.more-red img{width: 100%; display: block;}
.more-red h2{font-size: 0.9em; font-weight: 500; margin-bottom:10px; color: #000;}
.more-red h2:hover{text-decoration: underline;}
.more-red-title{font-size: 0.9em; font-weight: 600; margin-bottom:20px; color:#000; text-transform: uppercase;}

/*ficha técnica*/
.red-title{font-size: 1.4em; font-weight: 500; margin-bottom:10px; color: #000; width: 90%;}
.red-page-title{font-size: 2.5em; font-weight: 500; margin-bottom:10px; color: #000;}
.green-title{font-size: 1.2em; font-weight: 500; margin-bottom:10px; color: #000; width: 90%;}
.red-title a:hover, .green-title a:hover{text-decoration: underline;}
.red-info{line-height: 1.3em; }
.red-info h3{font-size: 0.9em; font-weight: 600; display: inline;}
.red-info span{font-size: 0.9em; font-weight: 400; margin-left: 2px;}

/*RECURSO SINGLE PAGE*/
.top-header-red-page{margin-bottom: 20px; align-items: flex-start;}
.red-page-list {position:relative;background-color: #FFF;margin-bottom:50px; padding-left:20px; border-left: 1px solid #d6d6d6;}
.info-page-red-content{background-color: #f2f2f2; padding: 20px; /*float: left; margin-right: 20px;*/ font-size:1em !important;}
.red-info-page{font-size: 0.9em;}


.red-use{margin:20px 0;}
.red-use div{display: inline; background-color:#9857F3; font-size: 0.8em; color: #FFF; padding: 4px 8px; border-radius: 5px; font-weight: 500;margin: 0 4px 4px 0;}
.red-use a:hover{text-decoration: underline;}
.red-use i{ font-size: 0.9em; margin-right: 5px;}

/*recurso-post*/
.red-gallery{margin-top: 20px; height: 380px; overflow: hidden;}
.gallery-main-image{width: 65%; position:relative; background:#DDD;}
.plyr__video-embed{position:absolute;width:100%;height:100%;  }
#player{--plyr-color-main:#9857F3;position:absolute; width:100%; height:100%;}
.gallery-main-image iframe{position:absolute; width:100%; height:100%;}
.gallery-main-image img {width:100%; display: block; }
.red-thumbnails{width:35%;background-color: #2e2d2b; color:#FFF; overflow-y: scroll;}
.red-thumbnails div{padding: 15px; border-bottom: 1px solid #535252; /*transition: 0.3s;*/}
.red-thumbnails div:hover{background-color: #3f3d3a;}
.red-thumb-selected{background-color: #3f3d3a;}
.red-thumbnails img{width:100%; display: block;}
.red-thumb-item{align-items: center; cursor: pointer;}
.red-thumb-item figure {width:30%}
.red-thumb-item header { width: 70%; padding-left: 10px;}
.red-thumb-item a{font-size: 0.8em; font-weight: 500;}
.red-thumb-item a:hover{text-decoration: underline;}

.red-sinopse{ margin: 40px 0 60px 0; font-size: 1.1em; line-height: 1.4em;}
.sinopse-text-topics{width: 80%;}
.red-sinopse p {margin-bottom: 10px;}
.tags-red-page{align-items:flex-start;}


.red-file{width: 28%;}



/*Quizz-box*/
.extra-left{ width:60%;}
.extra-left .post-content{margin-bottom: 20px;}
.extra-left .red-title{font-size: 1.2em;}
.quiz-box{position:relative;}
.quiz-box i{opacity: 1;}
.quiz-box{/*padding: 30px; background-color: #f6f0ff; border-radius: 5px; */ /*margin-bottom: 60px;*/ }
.quiz-title{margin-bottom: 25px;}
.quiz-title h3{display: inline; margin-left: 10px;}
.box-question-link{margin:1em 0;}
.question-link{display:block; padding:5px; width:2em; height:2em; border-radius: 50%; border: 2px solid #9857F3; color: #000; text-align: center; font-weight: 600; margin-right: 5px; transition:0.2s; cursor: pointer; background:#FFF;}
.current, .question-link:hover{display:block; padding:5px; width:2em; height:2em; border-radius: 50%; background-color: #9857F3; color: #FFF; text-align: center; font-weight: 600; border: 2px solid #9857F3;  margin-right: 5px}
.quiz-intro{ margin:0 0 1em 0; font-size:0.9em; }

.quiz-question{ /*margin: 20px 0; font-weight: bold;*/  border:1px solid #CCC; background:#FFF; }
.quiz-loader{position:absolute; width:100%; height:100%; top:0; left:0; background:rgba(255,255,255,0.5) url('../img/loader.gif') no-repeat center; background-size:7% auto; display:none;}
#quiz-thank{ background:#9857F3; color:#FFF; padding:3em; font-size:1.25em; display:none;}

#fixed-quiz{position:fixed; width:33%; max-width:400px;  bottom:0; right:0; background:#f2f2f2; padding:1.5em; box-shadow:0 0 15px rgba(0,0,0,0.3); transform:translateY(0%); transition:0.7s; z-index:99;}

#quiz-action-button{position:absolute; width:100%; background:#9857F3; color:#FFF; padding:1em; transform: translateY(-100%); z-index:1; left:0; top:0; text-align:left; font-size:1.2em; cursor: pointer; border-radius: 0.25em 0 0 0 ; }
#quiz-action-button i{color:#FFF; margin-right:0.25em;}

/*.quiz-question form{display: flex; flex-direction: column; padding: 10px 0;}
.quiz-box label {position: relative;}
.quiz-box input{position: absolute; top:9px; left: 10px;}
.quiz-box input:checked + span {background-color: #9857F3; color:#FFF;}
.quiz-box span {align-items: center;transition: 0.25s ease;  padding: 10px 20px 10px 40px; display: block;}
.quiz-box span:hover {background-color: #9857F3; color: #FFF;}*/
.next-question{background-color:#9857F3;padding: 10px 20px; border-radius: 30px; color: #FFF; cursor: pointer; text-align: center; display: inline-block;}
.quiz-title .fa-comment{color:inherit; font-size: inherit;}
#submit-question{display:none;}

.fa-thumbs-up:hover, .fa-comment:hover{color:#9857F3;}

.questions-container{position:relative;}
.quiz-question{display:none;}
.quiz-question:first-child{display:block;}
.quiz-question p{ padding:1em; /*background:#9857F3; color:#FFF;*/ font-weight: bold; }
.answer-container{padding:10px; cursor:pointer;}
.answer-container input, .answer-container label{cursor: pointer;}
.answer-container:hover{background-color:#d8cceb; /*color:#FFF;*/}
.active-answer{background-color:#d8cceb; /*color:#FFF;*/ }

.red-tags{display: flex; flex-wrap: wrap; margin-bottom: 20px;}
.red-tags-link{background-color:#f84d4a; font-size: 0.7em; color: #FFF; padding: 4px 8px; border-radius: 5px; font-weight: 500; display: block; margin-right: 5px; margin-bottom: 5px;}

.red-skills h2, .red-comments h2, .quiz-content h2{color:#f84d4a; font-size:1em; background-color: aquas;}
.red-skills{padding: 40px 20px;}

.topic-header{background-color:#fcfcfc; color: #000; padding: 10px 15px;border-bottom:1px solid #d6d6d6;}
.red-topic-content{margin-top: 30px;}
.red-topic-content figure{width: 15%;}
.red-topic-content img {width: 100%; display: block;}
.red-topic-content header{width: 85%; padding-left: 20px; color: #424242;}

.red-topic-title a{font-size: 1em; font-weight: 500; margin-bottom:5px; color: #000;}
.red-topic-title a:hover{text-decoration: underline;}
.red-topic-info{margin-top:10px;}
.red-topic-info h3{font-size: 0.8em; font-weight: 600;}
.red-topic-info p{font-size: 0.8em; font-weight: 400; margin-left: 2px;}

.btn-all-topics{display: block; text-align: center; padding: 10px 0; background-color: #f84d4a; color: #FFF; border-radius: 5px; margin-top: 40px; font-weight: 500;transition: 0.3s;}
.btn-all-topics:hover{opacity: 0.9;}

.red-comments{padding: 0 20px; margin-top: 20px;}
.red-comment-box{margin: 30px 0;}
.red-user-commment{margin-bottom: 20px;}
.comment-content{margin-left: 10px; font-size: 0.8em;}
.comment-content a{font-weight: 500;}
.resource-link-button{ display:inline-block; background-color:#9857F3; color:#FFF; padding:0.5em 2em; font-size:1.2em; border-radius:25px; margin-left:2em; white-space: nowrap; }
.resource-link-button i{ margin-left:0.25em; }

.resource-status{ position:relative; transition:0.3s;}
.resource-status span, .resource-status i{cursor: pointer;}
.resource-status-options{ position:absolute; top:110%; right:0; z-index:10; box-shadow:0 0 10px rgba(0,0,0,0.3); min-width:100%; text-align:right; display:none; }
.resource-status-option{ background:#FFF; padding:0.5em 1em; cursor: pointer; color:#1a1a1a; min-height:2em; }
.resource-status-option:hover{ background-color:#EEE; }
.resource-status-finish{ background:#3dd34aad;  }

.user-add-comment form{width: 100%; padding-left: 10px;}
.text-comment{display: block; width: 80%; padding: 10px; background-color: #f2f2f2; border: none; height: 60px;border-radius: 5px; resize: none; font-family: 'IBM Plex Sans', sans-serif; font-size: 0.8em;}

.btn-comment{border: none; padding: 10px 20px; background-color: #f84d4a; color: #FFF; border-radius: 5px; margin-top: 10px;}

/*sidebar
.red-content-single-side{padding: 20px;}
.red-content-single-side figure{width: 100%;}
.red-content-single-side img {width: 100%; display: block;}
.red-content-single-side header{width: 100%; color: #424242;}
.red-title-single-side{font-size: 0.9em; color: #f84d4a; font-weight: 500; margin: 10px 0;}
.red-title-single-side a:hover{text-decoration: underline;}
.red-info-single-side{padding-bottom: 2px;}
.red-info-single-side h3{font-size: 0.8em; font-weight: 600;}
.red-info-single-side p{font-size: 0.8em; font-weight: 400; margin-left: 2px;}*/

/* TÓPICOS PAGE LIST */
.topic{border:1px solid #d6d6d6;background-color: #FFF; margin-bottom: 30px;}
.topic-header{background-color:#fcfcfc; color: #000; padding: 10px 15px;border-bottom:1px solid #d6d6d6;}
.topic-content{padding: 20px;}
.topic-content figure{width: 30%;}
.topic-content img {width: 100%; display: block;}
.topic-content header{width: 70%; padding-left: 20px; color: #424242;}

/* ficha técnica */
.topic-title{font-size: 1.3em; font-weight: 500; margin-bottom:10px; color: #f84d4a;}
.topic-title a:hover{text-decoration: underline;}
.topic-lead{font-size: 0.9em;}
.topic-info{margin-top:10px;}
.topic-info h3{font-size: 0.9em; font-weight: 600;}
.topic-info p{font-size: 0.9em; font-weight: 400; margin-left: 2px;}


/*TOPICS SINGLE PAGE*/
.gallery-main-image iframe{width: 100%; min-height: 350px;}



/*DASHBOARD/FAVORITOS*/

.favorito{margin-bottom: 30px;}
.favorito-title{padding: 20px; background-color:#f2f2f2;}
.favorito-title h2{font-size: 1.05em;}
.favorito-title h2:hover{text-decoration: underline;}
.favorito-img img{width: 100%; display: block;}
.favorito-icone{display: inline-block; background-color:#9857F3; font-size: 0.8em; color: #FFF; padding: 4px 8px; border-radius: 5px; font-weight: 500;margin-top:10px;}
.favorite-text-icone{display: inline; margin-left: 5px;}
.fav-post-image{margin:1em 0;}
.fav-post-image img{width:100%;}

.post-content-favorito p{font-size: 0.9em; line-height: 1.3em;}
.user-post-favorito{margin-bottom:8px;}

.profile{justify-content: center; text-align: center;}
.profile-image {width: 80px; height: 80px; border-radius: 50%; display: block; overflow: hidden; margin:0 auto}
.profile-image img{width: 100%;}
.profile-text h2{font-size:1.2em; font-weight:600; margin-top:5px;}
.profile-text p{font-size: 0.8em;}

#profile-form{ }
#profile-form input{ display:block; width:100%; padding:0.5em; font-size:1em; border-radius:5px; border:1px solid #999;  margin-bottom:1em; color:#000 !important; }
#profile-form input[type="submit"]{ width:auto; padding:0.5em 2em; cursor: pointer; color:#FFF !important;}
#profile-form figure{ width:100px; height:100px; margin-bottom:0.5em;}
#profile-form figure img{ width:100%; height:100%; object-fit: cover; border-radius:50%;}


/*Página de perfil*/
.top-perfil{margin:30px 0; padding-bottom: 20px; border-bottom: 1px solid #666;}
.top-perfil figure{width: 100px; height: 100px; border-radius: 50%; display: block; overflow: hidden;}
.top-perfil figure img{width: 100%; height:100%; object-fit: cover;}
.top-perfil header{margin-left: 30px;}
.top-perfil h3{font-size: 2em; font-weight: 400; position:relative;}
.edit-perfil{display: inline-block; padding: 5px 10px; border-radius: 5px;background-color: #9857F3; font-size: 0.9em; color: #FFF; margin-top: 10px;}
.perfil-mensagens{padding: 30px; background-color:#f2f2f2; margin-bottom: 20px;}
.perfil-message-activity{font-size: 0.8em; color: #666;padding-bottom: 10px;}
.perfil-message-activity i{font-size: 1.3em;}
.delete-post{width: 32px; height: 32px; background-color: #9857F3; color: #FFF; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.topic-done, .perfil-atividade{margin-top: 40px;}
.done, .done:hover{width: 32px; height: 32px; background-color: #3dd34aad; color: #FFF; border-radius: 50%; display: flex; align-items: center; justify-content: center;}
.topic-done .post-content{ margin-bottom:15px; }
.ongoing, .ongoing:hover{ background-color: #9857F3; }

/*Album*/
.page-bg-grey-dash{ padding: 120px 0 40px 0; background-color:#f2f2f2}
.album-main{margin-top: 50px; }
.album{margin-bottom: 30px;}
.album:hover .album-thumbs-content img{opacity: 0.7;}
.album-thumbs-content{flex-wrap: wrap;height: 150px;background-color: #f2f2f2;border-radius: 5px; overflow: hidden; position: relative;}
.album-thumb{width: 50%; height: 50%; overflow: hidden;border-left:1px solid #FFF;}

.album-thumb img{height: 120%; display: block; transition: 0.3s;}
.album-title{margin-top: 10px;}
.album-title h3{font-weight: 500;}
.album-link{position: absolute; z-index: 1; top:0; left:0; width: 100%; height: 100%;}

.album-title-link:hover{text-decoration: underline; 
}

/*new album*/
.add-album{position:relative;display:block; height: 150px;background-color: #f84d4a;border-radius: 5px; transition: 0.3s;}
.add-icon{position: absolute; width: 100%; text-align: center; top:50%; transform: translateY(-50%);}
.add-album img{width: 50px;}
.add-album:hover{opacity:0.9;}


/* Nuno */
.post{transition:opacity 1s;}
.insert-post-wrapper{ padding:0px 20px 0px 20px; }
.post-like{cursor: pointer;}
.post-like:hover i, .post-like:hover div{ color:#9857F3; transition:0.3s; }
.add-post input[type="file"]{ display:none; }
.add-post .add-post-icon{cursor: pointer;}
.add-post .add-post-icon:hover{color:#9857F3;}
#add-post-image{display:none; margin:1em 0 0 0; height:300px;}
#add-post-image img{width:100%; height:100%; object-fit: cover;}
.post-content .post-image{width:100%; margin:0;}
.post-content .post-image img{ width:100%; }
#add-post-link{margin:1em 0 0 0; display:none;}
#add-post-link figure{}
#add-post-link figure img{}
#add-post-link .add-post-domain{margin-bottom:0.25em; font-weight:300; font-size:0.9em;}
#add-post-tags{margin-top:1em; display:none; font-size:0.9em; font-family: inherit; color:#666;}
.post-has-like, .post-has-like i, .post-has-comments, .post-has-comments i{ color:#9857F3 !important; }

.post-message-link2{width: 100%;}
.post-message-link2 .post-content{width:100%;}
.post-content .post-message-link2 figure{width: 100%;}
.post-content .post-message-link2 img {width: 100%; display: block;}
.post-content .post-message-link2 header{width: 100%; padding: 20px; background-color: #f2f2f2; color: #333; border-radius:0;}
.post-message-link2 header a{display:inline-block; font-size: 1em; font-weight: 500; margin-bottom:0.25em;}
.post-message-link2 p{font-size: 0.8em;}
.post-message-link2 .add-post-domain{margin-bottom:0.25em; font-weight:300; font-size:0.9em;}
.likes-total{display:inline-block !important; }

input[type="text"], textarea{ color:#666 !important;}


.text-page header h2{font-size:2em;}
.text-page header{margin-bottom:3em;}
.text-page .page-content{  line-height:1.5em;}
.text-page .page-content p{margin:1.5em 0;}



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

    .s-col0 {width:0%;}
    .scol-1 {width: 8.33%;}
    .scol-2 {width: 16.66%;}
    .scol-3 {width: 25%;}
    .scol-4 {width: 33.33%;}
    .scol-5 {width: 41.66%;}
    .scol-6 {width: 50%;}
    .scol-7 {width: 58.33%;}
    .scol-8 {width: 66.66%;}
    .scol-9 {width: 75%;}
    .scol-10 {width: 83.33%;}
    .scol-11 {width: 91.66%;}
    .scol-12 {width: 100%;}
    .scol-0{width:0%;}

    .s-hide{display:none !important; }
    .s-block{ display:block; }
    
    
    .login{ flex-wrap: wrap; height:auto; ; }
    .login-title{ width: 100% !important; padding:5vh 5%; text-align:center;}
    .login-title-content p{ margin-top:1em; }
    .login-form{width: 100%; padding:30px 0; min-height:70vh;}
    .login-form-content {width: 100%;padding: 30px;}  

    
    .main-menu{ position:fixed; bottom:0; left:0; top:auto; width:100%; z-index:99; display:flex; justify-content: center; background-color:#f2f2f2; padding:1em 1em; }
    .main-menu a{ font-size:0.9em; margin:0 4%; }
    
    .post-content{ flex-wrap:wrap; }
    .post-content figure {width: 100%; min-height: none; }
    .post-content header {width: 100%; padding: 15px 20px;border-radius: 0 0 10px 10px;  }
    .post, .red-list, .red-page-list{border-left: none; padding:0 0; }
    .resource-link-button { margin:0;}
    .red-page-title{ font-size:2em; margin-botton:0.5em; }
    .resource-link-button{ font-size:1em; }
    .text-page{padding:0 4%;}
    
    .red-file{}
    
    .red-gallery{ margin-top: 20px; height: auto; overflow: visible; flex-wrap:wrap;
    }
    .gallery-main-image{width: 100%; position:relative;}
    .gallery-main-image { width: 100%; position: relative;}
    .gallery-main-image div, .gallery-main-image img{position:static; width:100%;}
    #player{position:static;}
    .gallery-main-image iframe { min-height: 0;}
    .red-thumbnails{ width:100%; }
    .info-page-red-content{ margin:1.5em 0 2em 0; display:block; }
    .red-page-title{ font-size:1.5em; }
    .topic-header-buttons{ margin:2em 0; }
    .top-header-red-page{ display:block; }
    .sinopse-text-topics{ width:100%;}
    .extra-left{width:100%;}
    .red-title{ width:100%; }
    
    .register-form-content{ width:95%; min-width:0; padding: 30px 15px;}
    .selector-box{ width:100%;}

    #fixed-quiz{display:none;}
    
    .notifications-button{ position:static; }
    #notification-list{ width:95vw; height:400px;  right:0; }
    
    /*#notification-list{ position:absolute; z-index:99; min-height:100px; width:400px; height:400px; top:100%; right:0; margin-top:0.5em; background:#f2f2f2; box-shadow: 0 0 10px rgba(0,0,0,0.25); overflow-y:scroll; display:none;  }
    #notification-list span{ display:inline-block; padding:1em; }
    .notification-item{  }
    .notification-item a{ display:block; padding:1em; text-align:left; border-bottom:1px solid #CCC; transition:0.2s;}
    .notification-item a:hover{ background:#DDD; }
    .notification-item a i{ color:#9857F3; margin-right:0.5em; font-size:1.25em; }
    .new-notification{ background:#ded3ed; }
    .notification-time{ font-size:0.8em; margin:0.25em 0 0 2.5em; color:#666; }
    .notification-wrap{display:flex; align-items:flex-start; }*/
   
    
}

@media only screen and (max-width:768px){
    
    .login-footer{font-size:0.8em; position:static; width:100%; padding:1.5em;}
    .login-footer img{ width:100%; }

    .home-intro{ background:#FFF; padding:0; text-align: center; }
    .intro-wrapper{ padding:45px 15px 45px 15px; }
    .intro-logo{ width:50%; margin:0 auto 0 auto;}
    .intro-logo img{ width:100%; margin:0 0 0 0; }
    .home-intro header{ padding:60px 0 0 0; text-align: center; }
    .home-intro header h2{ font-size:2em;  }
    .home-intro header p{ width:100%;  }
    .home-intro-logos{ margin:45px 0 0 0; width:100%; text-align: center; }
    .home-intro-logos img{width:65%;}

    .home-about{ display:block; padding:5% 5% 30px 5%; text-align: center; }
    .about-left{ width:100%; }
    .about-left h2{   font-size:1.5em; line-height: 1.7em;    }

    .about-right{ width:100%; background:#FFF; margin:0 0 30px 0; }

    .home-spec-item{ display:block; padding:2em 5%; }
    .home-spec-item figure{ width:100%; margin:0 0; }
    .home-spec-item figure img{ width:100%; }
    .home-spec-item header{ width:100%; margin:30px 0;  } 

    .home-footer{ padding:3em 5%; background:#FFF; display:block; text-align: center;}
    .home-footer-left{ width:100%;}
    .home-footer-left img{max-width:100%; display:block; margin-top:0.25em;}

    .home-footer-right{ text-align:center; margin-top:3em; }
    .home-footer-links a{  text-align:center; color:#a45edf; margin:0 1em; }
    .footer-end{ background:#a45edf; height:1.5em; }
    .home-footer-right img{ display:inline-block; width:50%; margin:25px 0;  }
    .footer-logo{ position:static; text-align:center; margin-top:0px;}
    
}