/*
==========================================================

PremiumZone

Version :
1.0.0

File :
assets/css/corner.css

Description :
PremiumZone Corner

==========================================================
*/

/* ==========================================================
   CORNER
========================================================== */

.pz-corner{

    position:absolute;

    width:18px;

    height:18px;

    opacity:0;

    transition:

        opacity .18s linear;

    z-index:30;

}

/* ==========================================================
   LINE
========================================================== */

.pz-corner::before,

.pz-corner::after{

    content:"";

    position:absolute;

    background:#00F3FF;

    box-shadow:

        0 0 4px #00F3FF,

        0 0 10px rgba(

            0,

            243,

            255,

            .85

        ),

        0 0 18px rgba(

            0,

            243,

            255,

            .35

        );

}

/* ==========================================================
   TOP LEFT
========================================================== */

.pz-corner-tl{

    top:-1px;

    left:-1px;

}

.pz-corner-tl::before{

    width:18px;

    height:2px;

    left:0;

    top:0;

}

.pz-corner-tl::after{

    width:2px;

    height:18px;

    left:0;

    top:0;

}

/* ==========================================================
   TOP RIGHT
========================================================== */

.pz-corner-tr{

    top:-1px;

    right:-1px;

}

.pz-corner-tr::before{

    width:18px;

    height:2px;

    right:0;

    top:0;

}

.pz-corner-tr::after{

    width:2px;

    height:18px;

    right:0;

    top:0;

}

/* ==========================================================
   BOTTOM LEFT
========================================================== */

.pz-corner-bl{

    bottom:-1px;

    left:-1px;

}

.pz-corner-bl::before{

    width:18px;

    height:2px;

    left:0;

    bottom:0;

}

.pz-corner-bl::after{

    width:2px;

    height:18px;

    left:0;

    bottom:0;

}

/* ==========================================================
   BOTTOM RIGHT
========================================================== */

.pz-corner-br{

    bottom:-1px;

    right:-1px;

}

.pz-corner-br::before{

    width:18px;

    height:2px;

    right:0;

    bottom:0;

}

.pz-corner-br::after{

    width:2px;

    height:18px;

    right:0;

    bottom:0;

}

/* ==========================================================
   DIAMOND
========================================================== */

.pz-corner i{

    position:absolute;

    width:6px;

    height:6px;

    background:#00F3FF;

    transform:

        rotate(

            45deg

        );

    box-shadow:

        0 0 5px #00F3FF,

        0 0 12px rgba(

            0,

            243,

            255,

            .90

        );

}

/* ==========================================================
   POSITION
========================================================== */

.pz-corner-tl i{

    left:-3px;

    top:-3px;

}

.pz-corner-tr i{

    right:-3px;

    top:-3px;

}

.pz-corner-bl i{

    left:-3px;

    bottom:-3px;

}

.pz-corner-br i{

    right:-3px;

    bottom:-3px;

}