@import "navbar_stylesheet.css";
@import "PopUpProfile.css";
@import "Props.css";
@import "QuoteBox.css";
@import "Header.css";
@import "EC_StandardFooter.css";
@import "PopUp.css";
@import "Fonts.css";

body, html {
  height: 100%;
  margin: 0;
  font: 400 15px/1.8;
}

html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

a:link {
  color: rgb(var(--custom-link_colour));
  text-decoration: none;
}

a:active {
  color: rgb(var(--custom-active_link_colour));
  text-decoration: none;
}


a:hover {
  color: rgb(var(--custom-hover_colour));
  text-decoration: none;
}

a:visited {
  color: rgb(var(--custom-visited_link_colour));
  text-decoration: none;
}

button, .button, .MenuItem {
  background: none;
  border: none;
  padding: 0;
  font-family: arial, sans-serif;
  /*input has OS specific font-family*/
  cursor: pointer;
  font-size: 1em;
}


input[type=text], textarea, input[type=password], input[type=email], input[type=date], input[type=time] {
  width: 90%;
  padding: 3px 5px;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.5);
  border: transparent;
  border-radius: 20px;
  padding: 2%;
}

input[type=text].comment {
  border: 1px black;
}

/*
textarea {
  color: black;
  resize: none;
  border: transparent;
  font-size: 1em;
  outline: none;
  height: 80%;
  position: absolute;
  max-height: 80%;
  overflow: hidden;
}
*/

textarea:focus, .invisible_input {
  color: black;
}

/* Body Stuff*/

.central_body {
  position: relative;
  display: block;
  margin-left: 15%;
  margin-right: 15%;
  height: auto;
  z-index: 0;
}

.homepage_container {
  border-radius: 10px;
  margin: 5%;
  background: rgba(92,136,218, 1);
  display: block;
}
.module_container, .ProfileActions{
  border-radius: 10px;
  margin: 5%;
  background: rgba(var(--custom-bg), 1);
  display: block;
}

.module_container {
  text-align: center;
  color: white;
}

.homepage_container h1, .module_container h1 {

  color: white;

  padding-top: 5%;
  margin-left: 5%;
  margin-right: 5%;
  font-style: helvetica;
}

.homepage_container h3, p {
  color: white;
}

.homepage_container a {
  color: rgba(172, 173, 174,1);
}

.module_container h1, .full_event h1, .central_body h1 {
  font-size: 5em;
  height: auto;
}

.module_container a {
  color: white;
}

.full_event {
  max-height: 300px;
}

.individual_hot_topic {
  padding: 1%;
  padding-bottom: 2%;
  margin: 1%;
  text-align: left;
  display: block;
  position: relative;
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 20px;
  min-height: 300px;
}

.individual_hot_topic_unhappy {
  padding: 1%;
  padding-bottom: 2%;
  margin: 1%;
  text-align: left;
  display: block;
  position: relative;
  background-color: rgba(184, 28, 54, 0.7);
  border-radius: 20px;
  min-height: 300px;
}

.individual_hot_topic h3 {
  display: inline-block;
  font-size: 1.8em;
  margin: 2%;
  margin-bottom: 3%;
  width: 80%;
}

.individual_hot_topic p.date {
  position: absolute;
  display: inline-block;
  margin: 1%;
  margin-bottom: 5%;
  top: 25;
  right: 0;
}

.Linked_Consultation_Status {
  /*background: rgba(53, 164, 255, 0.808);*/
  background: rgba(var(--custom-bg), 0.808);
  border-radius: 90px;
  padding: 1%;
  margin: 1%;
  width: 50%;
  margin-left: 3%;
}

.hot_topic_button {
  /*background: rgba(53, 164, 255, 0.808);*/
  /*background: rgba(108, 27, 137, 0.808);*/
  background: rgb(var(--custom-button));  
  color: rgb(var(--custom-button-text));
  
  border-radius: 90px;
  padding: 1%;
  margin: 1%;
  margin-left: 3%;
}

.hot_topic_voting {
  position: absolute;
  top: 20;
  right: 0;
  display: inline-block;
}

.upvote, .downvote {
  width: 50px;
  height: 58px;
  border: none;
  margin: 1%;
  transform: scale(0.5);
  font-size: 1.5em;
  color: white;
  transition: 0.2s;
}

.upvote:hover, .downvote:hover {
  transform: scale(0.7);
  transition: 0.2s;
}

.magiczoom {  transition: 0.2s;
}

.upvote {
  background: url(https://ih.organisedteacher.com/images/votes/upvote_dry.png) no-repeat;
  background-size: 100%;
  margin-top: 30%;
}

.upvote.votepressed {
  background: url(https://ih.organisedteacher.com/images/votes/upvote_wet.png) no-repeat;
  background-size: 100%;
}

.downvote {
  background: url(https://ih.organisedteacher.com/images/votes/downvote_dry.png) no-repeat;
  background-size: 100%;
}

.downvote.votepressed {
  background: url(https://ih.organisedteacher.com/images/votes/downvote_wet.png) no-repeat;
  background-size: 100%;
}

.HT_HT {
  text-align: center;
  margin-left: 15%;
  margin-right: 15%;
}

.HT_Comments, .DiscussionBox {
  background: white;
  border-radius: 15px;
  padding: 1%;
  padding-left: 5%;
  padding-right: 5%;
  margin: 1%;
  text-align: justify;
}

.HT_Comments h4, .DiscussionBox h2 {
  margin-top: 1%;
  margin-bottom: 1%;
}

.HT_Comments form {
  margin-top: 2%;
  width: 90%;
}

.HT_Comments form input[type=text] {
  margin-top: 5%;
  margin-bottom: 3%;
  width: 75%;
  height: 4%;
}

.HT_Comments form input[type=submit] {
  width: auto;
}

.HTCommentSubmit {
  height: 4%;
}

.Hot_Topic_Comment {
  display: flex;
  justify-content: space-between;
}

.comment_date {
  margin: 1%;
  padding-top: 1%;
}

.comment_name {
  margin: 1%;
  padding-top: 1%;
  opacity: 0.1;
  transition: 0.1s;
  min-width:10%;
}

.Hot_Topic_Comment:hover .comment_name {
  opacity: 1;
  transition: 0.1s;
}

.Hot_Topic_Comment:hover .comment_content, .magiczoom:hover {
  transform: scale(1.01);
  transition: 0.1s;
}

.comment_content {
  /*background: rgba(53, 164, 255, 0.5);*/
  background: rgba(var(--custom-bg), 0.5);
  border-radius: 9px;
  padding: 2%;
  margin: 0.5%;
  transition: 0.1s
}

.my_comment {
  background: rgba(255, 179, 14, 0.7);
}

button, .button {
  margin: 3%;
  padding: 1%;
  background-color: rgb(var(--custom-button));
  color: rgb(var(--custom-button-text));
  
  border-radius: 10px;
  transition: 0.5s;
}

button:hover, .button:hover {
  transition: 0.5s;
  transform: scale(1.2);
}

.full_consultation {
  padding: 3%;
}

.full_consultation h2, .Consultation_Requirements h2 {
  font-size: 3em;
  margin: 1%;
}

.New {
  color: red !important;
}

.Consultation_Requirements {
  width: 90%;
  text-align: left;
  vertical-align: middle;
  margin: 5%;
  padding: 1%;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 100px;
}

.Consultation_Requirements h2 {
  text-align: center;
}

.WorkingParty_Launch, .Current_Proposal_Actions {
  width: 90%;
  margin: 5%;
  text-align: center;
  vertical-align: middle;
  background-color: rgba(255, 255, 255, 0.5);
  padding: 2%;
}

.consultation_stimulus {
  margin: 2%;
}

.consultation_details {
  padding-bottom: 2%;
}

.consultation_details h1 {
  padding-top: 1%;
}

.button.IR_button {
  display: block;
  margin: auto;
}

div.Proposal_Closed {
  display: flex;
  flex-flow: column;
  margin:2%;
  padding:2%;
  margin-bottom: 5%;
}

.Proposal_Voting {
  margin-left: 5%;
  margin-right: 5%;
  background: orange;
  width: 6%;
  height: 14%;
  border-radius: 50px;
}

.Proposal_Voting input[type=submit] {
  height: 50px;
  margin: 0;
}

.Proposal_Closed_Meta {
  width: 85%;
  margin-left: 5%;
  text-align: justify;
}

.DiscussionBox {
  margin: 3%;
  margin-top:15%;
  padding: 3%;
  border-radius: 10px;
  background-color: rgba(255, 255, 255, 0.5);
  text-align: justify;
}

.DiscussionBox.CDDiscussion, .DiscussionBox.CDDiscussion {margin-top:4%;}

.DiscussionBox h2, .DiscussionBox h3 .HT_Comments h3 {
  margin: 2%;
  margin-top: 0%;
}

.Proposal {margin-top:5%;}

.Proposal p {
  margin-bottom: 2%;
}

.button {
  margin-top: 5%;
  margin-bottom: 5%;
}

.FeedbackComment_Submit {
  margin: 0%;
  margin-top: 5%;
}

.FeedbackComment_Submit input[type=text] {
  display: inline-block;
  width: 80%;
  height: 4%;
  background: rgba(255, 255, 255, 0.5);
  border: transparent;
  border-radius: 90px;
  padding: 2%;
}

.FeedbackComment_Submit button {
  margin-bottom: 0;
  width: 10%;
}

.login_form * {
  margin: 1%;
}

.conflicts_container {
  width: 50%;
  margin: auto;
  margin-top: 5%;
  margin-bottom: 2%;
  padding: 2%;
  
}

.RequestedAction_Print {
  margin-left: auto;
  text-align: center;
  color: rgb(136, 0, 0, 0.8);
}

.DiscussionBox h3 {margin:1%;margin-bottom:3%;}

#Comment {margin-top:5%;width:70%;display:inline-block;
background-color: rgba(255,255,255,1);}

.inline-button {display:inline-block;width:15%;}

.EventEdit {
  background-color: rgba(0,0,0, 0.05);
  margin:2%;
  border-radius: 50px;
  padding:2%;
}
.SWAT_Event_button {margin-left:initial;margin-right:initial;}

.Overall_Satisfaction_Container { 
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position:fixed;
  right:10;
  top:25%;

  width:10%;
  height:50%;
  background-image: url(https://ih.organisedteacher.com/images/BrandMgmt/FeedbackList_Background.png);
  z-index:5;
text-align: left;
}
.Overall_Satisfaction_Container h3 {
padding-right:25%;

}


.Overall_Satisfaction_Container div {
background-repeat: no-repeat; 
background-size: contain;
right:0;
top:0;
width:100%; 
height:100%;
padding:0;
margin:0;
z-index:5;
transition:0.1s;

}

.Overall_Satisfaction_Container div:hover {
  transform:scale(1.01);
  transition:0.1s;
}



.Overall_Satisfaction_Container .Joyful {

  background-image: url(https://ih.organisedteacher.com/images/BrandMgmt/FeedbackList_Joyful.png);

}

.Overall_Satisfaction_Container .Happy {

  background-image: url(https://ih.organisedteacher.com/images/BrandMgmt/FeedbackList_Happy.png);

  
}

.Overall_Satisfaction_Container .Medium {

  background-image: url(https://ih.organisedteacher.com/images/BrandMgmt/FeedbackList_Medium.png);

}
.Overall_Satisfaction_Container .Sad {

  background-image: url(https://ih.organisedteacher.com/images/BrandMgmt/FeedbackList_Sad.png);

}
.Overall_Satisfaction_Container .Miserable {

  background-image: url(https://ih.organisedteacher.com/images/BrandMgmt/FeedbackList_Miserable.png);

}

/*
https://www.filamentgroup.com/lab/select-css.html
https://blogs.windows.com/msedgedev/2022/05/05/styling-select-elements-for-real/
https://www.youtube.com/watch?v=0ZXe6KEGPNM
*/
.custom_select, .custom_option {
  color: rgb(var(--custom-button-text));
  background-color: rgb(var(--custom-button));  
}
option {
  color: rgb(var(--custom-button-text));
  background-color: rgb(var(--custom-button));  
}

/*/////////////////////////////////////////////////////////////
// FILE UPLOAD INPUTS
/////////////////////////////////////////////////////////////*/
input[type="file"] {
  display: none;
}

.custom-file-upload {
  background-color: rgb(var(--custom-button));  
  color: rgb(var(--custom-button-text));
  border-radius: 10px;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}