Hello Yii Friends
I have done creating pdf in yii framework. When I export a pdf than i can perfectly create pdf in chrome,firefox but i having problem that it takes enough time to create pdf in safari specially in window 7 but again it works good in Mac safari. What can cause such problem in window safari browser. If any have previously solve this problem please let me know or anyone have idea regarding can please share with me.
Thanks in Advance
Sundar
Hi my friend
do you use extension to generate pdf ? how create your pdf? give an example
thank you for the reply
I have used the following mpdf pdf generator.
this is the code of javascript on onclik for link to export pdf
<script type="text/javascript">
function download_pdf()
{
$('#user_note_area').css('width',680);
$('form input').remove();
var total_content = $('#user_note_area section').length+1;
var content = '';
var content_height = 0;
var max_height = 850;
var index = 0;
content_height += $('.logo').outerHeight();
content_height += $('#report_detail').outerHeight();
content += '<section class="content-box" style="margin-top: 10px;">'+ $('#report_detail').html() + '</section>';
for(c=1; c<= total_content; c++)
{
//alert('child num'+i+' = '+ $('#user_note_area section:nth-child('+i+')').outerHeight());
content_height += $('#user_note_area section:nth-child('+c+')').outerHeight();
var next_content_height = $('#user_note_area section:nth-child('+(c+1)+')').outerHeight();
if(content_height + next_content_height > max_height || c == total_content)
{
$('form').append('<input type="hidden" name="content'+ index +'" value="">');
$('form input:eq('+ index +')').val(content);
index++;
content_height = 0;
content = '';
}
if($('#user_note_area section:nth-child('+c+')').hasClass('edition-year'))
{
content += '<section class="edition-year">'+ $('#user_note_area section:nth-child('+c+')').html() + '</section>';
}
else if($('#user_note_area section:nth-child('+c+')').hasClass('content-box'))
{
content += '<section class="content-box">'+ $('#user_note_area section:nth-child('+c+')').html() + '</section>';
}
else
{
content += '<section>'+ $('#user_note_area section:nth-child('+c+')').html() + '</section>';
}
}
$('#user_note_area').css('width','');
$('form').submit();
}
</script>
<form method=“post” action="<?php echo Yii::app()->getBaseUrl().’/site/download_note’; ?>">
</form>
this is the code in controller
require_once(Yii::app()->basePath . '/extensions/pdf_generator/mpdf.php');
$mpdf = new mPDF('c', 'A4');
// LOAD a stylesheet
$stylesheet = file_get_contents(Yii::app()->basePath . '/extensions/pdf_generator/print_note.css');
//$stylesheet = file_get_contents('css/theme/css.css');
$mpdf->WriteHTML($stylesheet, 1);
//$mpdf->SetHeader('Document Title');
//$mpdf->setFooter(date("Y-m-d").'|NFPA 101 Code Compare|{PAGENO}');
$current_user = Setting::model()->findByAttributes(array('user_id' => Yii::app()->user->id));
$footer_note = 'User note report from 101 Quick Compare Page {PAGENO} printed on ' . date("m/d/Y") . ' for (' . $current_user->username . '). View disclaimer information at www.nfpa.org';
$mpdf->setFooter($footer_note);
$mpdf->SetDisplayMode('fullpage');
$mpdf->WriteHTML('<img src="' . Yii::app()->request->baseUrl . '/images/theme/logo1.png">');
$total_page = count($_POST);
$i = 1;
foreach ($_POST as $page_content)
{
$mpdf->WriteHTML($page_content);
$i++;
if ($i <= $total_page)
{
$mpdf->AddPage();
}
}
//$mpdf->Output();
// $mpdf->Output('My_101codecompare_notes.pdf','F'); //save file in server
$mpdf->Output('My_101codecompare_notes.pdf', 'I');
exit;
as well as i have used the following css
@charset "utf-8";
/* CSS Document */
/* ------------------------ Reset ------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* ------------------------ Html tags ------------------------*/
html {-webkit-text-size-adjust: none;}
body{
margin:0;
padding:0;
background:#FFF;
color:#303030;
font:normal 12px/20px Arial, Helvetica, sans-serif;
}
h1,h2,h3,h4,h5,h6{
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-weight:bold;
color:#303030;
}
h1{font-size:22px;}
h2{font-size:20px; color:#FFF;}
h3{font-size:16px;}
h4{font-size:15px;}
h5{font-size:13px;}
p{
color:#303030;
font:normal 12px/18px Arial, Helvetica, sans-serif;
}
em{font-weight:bold}
a{
font-family:Arial, Helvetica, sans-serif;
color:#303030;
text-decoration:none;
outline:none
}
a:hover{text-decoration:none;}
sup {
vertical-align: super;
font-size: smaller; }
input{outline:none !important}
input[type=‘text’],input[type=‘password’],textarea{
background:#FFF;
box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
-moz-box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
-o-box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
-webkit-box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
padding:0 5px;
border:1px solid #a9a9a9;
height:30px;
border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
-webkit-border-radius:5px;
font:normal 12px Arial, Helvetica, sans-serif;
}
textarea{}
textarea#email {
height: 150px;
width: 100%;
}
/* ------------------------ Alignment & Clear ------------------------*/
.fleft{float:left}
.fright{float:right}
.fnone{float:none !important}
.clrleft{clear:left}
.clrright{clear:right}
.clrboth{clear:both}
.last{margin-right:0 !important}
.underline{text-decoration: underline}
.mr-20{margin-right:10px !important}
.mb-20{margin-bottom:20px !important}
/* ------------------------ Aside Edition ------------------------*/
.margin-right-one{margin-right:10px;}
.margin-right-two{margin-right:20px;}
.margin-bottom-one{margin-bottom:10px !important;}
.margin-bottom-two{margin-bottom:20px}
.margin-top-one{margin-top:10px ;}
.margin-left-one{margin-left:70px;}
.heading-red{color:red; margin-bottom:10px;}
.height-one{min-height:60px;}
.height-two{height:60px !important;}
.border-style-one{border-top:2px solid #000; overflow:hidden}
.underline{text-decoration: underline}
.width-one{width:75px;}
.text-black{color:#303030; margin-bottom:10px}
/* ------------------------ Pagewrap ------------------------*/
.page_wrap{
max-width:100%;
padding:0 2%;
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
margin:0 auto;
position:relative;
overflow:hidden
}
/* ------------------------ Top Header ------------------------*/
.head_top{
background:#1d1d1d;
height:40px;
}
.head_top h2{color:#FFF}
/* ------------------------ Left Tool and Right Tool ------------------------*/
ul.left_tool, ul.right_tool{
margin:0;
padding:0;
list-style:none
}
ul.left_tool li, ul.right_tool li{
float:left;
display:inline-block;
padding:6px;
margin-right:10px;
}
ul.left_tool li:last-child, ul.right_tool li:last-child{margin-right:0; padding-top:10px}
ul.left_tool li a span, ul.right_tool li a span{
background:url(../../images/theme/sprites.png) no-repeat;
width:30px;
height:30px;
display:inline-block;
text-indent:-999999px;
}
ul.left_tool li a span.home{
background-position: 0 0;
float: left;
margin-top: -4px !important}
ul.left_tool li a span.home:hover{background-position:0 -30px}
ul.left_tool li a span.back{background-position:-90px 0; width:52px;}
ul.left_tool li a span.back:hover{background-position:-90px -30px}
ul.right_tool li a span.setting{background-position:-30px 0}
ul.right_tool li a span.setting:hover{background-position:-30px -30px}
ul.right_tool li a span.help{background-position:-60px 0}
ul.right_tool li a span.help:hover{background-position:-60px -30px}
ul.right_tool li a.notification{
background: #ffffff;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNmU2ZTYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffffff 0%, #e6e6e6 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e6e6e6));
background: -webkit-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
background: -o-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
background: linear-gradient(to bottom, #ffffff 0%,#e6e6e6 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e6e6e6',GradientType=0 );*/
box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-o-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-ms-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
border:1px solid #a9a9a9;
width:24px;
height: 24px;
display:block;
margin-top:3px;
border-radius:50% 50% 50% 50%;
-moz-border-radius:50% 50% 50% 50%;
-o-border-radius:50% 50% 50% 50%;
-webkit-border-radius:50% 50% 50% 50%;
text-align:center;
font-size:14px;
margin-top:2px;
font-weight:bold;
color:#000;
text-shadow:1px 1px 0 #FFF;
}
/* ------------------------ Logo Banner ------------------------*/
a.logo{
background:url(../../images/theme/logo-bg.jpg) repeat-x;
height:81px;margin: 20px auto;width: 100%; display:block
}
a.logo img{
/*background:url(../../images/theme/logo1.png) no-repeat;*/
overflow: hidden;
text-indent: -99999px;
}
/* ------------------------ Buttons styles ------------------------*/
.control_button, a.control_button, .show-hide, .blackbtn{
background: #45494d;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzQ1NDk0ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #45494d 1%, #000000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#45494d), color-stop(100%,#000000));
background: -webkit-linear-gradient(top, #45494d 1%,#000000 100%);
background: -o-linear-gradient(top, #45494d 1%,#000000 100%);
background-image: -ms-linear-gradient(top, #45494d 1%,#000000 100%);
background: linear-gradient(to bottom, #45494d 1%,#000000 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45494d', endColorstr='#000000',GradientType=0 );*/
color:#FFF;
border:1px solid #000;
border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
-webkit-border-radius:5px;
-ms-border-radius:5px;
padding:5px 8px;
font-weight:bold;
overflow:hidden
/*margin-right:5px;*/
}
.control_button a{color:#FFF}
.control_button a:hover{color:#303030 !important}
.blackbtn:hover .control_button:hover, section.search_bar a.search:hover, ul.show-hide li:hover a, #advanced_search_btn:hover, .control_button:hover {
background: #ffffff;
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNmU2ZTYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffffff 1%, #e6e6e6 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#ffffff), color-stop(100%,#e6e6e6));
background: -webkit-linear-gradient(top, #ffffff 1%,#e6e6e6 100%);
background: -o-linear-gradient(top, #ffffff 1%,#e6e6e6 100%);
background: -ms-linear-gradient(top, #ffffff 1%,#e6e6e6 100%);
background: linear-gradient(to bottom, #ffffff 1%,#e6e6e6 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e6e6e6',GradientType=0 );*/
box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-o-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
-ms-box-shadow:inset 0 1px 1px rgba(0,0,0,0.78);
border:1px solid #a9a9a9;
color:#000
}
#advanced_search_btn:hover{text-decoration:none !important}
a.control_button span.plus{
border-left:1px solid #000;
font:bold 19px "Arial Black", Gadget, sans-serif;
color:#FFF;
padding-left:8px;
margin-left:5px;
position:relative;
top:3px;
}
a.control_button:hover span.plus{
color:#000;
border-left: 1px solid #CCC
}
ul.show-hide{
float:right;
width:100px;
height:30px;
padding:0 !important
}
ul.show-hide li a{
color:#FFF;
width:50px;
margin:0 !important;
float:left;
text-align:center
}
ul.show-hide li:hover a{border:none !important;}
.conrtoller_right{float:right; width:100px;}
/* ------------------------ Aside Edition ------------------------*/
aside.edition{
float:left;
width:250px;
height:auto;
margin-top:27px;
}
/* ------------------------ Article Details ------------------------*/
article.details{width:690px; margin-bottom:20px}
/* ------------------------ Search Bar ------------------------*/
section.search_bar{
float:left;
width:275px;
margin-top:25px;
margin-bottom:20px;
}
section.search_bar input.search{
background: url(../../images/theme/sprites.png) no-repeat -143px -4px;
display:block;
width:30px;
height:25px;
text-indent:-999999px;
color:#FFF;
border:1px solid #000;
border-radius:5px 0 0 5px;
-moz-border-radius:5px 0 0 5px;
-o-border-radius:5px 0 0 5px;
-webkit-border-radius:5px 0 0 5px;
cursor:pointer;
float:left
}
section.search_bar input.search{
background-color: #45494d;
}
section.search_bar a.search span.search_icon:hover{background:url(../images/sprites.png) no-repeat -143px -30px; }
section.search_bar input[type="text"]{
height:25px;
border:1px solid #c7c7c7;
padding-left:5px;
width:235px;
border-radius:0 5px 5px 0;
-moz-border-radius:0 5px 5px 0;
-o-border-radius:0 5px 5px 0;
-webkit-border-radius:0 5px 5px 0;
}
/* ------------------------ Select Drop Down ------------------------*/
.filter.fright {width: 40%;}
.filter h4{text-align:center; margin-bottom:5px;}
.sbHolder, .sbOptions{
background-color: #FFF;
border:1px solid #c7c7c7;
outline:none;
height: 25px;
position: relative;
width: 355px;
font:bold 12px/25px Arial, Helvetica, sans-serif;
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
-webkit-border-radius:5px;
box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
-moz-box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
-o-box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
-webkit-box-shadow:inset 0 0 10px rgba(0,0,0,0.18);
}
.sbHolder:focus .sbSelector{}
.sbSelector{
display: block;
height: 25px;
left: 0;
outline: none;
overflow: hidden;
position: absolute;
text-indent: 10px;
top: 0;
width: 310px;
}
.sbSelector:link, .sbSelector:visited, .sbSelector:hover{
color:rbga(0,0,0,0.5);
outline: none;
text-decoration: none;
}
.sbToggle{
background: url(../../images/theme/sprites.png) -172px 0 no-repeat;
display: block;
height: 30px;
outline: none;
position: absolute;
right: 0;
top: -4px;
width: 30px;
}
.sbToggle:hover{
background: url(../../images/theme/sprites.png) -203px 0 no-repeat;
}
.sbToggleOpen{
background: url(../../images/theme/sprites.png) -172px -30px no-repeat;
}
.sbToggleOpen:hover{
background:url(../images/sprites.png) -203px -30px no-repeat;
}
.sbHolderDisabled{
background-color: #3C3C3C;
border: solid 1px #515151;
}
.sbHolderDisabled .sbHolder{}
.sbHolderDisabled .sbToggle{}
.sbOptions{
height:auto !important;
list-style: none;
left: -1px;
margin: 0;
padding: 0;
position: absolute !important;
top: 30px;
width: 200px;
z-index: 1;
overflow-y: auto;
overflow-x:none;
width:355px;
overflow:hidden
}
.sbOptions li{
text-indent:5px;
border-bottom: 1px solid #EEE;
border-top: 1px solid #CCC;
}
.sbOptions a.sbFocus{
background: #45494d;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ1NDk0ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #45494d 0%, #000000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#45494d), color-stop(100%,#000000));
background: -webkit-linear-gradient(top, #45494d 0%,#000000 100%);
background: -o-linear-gradient(top, #45494d 0%,#000000 100%);
background: -ms-linear-gradient(top, #45494d 0%,#000000 100%);
background: linear-gradient(to bottom, #45494d 0%,#000000 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45494d', endColorstr='#000000',GradientType=0 );*/
color:#FFF;
width:100%;
}
.sbOptions li:first-child{border-top:none}
.sbOptions li:last-child{border-bottom:none}
.sbOptions a{
display: block;
outline: none;
padding: 1px 3px;
}
.sbOptions a:link, .sbOptions a:visited{ text-decoration: none;}
.sbOptions a:hover,
.sbOptions a:focus,
.sbOptions li.last a{
border-bottom: none;
}
.sbOptions .sbDisabled{
border-bottom: dotted 1px #515151;
color: #999;
display: block;
padding: 7px 0 7px 3px;
}
.sbOptions .sbGroup{
border-bottom: dotted 1px #515151;
color: #EBB52D;
display: block;
font-weight: bold;
padding: 7px 0 7px 3px;
}
.sbOptions .sbSub{
padding-left: 17px;
}
/* ------------------------ Content Box ------------------------*/
.content-box{
width:100%;
padding:5px 10px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
border:1px solid #a9a9a9;
margin-bottom:10px;
overflow:hidden
}
.content-box p{margin-bottom:10px;}
.content-box p:last-child {margin-bottom: 0}
.content-box a{font-weight:bold; margin-right:20px; cursor:pointer}
.content-box a:hover{color:#09C; text-decoration:underline}
.content-box a.link-blue{color:#09C; text-decoration:underline; margin-right:0}
.content-box a.link-blue:hover{text-decoration:none}
/* ------------------------ Edition year ------------------------*/
ul.edition-year{clear:both}
ul.edition-year li:last-child{margin-right:0}
.edition-year p{margin-bottom:10px; text-align: start;}
.edition-year h1{margin-bottom:5px; text-align:center;}
.edition-year h5{margin-bottom:5px;}
.green, .gray{
overflow-y:auto;
border:1px solid #a9a9a9;
padding:5px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
.green_print, .gray_print{
border:1px solid #a9a9a9;
padding:10px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
width: 400px;
}
.edition-year tr { width: 100%;}
.green, .green_print{background:#deffda;}
.gray, .gray_print{background:#eeeeee;}
.red{background:#fef2e7; margin-bottom:10px;}
.marginCustom{margin-bottom: 14px; margin-top: -15px;}
/* ------------------------ Edition year ------------------------*/
.browse{position:relative; top:29px}
#tabs{
overflow: hidden;
margin:24px 0 0 0;
padding: 0;
list-style: none;
float:right;
width:33%;
background: #ffffff;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNmU2ZTYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #ffffff 0%, #e6e6e6 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e6e6e6));
background: -webkit-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
background: -o-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
background: -ms-linear-gradient(top, #ffffff 0%,#e6e6e6 100%);
background: linear-gradient(to bottom, #ffffff 0%,#e6e6e6 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e6e6e6',GradientType=0 );*/
border:1px solid #a9a9a9;
border-radius:5px 5px 0 0
}
#tabs li a{
float: right;
margin:0;
width:50%;
text-align:center;
position: relative;
text-align:center;
text-decoration: none;
font-size:15px;
color: #303030;
font-weight:bold !important;
text-shadow: 0 1px 0 rgba(255,255,255,.<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/cool.gif' class='bbc_emoticon' alt='8)' />;
}
#tabs li a:hover, #tabs #current a{
background: #357030;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM1NzAzMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzODc1MzMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #357030 0%, #387533 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#357030), color-stop(100%,#387533));
background: -webkit-linear-gradient(top, #357030 0%,#387533 100%);
background: -o-linear-gradient(top, #357030 0%,#387533 100%);
background: -ms-linear-gradient(top, #357030 0%,#387533 100%);
background: linear-gradient(to bottom, #357030 0%,#387533 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#357030', endColorstr='#387533',GradientType=0 );*/
color:#FFF}
#tabs a:focus{outline: 0;}
#tabs a::after{
content:'';
position:absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
width: 1em;
}
#tabs #current a::after{z-index: 3;}
#content{
background: #fff;
height: auto;
position: relative;
z-index: 2;
border:1px solid #a9a9a9;
clear:both
}
.treeview, .treeview ul {
padding: 0;
margin: 0;
list-style: none;
}
.treeview ul { background: #a7a9ac; color:#000;}
.treeview li {
margin: 0;
padding: 0 10px;
}
.treeview a.selected {background-color: #eee;}
#treecontrol { margin: 1em 0; display: none; }
.treeview .hover { cursor: pointer; }
.filetree li { padding:0; font-size:11px;}
.filetree span.folder, .filetree span.file, .filetree span.file_1, .filetree .root span.chapter, .filetree li.folder span, .filetree li.file span { padding: 0 10px; display: block; }
.filetree span.folder/*, .filetree span.file */, #tab1 a, #tab2 a, .filetree .root span.chapter{
border-bottom:1px solid #FFF;
background: #4c9e45;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRjOWU0NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0YzllNDUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #4c9e45 0%, #4c9e45 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4c9e45), color-stop(100%,#4c9e45));
background: -webkit-linear-gradient(top, #4c9e45 0%,#4c9e45 100%);
background: -o-linear-gradient(top, #4c9e45 0%,#4c9e45 100%);
background: -ms-linear-gradient(top, #4c9e45 0%,#4c9e45 100%);
background: linear-gradient(to bottom, #4c9e45 0%,#4c9e45 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c9e45', endColorstr='#4c9e45',GradientType=0 );*/
color: #FFFFFF;
height: 30px;
font:bold 12px/30px Arial, Helvetica, sans-serif;
cursor:pointer
}
.filetree span.folder:hover, .filetree span.file:hover, .filetree span.file_1:hover, .filetree span.file_2:hover, .active, .treeview .hover, .filetree .root span.chapter:hover, .filetree li.folder span:hover, .filetree li.file span:hover{
background: #a9db80;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E5ZGI4MCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5NmM1NmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #a9db80 0%, #96c56f 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a9db80), color-stop(100%,#96c56f));
background: -webkit-linear-gradient(top, #a9db80 0%,#96c56f 100%);
background: -o-linear-gradient(top, #a9db80 0%,#96c56f 100%);
background: -ms-linear-gradient(top, #a9db80 0%,#96c56f 100%);
background: linear-gradient(to bottom, #a9db80 0%,#96c56f 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=0 );*/
color:#000
}
#tab1 a, #tab2 a{padding:0 10px; display:block}
.filetree li.expandable span.folder { border-bottom:1px solid #FFF}
.filetree span.file {
color: #000;
font-size:11px !important;
font-weight:bold;
cursor:pointer
}
li.folder span{
display:block;
font:bold 11px/30px Arial, Helvetica, sans-serif !important;
color:#000;
cursor:pointer
}
li.file span{
display:block;
font:11px/30px Arial, Helvetica, sans-serif !important;
color:#000;
cursor:pointer
}
.file_1{font-size:11px !important}
.filetree span.file_2{
display:block;
font:bold 11px/30px Arial, Helvetica, sans-serif;
cursor:pointer
}
.file_2 a{padding-left:10px;}
.file_2 a:hover {
background: #a9db80;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E5ZGI4MCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5NmM1NmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #a9db80 0%, #96c56f 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a9db80), color-stop(100%,#96c56f));
background: -webkit-linear-gradient(top, #a9db80 0%,#96c56f 100%);
background: -o-linear-gradient(top, #a9db80 0%,#96c56f 100%);
background: -ms-linear-gradient(top, #a9db80 0%,#96c56f 100%);
background: linear-gradient(to bottom, #a9db80 0%,#96c56f 100%);
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=0 );*/
color:#000;
display:block
}
.active {color: #000 !important;}
.file-1{display: block;}
/* ------------------------ Login ------------------------*/
section.login{
width:475px;
margin:0 auto;
}
section.login h2{
color:#303030;
text-align:center
}
section.login h4{text-align: center}
form.login_form{
margin:20px auto;
width:315px;
}
form.login_form h4{text-align:center; margin-bottom:10px;}
form.login_form p, form.user-setting p{margin-bottom:10px; display:block}
form.login_form p a.control_button{color:#FFF; text-decoration:none}
form.login_form p a.control_button:after{margin:0 !important}
form.login_form p a.control_button:hover{color:#000;}
form.login_form p a{
text-decoration:underline;
color:#09C;
margin-right:10px;
font-weight:bold;
}
/*form.login_form p a:after{
content:"|";
margin-left:10px;
color:#000;
text-decoration:none !important;
}
form.login_form p a:last-child:after{content:""}*/
form.login_form p a:hover{color:#000}
form.login_form p label, form.user-setting p label{
float:left;
width:75px;
}
form.login_form p input[type="text"],form.login_form p input[type='password'], form.user-setting p input[type='text'], form.user-setting p input[type='password']{width:72%}
form.user-setting p span{font-style:italic}
form.user-setting p span.theme-1, form.user-setting p span.theme-2, form.user-setting p span.theme-3, form.user-setting p span.theme-4, form.user-setting p span.theme-5{
width:24px;
height:24px;
display:inline-block;
border:2px solid #000;
margin-right:5px;
text-indent:-999999px;
box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
position:relative;
cursor:pointer
}
form.user-setting p span.theme-1{background:#cc0000}
form.user-setting p span.theme-2{background:#ff9900}
form.user-setting p span.theme-3{background:#ffff00}
form.user-setting p span.theme-4{background:#009e0f}
form.user-setting p span.theme-5{background:#2b78e4}
form.user-setting p span strong.arrow{
background:url(../images/arrow.png) no-repeat;
width:12px;
height:9px;
display:block;
position:absolute;
top:16px;
right:0
}
/* ------------------------ Reveal Modal ------------------------*/
.reveal-modal-bg, .reveal-modal-1-bg .reveal-bg{
position: fixed;
height: 100%;
width: 100%;
background: #000;
background: rgba(0,0,0,.6);
z-index: 100;
display: none;
top: 0;
left: 0;
}
.reveal-modal{
/*top: auto !important; */
left: 9%;
width: 800px;
}
.reveal-modal-1{
width:300px;
top:auto !important;
left: 30% ;
}
.reveal-modal, .reveal-modal-1 {
visibility: hidden;
background: #eee;
margin-left: 0px;
padding: 20px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
box-shadow: 0 0 10px rgba(0,0,0,.4);
-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
position: absolute;
z-index: 101;
border:2px solid #a9a9a9;
}
.reveal-modal .close-reveal-modal {cursor: pointer;}
ul.nfpa_section{margin-bottom:20px;}
ul.nfpa_section li {
display:inline-block;
margin-right:10px;
font-weight:bold;
font-size:12px;
}
ul.nfpa_section li a{color:#09C; text-decoration:underline}
ul.nfpa_section li a.active{color:#303030; text-decoration:none}
ul.nfpa_section li:after{
content:">";
font-weight:bold;
text-decoration:none !important;
color:#303030;
margin-left:10px;
}
ul.nfpa_section li:last-child:after{content:""}
.popup-grid{margin-bottom:20px;}
.popup-grid .content-box {width: 85.5%;}
.popup-grid h3{margin-bottom:10px;}
.conrtoller_right .control_button{float:right}
#section_information div, #section_information h1 {margin-bottom: 10px;}
#LoginForm_username_em_, #LoginForm_password_em_{color: red;
font-size: 11px;
margin-left: 78px;
margin-top: -8px;}
em.font-italic{font-weight:normal; font-style:italic}
span.highlight{border:2px solid #FFFF00;}
span.highlight_important{border:2px solid #FFFF00;}
#example {
}
#example header.tia hgroup h2 {
color: #303030;
}
#example strong, #example aside strong p {
font-weight: bold;
}
#example em {
font-style: italic;
font-weight: normal;
}
#example p {
margin-bottom: 5px;
}
.underline {
text-decoration: underline;
}
.stroke {
text-decoration: line-through;
}
blockquote {
text-indent: 20px;
}
#example footer.tia p {
margin-bottom: 0;
}
.border-right {
border-right: 1px solid #000000;
padding: 5px;
}
.mr-19{margin-right:19px !important;}
.mr-0{margin-right:0 !important}
label.term{
font-size:14px;
font-weight:bold;
margin-right:10px;
}
.content-box input[type=‘text’]{width:300px; margin-right:5px;}
#section_information > h3 {margin-bottom: 10px;}
#section_information {
float: left;
}
.note_des {
margin-bottom: 0 !important;
}
.clrboth.content-box.note {
margin-bottom: 5px;
}
button.export-pdf{
background:url(../../images/theme/pdf_download.png) no-repeat;
width:24px;
height:27px;
display:block;
float:right;
position: relative; top:0px;
border:none;
outline:none;
cursor:pointer;
margin-bottom:5px;
}
@media screen and (min-width:700px) and (max-width:768px){
/*.page_wrap{width:720px;}
article.details{width:455px}
section.search_bar{width:160px;}
section.search_bar input[type="text"]{width:125px;}
.sbHolder, .sbOptions{width:285px;}
.sbOptions li a{font-size:10px}
.sbSelector{font-size:9px; text-indent:5px;}
ul.edition-year li{width:48.9%}
.reveal-modal{
left: 1%;
top: 190px !important;
width: 705px;}
.conrtoller_right{width:90px;}*/
}
@media screen and (min-width:769px) and (max-width:1024px){}
.displayBlock{display: block !important;}
.displayNone{display: none !important;}
.strikeTrough{text-decoration: line-through;}
table.head {
border-collapse: collapse;
border-spacing: 0;
font-size: 18px;
font-weight: bold;
text-align: center;
width: 100%;
}
table.note_created{
width: 100%;
font-size: 12px;
}
table.note_created td.date{
text-align: right;
width: 200px;
}
.loading {
float: left;
height: 50px;
margin-bottom: 5px;
overflow: hidden;
position: relative;
top: 11px;
width: 163px;
}
.loading img {
left: -4px;
position: relative;
top: 10px;
}
strong {
font-weight: bold;
}
.opened
{
display: block;
}
.closed
{
display: none;
}
.edition-year p{
border-collapse: collapse;
border-spacing: 0;
text-align:justify;
}
.edition_desc{
font-size: 12px !important;
width: 50%;
}
.content-box
{
font-size: 12px !important;
}