Html+css Page Practice--legend part Fifth

Part V--service

Brief introduction:

Page effect:

HTML code:

< SectionID= "Services">        <Divclass= "Container">            <Divclass= "Align"><Iclass= "icon-cog-circled"></I></Div>            <H1>Services</H1>            <Divclass= "Row">                <Divclass= "Span3">                    <Divclass= "Align"><Iclass= "Icon-desktop Sev_icon"></I></Div>                    <H2>Web Design</H2>                    <P>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</P>                </Div>                <Divclass= "Span3">                    <Divclass= "Align"><Iclass= "Icon-vector Sev_icon"></I></Div>                    <H2>Print Design</H2>                    <P>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</P>                </Div>                <Divclass= "Span3">                    <Divclass= "Align"><Iclass= "Icon-basket Sev_icon"></I></Div>                    <H2>Ecommerce</H2>                    <P>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</P>                </Div>                <Divclass= "Span3">                    <Divclass= "Align"><Iclass= "Icon-mobile-1 Sev_icon"></I></Div>                    <H2>Marketing</H2>                    <P>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</P>                </Div>            </Div>        </Div>    </ Section>

CSS code:

       #services {padding:50px 70px;            margin-top:0px;        margin-bottom:50px;            } #services. span3{background: #e9e9e9;            padding:3px 0 15px 10px;            Transition:all 0.3s ease-in-out;            width:22%;            Display:inline-block;        margin:9px;            } #services. span3:hover{background: #e3e3e3;        box-shadow:1px 1px 6px #c1bac1;            } #services h1{font-size:3em;            Margin:0em 0 0.7em 0;            font-family: ' Patua one ', cursive;        Text-align:center;            } #services h2{font-size:22px;            font-family: ' Patua one ', cursive;            Font-weight:lighter;            margin:0;            padding:0;        Text-align:center;            } #services p{margin:10px;              Float:left;              line-height:25px; } #services. align{font-size: 6em;            Text-align:center;        padding:0;            } #services. align. sev_icon{text-align:center;            margin:10px 0 20px 0;            Font-size:0.6em;        Color: #F0BF00; }

Html+css Page Practice--legend part Fifth