Commit bac2b7df authored by Олег Гиммельшпах's avatar Олег Гиммельшпах

Merge branch 'master' of git.task-on.com:ktask/taskoncom

parents 717b4b6f 5d025f3a
......@@ -21,7 +21,9 @@ $(function() {
selector: "textarea",
theme: "modern",
language: "ru",
schema: "html5",
custom_elements: "emstart,emend,header,main,span",
valid_children: '+a[div]',
extended_valid_elements: "span[id|name|class|style],i[id|name|class|style],ul[id|name|class|style],li[id|name|class|style],script[type|src],style",
height: '350px',
menubar: "edit insert view format table tools",
......
......@@ -41,7 +41,7 @@ class AppAsset extends AssetBundle
'/js/add_06.06.16.js',
'/js/modernizr.js',
'/js/common.js',
'js/case-api.js'
'js/cases.js'
];
public $depends = [
'yii\web\YiiAsset',
......
......@@ -2,6 +2,7 @@
return [
'About' => 'О компании',
'Portfolio' => 'Кейсы',
'Business solutions' => 'Решения для бизнеса',
'Blog' => 'Блог',
'Contacts' => 'Контакты',
'Analytics school' => 'Школа аналитики',
......
......@@ -12,10 +12,9 @@ use common\modules\languages\widgets\Languages;
<ul>
<li><?=Html::a(\Yii::t('menu', 'About'), ['/about']);?></li>
<li><?=Html::a(\Yii::t('menu', 'Portfolio'), ['/portfolio']);?></li>
<li><?=Html::a(Yii::t('menu', 'Business solutions'), ['/business-cases']);?></li>
<li><?=Html::a(\Yii::t('menu', 'Blog'), ['/blog']);?></li>
<!-- <li><?=Html::a(\Yii::t('menu', 'Analytics school'), ['/school']);?></li> -->
<li><?=Html::a(\Yii::t('menu', 'Contacts'), ['/contacts']);?></li>
<!-- <li>--><?//=Html::a(\Yii::t('menu', 'Faq'), ['/faq']);?><!--</li>-->
</ul>
</nav>
......@@ -32,11 +31,9 @@ use common\modules\languages\widgets\Languages;
<ul>
<li><?=Html::a(\Yii::t('menu', 'About'), ['/about']);?></li>
<li><?=Html::a(\Yii::t('menu', 'Portfolio'), ['/portfolio']);?></li>
<li><?=Html::a('Решения для бизнеса', ['/business-cases']);?></li>
<li><?=Html::a(Yii::t('menu', 'Business solutions'), ['/business-cases']);?></li>
<li><?=Html::a(\Yii::t('menu', 'Blog'), ['/blog']);?></li>
<!-- <li><?=Html::a(\Yii::t('menu', 'Analytics school'), ['/school']);?></li> -->
<li><?=Html::a(\Yii::t('menu', 'Contacts'), ['/contacts']);?></li>
<!-- <li>--><?//=Html::a(\Yii::t('menu', 'Faq'), ['/faq']);?><!--</li>-->
</ul>
</nav>
<?= Languages::widget();?>
......
......@@ -1836,6 +1836,12 @@ a.keys_test_btn {
display: block;
}
.keys_block_small.keys_block_small--auto {
display: block;
width: auto;
height: auto;
}
.attachment-button {
display: inline-block;
cursor: pointer;
......@@ -3503,6 +3509,10 @@ ul.list {
padding-left: 40px;
}
ul.list li {
margin-bottom: 5px;
}
.category-preloader {
display: none;
float: right;
......@@ -3621,6 +3631,125 @@ h3.block-chain-header {
z-index: 3;
}
.case-block {
margin-bottom: 50px;
}
.case-block h2 {
margin-bottom: 30px;
}
.dek_how_works {
margin-bottom: -120px;
}
@media only screen and (max-width: 991px) {
.dek_how_works {
margin-bottom: -80px;
}
}
.case {
height: 160px;
position: relative;
display: block;
margin-bottom: 20px;
box-shadow: 0 0 18px rgba(0,1,3,.26);
}
.case--crypto {
background: url("../images/crypto_case.png") no-repeat center;
background-size: cover;
}
.case--lizing {
background: url("../images/lizing_case.png") no-repeat center;
background-size: cover;
}
.case--lizing-ai {
background: url("../images/lizing_ai_case.png") no-repeat center;
background-size: cover;
}
.case:hover .case__footer {
background: #fff;
}
.case:hover .case-footer-title {
color: #2d3642;
}
.case:hover .case-details {
color: #4b78bb;
border: 2px solid #4b78bb;
}
.case .case-footer-title {
margin: 20px 0 0 20px;
color: #fff;
font-size: 20px;
line-height: 1.1;
font-family: "RobotoBold";
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
-ms-transition: all .2s linear;
transition: all .2s linear;
}
.case-details {
margin: 20px 20px 0 0;
display: none;
float: right;
color: #fff;
font-size: 16px;
padding: 0 10px;
border: 2px solid #fff;
text-align: center;
line-height: 27px;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
-o-border-radius: 50px;
-ms-border-radius: 50px;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
-ms-transition: all .2s linear;
transition: all .2s linear;
}
.case:hover .case-details:after {
background: url(../images/icon/keys_small_btn_more-hover.png) no-repeat;
}
.case-details:after {
content: "";
background: url(../images/icon/keys_small_btn_more.png) no-repeat;
width: 8px;
height: 17px;
display: inline-block;
vertical-align: middle;
margin-left: 15px;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
-ms-transition: all .2s linear;
transition: all .2s linear;
}
.case__footer {
width: 100%;
height: 70px;
position: absolute;
bottom: 0;
left: 0;
background: rgba(36,51,64,.56);
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
-ms-transition: all .2s linear;
transition: all .2s linear;
}
@media only screen and (max-width: 1600px) and (min-width: 1301px){
......@@ -3653,7 +3782,6 @@ h3.block-chain-header {
}
}
@media only screen and (max-width: 767px){
.blockchain_title_logo{
margin-bottom: 0;
}
......@@ -3671,8 +3799,16 @@ h3.block-chain-header {
@media only screen and (min-width: 768px) {
.case-details {
display: block;
}
.case .case-footer-title {
font-size: 24px;
line-height: 33px;
}
.block-chain {
background: url(/images/block_chain.png) no-repeat left top;
background: url(../images/block_chain.png) no-repeat left top;
}
.block-chain-item {
......
......@@ -140,19 +140,28 @@ u {
padding-left: 90px;
}
.benefit-item.benefit-icon-1 {
background: url(/images/benefit_icon_1.png) no-repeat 10px top;
background: url(../images/benefit_icon_1.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-2 {
background: url(/images/benefit_icon_2.png) no-repeat 10px top;
background: url(../images/benefit_icon_2.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-3 {
background: url(/images/benefit_icon_3.png) no-repeat 10px top;
background: url(../images/benefit_icon_3.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-4 {
background: url(/images/benefit_icon_4.png) no-repeat 10px top;
background: url(../images/benefit_icon_4.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-5 {
background: url(/images/benefit_icon_5.png) no-repeat 10px top;
background: url(../images/benefit_icon_5.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-bank {
background: url(../images/benefit_bank.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-finance {
background: url(../images/benefit_finance.png) no-repeat 10px top;
}
.benefit-item.benefit-icon-micro-finance {
background: url(../images/benefit_micro_finance.png) no-repeat 10px top;
}
}
......@@ -256,7 +265,7 @@ a.logo {
font-size: 15px;
display: block;
float: left;
padding: 0px 8px;
padding: 0px 7px;
height: 38px;
line-height: 34px;
border: 2px solid transparent;
......@@ -11069,6 +11078,16 @@ h6 {
-ms-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.keys_small_btn_more.keys_small_btn_more--right {
float: right;
margin-left: 0;
margin-right: 23px;
}
.keys_block_small:hover .keys_small_foot .keys_small_title, .keys_block_big:hover .keys_small_foot .keys_small_title {
color: #2d3642;
}
.keys_block_small .keys_small_btn_more:hover, .keys_block_small .keys_small_btn_more:focus {
text-decoration: none;
}
......
......@@ -98,7 +98,7 @@
left: 0;
width: 100%;
height: 370px;
background: url(/img/new_figure.png) no-repeat;
background: url(../img/new_figure.png) no-repeat;
background-size: cover;
background-position: center;
}
......
......@@ -1564,4 +1564,1214 @@
background-size: 100% 50px;
height: 50px;
}
}
.keys_dek_top{
width: 100%;
min-height: 444px;
background: #60AD26 url(../img/dek_bg.png) no-repeat bottom center;
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
padding-top: 53px;
position: relative;
}
.dek_title_wrap{
color: #2d323a;
}
.keys_dek_top h1{
font-size: 36px;
line-height: 40px;
font-weight: bold;
color: #2d323a;
margin-bottom: 20px;
}
.keys_dek_top h1 span{
color: #006547;
}
.dek_title_wrap p{
font-size: 20px;
line-height: 24px;
margin-bottom: 35px;
}
.dek_title_list{
margin-bottom: 50px;
}
.dek_title_list li{
font-size: 16px;
line-height: 18px;
display: flex;
align-items: center;
}
.dek_title_list li:not(:last-child){
margin-bottom: 15px;
}
.dek_title_list span{
margin-right: 15px;
}
.dek_title_logo{
margin-bottom: 40px;
}
.dek_title_logo p{
font-size: 16px;
line-height: 18px;
color: #2d323a;
margin-bottom: 10px;
}
.dek_title_wrap .toggle_bottom{
position: static;
margin-top: 0;
color: #2d323a;
border-color: #2d323a;
}
.dek_title_wrap .icon-arrowDown2::after{
background: url(../images/icon/arrow_down_black.png) no-repeat;
}
.dek_title_wrap .toggle_bottom:hover{
background-color: #2d323a;
color: #fff;
}
.dek_title_wrap .toggle_bottom:hover .icon-arrowDown2::after{
background: url(../images/green/arrow_down2.png) no-repeat;
}
.dek_par{
margin-left: -295px;
/* margin-top: 90px; */
background: url(../img/dek_mokup.png) no-repeat center center !important;
max-width: 620px;
height: 415px;
top: 0 !important;
left: 10px;
position: relative;
z-index: 3;
}
.dek_mock_wrap{
margin-left: -295px;
max-width: 510px;
height: 415px;
top: 0 !important;
left: 10px;
position: relative;
z-index: 3;
}
.dek_mock1{
width: 419px;
height: 272px;
position: absolute;
bottom: 0;
left: 0;
background: url(../img/dek_m1.png) no-repeat center center;
z-index: 3;
}
.dek_mock2{
width: 420px;
height: 266px;
position: absolute;
bottom: 90px;
left: 70px;
background: url(../img/dek_m2.png) no-repeat center center;
z-index: 2;
}
.dek_mock3{
width: 380px;
height: 243px;
position: absolute;
top: 0;
right: 0;
background: url(../img/dek_m3.png) no-repeat center center;
z-index: 1;
}
.dek_p1{
background: url(../img/dek_p1.png) no-repeat center center;
width: 120px;
height: 130px;
position: absolute;
top: 50px;
left: 225px;
}
.dek_p2{
background: url(../img/dek_p2.png) no-repeat center center;
width: 165px;
height: 145px;
position: absolute;
top: 350px;
left: 250px;
z-index: 4;
}
.dek_p3{
background: url(../img/dek_p3.png) no-repeat center center;
width: 145px;
height: 155px;
position: absolute;
top: 70px;
right: 225px;
z-index: 4;
}
.dek_p4{
background: url(../img/dek_p4.png) no-repeat center center;
width: 170px;
height: 195px;
position: absolute;
top: 280px;
right: 125px;
z-index: 4;
}
.dek_list{
margin-top: 23px;
}
.dek_list li{
padding-left: 27px;
font-size: 21px;
line-height: 24px;
position: relative;
}
.dek_list li::before{
content: '';
position: absolute;
top: 8px;
left: 0;
width: 15px;
height: 10px;
background: url(../images/appl_list.png) no-repeat center;
}
.dek_list li:not(:last-child){
margin-bottom: 14px;
}
.keys_dek_bt{
background: url(../images/keys_appl_bt.png) no-repeat bottom center;
width: 100%;
min-height: 62px;
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
position: relative;
z-index: 2;
top: -120px;
}
.dek_how_works{
width: 100%;
background: #60AD26;
min-height: 100px;
position: relative;
top: -120px;
padding-top: 45px;
padding-bottom: 41px;
}
.dek_how_works h2 {
font-size: 30px;
color: #fff;
background: #262E38;
display: inline-block;
padding: 10px 15px 17px 23px;
font-family: "RobotoBold";
}
@media only screen and (max-width: 1600px) and (min-width: 1301px){
.dek_p1{
top: 50px;
left: 30px;
}
.dek_p2{
top: 350px;
left: 30px;
}
.dek_p3{
top: 70px;
right: 30px;
}
.dek_p4{
top: 280px;
right: 30px;
}
}
@media only screen and (max-width: 1301px){
.dek_p{
display: none;
}
}
@media only screen and (max-width: 991px){
.dek_mock_wrap{
margin-left: 0;
}
.keys_dek_bt{
top: -80px;
}
.dek_how_works{
top: -80px;
}
}
@media only screen and (max-width: 767px){
.dek_mock1{
display: none;
}
.dek_mock2{
display: none;
}
.dek_mock3{
display: none;
}
.dek_mock_wrap{
background: url(../img/dek_mokup.png) no-repeat;
background-size: 100%;
background-position: center;
}
.dek_title_logo{
margin-bottom: 0;
}
.dek_how_works h2{
font-size: 24px;
}
}
.main_content {
background: #fff;
color: #2d323a;
margin-top: -120px;
padding-top: 70px;
padding-bottom: 48px;
}
.main_content h2 {
font-size: 25px;
color: #494949;
font-family: "RobotoBold";
margin-bottom: 25px;
}
.main_content p {
margin-bottom: 15px;
font-size: 17px;
line-height: 26px;
}
.main_content strong {
font-family: "RobotoBold";
color: #494949;
line-height: 22px;
}
.point_img_box_wr {
position: relative;
}
.point_img img {
width: 100%;
height: auto;
}
.point_img_list {
counter-reset: myCounter;
}
.point_img_list li {
font-size: 16px;
line-height: 20px;
position: absolute;
}
.point_img_list_resp {
padding-left: 20px;
display: none;
margin-bottom: 30px;
list-style-type: decimal;
}
.point_img_list_resp li {
margin: 0 0 15px 0;
text-align: left;
line-height: 25px;
}
.point_img_list_resp li br {
display: none;
}
.point_img_list li:before {
counter-increment: myCounter;
content: counter(myCounter);
font-size: 16px;
line-height: 20px;
font-weight: bold;
display: none;
}
@media only screen and (max-width: 767px){
.point_img_list_resp {
display: block;
}
.point_img_list li:before {
display: block;
}
.point_img_list li {
height: 20px;
padding: 0 4px;
overflow: hidden;
}
.point_img_box_wr {
margin-bottom: 10px;
}
}
.keys_automation_top {
width: 100%;
min-height: 535px;
background: #f1f1f1 url(../images_automation/keys_automation_top.jpg) no-repeat bottom center;
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
padding-top: 53px;
position: relative;
}
.automation_title_wrap {
color: #2d323a;
}
.automation_title_wrap h1{
font-size: 36px;
line-height: 50px;
font-family: "RobotoBold";
color: #2d323a;
margin-bottom: 25px;
}
.automation_title_wrap span{
font-size: 20px;
line-height: 24px;
margin-bottom: 35px;
}
.automation_mock_wrap{
position: relative;
z-index: 3;
margin-top: 30px;
}
.automation_mock_wrap > div{
float: left;
width: 33%;
position: relative;
}
.automation_mock1{
width: 428px;
height: 295px;
position: relative;
top: 0px;
left: 0;
z-index: 3;
}
.automation_mock2{
width: 428px;
height: 276px;
position: relative;
top: 55px;
left: -50px;
z-index: 2;
}
.automation_mock3{
width: 542px;
height: 340px;
position: relative;
top: 80px;
left: -160px;
z-index: 4;
}
.automation_p1{
background: url(../images_automation/automation_p1.png) no-repeat center center;
width: 204px;
height: 203px;
position: absolute;
top: 80px;
left: 130px;
}
.automation_p2{
background: url(../images_automation/automation_p2.png) no-repeat center center;
width: 252px;
height: 106px;
position: absolute;
top: 340px;
left: 80px;
z-index: 4;
}
.automation_p3{
background: url(../images_automation/automation_p3.png) no-repeat center center;
width: 117px;
height: 108px;
position: absolute;
top: 60px;
right: 80px;
z-index: 4;
}
.automation_p4{
background: url(../images_automation/automation_p4.png) no-repeat center center;
width: 282px;
height: 222px;
position: absolute;
top: 367px;
right: 180px;
z-index: 4;
}
.dek_list{
margin-top: 23px;
}
.dek_list li{
padding-left: 27px;
font-size: 21px;
line-height: 24px;
position: relative;
}
.dek_list li::before{
content: '';
position: absolute;
top: 8px;
left: 0;
width: 15px;
height: 10px;
background: url(../images/appl_list.png) no-repeat center;
}
.dek_list li:not(:last-child){
margin-bottom: 14px;
}
@media only screen and (max-width: 1600px) and (min-width: 1301px){
.automation_p1{
top: 50px;
left: -10px;
}
.automation_p2{
top: 350px;
left: -120px;
}
.automation_p3{
top: 70px;
right: 30px;
}
.automation_p4{
top: 280px;
right: -90px;
}
}
@media only screen and (max-width: 1301px){
.automation_p{
display: none;
}
}
@media only screen and (max-width: 991px){
.automation_mock_wrap{
margin-left: 0;
}
.automation_mock_wrap > div{
width: 33.33%;
}
.automation_mock {
position: static;
width: 100%;
height: auto;
}
.automation_mock img {
width: 100%;
height: auto;
}
}
@media only screen and (max-width: 767px){
.automation_mock_wrap > div{
width: 100%;
float: none;
}
}
.keys_soap_top {
width: 100%;
min-height: 510px;
background: #000000 url(../images_soap/keys_soap_top.jpg) no-repeat bottom center;
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
padding-top: 53px;
position: relative;
}
.soap_title_wrap {
color: #ffffff;
}
.soap_title_wrap h1{
font-size: 36px;
line-height: 50px;
font-family: "RobotoBold";
color: #ffffff;
margin-bottom: 25px;
}
.soap_title_wrap span{
font-size: 20px;
line-height: 24px;
margin-bottom: 35px;
}
.soap_p1{
background: url(../images_soap/soap_p1.png) no-repeat center center;
width: 106px;
height: 118px;
position: absolute;
top: 80px;
left: 130px;
}
.soap_p2{
background: url(../images_soap/soap_p2.png) no-repeat center center;
width: 80px;
height: 76px;
position: absolute;
top: 340px;
left: 80px;
z-index: 4;
}
.soap_p3{
background: url(../images_soap/soap_p3.png) no-repeat center center;
width: 106px;
height: 118px;
position: absolute;
top: 60px;
right: 80px;
z-index: 4;
}
.soap_p4{
background: url(../images_soap/soap_p4.png) no-repeat center center;
width: 94px;
height: 82px;
position: absolute;
top: 367px;
right: 180px;
z-index: 4;
}
.soap_mock_wrap{
position: relative;
z-index: 3;
}
.soap_mock1{
width: 602px;
height: 431px;
position: absolute;
top: -90px;
right: -50px;
z-index: 3;
background: url(../images_soap/soap_m1.png) 0 0 no-repeat;
}
@media only screen and (max-width: 1600px) and (min-width: 1301px){
.soap_p1{
top: 50px;
left: -10px;
}
.soap_p2{
top: 350px;
left: -10px;
}
.soap_p3{
top: 70px;
right: 30px;
}
.soap_p4{
top: 310px;
right: -30px;
}
}
@media only screen and (max-width: 1301px){
.soap_p{
display: none;
}
}
@media only screen and (max-width: 991px){
.soap_mock_wrap{
}
.soap_mock{
display: none;
}
.soap_mock_wrap{
margin-top: 20px;
margin-left: 0px;
background: url(../images_soap/soap_m1.png) 0 0 no-repeat;
background-size: 100%;
background-position: center;
padding-top: 75%;
width: 100%;
max-width: none;
margin-bottom: 0px;
}
.toggle_bottom_wr .toggle_bottom {
display: block !important;
}
}
@media only screen and (max-width: 767px){
.toggle_bottom_wr {
margin-bottom: 80px;
}
}
.army_how_works{
background-color: #ff1343;
position: relative;
}
.keys-btn_army{
z-index: 22;
}
.army_how_works::before{
content: '';
position: absolute;
left: 0;
top: -165px;
width: 100%;
height: 365px;
background: url(../images/img_army/main_bg.png) no-repeat bottom center;
background-size: 100% 365px;
}
.keys_army_bt{
background: url(../images/img_army/main_bg_treyg.png) no-repeat;
width: 100%;
min-height: 100px;
background-position-y: 10px;
}
.keys_army_top{
background: url(../images/img_army/head_bg.jpg) no-repeat;
background-size: cover;
height: auto;
}
.army_main_title span{
font-size: 34px;
line-height: 60px;
background-color: #db1a44;
padding: 5px 10px;
}
.army_par{
background: url(../images/img_army/army_term.png) no-repeat;
max-width: 555px;
}
.army_p1{
background: url(../images/img_army/par_1.png) no-repeat;
}
.army_p2{
background: url(../images/img_army/par_3.png) no-repeat;
}
.army_p3{
background: url(../images/img_army/par_2.png) no-repeat;
}
.army_p4{
background: url(../images/img_army/par_4.png) no-repeat;
}
.army_title_second {
background-color: #047ad4 !important;
}
.army_cont{
padding-bottom: 90px;
}
.army_offset{
padding: 20px 30px;
}
.army_section p{
font-size: 17px;
line-height: 26px;
color: #2d323a;
margin-bottom: 30px;
}
.p_1{
padding-top: 50px;
}
.army_main_third{
font-size: 27px;
line-height: 36px;
background-color: #db1a44;
display: inline-block;
padding: 10px 15px 17px 23px;
font-family: "RobotoBold";
}
.title_1_poz{
margin-top: -65px;
}
.title_1{
z-index: 22;
position: relative;
}
.army_img_1{
margin-top: -45px;
}
.army_offset_big{
padding-top: 100px;
}
.army_bold_txt{
font-size: 20px !important;
margin: 30px 0;
}
.army_ipad_txt{
float: right;
width: 30%;
position: relative;
}
.army_ipad_txt p{
font-size: 16px;
line-height: 21px;
color: #647e8e;
padding-top: 90px;
padding-right: 15px;
}
.army_ipad{
float: left;
width: 70%;
position: relative;
}
.army_ipad::before{
content: '';
position: absolute;
left: 400px;
top: 182px;
width: 100%;
height: 13px;
background: url(../images/img_army/army_line.png) no-repeat;
}
.army_ipad img{
width: 100%;
height: auto;
}
.title_3{
margin-bottom: 30px;
}
.army_align_center{
text-align: center;
}
.army_item{
background-color: #e5e5e5;
width: 100%;
min-height: 175px;
margin-bottom: 15px;
}
.army_item_img img{
max-width: 100%;
height: auto;
}
.army_section_last{
padding-bottom: 100px;
}
.army_item_small{
background-color: #e5e5e5;
width: 100%;
min-height: 80px;
margin-right: 10px;
margin-bottom: 15px;
}
.img_wrap img{
width: 100%;
height: auto;
}
/* .short_keys_block_army{
width: auto;
} */
.army_test_wrap{
position: relative;
perspective: 500px;
perspective-origin: 125% 0;
}
.army_test p{
font-size: 12px;
line-height: 12px;
color: #ffffff;
margin-bottom: 0;
/* transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
-o-transform: rotate(-2deg); */
}
.army_test{
position: absolute;
left: 125px;
background-color: #c5462a;
border-radius: 3px;
box-shadow: 3px 3px 0px 0px rgba(191, 58, 28, 0.75);
transform: rotateX(10deg) rotateZ(-2deg);
}
.army_test_1{
top: 60px;
padding: 10px 15px;
}
.army_test_2{
top: 110px;
padding: 10px 10px;
}
.army_shadow{
background: url(../images/img_army/army_shadow.png) no-repeat bottom center;
background-size: 100% 190px;
position: relative;
z-index: 22;
}
.army_ipad_offset{
padding-bottom: 0;
}
@media only screen and (max-width: 991px){
.army_img_1{
margin-top: 0;
}
.army_main_title span {
font-size: 22px;
line-height: 48px;
}
.army_ipad_txt{
width: 30%;
}
.army_ipad_txt p{
padding-right: 0;
}
.army_ipad{
width: 70%;
}
.army_ipad::before{
display: none;
}
.army_test_1{
top: 110px;
}
.army_test_2{
top: 155px;
}
.army_par{
background: transparent;
}
}
@media only screen and (max-width: 767px){
.army_ipad_txt{
width: 100%;
float: none;
}
.army_ipad_txt p{
padding-top: 0;
}
.army_ipad{
width: 100%;
}
.army_test p{
font-size: 8px;
line-height: 8px;
}
.army_test_1{
top: 70px;
left: 75px;
padding: 5px 10px;
}
.army_test_2{
top: 100px;
left: 75px;
padding: 5px 5px;
}
.army_offset {
padding: 20px 0px;
}
.army_ipad_offset{
padding-bottom: 0;
}
.army_par{
height: 140px;
}
.keys-btn_army {
position: relative !important;
}
}
@media only screen and (max-width: 486px){
.army_test{
display: none;
}
.army_main_third {
font-size: 25px;
line-height: 30px;
}
.army_main_title span {
padding: 0;
}
}
/*==========>> 3.18. FLEX BOX <<==========*/
.flex_box {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.flex_box_middle {
-webkit-align-items: center;
-moz-align-items: center;
-ms-align-items: center;
-o-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.flex_box_between {
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
-ms-justify-content: space-between;
-o-justify-content: space-between;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.flex_wrap {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
}
.flex_center {
-webkit-justify-content: center;
-moz-justify-content: center;
-ms-justify-content: center;
-o-justify-content: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.flex_right {
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
-ms-justify-content: flex-end;
-o-justify-content: flex-end;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.youtube {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
display: block;
overflow: hidden;
transition: all 200ms ease-out;
cursor: pointer;
width: 100%;
height: 176px;
border: 1px solid #cecece;
}
.youtube .play {
background: url("../images/img_army/youtube_play.png") no-repeat center center;
position: absolute;
height: 100%;
width: 100%;
opacity: .9;
filter: alpha(opacity=90);
transition: all 0.2s ease-out;
}
.youtube .play:hover {
opacity: 1;
filter: alpha(opacity=100);
}
.keys_obj_top{
width: 100%;
min-height: 464px;
background: #60AD26 url(../images_object/obj_bg.jpg) no-repeat bottom center;
background-size: cover;
-moz-background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
padding-top: 60px;
padding-bottom: 60px;
position: relative;
}
.obj_title_wrap .toggle_bottom{
margin-top: 160px;
display: block !important;
color: #2d323a;
border-color: #2d323a;
}
.obj_title_wrap .toggle_bottom:hover{
background-color: #2d323a;
color: #fff;
}
.obj_title_wrap .icon-arrowDown2::after {
background: url(../images/icon/arrow_down_black.png) no-repeat;
}
.obj_title_wrap .toggle_bottom:hover .icon-arrowDown2::after {
background: url(../images/green/arrow_down2.png) no-repeat;
}
.keys_obj_top h1 {
font-size: 36px;
line-height: 50px;
font-family: "RobotoBold";
color: #2d323a;
margin-bottom: 20px;
}
.obj_mock_wrap {
margin-left: -235px;
max-width: 550px;
height: 340px;
top: 20px !important;
left: 10px;
position: relative;
z-index: 3;
}
.obj_mock1 {
width: 440px;
height: 190px;
position: absolute;
bottom: 0;
left: 0;
background: url(../images_object/obj_m1.png) no-repeat center center;
z-index: 3;
}
.obj_mock2 {
width: 440px;
height: 190px;
position: absolute;
bottom: 90px;
left: 70px;
background: url(../images_object/obj_m2.png) no-repeat center center;
z-index: 2;
}
.obj_mock3 {
width: 415px;
height: 190px;
position: absolute;
top: 0;
left: 140px;
background: url(../images_object/obj_m3.png) no-repeat center center;
z-index: 1;
}
.obj_p1 {
background: url(../images_object/obj_p1.png) no-repeat center center;
width: 90px;
height: 95px;
position: absolute;
top: 50px;
left: 30px;
}
.obj_p2 {
background: url(../images_object/obj_p2.png) no-repeat center center;
width: 115px;
height: 145px;
position: absolute;
top: 350px;
left: 0;
z-index: 4;
}
.obj_p3 {
background: url(../images_object/obj_p3.png) no-repeat center center;
width: 95px;
height: 155px;
position: absolute;
top: 70px;
right: 0px;
z-index: 4;
}
.obj_p4 {
background: url(../images_object/obj_p4.png) no-repeat center center;
width: 100px;
height: 195px;
position: absolute;
top: 280px;
right: 0;
z-index: 4;
}
.obj_title_logo{
margin-bottom: 40px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.obj_title_logo p{
font-size: 16px;
line-height: 18px;
color: #2d323a;
margin-bottom: 0;
margin-right: 15px;
}
@media only screen and (max-width: 1301px){
.obj_p{
display: none;
}
.obj_mock_wrap{
margin-left: -300px;
}
}
@media only screen and (max-width: 971px){
.obj_mock_wrap{
margin-left: 0;
}
.obj_title_wrap .toggle_bottom{
margin-top: 0;
margin-bottom: 40px;
}
}
@media only screen and (max-width: 767px){
.obj_mock_wrap{
width: 100%;
height: 350px;
background: url(../images_object/obj_m_bg.png) no-repeat center;
background-size: 100%;
}
.obj_mock1, .obj_mock2, .obj_mock3{
display: none;
}
.keys_obj_top{
padding-top: 20px;
padding-bottom: 60px;
}
.keys_obj_top h1{
font-size: 28px;
line-height: 35px;
}
.keys_obj_top h1 br{
display: none;
}
.obj_title_logo{
margin-bottom: 0;
}
}
\ No newline at end of file
$( document ).ready(function() {
$(".appl_api_section .img_list_wrap").each(function(index,el){
var id = $(el).attr("id");
$("#" + id).find(".img_list").after("<ul class='img_list_resp_box'></ul>");
$("#" + id).find(".img_list_resp_box").append($("#" + id).find(".img_list").html());
});
});
\ No newline at end of file
$(document).ready(function () {
$(".appl_api_section .img_list_wrap").each(function (index, el) {
var id = $(el).attr("id");
$("#" + id).find(".img_list").after("<ul class='img_list_resp_box'></ul>");
$("#" + id).find(".img_list_resp_box").append($("#" + id).find(".img_list").html());
});
if ($('.point_img_box').length) {
$(".point_img_box").each(function (index, el) {
var ind = index + 1;
$(this).attr('id', 'point_img_box' + ind);
var id = $(el).attr("id");
$("#" + id).find(".point_img_box_wr").after("<ul class='point_img_list_resp'></ul>");
$("#" + id).find(".point_img_list_resp").append($("#" + id).find(".point_img_list").html());
});
}
$(".youtube").each(function () {
// Based on the YouTube ID, we can easily find the thumbnail image
$(this).css('background-image', 'url(http://i.ytimg.com/vi/' + this.id + '/sddefault.jpg)');
// Overlay the Play icon to make it look like a video player
$(this).append($('<div/>', {'class': 'play'}));
$(document).delegate('#' + this.id, 'click', function () {
// Create an iFrame with autoplay set to true
var iframe_url = "https://www.youtube.com/embed/" + this.id + "?autoplay=1&autohide=1";
if ($(this).data('params')) iframe_url += '&' + $(this).data('params');
// The height and width of the iFrame should be the same as parent
var iframe = $('<iframe/>', {
'frameborder': '0',
'src': iframe_url,
'width': $(this).width(),
'height': $(this).height()
});
// Replace the YouTube thumbnail with YouTube HTML5 Player
$(this).replaceWith(iframe);
});
});
});
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment