/**************************************/
/*                MAIN                */
/**************************************/


body
{
    font-family: 'Open Sans' , sans-serif;
    font-size: 62.5%;
    color: #383838;
    margin: 0;
    padding: 0;   
}

#main
{
    font-size: 1.2em;
}

h1
{
    color: #96b651;
    font-weight: bolder;
    font-size: 2.1em;
    margin: 0;
    padding: 0;
}

.title1
{
    color: #96b651;
    font-weight: bolder;
    font-size: 2.1em;
    margin: 0;
    padding: 0;
}

h1.smaller
{
    font-size: 1.8em;
}

h2
{
    color: #96b651;
    font-weight: bolder;
    font-size: 1.5em;
    line-height: 1.6em;
    margin: 0;
    padding: 0;
}


p
{
    font-size: 1.2em;
    line-height: 1.5em;
}

.justify
{
    text-align: justify;
}

a
{
    color: #25b0d7;
}

a:hover
{
    color: #0b8aae;
}


a.darklink
{
    color: #06627c;
}

a.darklink:hover
{
    color: #0b85a7;
}

ul.common
{
   
    margin: 0;
    padding: 0;
    font-size: 1.2em;
}

ul.common li
{
    background: url(/img/bullet_point.png) 6px 8px no-repeat;
    list-style: none;
    padding: 1px 0 0 16px;
}

ul.common li ul
{
    font-size: 1em;
}

.margintop20
{
    margin-top: 20px;
}

.marginbottom20
{
    margin-bottom: 20px;
}

.margintop10
{
    margin-top: 10px;
}

.marginLeft15
{
    margin-left: 15px;
}

.nopadding
{
    padding: 0;
}


.fullWidth
{
    width: 960px;
}

.grayback
{
    background: url(/img/gray-gradient.png) 0 2px repeat-x;
}

.white
{
    color: #FFFFFF;
}

.lightgreen
{
    color: #e5f6c2;
}

.centeredtext
{
    text-align: center;
}

.righttext
{
    text-align: right;
}

.error
{
    color: white;
    font-size: 1em;
}

.smallertext
{
    font-size: 0.9em;
}

.floatleft
{
    width: 40%;
    float: left;
    height: auto;
}

.floatright
{
    width: 60%;
    float: right;
    height: auto;
}


.rowheight
{
    height: 30px;
    margin-bottom: 4px;
}


.autoleft
{
    float: left;
    height: auto;
}

.autoright
{
    float: right;
    height: auto;
}

.margin30
{
    margin: 30px;
}

.center
{
    width: 100%;
    float: left;
    height: auto;
}

.customers
{
    width: 100%;
    float: left;
    height: auto;
    padding: 35px 0;
}


.customers h1
{
    text-align: center;
    margin: 0 0 25px 0;
}


.smile
{
     width: 100%;
    float: left;
    height: auto;
    padding: 40px 0;
}

.inline
{
    display: inline;
    float: left;
}

.watermark
{
    color: #999 !important;
}


.link
{
    width: 180px;
    height: 15px;
    z-index: 10;
    position: absolute;
    top: 123px;
    left: 230px;
    cursor: pointer;
    background: url(/img/empty.gif);
}

.search-results-note {
    position: relative;
    top: 65px;
}

/**************************************/
/*               HEADER               */
/**************************************/

#headerwrapper
{
    width: 100%;
    height: auto;
    float: left;
    z-index: 200;
    background: #FFF;

}

#header
{
    width: 960px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

#logo
{
    width: 224px;
    height: 95px;
    float: left;
    margin-top: 5px;
    background: url(/img/logo.svg) no-repeat;
}

.profile
{
    width: auto;
    height: 30px;
    float: right;
    margin-bottom: 10px; 
}


#profileContainer
{
    width: auto;
    height: 30px;
    margin: 0;
    padding: 10px 0 0 0; 
    text-align: right;
   /* background: #f6f6f6;
    -moz-border-radius-bottomright: 12px;
    border-bottom-right-radius: 12px;
    -moz-border-radius-bottomleft: 12px;
    border-bottom-left-radius: 12px;*/
}


#profileContainer span
{
    color: #25b0d7;
    font-weight: bold;
    font-family: Arial;
    font-size: 1.1em;
}

#profileContainer .btn
{
    color: #FFFFFF;
    border: 0;
    border-radius: 2px;
    box-shadow: 3px 3px 2px #dad8db;
    margin: -2px 0 0 5px;
    text-decoration:none;
}

#nav
{
    width: 900px;
    height: 45px;
    float: right;
}

.nav
{
    margin: 0 -10px 0 0;
    padding: 10px 0;
    text-align: right;
    list-style: none;
    font-size: 1.2em;
}

.ie7 .nav
{
    margin: 0 -13px 0 0;
}

.nav li
{
    display: inline;
    margin: 0 10px 3px 10px;
    padding: 3px 0;
}

.nav li a
{
    text-decoration: none;
    color: #383838;
}


.nav li a:hover, .nav li a.active
{
    border-bottom: solid 4px #99b45f;
    cursor: pointer;
    color: #99b45f;
}



/**************************************/
/*             SLIDESHOW              */
/**************************************/
* html #features
{
    overflow-x: hidden;
}


#features
{
    display: inline;
    float: left;
    margin-right: 0;
    width: 100%;
    height: 374px;
    overflow: hidden;
    z-index: 100;
}
#features .bottom
{
    background: url(/img/container-border.jpg) repeat-x;
    width: 100%;
    height: 12px;
    position: absolute;
    left: 0;
}
#featurecontainer
{
    background-color: #ffffff;
    height: 374px;
    position: absolute;
    width: 100%;
    left: 0;
    z-index: 100;
    overflow: hidden;
    line-height: 0;
}

/* fix for IE8 */
#featurecontainer
{
    margin-top: -2px\0/;
}

/* fix for FF */
html > /**/ body #featurecontainer, x:-moz-any-link, x:default #featurecontainer
{
    margin-top: -2px;
}

/* fix for chrome, safari */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
    #featurecontainer
    {
        margin-top: -2px;
    }
}

#featurecontainer #feature-nav
{
    position: absolute;
    z-index: 110;
    width: 100%;
    bottom: 6px;
    text-align: center;
}
#featurecontainer #feature-nav-shim
{
    margin: 0 auto;
    width: 18px;
    height: 18px;
}
#featurecontainer #feature-slider
{
    position: relative;
}
    #featurecontainer #feature-slider img[data-navigateto] {
        cursor: pointer;
    }

#featurecontainer img
{
    float: left;
}
.featurestep
{
    position: absolute;
}
.featurestep a
{
    width: 30px;
    height: 30px;
    display: block;
}
#featurestepleft
{
    background: url(/img/fs.prevnext.png) no-repeat;
}
#featurestepright
{
    background: url(/img/fs.prevnext.png) -30px 0 no-repeat;
    right: 0px;
}
#features .stepcontainer
{
    z-index: 125;
    top: 170px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 100%;
}


/**************************************/
/*              CONTENT               */
/**************************************/

#pages
{
    width: 100%;
    float: left;
    height: auto;
}

#greenwrapper
{
    background: #96b651;
    float: left;
    width: 100%;
    height: 210px;
    overflow: hidden;
    margin-top: -2px;
}


#contentwrapper
{
    width: 100%;
    float: left;
    height: auto;
    padding: 30px 0;
    position: relative; 
}

.container {
    margin: 0 auto;
    padding: 0 10px;
    max-width: 1100px;
}

.minheight
{
    min-height: 622px;
}

.iconbox {
    width: 295px;
    height: 210px;
    float: left;
    margin: 0;
    padding: 19px 10px 0 10px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

.iconbox img
{
    width: 96px;
    height: 67px;
    position: relative;
}

.iconbox .title
{
    /* font-family: Francois One;*/
    font-size: 1.8em;
    line-height: 1.4em;
    font-weight: normal;
}

.iconbox p
{
    margin: 0;
    padding: 0;
    font-size: 1.2em;
    line-height: 1.4em;
}

.iconbox:hover
{
    background: #88a941;
}

.iconbox a
{
    color: #FFF;
    text-decoration: none;
}

.verticalsep
{
    background: #FFFFFF;
    opacity: 0.4;
    height: 100px;
    width: 1px;
    margin-top: 50px;
    float: left;
}

.dashedgraysep
{
    width: 95%;
    height: 1px;
    padding: 10px 10px;
    border-bottom: dashed 1px #d4d4d6;
    float: left;
}

.ie7 .dashedgraysep, .ie6 .dashedgraysep
{
    width: 800px;
}


.leftquote, .rightquote
{
    width: 48px;
    height: 39px;
    position: relative;
}

.leftquote
{
    float: left;
    margin-right: 10px;
    top: -10px;
    background: url(/img/left-quote.png) no-repeat;
}

.rightquote
{
    float: right;
    top: 40px;
    background: url(/img/right-quote.png) no-repeat;
}

.quotemsg
{
    margin: 0;
    padding: 0;
    float: left;
    width: 87%;
}


#banner
{
    width: 100%;
    background: #96b651;
    height: auto;
    float: left;
    margin: 0;
    padding: 20px 0;
}

#banner h1
{
    font-size: 2.9em;
    border-top: dashed 1px #adce66;
    border-bottom: dashed 1px #adce66;
    padding: 5px 0;
    color: #adce66;
    text-align: center;
}

#banner h2
{
    padding: 10px 0 15px 0;
}



/**************************************/
/*               FOOTER               */
/**************************************/

#footer, #subfooter
{
    width: 100%;
    height: auto;
    float: left;
    padding: 10px;
    color: #d6d6d9;
    z-index: 200;
    font-size: 1.1em; 
    position: relative;
}

#footer
{
    background: #5f5f61;
}

#subfooter
{
    margin-top: 30px;
    background: #747475;
}

.sectioncont
{
    width: 270px;
    height: auto;
    float: left;
    margin: 0 20px;
}

.sectioncont img
{
    float: left;
}


#sectionlinks
{
    float: left;
    width: auto;
    height: auto;
}

#sectionlinks ul
{
    list-style: none;
    margin: 0;
    padding: 0;
}

#sectionlinks ul li
{
    display: inline;
    margin: 0 8px;
}

#sectionlinks ul a, #footer a, #subfooter a
{
    color: #d6d6d9;
}

#sectionlinks ul a:hover, #footer a:hover, #subfooter a:hover, #footer a.active
{
    color: #96b651;
}

#sectionsocial
{
    width: 200px;
    height: auto;
    float: right;
    display: none;
}

#sectionsocial a{
    text-decoration: none;
}

.socialMediaCircle {
    color: #838383;
}

.socialMediaImage {
    color: #5F5F61;
}

.socialMediaImage:hover {
    opacity: 0.4;
}

.copy {
    margin: 12px 0 0 12px;
}

.footerText {
    margin: 12px 0 0 12px;
    padding-top: 1em;
    display: inline-block;
}


/**************************************/
/*         FANCYBOX PROMPT            */
/**************************************/

#promtwrapper
{
    width: auto;
    height: 130px;
    background: #96b651;
    padding: 15px 20px 0 20px;
    margin: 0;     
}


#promtwrapper h1
{
    margin: 7px 0;
    font-size: 1.6em;
    font-weight: normal;
}

#promtwrapper input
{
    font-size: 1.2em;
}


#messagewrapper
{
    width: 630px;
    height: 360px;
    background: #96b651;
    padding: 15px 30px 0 20px;
    margin: 0; 
    
}

#messagewrapper a
{
    color:#fff;
}

#messagewrapper ul li
{
    padding: 3px 0 0 15px;
}

#promtwrapper h2
{
    font-size: 1.4em;
    line-height: 0.9em;
}

#messagewrapper h2
{
    font-size: 1.4em;
    line-height: 1.2em;
    color: #ffffff;
}

#promtwrapper p, #messagewrapper p
{
    font-size: 1.3em;
    line-height: 1.4em;
    text-align: justify;
}

/**************************************/
/*        FANCYBOX WARNING           */
/**************************************/

#wwrapper
{
    width: 350px;
    height: 110px;
    padding: 10px 30px 0 20px;
    margin: 0;
    border: solid 3px #96b651;
    background: #fff;
    display: none;
    position: absolute;
    top: 180px;
    left: 30%;
    z-index: 3000; 
}

.ie7 #wwrapper
{
    padding: 10px 30px 0 10px; 
}


#wwrapper p
{
    text-align: justify;
    font-size: 1.1em;
}




/**************************************/
/*        DENTAL PLANS PAGE           */
/**************************************/

.relative
{
    position: relative;
}

.height30
{
    height: 30px;
    width: 100%;
    float: left;
}

.plansBoxImg
{
    width: 18%;
    height: 220px;
    height: 220px;
    margin-left: 20px;
}


.plansBoxInfo
{
    width: 74%;
    height: 200px;
    margin-right: 20px;
    margin-top: 20px; 
}

.showGridBtn
{
    position: relative;
    height: 36px;
    float: right;
    margin: 0; 
    padding: 0 30px 0 0;
    z-index: 1; 
}


#btnIndividualPlans, #btnShopPlans
{
    text-align: center;
    padding-top: 10px;
}


#indGrid, #shopGrid
{
    width: 827px; 
    height: auto;
    border-top: solid 2px #25b0d7;
    margin: 0 30px 0 0;
    padding: 30px;
    position: relative;
    float: right;
    display: none;
    background: url(/img/plans-footer.png) bottom no-repeat;
}



#btnFLIndividualPlans, #btnNYIndividualPlans, #btnFLShopPlans,
#btnNYShopPlans, #btnAZIndividualPlans, #btnILIndividualPlans,
#btnOHIndividualPlans, #btnTXIndividualPlans, #btnCOIndividualPlans,
#btnMIIndividualPlans, #btnNJIndividualPlans, #btnPAIndividualPlans, #btnVAIndividualPlans, .btnIndividualPlans {
    text-align: center;
    padding: 10px;
    height: auto;
}


#divFLIndPlans, #divNYIndPlans, #divFLShopPlans,
#divNYShopPlans, #divAZIndPlans, #divILIndPlans,
#divOHIndPlans, #divTXIndPlans, #divCOIndPlans,
#divMIIndPlans, #divNJIndPlans, #divPAIndPlans,
#divVAIndPlans, .plans-info {
    height: auto;
    border-top: solid 2px #25b0d7;
    margin: 0 30px 0 0;
    padding: 30px;
    position: relative;
    float: right;
    display: none;
    background: url(/img/plans-footer.png) bottom no-repeat;
}



.titleGrid
{
    color: #96b651;
    font-weight: bolder;
    font-size: 1.7em;
    padding: 0;
    margin: 0;
}

.gridLeftCol
{
    width: 75%;
    height: auto;
    float: left;
}


.gridRightCol
{
    width: 18%;
    height: auto;
    float: right;
}

.gridRightCol img, #shopGrid img
{
    vertical-align: middle;
}


.darkblueTitle
{
    color: #06627c;
}

/**************************************/
/*       COST CALCULATOR PAGE         */
/**************************************/

.gridTitle
{
    font-size: 1.8em;
    font-weight: 600;
    color: #5f5f61;
    font-family: 'Open Sans Condensed';
}

.gridTitle img
{
    vertical-align: text-bottom;
}


.calcGrid
{
    width: 940px;
    height: 360px;
}

.calcGridheading
{
    height: auto;
    min-height: 27px;
    width: 100%;
    background: #25b0d7;
    color: #fff;
    font-weight: bold;
    padding: 2px 2px;
    font-size: 1.1em;
}


.dashedbottom
{
    width: 100%;
    height: 1px;
    padding: 2px;
    border-bottom: dashed 1px #d4d4d6;
    float: left;
}


/**********************************************
 ***************** MAP VIEW *******************
 **********************************************/
#MapView
{
    font-size: 0.9em;
    color: #373932;
}
#MapView h1
{
    margin: 0;
    padding: 0;
    color: #99b45f;
}
#mapcanvas
{
    height: 100%;
    width: 66%;
    float: left;
    display: inline;
}
#directions
{
    margin: 5px 0 5px 0;
}
#directionspanel
{
    float: right;
    width: 32%;
    height: 100%;
    display: inline;
    padding-left: 10px;
}

/**************************************/
/*             FORM INPUT             */
/**************************************/
.green
{
    background: #99b45f;
    width: auto;
    height: 28px; /*border-radius: 5px;     -webkit-border-radius: 5px;     -moz-border-radius: 5px;*/
    color: #FFFFFF;
    border: 0;
    padding: 0 12px;
}

.green:hover
{
    background: #b7ce87;
}

.darkgray
{
    background: #5f5f61; /*border-radius: 5px;     -webkit-border-radius: 5px;     -moz-border-radius: 5px;*/
    width: auto;
    height: 28px;
    color: #FFFFFF;
    border: 0;
    padding: 0 12px;
}


.darkgray:hover
{
    background: #45473f;
}

.lightblue
{
    background: #25b0d7; /*border-radius: 5px;     -webkit-border-radius: 5px;     -moz-border-radius: 5px;*/
    width: auto;
    height: 28px;
    color: #FFFFFF;
    border: 0;
    padding: 0 12px;
}

.ie7 .green, .ie7 .lightblue, .ie7 .darkgray
{
    padding: 0 5px;
}


.lightblue:hover
{
    background: #0d89ac;
}

.greenborder
{
    width: auto;
    height: 28px;
    color: #88a941;
    border: solid 1px #88a941;
    padding: 0 12px;
    background: #FFF;
}

.greenborder:hover
{
    border: solid 1px #b7ce87;
    color: #b7ce87;
}



input[type="text"],
input[type="tel"],
input[type="password"] {
    margin: 0;
    border: 1px solid #ecedea;
    background: url("/img/gradient_white.png") repeat-x top left #f5f6f1;
    padding: 5px 5px;
}


select
{
    margin: 0;
    border: 1px solid #ecedea;
    background: url("/img/gradient_white.png") repeat-x top left #f5f6f1;
    padding: 2px 5px;
}


/**************************************/
/*          PROVIDER SEARCH          */
/**************************************/


.question
{
    border: solid 1px #ecedea;
    width: 200px;
    height: auto;
    position: absolute;
    right: 50px;
    padding: 5px 10px;
    display: none;
}

.question p 
{
    font-size: 1em;
}

.providerSearch
{
    width: 600px;
    font-size: 1.1em;
    margin: 0 auto;
}

.providerSearch select
{
    min-width: 187px;
    width: auto;
}

.providerSearch input[type="text"]
{
    min-width: 155px;
    width: auto;
}


/**************************************/
/*             ENROLLMENT             */
/**************************************/

.enroll
{
    width: 100%;
    margin: 0 auto 0 auto;
    float: left;
    height: auto;
    color: #777778;
    position: relative;
}

.enroll .heading
{
    color: #06627c;
    font-size: 2.3em;
    font-weight: bold;
    height: 50px;
    padding: 10px 10px 0 68px;
}

.enroll h2
{
    color: #25b0d7;
}

.enroll h2.darkBlue
{
    color: #06627c;    
}


.enroll .dashedgraysep
{
    padding: 0;
    margin-bottom: 5px;
    width: 100%;
}

.step1
{
    background: url(/img/step1.png) no-repeat;
}

.step2
{
    background: url(/img/step2.png) no-repeat;
}

.step3
{
    background: url(/img/step3.png) no-repeat;
}

.step4
{
    background: url(/img/step4.png) no-repeat;
}

.step5
{
    background: url(/img/step5.png) no-repeat;
}

.enroll .line
{
    float: left;
    display: block;
    width: 800px;
    min-height: 30px;
    height: auto;
    margin-bottom: 10px;
}


.enroll .confirmLine
{
    float: left;
    display: block;
    width: 800px;
    min-height: 30px;
    height: auto;
    margin-bottom: 4px;
}


.enroll .smallline
{
    float: left;
    display: block;
    width: 340px;
    min-height: 30px;
    height: auto;
    margin-bottom: 10px;
}

.enroll .left
{
    float: left;
    height: auto;
    margin-right: 8px;
    text-align: left;
    min-width: 115px;
}

.enroll .right
{
    float: right;
    height: auto;
    text-align: left;
}

.left p, .right p
{
    margin: 2px 0;
    font-size: 1.1em;
}

.alignLeft
{
    text-align: left;
}

.alignRight
{
    text-align: right;
}

.enroll select
{
    height: 28px;
    margin: 0;
    width: 187px;
    color: #777778;
}

.ie6 .enroll select, .ie7 .enroll select
{
    margin: 2px 0;
    background-color: transparent;
}

.enroll input[type=text], .enroll input[type=password]
{
    width: 175px;
    color: #777778;
}

input[type=text].smallinput, select.smallinput, input[type=password].smallinput
{
    width: 90px;
}

input[type=text].biginput, select.biginput, input[type=password].biginput
{
    width: 260px;
}


.enroll fieldset.noBorders
{
    border: 0;
    padding: 15px 20px 5px 20px;
}

.w400
{
    width: 360px;
}

.w550
{
    width: 550px;
}


.w600
{
    width: 600px;
    margin: 0 auto 0 auto;
}

.w700
{
    width: 700px;
    margin: 0 auto 0 auto;
}

.w800
{
    width: 800px;
    margin: 0 auto 0 auto;
}

.rateBox
{
    /*background:#f3f3ed;*/
    width: 96%;
    float: left;
    padding: 20px 20px;
}

.rateBox .toLeft
{
    float: left;
    padding: 0 20px 0 20px;
}

.rateBox .borderRight
{
    border-right: dashed 1px #d4d4d6;
}

.yq
{
    width:100px;
    height:auto;
    margin:0;
}

.rate
{
    color: #06627c;
    font-size: 2.4em;
    line-height:1.2em;
    font-family: Impact;
}



.rateBox .plan
{
    font-size: 1.9em;
    font-weight: bolder;
    padding: 5px 0 0 45px;
    background: url(/img/dental-icon.png) 15px no-repeat;
    margin: 0;
}

.rateBox .links
{
    width: 120px;
    float: right;
}


input[type='text'].focus, textarea.focus, select.focus
{
    border-color: red !important;
}

.insideContainer
{
 float: left;
}

.buttonBar
{
    float: left; width: 300px; 
    margin: 0 0 0 80px; position: relative; 
}

.ie7 .buttonBar, .ie6 .buttonBar
{
   float: left;
    margin: -43px 0 0 40px;
}


.dashedBorders
{
    border: dashed 1px #d4d4d6;
    margin: 5px auto 10px auto;
    float: left;
    width: 97%;
    height: auto;
    padding: 10px;
}


.help-icon
{
    vertical-align: baseline;
    width: 16px;
    height: 16px;
}


#check
{
    width: 457px;
    height: 228px;
    background: url(/img/check.png) no-repeat;
    position: absolute;
    z-index: 10;
    display: none;
    left: 30%;
    top: 260px;
}

#print
{
    position: relative;
}

#printthis
{
    position: absolute;
    top: 18px;
    right: 30px;
}

#printthis img
{
    vertical-align: middle;
}

.tweet {
    border: dashed 2px #d4d4d6;
    padding: 10px;
    float: left;
    width: 360px;
    margin: 0 5px 0 0;
    min-height: 130px;
}

.tweet:hover
{
    border: dashed 2px #25b0d7;
}

.tweet img
{
    vertical-align:middle;
    border:0;
}

.tweet .follow
{
    float: right;
    font-weight:bold;
}





/**************************************/
/*          UPDATE PROGRESS          */
/**************************************/

#overlay
{
    width: 100%;
    height: 100%;
    position:fixed;
    background: url(/img/pixel.png) repeat;
    z-index: 3000;
}

.spinning
{
    width: 120px;
    height: 50px;
    z-index: 3001;  
    position: relative;
    margin: auto;
   margin-top: 25%;
}


   /*******************Errors Divs*********************/
.error-wrapper {
    width: 91%;
    height: auto;
    position: relative; margin: 0 0 50px 5px;
}

.error-container
{
  float: left;
 background: none repeat scroll 0 0 #F2DEDE;
    border: 1px solid red;
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    font-size: 14px;
  color: red;
  padding: 5px;
}

.form-error
{
    background: none repeat scroll 0 0 #F2DEDE;
    border: 1px solid red;
    border-radius: 8px 8px 8px 8px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    font-size: 13px;
    padding: 5px 10px;
    position: relative;
    width: auto;
    color: red;
    top: 5px;
    z-index: 2000;
    float: left;
}

span.form-error[style*="inline"]
{
    display: block !important;
}
.form-error:before
{
    border-bottom: 7px solid red;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    content: "";
    display: inline-block;
    left: 20px;
    position: absolute;
    top: -7px;
}
.form-error:after
{
    border-bottom: 6px solid #F2DEDE;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    content: "";
    display: inline-block;
    left: 21px;
    position: absolute;
    top: -6px;
}
.form-error.left:before
{
    border-bottom: 7px solid transparent;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -14px;
    top: 20px;
}
.form-error.left:after
{
    border-bottom: 6px solid transparent;
    border-right: 6px solid #EEEEEE;
    border-top: 6px solid transparent;
    left: -12px;
    top: 21px;
}