/* ============================================= 
* Filename : tranzparency.styles.css
* Template : Tranzparency
* Author : Stefan Carcu
* Date created : 20.11.2010
* Media : Screen
 ============================================= */

body { margin:70px 0; padding:0; font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; font-weight:normal; font-size:12px; line-height:18px; color:#636363; }

h1, h2, h3, h4, h5, h6 { margin:8px 0; padding:0; color:#505050; }
h1 { font-size:26px; }
h2 { font-size:24px; color:#505050; }
h3 { font-size:22px; text-transform:uppercase; }
h4 { font-size:20px; text-transform:uppercase; }
h5 { font-size:18px; margin:2px 0; }
h6 { font-size:16px; color:#919191; }

a, a:visited { text-decoration:none; color:#00b1fc; }
a:hover { color:#969696; }

#footer a, #footer a:visited { text-decoration:none; color:#636363; }
#footer a:hover { color:#393939; border-bottom:1px dashed #393939; }

#menu a, #menu a:visited { text-decoration:none; color:#b3c1f3; }
#menu a:hover { color:#969696; }

.clear { height:1%; clear:both; }
.float_left { float:left; }
.float_right { float:right; }
.margin_5_0 { margin:5px 0; }
.margin_0_8_0_0 { margin:0 8px 0 0; }
.margin_10_0 { margin:10px 0; }
.margin_15_0 { margin:15px 0; }
.margin_10_15_10_0 { margin: 10px 15px 10px 0; }
.margin_0_20 { margin:0 20px; }
.marginRight_90 { margin:0 90px 0 0; }
.marginRight_20 { margin:0 20px 0 0; }
.marginLeft_40 { margin:0 0 0 40px; }
.margin_5_0_20_0 { margin:5px 0 20px 0; }
.margin_5_0_12_0 { margin:5px 0 12px 0; }
.padding_0_40 { padding:40px; }
.nodisplay { display:none; }
.center { text-align:center; }

/* ============================================= reset ============================================= */
ul, ol, li em, td, img, p { margin:0; padding:0; list-style:none; border:0; }

/* ============================================= corners ============================================= */
.corners { -moz-border-radius: 8px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; display: block; }
.corners_bottom { -moz-border-radius-bottomleft:8px; -moz-border-radius-bottomright:8px; -webkit-border-bottom-left-radius:8px; -webkit-border-bottom-right-radius:8px;border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; }
.corners_top { -moz-border-radius-topleft:6px; -moz-border-radius-topright:6px; -webkit-border-top-left-radius:6px; -webkit-border-top-right-radius:6px; border-top-right-radius: 6px; border-top-left-radius: 6px; }
.corners_left { -moz-border-radius-bottomleft:6px; -moz-border-radius-topleft:6px; -webkit-border-bottom-left-radius:6px; -webkit-border-top-left-radius:6px; border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
.corners_right { -moz-border-radius-bottomright:6px; -moz-border-radius-topright:6px; -webkit-border-bottom-right-radius:6px; -webkit-border-top-right-radius:6px; border-top-right-radius: 6px; border-bottom-right-radius: 6px; }


#wrapper { background: rgba(255, 255, 255, 0.2); border:1px solid white; border-color: rgba(255, 255, 255, 0.75); margin:auto; position:relative; width:960px; padding:10px; -webkit-background-clip: padding-box; -moz-box-shadow: 0 0 4px rgba(50, 50, 50, 0.5);-webkit-box-shadow: 0 0 4px rgba(50, 50, 50, 0.5);box-shadow: 0 0 4px rgba(50, 50, 50, 0.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#33FFFFFF,endColorstr=#33FFFFFF); }
#content { background: rgba(255, 255, 255, 1.00); background-color:#FFF; -moz-box-shadow: 0 0 14px rgba(255, 255, 255, 1.00); -webkit-box-shadow: 0 0 14px rgba(255, 255, 255, 1.00); box-shadow: 0 0 14px rgba(255, 255, 255, 1.00); -moz-border-radius:4px; -webkit-border-radius:4px; border-radius: 4px; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFFFFFFF,endColorstr=#FFFFFFFF); }

#ads { background-color:#dfdfdf; border:1px solid #cccccc; padding:5px; }
#menu { background-color:#505050; margin:20px 0; -moz-border-radius-topright:8px; -webkit-border-top-right-radius:8px; border-top-right-radius:8px; }
#menu h6 { color:#FFF; margin:10px 0 0 0; padding:0; text-transform:uppercase; }
#slideshow { background:url(../images/slide_btm.gif) bottom no-repeat #dfdfdf; height:350px; margin:0; padding:0; -moz-border-radius-topright:8px; -webkit-border-top-right-radius:8px; border-top-right-radius:8px; }
#where { background:url(../images/slide_btm.gif) bottom no-repeat #dfdfdf; height:27px; margin:0; padding:3px 0 0 0; -moz-border-radius-topright:8px; -webkit-border-top-right-radius:8px; border-top-right-radius:8px; }

/* ============================================= menu ============================================= */
#menu ul { height:50px; color:#FFF; }
#menu ul li { float:left; padding: 0 36px 0 0; position: relative;  }

/* ============================================= sub navigation ============================================= */
#menu li ul.subnav { position: absolute; left: 0; top: 44px; background-color:#505050; margin: 0; padding:0; display: none; float: left; width: 140px; z-index:100; -moz-border-radius-bottomleft:8px; -moz-border-radius-bottomright:8px; -webkit-border-bottom-left-radius:8px; -webkit-border-bottom-right-radius:8px; border-top:none; border-bottom:1px solid #444444; border-left:1px solid #444444; border-right:1px solid #444444; height:auto; }
#menu li ul.subnav li { margin: 0; padding: 0; clear: both; width: 140px; z-index:5; border-top:1px solid #444444; }
#menu li ul.subnav li a { margin: 0; padding: 0 10px; float: left; width: 140px; z-index:135; line-height:30px; text-align:left; }
#menu li.current li a { color:#3f3f3f; }

.width_280 { width:280px; }
.margin_0_20_0_0 { margin:0 20px 0 0; }

/* ============================================= divider ============================================= */
.dashed_line { background:url(../images/dashed_line.gif) repeat-x; height:2px; width:100%; margin:40px 0; }

/* ============================================= list styles ============================================= */
.validlist li { background:url(../images/valid.gif) no-repeat; padding:0 0 4px 22px; }
.wronglist li { background:url(../images/wrong.gif) no-repeat; padding:0 0 4px 22px; }
.minuslist li { background:url(../images/minus.gif) no-repeat; padding:0 0 4px 22px; }

/* ============================================= mark ============================================= */
span.mark { background-color:#FF0; }

/* ============================================= boxes ============================================= */
a.box { display: block; padding: 12px 12px 12px 52px; color: #333; text-decoration: none; margin: 20px 0; }	
a.box:hover { color: #000; text-decoration:none; }
.close { width: 9px; height: 9px; float: right; background: url("../images/close_box.png") no-repeat left top; margin: 6px 0; }
.close:hover { background: url("../images/close_box.png") no-repeat left bottom; }
.succes { border: 1px solid #b3dc7c; background: url("../images/success.png") no-repeat 10px 50% #e8ffca; }
.error { border: 1px solid #ebb1b1; background: url("../images/error.png") no-repeat 10px 50% #ffd6d6; }
.warning { border: 1px solid #efdc75; background: url("../images/warning.png") no-repeat 10px 50% #fff7cb; }
.info { border: 1px solid #afdbee; background: url("../images/info.png") no-repeat 10px 50% #e4f5fd; }

/* ============================================= dropcap ============================================= */
span.dropcap { height: 32px; width: 32px; margin: 0 8px 0 0; float: left; display: block; font-size: 24px; line-height: 32px; text-align: center; background:url(../images/dropcap.png) 0 0 no-repeat; color:#FFF; }

/* ============================================= pullquotes ============================================= */
.pullquote { width: 201px; font-size: 16px; line-height: 27px; font-family: Georgia, serif; font-style: italic; margin: 18px 22px; }

/* ============================================= units ============================================= */
.two_units { width:48%; margin:0 1%; }
.three_units { width:30%; margin:0 1.5%; }
.four_units { width:23%; margin:0 1%; }
#container { width:68%; margin:0 1%; }
.sideleft_menu { width:26%; margin:0 2%; }
.sideright_menu { width:22%; margin:0 4%; }
#side_menu ul { margin:0 0 0 15px; }
#side_menu ul li { background:url(../images/dashed_line.gif) repeat-x bottom; list-style-image:url(../images/arrow.gif); width:100%; padding:4px 0; }

/* ============================================= frames ============================================= */
.frame_blog { position: relative; display: block; height:266px; width: 586px; }
.frame_blog span { background: url(../images/frame_ebig.png) no-repeat center top; height:266px; width: 586px; display: block; position: absolute; }

.frame_ebig { position: relative; display: block; height:266px; width: 586px; }
.frame_ebig span { background: url(../images/frame_ebig.png) no-repeat center top; height:266px; width: 586px; display: block; position: absolute; }
.frame_ebig span:hover { background: url(../images/frame_ebig.png) 0 -290px no-repeat; }

.frame_big { position: relative; display: block; height:196px; width: 432px; }
.frame_big span { background: url(../images/frame_big.png) no-repeat center top; height:196px; width: 432px; display: block; position: absolute; }
.frame_big span:hover { background: url(../images/frame_big.png) 0 -214px no-repeat; }

.frame_medium { position: relative; display: block; height:126px; width: 278px; }
.frame_medium span { background: url(../images/frame_threecolumns.png) no-repeat center top; height:126px; width: 278px; display: block; position: absolute; }
.frame_medium span:hover { background: url(../images/frame_threecolumns.png) 0 -137px no-repeat; }

.frame_small { position: relative; display: block; height:91px; width: 201px; }
.frame_small span { background: url(../images/frame_fourcolumns.png) no-repeat center top; height:91px; width: 201px; display: block; position: absolute; }
.frame_small span:hover { background: url(../images/frame_fourcolumns.png) 0 -99px no-repeat; }

.frame_esmall { position: relative; display: block; height:35px; width: 47px; }
.frame_esmall span { background: url(../images/frame_esmall.png) no-repeat center top; height:35px; width: 47px; display: block; position: absolute; }

/* ============================================= blog ============================================= */
.date { background:url(../images/calendar.gif) no-repeat; height:16px; padding:0 0 0 20px; margin:0 15px 0 0; }
.author { background:url(../images/author.gif) no-repeat; height:16px; padding:0 0 0 20px; margin:0 15px 0 0; }
.tags { background:url(../images/tags.gif) no-repeat; height:16px; padding:0 0 0 20px; margin:0 15px 0 0; }
.comments { background:url(../images/comments.gif) no-repeat; height:16px; padding:0 0 0 20px; margin:0 15px 0 0; }

/* ============================================= comments ============================================= */
.avatar { margin:0 8% 0 0; width:8%; }
.comment { width:84%; }

/* ============================================= add comment ============================================= */
label { display:block; margin:6px 0; }
.required { color:red; }
.textinput { border:1px solid #CCC; padding:6px; color:#333; width:250px; }
.messagearea { border:1px solid #CCC; padding:6px; color:#333; width:390px; }
.button { background: url(../images/button.gif) no-repeat; height:30px; width:100px; border:none; color:#FFF; margin:10px 0; text-transform:uppercase; }

/* ============================================= contact ============================================= */
.widthHalf { width:48%; margin:0 1%; }

/* ============================================= footer ============================================= */
#footer { background:url(../images/footer_top.gif) no-repeat top #dfdfdf; padding:20px 40px; }
#footer_copy { background-color:#7c7c7c; color:#FFF; padding:16px 40px; }
#footer_copy ul li { float:left; margin:0 10px; }

#footer_copy a, #footer_copy a:visited { text-decoration:none; color:#FFFFFF; }
#footer_copy a:hover { color:#393939; }

/* ========== WHO ANSWERS LIGHTBOX ========== */
  #who_answers {
    display: none;
    width: 90%;
    max-width: 500px;
    border-radius: 0.25rem;
    background: #fff;
    padding: 25px 25px 1px;
    font-size: 16px;
    text-align: initial;
    }
    
    #who_answers .close {
    position: absolute;
    top: 13px;
    right: 16px;
    font-size: 30px;
    line-height: 1;
    cursor: pointer;
    }
    
    #who_answers .close svg {
      width: 1rem;
      }
    #who_answers h2 {
    font-size: 26px;
    margin: 0 0 30px;
    text-transform: uppercase;
    }
    
    #who_answers ul {
    list-style: disc;
    padding: 0 0 0 40px;
    margin-bottom: 1rem;
    }
    
    #who_answers p {
    margin: 0;
    padding: 0 0 30px;
    }
    
    .who_answers {
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    }
    
    #who_answers svg {
    width: .6rem;
    padding-right: 2px;
    }
    
    .who_answers svg {
    color: #6699cc;
    margin: 0;
    width: .6rem;
    padding-right: 2px;
    }
  
    header .number-wrapper .who_answers {
    margin-top: 8px;
    }
    
    .cta-line {
    text-align: center;
    margin: 0 auto 1rem;
    }
  
    #call-cta {
    text-align: center;
    }
    
    #cta-fixed .who_answers svg {
    background: none;
    margin: 0;
    }
    
    #ads .who_answers svg {
      position: relative;
      margin-left: 43%;
    }
   
    /* ========== END ========== */