Virgonc design - G-Portál

AJÁNLOM AZ OLDALT

Blog-Frissítések-Főoldal

template

FIRST

ABOUT YOUR CHARACTER HERE

friends

WORDS

enemies

WORDS

lovers

WORDS

FIRST LAST

FIRST

ABOUT YOUR CHARACTER HERE.

friends

WORDS

enemies

WORDS

lovers

WORDS

FIRST LAST

Victoria

ABOUT YOUR CHARACTER HERE.

friends

WORDS

enemies

WORDS

lovers

WORDS

FIRST LAST

FIRST

ABOUT YOUR CHARACTER HERE.

friends

WORDS

enemies

WORDS

lovers

WORDS

FIRST LAST

<style>

.watercontainer {

margin: 10px auto;

height: auto;

width: auto;

}

.watertabs {

margin: 0px auto;

position: relative;

width: 280px;

height: 480px;

background: red;

}

.watertab {

float: left;

}

.watertab label {

display: block;

width: 70px;

height: 30px;

background: #eee;

margin: 0px;

position: relative;

left: 0px;

top: 0px;

z-index: 1;

text-align: center;

line-height: 30px;

font-family: arial;

font-size: 8px;

text-transform: uppercase;

cursor: crosshair;

}

.watertab input[type=radio]:checked ~ label {

background: white;

z-index: 2;

}

.watertab input[type=radio] {

display: none;

}

.watercontent {height: 450px; width: 280px; left: 0; background: blue; position: absolute; overflow: hidden; bottom: 0; color: #000}

.watertab input[type=radio]:checked ~ label ~ .watercontent {

z-index: 1;

}

.water1 {height: 60px; width: 280px; position: absolute; bottom: 0; text-align: center; line-height: 60px; font-family: roboto; color: #fff; text-transform: uppercase; font-size: 24px; font-weight: 700; letter-spacing: -2px}

.water2 {position: absolute; top: 0; height: 390px; width: 280px; background-size: cover; -webkit-transition: 0.5s;-moz-transition: 0.5s;transition: 0.5s; }

#water:hover .water2 {-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition: 0.5s;-moz-transition: 0.5s;transition: 0.5s; }

.water2a {position: absolute; top: 10px; height: 350px; width: 220px; background: transparent; left: 30px}

.water2a1 {position: absolute; top: 10px; height: 320px; width: 220px; }

.water2a2a {width: 0;

height: 0;

border-style: solid;

border-width: 30px 110px 0 0;

position: absolute; top: 330px; left: 0}

.water2a2b {width: 0;

height: 0;

border-style: solid;

border-width: 0 110px 30px 0;

position: absolute; top: 330px; right: 0}

.water2b {height: 270px; width: 180px; top: 10px; left: 10px; background: white; position: absolute; border-color: white; border-style: solid; border-width: 10px 5px 10px 10px; padding-right: 5px; font-family: open sans; font-size: 9px; line-height: 11px; overflow: auto; text-align: justify}

.water2b::-webkit-scrollbar {width: 4px}

.water2b::first-letter {font-family: roboto; float: left; font-size: 52px; margin: 10px 5px 5px 0px; font-weight: 700; text-transform: uppercase; padding-top: 9px}

.water2b b, .water2b i {font-family: roboto; text-transform: uppercase; font-weight: 700; font-size: 11px; letter-spacing: 0}

#water .water2a {top: -360px; transition: 0.5s ease-in-out 0.3s; -webkit-transition: 0.5s ease-in-out 0.3s; -moz-transition: 0.5s ease-in-out 0.3s; }

#water:hover .water2a {top: 0px; transition: 0.5s ease-in-out; -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; }

.water2b span {font-family: roboto; font-size: 20px; text-transform: uppercase; line-height: 20px; font-weight: 700}

.waterl1 {height: 100%; width: 100%; color: #fff; background: #616FA5}

.watera .water1 {background-color: #616FA5}

.watera .water2a1 {background-color: #616FA5}

.watera .water2a2a {border-color: #616FA5 transparent transparent transparent;}

.watera .water2a2b {border-color: transparent #616FA5 transparent transparent;}

.watera .water2b::-webkit-scrollbar-thumb {border: 1px solid #616FA5; background: #fff}

.watera .water2b b {color: #7F92DA}

.watera .water2b i {color: #97A4D8}

.watera .water2b::first-letter {color: #616FA5;}

.watera .water2b span {color: #616FA5}

.waterl2 {height: 100%; width: 100%; color: #fff; background: #A86060}

.waterb .water1 {background: #A86060}

.waterb .water2a1 {background-color: #A86060}

.waterb .water2a2a {border-color: #A86060 transparent transparent transparent;}

.waterb .water2a2b {border-color: transparent #A86060 transparent transparent;}

.waterb .water2b::-webkit-scrollbar-thumb {border: 1px solid #A86060; background: #fff}

.waterb .water2b b {color: #D97D7D}

.waterb .water2b i {color: #CF9999}

.waterb .water2b::first-letter {color: #A86060;}

.waterb .water2b span {color: #A86060}

.waterl3 {height: 100%; width: 100%; color: #fff; background: #5C966E}

.waterc .water1 {background-color: #5C966E}

.waterc .water2a1 {background-color: #5C966E}

.waterc .water2a2a {border-color: #5C966E transparent transparent transparent;}

.waterc .water2a2b {border-color: transparent #5C966E transparent transparent;}

.waterc .water2b::-webkit-scrollbar-thumb {border: 1px solid #5C966E; background: #fff}

.waterc .water2b b {color: #81D09A}

.waterc .water2b i {color: #9AC5A8}

.waterc .water2b::first-letter {color: #5C966E;}

.waterc .water2b span {color: #5C966E}

.waterl4 {height: 100%; width: 100%; color: #fff; background: #9276A3}

.waterd .water1 {background-color: #9276A3}

.waterd .water2a1 {background-color: #9276A3}

.waterd .water2a2a {border-color: #9276A3 transparent transparent transparent;}

.waterd .water2a2b {border-color: transparent #9276A3 transparent transparent;}

.waterd .water2b::-webkit-scrollbar-thumb {border: 1px solid #9276A3; background: #fff}

.waterd .water2b b {color: #BC97D2}

.waterd .water2b i {color: #B19BBF}

.waterd .water2b::first-letter {color: #9276A3;}

.waterd .water2b span {color: #9276A3}

</style>

<label for="watertab-1"><div class="waterl1">FIRST</div></label>

<div class="water2b">ABOUT YOUR CHARACTER HERE

<p><span>friends</span>

<p>WORDS

<p><span>enemies</span>

<p>WORDS

<p><span>lovers</span>

<p>WORDS

</div>

</div>

<a href="http://shine.b1.jcink.com/index.php?showuser=6723"><div class="water1">FIRST LAST</div></a>

</div></div></div></div>

<label for="watertab-2"><div class="waterl2">FIRST</div></label>

<div class="water2b">ABOUT YOUR CHARACTER HERE.

<p><span>friends</span>

<p>WORDS

<p><span>enemies</span>

<p>WORDS

<p><span>lovers</span>

<p>WORDS

</div>

</div>

<div class="water1">FIRST LAST</div>

</div></div></div></div>

<label for="watertab-3"><div class="waterl3">Victoria</div></label>

<div class="water2b">ABOUT YOUR CHARACTER HERE.

<p><span>friends</span>

<p>WORDS

<p><span>enemies</span>

<p>WORDS

<p><span>lovers</span>

<p>WORDS

</div>

</div>

<div class="water1">FIRST LAST</div>

</div></div></div>

</div>

<label for="watertab-4"><div class="waterl4">FIRST</div> </label>

<div class="water2b">ABOUT YOUR CHARACTER HERE.

<p><span>friends</span>

<p>WORDS

<p><span>enemies</span>

<p>WORDS

<p><span>lovers</span>

<p>WORDS

</div>

</div>

<div class="water1">FIRST LAST</div>

</div></div></div>

</div>

2016.03.15. 18:03, Virág

Vissza a bloghoz

Súgó

Még nincs hozzászólás.

Új hozzászólás Fórum frissítése

Frissítés

Blog(éves)

ARCHÍVUM

2022. (5)

2021. (6)

2020. (28)

2018. (108)

2017. (261)

2016. (338)

2015. (162)

Oldal tetejére

Oldal info

Virág

www.jegvirag.gportal.hu

Ez az oldal a www.jegvirag.gportal.hu MINTA oldala,az oldalon tesztelem a design-et ,kódokat...

Elérhetőségem: [email protected]

Vendégkönyv Képtár Blog

Menü

Számláló

Indulás: 2014-07-11

Bejelentkezés

Regisztráció
Elfelejtettem a jelszót

Csskod