h2,
h3,
h4,
p,
li,
dt,
dd {
	letter-spacing: 3px;
}
body {
    font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", Meiryo, serif;
}
a {
    color: #0099cc;
    text-decoration: underline;
}
p {
    line-height: 1.8;
}
.mB20 { margin-bottom: 20px; }
.mB30 { margin-bottom: 30px; }
.mB40 { margin-bottom: 40px; }
.mB50 { margin-bottom: 50px; }
.mB60 { margin-bottom: 60px; }
.mB70 { margin-bottom: 70px; }
.mB80 { margin-bottom: 80px; }
.mB90 { margin-bottom: 90px; }
.mB100 { margin-bottom: 100px; }
section {
    position: relative;
    overflow: hidden;
}
header {
    background: url(../img/bg_header.webp) left top repeat;
    border-top: 5px solid #036eb7;
    padding: 30px 0;
    background-size: 512px 512px;
}
    header h1 {
        margin: 0;
        padding: 3px 0 0 0;
    }
        header h1 a {
            display: block;
        }
    	header h1 img {
	    	max-width: 100%;
	    	height: auto;
    	}
    	header h1 a:hover img {
	    	opacity: 0.8;
	    	filter: alpha(opacity=80);
    	}
    .navbar {
        margin-bottom: 0;
        min-height: inherit;
    }
    header .navbar-default {
        background: none;
        border: none;
    }
    header ul.nav {
        background: url(../img/bg_gnavi.webp) left center no-repeat;
        background-size: 1px 64px;
    }
    header ul.nav li {
        width: 20%;
        text-align: center;
        background: url(../img/bg_gnavi.webp) right center no-repeat;
        background-size: 1px 64px;
    }
    .navbar-nav > li > a {
        padding: 10px 0;
        height: 69px;
    }
    header ul.nav li a img {
        width: 84px;
        height: 49px;
    }
    header ul.nav li a img:hover {
        filter: brightness(0) invert(0);
    }


section:nth-of-type(1){height: 440px;background: #e0e0e0;}

section#mainImg>div:nth-of-type(1) {
    background: url(../img/main_img.webp) 50% 0 no-repeat fixed;
    margin: 0;
    height: 440px;
    position:absolute;
    width:100%;
    top:0;left:0;
    background-size: 1800px 625px;
}

.colBlock {
    padding: 40px 0 60px;
}
    .colBlock h2 {
        background-size: 68px 68px;
    }
    button:hover {
        opacity: 0.8;
        filter: alpha(opacity=80);
    }
    .colBlock h2 {
        padding: 80px 0 0 0;
        margin-top: 0;
        background-position: center top;
        background-repeat: no-repeat;
        font-weight: bold;
        text-align: center;
        font-size: 24px;
    }
    .colBlock .notice h5 {
        margin: 30px;
        text-align: center;
    }
    #info h2 {
        background-image: url(../img/h2_info.webp);
    }
    #info ul,
    #info ul li {
        background-image: url(../img/line_dot.gif);
        background-repeat: repeat-x;
        background-size: 2px 1px;
    }
    #info ul {
        background-position: left top;
        padding: 0;
        margin: 0;
    }
    #info ul li {
        background-position: left bottom;
        list-style: none inside;
    }
    #info ul li dl {
        font-size: 16px;
        margin: 0;
        padding: 30px 20px;
        width: 100%;
        overflow: hidden;
    }
    #info ul li dl dt {
        float: left;
        width: 15%;
        font-weight: normal;
        background-image: url(../img/li_red.webp);
        background-position: left center;
        background-repeat: no-repeat;
        font-size: 14px;
        padding: 2px 0 2px 15px;
        background-size: 5px 13px;
    }
    #info ul li dl dd {
        float: left;
        width: 85%;
    }
    #info .btn_info {
        background: url(../img/bg_b.webp) left top;
        padding: 5px 30px;
        color: #ffffff;
        border: 0;
        margin: 0 0 0 auto;
        display: block;
        letter-spacing: 2px;
        margin-top: 20px;
        background-size: 512px 512px;
    }
    #info ul#old_info {
        background: none;
    }
    #info dl dd span {
        letter-spacing: 1px;
        display: inline-block;
        margin-bottom: 5px;
        font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
        font-weight: normal;
    }

#webrtc {
	background: #bfd8f0;
}
	#webrtc h2 {
        margin-bottom: 30px;
        background-image: url(../img/h2_business.webp);
    }
#company {
    background: #bfd8f0;
}
#mqtt {
    background: url(../img/bg_header.webp) left top repeat;
}
    #mqtt h2 {
        margin-bottom: 30px;
        background-image: url(../img/h2_mqtt.webp);
    }
    #mqtt .btn_mqtt {
        background: url(../img/bg_b.webp) left top;
        padding: 15px 100px;
        color: #ffffff;
        border: 0;
        margin: 0 auto 40px;
        display: block;
        letter-spacing: 2px;
        text-align: center;
        font-size: 16px;
        font-weight: bold;
    }
    div.proBlock div p img {
        border: solid 5px #ffffff;
        box-shadow:rgba(0, 0, 0, 0.25) 0px 0px 8px 0px;
        -webkit-box-shadow:rgba(0, 0, 0, 0.25) 0px 0px 8px 0px;
        -moz-box-shadow:rgba(0, 0, 0, 0.25) 0px 0px 8px 0px;
    }
    div.proBlock div p a:hover img {
	    opacity: 0.8;
    }
    div.proBlock div dl dt {
        background-image: url(../img/li_red.webp);
        background-position: left center;
        background-repeat: no-repeat;
        padding-left: 15px;
        color: #0099cc;
        font-weight: normal;
        margin-bottom: 10px;
        background-size: 5px 13px;
    }
    div.proBlock div dl dt a {
        font-size: 13px;
        letter-spacing: 1px;
    }
    div.proBlock div dl dd {
        padding: 5px 25px 25px 15px;
        font-size: 13px;
    }
    #mqtt div.proBlock p {
        position: relative;
    }
    #mqtt span.release {
        font-weight: bold;
        padding: 0 5px;
        background: #ffffff;
        position: absolute;
        top: -20px;
        left: 0;
        font-size: 12px;
        color: #e71f19;
        font-family: Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    }
#opensource {
    background: url(../img/bg_header.webp)
}
    #opensource h2 {
        margin-bottom: 30px;
        background-image: url(../img/h2_oss.webp);
    }
    #opensource .proBlock dl {
	    margin-bottom: 0;
    }

    #service h2 {
        margin-bottom: 30px;
        background-image: url(../img/h2_service.webp);
    }
    #service .proBlock dl {
        margin-bottom: 0;
    }

#consulting {
    background: #036eb7;
    color: #ffffff;
}
    #consulting h2 {
        margin-bottom: 30px;
        background-image: url(../img/h2_consulting.webp);
    }
    #consulting p {
        padding: 0 80px;
        font-size: 16px;
        line-height: 2.2;
    }
    #consulting .btn_more {
        background: url(../img/bg_header.webp) left top;
        padding: 10px 80px;
        color: #000000;
        border: 0;
        margin: 0 auto;
        display: block;
        letter-spacing: 2px;
        margin-top: 40px;
        font-size: 16px;
        background-size: 512px 512px;
    }

    #company h2 {
        margin-bottom: 60px;
        background-image: url(../img/h2_company.webp);
    }
    #company .row {
        margin: 0;
    }
    #company .row ul {
        padding: 0;
        margin: 0;
    }
    #company .row li {
        list-style: none;
        margin-bottom: 40px;
    }
    #company .row li li {
        margin-bottom: 10px;
    }
    #company .row dl {
        overflow: hidden;
    }
    #company .row dl dt {
        width: 20%;
        float: left;
    }
    #company .row dl dd {
        float: left;
        width: 80%;
    }
    #company dl dt {
        background-image: url(../img/li_red.webp);
        background-position: left center;
        background-repeat: no-repeat;
        font-size: 17px;
        padding-left: 15px;
        margin-bottom: 10px;
        background-size: 5px 13px;
    }
    #company dl dd {
        font-size: 16px;
        padding-left: 15px;
    }
    #company div#map {
        margin-bottom: 20px;
        width: 100%;
        height: 400px;
    }
    #company .company_ex {
        margin-left: 15px;
    }
    mark {
        background: #efefef;
        padding: 2px 0;
        line-height: 2.0;
    }

#shigure {
    background: url(../img/bg_shigure.webp) left top repeat;
    background-size: 105px 105px;
}
    #shigure h2 {
        margin-bottom: 60px;
        background-image: url(../img/h2_shigure.webp);
    }
    #shigure .shigure-tsushin {
        position: relative;
        border: solid 5px #ffffff;
        box-shadow:rgba(0, 0, 0, 0.25) 0px 0px 8px 0px;
        -webkit-box-shadow:rgba(0, 0, 0, 0.25) 0px 0px 8px 0px;
        -moz-box-shadow:rgba(0, 0, 0, 0.25) 0px 0px 8px 0px;
        margin-bottom: 20px;
    }
        #shigure .img-container {
            min-width: 100%;
            height: 200px;
            cursor: pointer;
        }
        #shigure .shigure-tsushin h4 {
            margin: 0;
            padding: 10px;
            font-size: 12px;
            width: 100%;
            color: #ffffff;
            position: absolute;
            bottom: 0;
            background-color:rgba(0,0,0,0.85);
            line-height: 1.6;
        }
        #shigure .pager li a {
           text-decoration: none;
           font-size: 12px;
        }
        #shigure .modal-body img {
            max-width: 100%;
        }
        #shigure .modal-body {
            padding: 25px 40px;
        }
        #shigure h4.modal-title {
            background-image: url(../img/li_red.webp);
            background-position: 0 5px;
            background-repeat: no-repeat;
            padding-left: 15px;
            background-size: 5px 13px;
            font-size: 16px;
            font-weight: bold;
        }
        #shigure .modal-body .tsushin-img {
            text-align: center;
            margin-bottom: 30px;
            padding-bottom: 30px;
            background-image: url(../img/line_dot.gif);
            background-repeat: repeat-x;
            background-size: 2px 1px;
            background-position: left bottom;
        }
        #shigure .modal-body .tsushin-img img {
            border: solid 1px #333333;
        }

        #shigure .modal-body p {
            line-height: 2.0;
        }
#page-top {
    position: fixed;
    bottom: 0;
    text-align: center;
    right: 30px;
}
#page-top a {
    border-radius: 5px;
    height: 50px;
    width: 50px;
    line-height: 50px;
    display: block;
    text-align: center;
    color: #ffffff;
    text-decoration: none;
    background: #333333;
    font-size: 16px;
    opacity: 0.8;
    filter: alpha(opacity=8);
}
#page-top a:hover,
#page-top a:focus {
    opacity: 0.6;
    filter: alpha(opacity=6);
}
#page-top a:focus {
    outline: none;
}

footer {
    text-align: center;
    background: #efefef;
    padding: 25px 0;
    font-size: 12px;
    border-bottom: 5px solid #036eb7;
    letter-spacing: 2px;
}

/* 設計・開発・コンサルティング */
section#consultingTop {
    height: auto;
    background: #036eb7;
}
    section#consultingTop h2 {
        background: url(../img/h2_consulting.webp) center top no-repeat;
        text-align: center;
        color: #ffffff;
        padding: 80px 0 0;
        margin: 50px 0;
        background-size: 68px 68px;
    }
#sidebar {
    margin-top: 5px;
    padding: 0 5% 0 0;
    z-index: 1;
}
    #sidebar ul {
        padding: 0;
        margin: 0;
    }
    #sidebar ul li {
        list-style: none;
    }
    #sidebar ul li a {
        background: url(../img/li_w_arrow.webp) #003960 right center no-repeat;
        border-bottom: 1px dotted #ffffff;
        font-weight: bold;
        color: #ffffff;
        display: block;
        text-decoration: none;
        padding: 20px 15px;
        background-size: 23px 7px;
    }
    #sidebar ul li a:hover,
    #sidebar ul li a:focus {
        opacity: 0.8;
        filter: alpha(opacity=8);
    }
    h2.h2_consulting small {
        display: block;
        margin-top: 20px;
        font-size: 60%;
        font-weight: bold;
        color: #000000;
    }
    h3.h3_support {
        border-bottom: 1px solid #003960;
        padding: 5px 0 15px 50px;
        background-position: left top;
        background-repeat: no-repeat;
        font-size: 18px;
        color: #003960;
        margin: 70px 0 20px;
        line-height: 1.6;
        background-size: 36px 36px;
    }
    #consulting01 h2 {
        margin-bottom: 60px;
        background-image: url(../img/h2_consulting01.webp);
    }
    #consulting01 ul {
        padding: 0;
    }
    #consulting01 ul li {
        list-style: none;
        background: url(../img/li_r_arrow.webp) left 7px no-repeat;
        padding-left: 20px;
        margin-bottom: 10px;
        background-size: 8px 7px;
    }
    #consulting02 h2 {
        background-image: url(../img/h2_consulting02.webp);
    }
    #support01 { background-image: url(../img/pic_n01.webp); }
    #support02 { background-image: url(../img/pic_n02.webp); }
    #support03 { background-image: url(../img/pic_n03.webp); }
    #support04 { background-image: url(../img/pic_n04.webp); }
    #support05 { background-image: url(../img/pic_n05.webp); }

    #consulting03 h2 {
        background-image: url(../img/h2_consulting03.webp);
    }
    h3.h3_portfolio {
        background-image: url(../img/pic_arrow.webp);
        font-size: 16px;
    }
    h3.h3_portfolio a {
        text-decoration: none;
        color: #003960;
        font-size: 18px;
    }
    h3.h3_portfolio a:hover {
        color: #0099cc;
    }
    #consulting03 ul {
        padding: 0;
        margin: 0;
    }
        #consulting03 ul li {
            list-style: disc outside;
            margin: 0 0 30px 15px;
            line-height: 1.8;
        }
    #consulting04 h2 {
        background-image: url(../img/h2_consulting04.webp);
        margin-bottom: 60px;
    }
    #preview h1 {
        font-size: 24px;
        line-height: 24px;
        padding-left: 25px;
        font-weight: bold;
    }
    .form-group label {
        font-size: 16px;
        letter-spacing: 2px;
    }
    form button {
        border: 1px solid #003960;
        background: #036eb7;
        color: #ffffff;
    }
    .btn:hover,
    .btn:focus {
        color: #ffffff;
    }
    #preview dl {
        width: 100%;
        padding: 0 20px;
        margin: 20px 0;
        overflow: hidden;
    }
        #preview dl dt,
        #preview dl dd {
            letter-spacing: 0.1em;
            line-height: 1.6;
            padding: 5px 10px;
            margin-bottom: 10px;
            float: left;
        }
        #preview dl dt {
            width: 30%;
            background: #eeeeee;
            border-radius: 20px;
            -webkit-border-radius: 20px;
            -moz-border-radius: 20px;
        }
        #preview dl dd {
            width: 70%;
        }
        #preview button {
            width: 20%;
            margin: 0 auto;
            display: block;
        }

/* ニュースリリース */
section#infoTop {
    height: auto;
    background: #036eb7;
}
    section#infoTop h2 {
        background: url(../img/h2_info_w.webp) center top no-repeat;
        text-align: center;
        color: #ffffff;
        padding: 80px 0 0;
        margin: 50px 0;
        background-size: 68px 68px;
    }
#infoBlock {
    padding-top: 20px;
}
    #infoBlock .container {
        padding: 0 80px;
    }
    #infoBlock .container h3 {
        line-height: 1.6;
        text-align: center;
        margin: 20px 0 40px;
    }
    	#infoBlock .container h3.h3_f22 {
	    	font-size: 22px;
    	}
    	#infoBlock .container h3 span {
	    	font-size: 80%;
	    	color: #333333;
    	}
    #infoBlock .container h4 {
        border-bottom: 1px solid #003960;
        margin: 60px 0 20px;
        padding-bottom: 10px;
        color: #003960;
        line-height: 1.6;
    }
    #infoBlock .container span {
        color: #ff0012;
    }
    #infoBlock .container p.text-ex {
        font-size: 13px;
    }
    #infoBlock .container li,
    #infoBlock .container dt,
    #infoBlock .container dd {
        line-height: 1.8;
    }
    #infoBlock .container ul {
        margin: 0 0 0 15px;
        padding: 0;
    }
    #infoBlock .contactBlock {
        margin-top: 30px;
        border: 1px solid #003960;
        padding: 20px;
        background: url(../img/bg_header.webp);
        background-size: 512px 512px;
    }
    #infoBlock img {
        max-width: 100%;
        height: auto;
    }
    #infoBlock .contactBlock dt {
        border-bottom: 1px solid #003960;
        margin-bottom: 10px;
    }
    #infoBlock .contactBlock dd {
        padding: 0 20px;
    }
    #infoBlock .btn {
        letter-spacing: 1px;
    }
    #infoBlock .btn:hover,
    #infoBlock .btn:focus {
        color: #333333;
    }
    #infoBlock .cluster-ex {
        color: #3c73b7;
        font-size: 20px;
        font-weight: bold;
    }
    #infoBlock .couster-txt {
        background: none repeat scroll 0 0 #fff0f2;
        padding: 10px 10px 5px;
    }
    #infoBlock .couster-txt li {
        list-style: outside none none;
    }
    #infoBlock .couster-txt li span {
        margin-right: 5px;
        color: #333333;
    }
    #infoBlock .fuji_list dt,
    #infoBlock p.fuji_list {
	    color: #9c558f;
	    font-weight: bold;
    }
    #infoBlock .sora_list dt {
	    color: #3697C4;
	    font-weight: bold;
    }
    #infoBlock .fuji_list dt,
     #infoBlock .sora_list dt {
	    margin-top: 20px;
    }
    #infoBlock .fuji_list dd,
     #infoBlock .sora_list dd {
	    padding-left: 20px;
    }
    #infoBlock p.fuji_list {
	    font-size: 18px;
	    font-weight: bold;
	    margin-top: 30px;
    }


/* Retina対応 */
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
    header,
    #product,
    #consulting .btn_more,
    #infoBlock .contactBlock {
        background-image: url(../img/bg_header@2x.webp);
    }
    header ul.nav,
    header ul.nav li {
        background-image: url(../img/bg_gnavi@2x.webp);
    }
    section#mainImg {
        background-image: url(../img/main_img@2x.webp);
    }
    #info h2 {
        background-image: url(../img/h2_info@2x.webp);
    }
    #info ul li dl dt,
    div.proBlock div dl dt,
    #company dl dt,
    #shigure h4.modal-title {
        background-image: url(../img/li_red@2x.webp);
    }
    #info .btn_info {
        background-image: url(../img/bg_b@2x.webp);
    }
    #info ul,
    #info ul li,
    #shigure .modal-body .tsushin-img {
        background-image: url(../img/line_dot@2x.gif);
    }
    #webrtc h2 {
        background-image: url(../img/h2_business.webp);
    }
    #mqtt h2 {
        background-image: url(../img/h2_mqtt@2x.webp);
    }
    #product h2 {
        background-image: url(../img/h2_oss.webp);
    }
    #consulting h2 {
        background-image: url(../img/h2_consulting@2x.webp);
    }
    #company h2 {
        background-image: url(../img/h2_company.webp);
    }
    #shigure {
        background: url(../img/bg_shigure@2x.webp) left top repeat;
    }
    #shigure h2 {
        background-image: url(../img/h2_shigure@2x.webp);
    }
    section#consultingTop h2 {
        background-image: url(../img/h2_consulting@2x.webp);
    }
    #sidebar ul li a {
        background-image: url(../img/li_w_arrow@2x.webp);
    }
    #consulting01 h2 {
        background-image: url(../img/h2_consulting01@2x.webp);
    }
    #consulting01 ul li {
        background-image: url(../img/li_r_arrow@2x.webp);
    }
    #consulting02 h2 {
        background-image: url(../img/h2_consulting02@2x.webp);
    }
    #support01 { background-image: url(../img/pic_n01@2x.webp); }
    #support02 { background-image: url(../img/pic_n02@2x.webp); }
    #support03 { background-image: url(../img/pic_n03@2x.webp); }
    #support04 { background-image: url(../img/pic_n04@2x.webp); }
    #support05 { background-image: url(../img/pic_n05@2x.webp); }
    #consulting03 h2 {
        background-image: url(../img/h2_consulting03@2x.webp);
    }
    h3.h3_portfolio {
        background-image: url(../img/pic_arrow@2x.webp);
    }
    #consulting04 h2 {
        background-image: url(../img/h2_consulting04@2x.webp);
    }
    section#infoTop h2 {
        background-image: url(../img/h2_info_w@2x.webp);
    }
}

@media (min-width: 768px) {
    header ul.nav {
        width: 70%;
    }
}
@media (max-width: 767px) {
    h2,
    h3,
    h4,
    p,
    li,
    dt,
    dd,
    footer {
    	letter-spacing: 1px;
    }
    .colBlock h2 {
        font-size: 20px;
    }
    #consulting h2 {
        letter-spacing: 0;
    }
    header ul.nav,
    header ul.nav li,
    header ul.nav li a {
        background: none !important;
    }
    header ul.nav li {
        width: 100%;
        text-align: left;
        border-bottom: 1px solid #cccccc;
    }
    .navbar-nav > li > a {
        padding: 10px 0;
        height: auto;
    }
    .navbar-default .navbar-collapse {
        border: none;
    }
    header ul.nav li a {
        text-indent: inherit;
        white-space: normal;
        text-decoration: none;
    }
    section#mainImg{
        height: 260px;
    }
    section#mainImg>div:nth-of-type(1) {
	    background-position: 50% -40%;
    }
    #info ul li dl {
        padding: 10px 0;
    }
    #consulting p {
        font-size: 14px;
        line-height: 1.42857;
    }
    div.proBlock div p img {
        width: 100%;
        height: auto;
    }
    #company .row dl dt,
    #company .row dl dd {
        float: none;
        width: 100%;
    }
    #company div#map {
        height: 300px;
    }
    #mqtt .btn_mqtt {
        padding: 15px 0;
        width: 100%;
    }
    #consulting .btn_more {
        padding: 10px 0;
        width: 100%;
    }
    #shigure .modal-body {
        padding: 15px;
    }
    #page-top {
        right: 10px;
    }
    #page-top a {
        height: 30px;
        width: 30px;
        line-height: 30px;
        font-size: 12px;
    }
    section#consultingTop h2 {
        font-size: 20px;
        letter-spacing: 0;
    }
    section:nth-of-type(2){
        padding-top: 0;
    }
    section#mainImg {
        margin-bottom: 40px;
    }
    #sidebar {
        margin-top: 0;
        padding: 20px;
        margin: 0 0 40px;
        background: #003960;
    }
        #sidebar ul {
            padding: 0;
            text-align: center;
        }
        #sidebar ul li {
            list-style: none;
            display: inline-block;
        }
        #sidebar ul li a {
            background: none;
            border-bottom: none;
            font-weight: normal;
            text-decoration: none;
            padding: 0 15px;
            font-size: 12px;
        }
        #sidebar ul li a:hover,
        #sidebar ul li a:focus {
            opacity: 0.8;
            filter: alpha(opacity=8);
        }
    #consulting01 h2,
    #consulting04 h2 {
        margin-bottom: 30px;
    }
    h3.h3_support {
        margin: 30px 0 10px;
    }
    #infoBlock .container h3 {
        text-align: left;
    }
    #infoBlock .container .dl-horizontal dt,
    #infoBlock .container .dl-horizontal dd {
        line-height: 1.6;
    }
    #infoBlock .container .dl-horizontal dd {
        margin-bottom: 10px;
        padding-bottom: 10px;
        border-bottom: 1px dotted #cccccc;
    }
}
@media (max-width: 479px) {
    #sidebar ul li,
    #sidebar ul li a {
        display: block;
        width: 100%;
        text-align: left;
    }
    #sidebar ul li a {
        background: url(../img/li_w_arrow.webp) #003960 right center no-repeat;
        border-bottom: 1px dotted #ffffff;
        padding: 10px 0;
    }
    .modal-body img {
        max-width: 100%;
    }
}
@media (min-width: 992px) {
    header ul.nav {
        width: 65%;
    }
}
@media (max-width: 991px) {
    #info ul li dl dt,
    #info ul li dl dd {
        float: none;
        width: auto;
    }
    #info ul li dl dd {
        margin: 5px 0 0 15px;
    }
    #consulting p {
        padding: 0;
    }
    #infoBlock .container {
        padding: 20px;
    }
    #infoBlock .container h3 {
        font-size: 16px;
    }
}
@media (min-width: 1200px) {
    header ul.nav {
        width: 60%;
    }
}