Difference between revisions of "Template:2015CSS"
(37 intermediate revisions by the same user not shown) | |||
Line 43: | Line 43: | ||
} | } | ||
− | + | /*left align BMB */ | |
#top_menu_inside { | #top_menu_inside { | ||
margin-left: 20px; | margin-left: 20px; | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
Line 108: | Line 104: | ||
/*Class for creating a news post, this is used in the Main Page and in the Archived news page */ | /*Class for creating a news post, this is used in the Main Page and in the Archived news page */ | ||
.newsItem { | .newsItem { | ||
− | |||
border: 1px solid #cccccc; | border: 1px solid #cccccc; | ||
margin: 0px 5px 5px 5px; | margin: 0px 5px 5px 5px; | ||
Line 146: | Line 141: | ||
margin-bottom: 2px; | margin-bottom: 2px; | ||
padding-left: 11px; | padding-left: 11px; | ||
− | padding-top: | + | padding-top:7px; |
− | padding-bottom: | + | padding-bottom:7px; |
− | color: # | + | color: #6D6E70; |
} | } | ||
+ | #rightColumn_MainPage a{ | ||
+ | text-decoration: none; | ||
+ | color: #565656; | ||
+ | } | ||
− | /* | + | /*Styling for the the list item */ |
− | ul | + | #rightColumn_MainPage ul { |
− | + | margin-top: -5px; | |
− | + | } | |
+ | |||
+ | /*Styling for the the list item */ | ||
+ | #rightColumn_MainPage ul li{ | ||
+ | padding-left: 10px; | ||
+ | margin-left: -19px; | ||
+ | padding-top:2px; | ||
+ | padding-bottom: 2px; | ||
+ | margin-bottom: -1px; | ||
+ | |||
+ | border: 1px solid #ccc; | ||
+ | border-right: 0px solid white; | ||
+ | border-left: 0px solid white; | ||
+ | |||
+ | height:20px; | ||
font-weight: bold; | font-weight: bold; | ||
− | + | list-style: none; | |
− | + | ||
− | + | /*animate transition */ | |
+ | -webkit-transition: background 0.2s linear; | ||
+ | -moz-transition: background 0.2s linear; | ||
+ | -ms-transition: background 0.2s linear; | ||
+ | -o-transition: background 0.2s linear; | ||
+ | transition: background 0.2s linear; | ||
} | } | ||
− | + | ||
− | /* For the | + | /*For the list item, changes the color on hover.*/ |
− | + | #rightColumn_MainPage ul li:hover{ | |
− | background-color: #c1dfa6 | + | background-color:#c1dfa6; |
− | + | ||
− | + | ||
} | } | ||
+ | |||
Line 249: | Line 266: | ||
font-size: 13px; | font-size: 13px; | ||
color: #434343; | color: #434343; | ||
+ | } | ||
+ | |||
+ | #leftColumn ul ul li, #leftColumn ul li { | ||
+ | padding-left: 10px; | ||
+ | margin-left: -19px; | ||
+ | padding-top:2px; | ||
+ | padding-bottom: 2px; | ||
+ | margin-bottom: -1px; | ||
+ | |||
+ | border: 1px solid #ccc; | ||
+ | border-right: 0px solid white; | ||
+ | border-left: 0px solid white; | ||
+ | |||
+ | height:20px; | ||
+ | list-style: none; | ||
+ | |||
+ | /*animate transition */ | ||
+ | -webkit-transition: background 0.2s linear; | ||
+ | -moz-transition: background 0.2s linear; | ||
+ | -ms-transition: background 0.2s linear; | ||
+ | -o-transition: background 0.2s linear; | ||
+ | transition: background 0.2s linear; | ||
+ | |||
} | } | ||
Line 254: | Line 294: | ||
#leftColumn ul ul li:hover, #leftColumn ul li:hover { | #leftColumn ul ul li:hover, #leftColumn ul li:hover { | ||
background-color: #c1dfa6; | background-color: #c1dfa6; | ||
− | |||
} | } | ||
Line 267: | Line 306: | ||
font-weight: bold; | font-weight: bold; | ||
text-decoration: none; | text-decoration: none; | ||
− | |||
− | |||
} | } | ||
/* Styling links on hover- links are different in menu divs */ | /* Styling links on hover- links are different in menu divs */ | ||
#rightColumn a:hover, #fullWidth a:hover, #leftColumn_MainPage a:hover { | #rightColumn a:hover, #fullWidth a:hover, #leftColumn_MainPage a:hover { | ||
− | + | color: #b5dec7; | |
− | + | ||
} | } | ||
Line 343: | Line 379: | ||
.button { | .button { | ||
width: 130px; | width: 130px; | ||
− | border: | + | border: 2px solid #3aa76c; |
background-color: fff; | background-color: fff; | ||
height: 30px; | height: 30px; | ||
Line 350: | Line 386: | ||
padding: 10px 5px 0px 5px; | padding: 10px 5px 0px 5px; | ||
margin: auto; | margin: auto; | ||
+ | /*animate transition */ | ||
+ | -webkit-transition: background 0.2s linear; | ||
+ | -moz-transition: background 0.2s linear; | ||
+ | -ms-transition: background 0.2s linear; | ||
+ | -o-transition: background 0.2s linear; | ||
+ | transition: background 0.2s linear; | ||
} | } | ||
/*For the button class, change background on hover */ | /*For the button class, change background on hover */ | ||
.button:hover { | .button:hover { | ||
− | background-color: # | + | background-color: #3aa76c; |
+ | color: white; | ||
} | } | ||
+ | |||
+ | |||
+ | |||
+ | /* Class for making images with links react on hover */ | ||
+ | img.imageHover:hover { | ||
+ | opacity: 0.4; | ||
+ | filter: alpha(opacity=40); /* For IE8 and earlier */ | ||
+ | } | ||
+ | |||
/*Class for text that needs to be highlighted, used in span tag */ | /*Class for text that needs to be highlighted, used in span tag */ | ||
Line 371: | Line 423: | ||
/*Alert message for important messages */ | /*Alert message for important messages */ | ||
− | . | + | .alertMessage { |
width:700px; | width:700px; | ||
margin:auto; | margin:auto; | ||
Line 449: | Line 501: | ||
.textBeforeWhy { | .textBeforeWhy { | ||
float:left; | float:left; | ||
− | + | } | |
/*Makes a round div that will call the pop up box*/ | /*Makes a round div that will call the pop up box*/ | ||
.pop_why { | .pop_why { | ||
border: 1px solid #f58631; | border: 1px solid #f58631; | ||
− | + | color: #f58631; | |
− | color:#f58631; | + | |
font-weight: bold; | font-weight: bold; | ||
− | text-align:center; | + | text-align: center; |
border-radius: 50%; | border-radius: 50%; | ||
− | float: | + | float: none; |
− | margin-right:5px; | + | margin-right: 5px; |
− | margin-left:5px; | + | margin-left: 5px; |
− | + | padding-left: 4px; | |
+ | padding-top: 3px; | ||
+ | padding-right: 4px; | ||
+ | } | ||
− | |||
/*For the pop why class, changes the color on hover */ | /*For the pop why class, changes the color on hover */ |
Latest revision as of 17:19, 19 March 2015