/* Reset */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, font, img, ul, li {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
:focus {
outline: 0;
}
/* // Reset */
body {
background: url('https://www.cubby.com/p/_b743757213bf4788927e4d2e04004f20/bck.jpg') repeat;
font-family: Georgia, Verdana, 'Lucida Sans Unicode', sans-serif;
font-size: 12px;
color: #999;
}
h2 {
font-style: italic;
font-weight: normal;
line-height: 1.2em;
}
#container {
margin: 50px auto 0 auto;
width: 950px;
}
.bubble {
clear: both;
margin: 0px auto;
width: 950px;
background-color: #fff;
position: relative;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 0 8px rgba(0,0,0,0.3);
-moz-box-shadow: 0 0 8px rgba(0,0,0,0.3);
box-shadow: 0 0 8px rgba(0,0,0,0.3);
z-index: 90;
}
.rectangle {
background-color: #7f9bd9;
height: 50px;
width: 980px;
position: relative;
left: -15px;
top: 30px;
float: left;
-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.55);
-moz-box-shadow: 0 0 4px rgba(0,0,0,0.55);
box-shadow: 0 0 4px rgba(0,0,0,0.55);
z-index: 100;
}
.rectangle h2 {
font-size: 30px;
color: #fff;
padding-top: 6px;
text-align: center;
text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
}
.triangle-l {
border-style: solid;
border-width: 15px;
height: 0px;
width: 0px;
position: relative;
left: -30px;
top: 65px;
z-index: -1;
border-color: transparent #7d90a3 transparent transparent;
}
.triangle-r {
border-style: solid;
border-width: 15px;
height: 0px;
width: 0px;
position: relative;
left: 950px;
top: 35px;
border-color: transparent transparent transparent #7d90a3;
z-index: -1;
}
.info {
padding: 60px 25px 35px 25px;
}
.info h2 {
font-size: 20px;
}
.info p {
padding-top: 10px;
font-size: 14px;
line-height: 22px;
}
.info p a {
text-decoration: none;
color: #c4591e;
}
.info p a:hover {
text-decoration: underline;
}
nav {
position: relative;
top: 3px;
left: 90px;
z-index: 80;
}
nav ul li {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
width: 50px;
overflow: hidden;
margin: 10px 0;
padding: 5px 5px 5px 18px;
float: left;
background-color: #7f9db9;
text-align: right;
}
nav ul li a {
color: #fff;
text-decoration: none;
display: block;
}
nav ul li.l1 {
background-color: rgba(131,178,51,0.65);
}
nav ul li.l1:hover {
background-color: rgb(131,178,51);
}
nav ul li.l2 {
background-color: rgba(196,89,30,0.65);
}
nav ul li.l2:hover {
background-color: rgb(196,89,30);
}
nav ul li.l3{
background-color: rgba(65,117,160,0.65)
}
nav ul li.l3:hover {
background-color: rgb(65,117,160);
}
nav span {
float: right;
margin: 15px 80px 0 0 ;
}