Home Educational Development Unit css edu-additional-styles.css

edu-additional-styles.css

CSS stylesheet icon EDU-styles-2016.css — CSS stylesheet, 3 kB (3906 bytes)

File contents

@charset "utf-8";
/* CSS Document */

@media screen and (min-width: 1024px) {
.right-col {
		width:30%;
		float:right;
	}
}

.bubble > div, .bubble2 > div, .bubble3 > div, .bubble4 > div, .bubble5  > div
{
width: auto;
height: auto;
padding: 5px 10px 5px 10px;
}

.bubble 
{
position: relative;
width: 100%;
height: auto;
padding: 0;
margin-bottom:30px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #572163 solid 5px;
}
.bubble:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 17px 16px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
margin-left: -16px;
bottom: -17px;
left: 22%;
}

.bubble:before 
{
content: '';
position: absolute;
border-style: solid;
border-width: 21px 20px 0;
border-color: #572163 transparent;
display: block;
width: 0;
z-index: 0;
margin-left: -20px;
bottom: -26px;
left: 22%;
}
/*---------------------*/
.bubble2 
{
position: relative;
width: 100%;
height: auto;
padding: 0px;
margin-bottom:30px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #B74783 solid 5px;
}

.bubble2:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 17px 16px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
margin-left: -16px;
bottom: -17px;
left: 84%;
}

.bubble2:before 
{
content: '';
position: absolute;
border-style: solid;
border-width: 21px 20px 0;
border-color: #B74783 transparent;
display: block;
width: 0;
z-index: 0;
margin-left: -20px;
bottom: -26px;
left: 84%;
}
/*---------------------*/
.bubble3 
{
position: relative;
width: 100%;
height: auto;
padding: 0px;
margin-bottom:30px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #D15861 solid 5px;
}

.bubble3:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 17px 16px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
margin-left: -16px;
bottom: -17px;
left: 11%;
}

.bubble3:before 
{
content: '';
position: absolute;
border-style: solid;
border-width: 21px 20px 0;
border-color: #D15861 transparent;
display: block;
width: 0;
z-index: 0;
margin-left: -20px;
bottom: -26px;
left: 11%;
}
/*---------------------*/
.bubble4
{
position: relative;
width: 100%;
height: auto;
padding: 0px;
margin-bottom:30px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #572163 solid 5px;
}

.bubble4:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 17px 16px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
margin-left: -16px;
bottom: -17px;
left: 61%;
}

.bubble4:before 
{
content: '';
position: absolute;
border-style: solid;
border-width: 21px 20px 0;
border-color: #572163 transparent;
display: block;
width: 0;
z-index: 0;
margin-left: -20px;
bottom: -26px;
left: 61%;
}
/*---------------------*/
.bubble5 
{
position: relative;
width: 100%;
height: auto;
padding: 0px;
margin-bottom:30px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #B74783 solid 5px;
}

.bubble5:after 
{
content: '';
position: absolute;
border-style: solid;
border-width: 17px 16px 0;
border-color: #FFFFFF transparent;
display: block;
width: 0;
z-index: 1;
margin-left: -16px;
bottom: -17px;
left: 89%;
}

.bubble5:before 
{
content: '';
position: absolute;
border-style: solid;
border-width: 21px 20px 0;
border-color: #B74783 transparent;
display: block;
width: 0;
z-index: 0;
margin-left: -20px;
bottom: -26px;
left: 89%;
}