Welcome to the TWC Wiki! You are not logged in. Please log in to the Wiki to vote in polls, change skin preferences, or edit pages. See HERE for details of how to LOG IN.

Difference between revisions of "User:Makanyane/twc.css"

From TWC Wiki
Jump to navigationJump to search
Line 41: Line 41:
 
/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */
 
/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */
  
@media only screen and (max-width: 600px) {
+
@media only screen and (max-width: 700px) {
 
.col {  
 
.col {  
 
margin: 1% 0 1% 0%;
 
margin: 1% 0 1% 0%;
Line 60: Line 60:
 
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
 
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
  
@media only screen and (max-width: 600px) {
+
@media only screen and (max-width: 700px) {
 
.col { margin: 1% 0 1% 0%;}
 
.col { margin: 1% 0 1% 0%;}
 
.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
 
.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
Line 78: Line 78:
 
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
 
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
  
@media only screen and (max-width: 600px) {
+
@media only screen and (max-width: 700px) {
 
.span_2_of_2 {
 
.span_2_of_2 {
 
width: 100%;
 
width: 100%;
Line 97: Line 97:
 
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
 
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
  
@media only screen and (max-width: 600px) {
+
@media only screen and (max-width: 700px) {
 
.span_40_of_2 {
 
.span_40_of_2 {
 
width: 100%;
 
width: 100%;

Revision as of 00:18, 17 May 2019

/* Mak's testing area for twc skin */
/*  STYLING */
div.section, div.group {
        border: none;
        background: none;
}

/*  SECTIONS  ============================================================================= */

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  GROUPING  ============================================================================= */

.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */


/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 700px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}

/*  GRID OF THREE  */
.span_3_of_3 {
	width: 100%;
}
.span_2_of_3 {
	width: 66.1%;
}
.span_1_of_3 {
	width: 32.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 700px) {
	.col { margin: 1% 0 1% 0%;}
	.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
}

/*  GRID OF TWO   ============================================================================= */


.span_2_of_2 {
	width: 100%;
}

.span_1_of_2 {
	width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 700px) {
	.span_2_of_2 {
		width: 100%;
	}
	.span_1_of_2 {
		width: 100%; 
	}
}
/*  GRID OF TWO   40/60============================================================================= */


.span_40_of_2 {
	width: 39.36%;
}
.span_60_of_2 {
	width: 59.04%;
}
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 700px) {
	.span_40_of_2 {
		width: 100%;
	}
	.span_60_of_2 {
		width: 100%; 
	}
}

.TWCportal_1 {
    border: none;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
    background: rgb(227,227,227);
    background: linear-gradient(180deg, rgba(165,165,180,0.5) 0%, rgba(165,165,180,0) 100%);
}
.TWCportal_2 {
    border: none;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
    background: rgb(205,199,199);
    background: linear-gradient(180deg, rgba(168,160,162,0.5) 0%, rgba(168,160,162,0) 100%);
}
.TWCportal_3 {
    border: none;
    padding: .4em .9em .9em;
    color: black;
    vertical-align: top;
    background: rgb(229,225,219);
    background: linear-gradient(180deg, rgba(168,168,162,0.5) 0%, rgba(168,168,162,0) 100%);
}
.TWCportal_head {
    padding:5px; 
    background:#7d1515; 
    color:white;
    margin-bottom: 0em;
}