@font-face {
    font-family: 'Gliscor Gothic';
    src: url('../fonts/GliscorGothic.eot');
    src: url('../fonts/GliscorGothic.eot?#iefix') format('embedded-opentype'), url('../fonts/GliscorGothic.ttf') format('truetype'), url('../fonts/GliscorGothic.svg#GliscorGothic') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Mulish';
    src: url('../fonts/Mulish-ExtraLight.ttf') format('truetype');
}

@font-face {
    font-family: 'FuturaBoldCondensedBT';
    src: url('../fonts/FuturaBoldCondensedBT.ttf') format('truetype');
}

html {
    height: 100%;
}

body {
    font-family: 'Gliscor Gothic';
}

ul {
    list-style-type: none;
    padding-left: 0px;
}

a:hover {
    color: #ff4500;
    text-decoration: none;
}

img {
    max-width: 100%;
}


/** header starts **/

header {
    padding-top: 25px;
}


/* .logo {
    float:right;
} */


/* .logo img {
    width: 120px;
}
 */


/** header ends **/


/** gender starts **/

.title {
    text-transform: uppercase;
    font-size: 60px;
    margin-bottom: 20px;
}

.padd_top {
    margin-top: 10px;
}


/* .gender_list {
	margin-top:-125px;
} */

.garments {
    margin-top: 20px;
}

.modifs h3 {
    font-size: 24px;
    margin-bottom: 10px;
    text-transform: inherit;
}

@media only screen and (max-width: 767px) {
    .title {
        font-size: 30px;
    }
    .padd_top {
        margin-top: 50px;
    }
    /* .gender_list {
		margin-top:0px;
		padding-top:35px;
	} */
    .garments {
        margin-top: 0px;
        padding-top: 35px;
    }
}


/** gender ends **/


/** Garments Starts **/

.small_title {
    text-transform: uppercase;
    font-size: 30px;
}

.jersey h3 {
    text-transform: uppercase;
    padding-top: 40px;
    padding-bottom: 35px;
}

.jersey h3 a {
    color: #000000;
    font-family: 'Mulish';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 33px;
    text-align: center;
    text-transform: capitalize;
}

.title {
    text-transform: uppercase;
    margin-bottom: 52px;
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 40px;
    line-height: 47px;
    text-align: center;
    color: #FF6B00;
}

.jersey h3 a:hover,
.jersey:hover h3 a {
    color: #ff4500;
}

.jersey img {
    transition: transform .2s;
    cursor: pointer;
}

.jersey img:hover {
    -ms-transform: scale(1.1);
    /* IE 9 */
    -webkit-transform: scale(1.1);
    /* Safari 3-8 */
    transform: scale(1.1);
}

.pos_rel {
    position: relative;
}

.side_menu {
    width: 100%;
    display: inline-block;
}

.side_menu ul li {
    text-align: center;
    text-transform: uppercase;
    line-height: 20px;
    margin-bottom: 20px;
    position: relative;
    cursor: pointer;
    display: inline-block;
}

.side_menu ul li a {
    color: #000;
    font-size: 20px;
}

.top_menu li,
.top_menu2 li {
    position: relative;
    cursor: pointer;
}

.top_menu li a,
.top_menu2 li a {
    color: #000;
    font-size: 24px;
    text-transform: uppercase;
}

.side_menu ul li a:hover,
.top_menu li a:hover,
.top_menu2 li a:hover {
    color: #ff4500;
}

.sub_menu {
    display: none;
}

.sub_menu2 {
    display: none;
}

.submenu {
    display: none;
    position: absolute;
    left: 110px;
    top: 5px;
    width: 170px;
}

.sub_menu li,
.sub_menu2 li {
    text-align: left;
    line-height: 20px;
}

.sub_menu li a,
.sub_menu2 li a {
    font-size: 22px;
}

.side_menu li.active .submenu {
    display: block;
}

.top_menu li a.active+.sub_menu {
    display: block;
    position: absolute;
    top: 7px;
    right: -70px;
}

.top_menu2 li a.active+.sub_menu2 {
    display: block;
    position: absolute;
    top: 5px;
    right: -180px;
}

.side_menu li.active .submenu li {
    padding-bottom: 10px;
    line-height: 10px;
}

.side_menu li.active .submenu li a {
    color: #000;
    font-size: 20px;
}

.side_menu li.active .submenu li a:hover,
.side_menu ul li.active a {
    color: #ff4500;
}

.side_menu>ul>li:after {
    content: "";
    width: 30px;
    height: 30px;
    background: url("../images/next.png") right center no-repeat;
    top: -4px;
    right: 5px;
    position: absolute;
    display: inline-block;
}

.top_menu>li>a:after {
    content: "";
    width: 30px;
    height: 30px;
    background: url("../images/next.png") right center no-repeat;
    top: 3px;
    right: -5px;
    position: absolute;
    display: inline-block;
    transform: rotate(180deg);
}

.top_menu2>li>a:after {
    content: "";
    width: 30px;
    height: 30px;
    background: url("../images/next.png") right center no-repeat;
    top: 2px;
    right: -25px;
    position: absolute;
    display: inline-block;
    transform: rotate(180deg);
}

.side_menu>ul>li:first-child:after {
    background: url("../images/prev.png") right center no-repeat;
}

.side_menu>ul>li:last-child:after {
    background: url("../images/prev.png") right center no-repeat;
}

.side_menu>ul>li.right_cont:after {
    background: url("../images/next.png") right center no-repeat;
}

.side_menu>ul>li.active:after,
.top_menu>li>a.active:after {
    transform: rotate(360deg);
    right: 15px;
}

.top_menu2>li>a.active:after {
    transform: rotate(360deg);
    right: -10px;
}

.side_menu>ul>li:last-child.active:after {
    transform: rotate(180deg);
    right: 0px;
}

.social_icons {
    padding-left: 0px;
}

.social_icons li {
    display: inline-block;
    padding: 0px 1px;
}

@media only screen and (max-width: 767px) {
    .top_menu {
        margin: 0px auto;
    }
    .top_menu2 {
        margin: 0px auto;
    }
    .sub_menu2,
    .sub_menu {
        position: inherit !important;
        right: -50px !important;
        margin-bottom: 15px;
    }
}

@media only screen and (max-width: 640px) {
    /* .side_menu{
        position:inherit !important;
        margin-top:50px;
        margin: 0px auto;
        left:35px !important;
		top: 10px;
    } */
    .jersey {
        margin-bottom: 90px;
    }
    .jersey img:hover {
        -ms-transform: scale(1.1);
        /* IE 9 */
        -webkit-transform: scale(1.1);
        /* Safari 3-8 */
        transform: scale(1.1);
    }
}

@media only screen and (min-width: 640px) and (max-width: 767px) {
    /*  .side_menu {
        top:35% !important;
    } */
    .padd_top {
        margin-top: 10px;
    }
    .jersey {
        margin-bottom: 65px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1500px) {
    .padd_top {
        margin-top: 10px;
    }
    .jersey {
        margin-bottom: 65px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1400px) {
    /* .side_menu {
        top:30% !important;
        position:fixed;
    } */
    /***.pack_body .side_menu {
        top:95% !important;
        position:fixed;
    }**/
    /* .ensemble .side_menu {
        top:55% !important;
        position:fixed;
    } */
    /* .pack_body .simulation .side_menu_right {
        /**top: 95% !important;
        right: 55px !important;
        left: inherit;
        position: fixed;
    } */
}


/** Simulation **/

.garments li#goback:after {
    background: url(../images/prev.png) right center no-repeat !important;
    left: -40px;
}


/* .modifs_design {
    border-right:3px solid #000;
    width: 100px;
    margin: 0px auto;
} */

.modifs_design li {
    border-radius: 30px;
    /* border:1px solid #000 !important; */
    border: 1px solid #ccc !important;
    width: 54px !important;
    height: 54px !important;
    margin-bottom: 20px !important;
    background: #fff;
    margin: 0px auto;
    overflow: hidden;
    cursor: pointer;
    outline: none;
}

.modifs_design li.active,
.modifs_design li:hover {
    border: 3px solid #FF4500 !important;
}

.modifs h3 {
    text-transform: uppercase;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 30px;
}


/* .colour {
    margin-top:80%;
    border-left:3px solid #000;
    padding-left:10px;	
    padding-top: 10px;
} */

.colour li {
    text-align: left;
    cursor: pointer;
    text-transform: uppercase;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    color: #000000;
    margin-bottom: 14px;
}

.colour li.active p {
    border: 3px solid #000;
    box-shadow: 0 0 0 0.2em currentColor inset, 0 0.2em 0.2em rgba(0, 0, 0, 0.2), 0 0.3em 0.2em rgba(0, 0, 0, 0.2) inset;
    display: inline-block;
    margin-right: 1.6em;
    vertical-align: bottom;
    width: 1.5em;
    height: 1.5em;
    transition: transform 0.2s cubic-bezier(0.5, 0, 0.5, 2), box-shadow 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95), color 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    color: #fff;
}

.colour li:hover p {
    border: 3px solid #000;
}

.colour li:hover,
.colour li.active {
    color: #ff4500;
}

.colour li p {
    margin-right: 15px;
    border-radius: 20px;
    float: left;
    border: 0px solid #ff0000;
    margin-top: 2px;
    border: 3px solid #000;
    box-shadow: 0 0 0 0.2em currentColor inset, 0 0.2em 0.2em rgba(0, 0, 0, 0.2), 0 0.3em 0.2em rgba(0, 0, 0, 0.2) inset;
    display: inline-block;
    margin-right: 1.6em;
    vertical-align: bottom;
    width: 1.5em;
    height: 1.5em;
    transition: transform 0.2s cubic-bezier(0.5, 0, 0.5, 2), box-shadow 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95), color 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    color: #fff;
    margin-bottom: 0;
}

.colour li p.yellow {
    background: #ffca1c;
}

.colour li p.black {
    background: #000;
}

.colour li p.white {
    background: #fff;
}


/* .side_menu_right {
    left:inherit;
    right:40px;
} */

.side_menu_right>ul>li:after {
    display: none;
}


/* .side_menu_right > ul > li:before {
    content: "";
    width: 30px;
    height: 30px;
    background: url(../images/next.png) right center no-repeat;
    top: -4px;
    left: -45px;
    position: absolute;
    display: inline-block;
} */

li#reset_control:before {
    background: url(../images/tick.png) right center no-repeat;
}


/* .simulation .side_menu {
    top:40%;
} */

.color_chooser {
    margin-top: 5%;
    position: relative;
}

.left-arrow {
    position: absolute;
    top: 70px;
    left: -25px;
}

.right-arrow {
    position: absolute;
    top: 80px;
    right: -70px;
}

.slick-carousel1 .slick-slide {
    margin: 0px 10px;
}

.slick-carousel1 .slick-list {
    top: -35px;
    left: 20px;
    width: 100%;
}

.slick-carousel1 li div {
    width: 35px;
    height: 80px;
    transition: all .2s ease-in-out;
}

.slick-carousel1 .slick-list {
    height: 90px;
    padding-top: 40px;
}

.slick-carousel1 li:hover div {
    transform: scaleY(2.0);
    transform-origin: bottom;
}

div.yellow {
    background: yellow;
}

div.grey {
    background: #828282;
}

div.black {
    background: #000;
}

div.red {
    background: #f70000;
}

div.green {
    background: #82e41f;
}

div.pink {
    background: #ff1af0;
}

div.violet {
    background: #824aea;
}

div.dull_blue {
    background: #82b9ce;
}

div.dark_green {
    background: #005b2b;
}

div.brown {
    background: #822442;
}

div.sky_blue {
    background: #82f6f2;
}

div.dark_blue {
    background: #2028bd;
}

.dev_btn {
    position: absolute;
    right: -300px;
    top: 80px;
}

.dev_btn button {
    background: #fe0000;
    border: 1px solid #fe0000;
    text-transform: uppercase;
    font-size: 24px;
    padding: 2px 25px;
    border-radius: 0px;
}

.dev_btn button:hover {
    background: #ff4500;
    border: 1px solid #ff4500;
}

#renderCanvas_single {
    width: 100%;
    height: 100%;
    touch-action: none;
}

#joystick_container {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute !important;
    padding: 0;
    margin: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    cursor: grab;
}

#babylonjsLoadingDiv {
    display: none;
}

.slick-carousel1 {
    -webkit-transition-property: transform;
    -moz-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .4s;
    -moz-transition-duration: .4s;
    transition-duration: .4s;
    -webkit-transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    -moz-transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    transform: translateX(0%);
    margin: 0;
    padding: 0;
    padding-top: 2rem;
    white-space: nowrap;
    position: relative;
}

.slick-carousel1 li {
    display: inline-block;
    margin-right: 0.5rem;
    position: relative;
}

.slick-carousel1 li:hover,
.slick-carousel1 li:focus {
    outline: none;
}

.slick-carousel1 li:hover span,
.slick-carousel1 li.active span {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    transform: scaleY(1);
    outline: none;
}

.slick-carousel1 li span {
    position: absolute;
    cursor: pointer;
    height: 80px !important;
    width: 35px !important;
    background-color: currentcolor;
    -webkit-transition-property: transform;
    -moz-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .1s;
    -moz-transition-duration: .1s;
    transition-duration: .1s;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: 0 100%;
    -moz-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.8);
    -moz-transform: scaleY(0.8);
    transform: scaleY(0.8);
}

.slick-carousel1 li:hover label {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
    outline: none;
}

.slick-carousel1 li label {
    position: absolute;
    font-size: 13px;
    top: -20px;
    left: 122%;
    -webkit-transform: translateX(-50%) translateY(1rem);
    -moz-transform: translateX(-50%) translateY(1rem);
    transform: translateX(-50%) translateY(1rem);
    -webkit-transition-property: transform, opacity, visibility;
    -moz-transition-property: transform, opacity, visibility;
    transition-property: transform, opacity, visibility;
    -webkit-transition-duration: .2s;
    -moz-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    text-transform: uppercase;
    opacity: 0;
    visibility: hidden;
    color: black;
}

.btn-danger {
    color: #fff;
    background-color: #1d70b8;
    border-color: #1d70b8;
    border-radius: 0px;
}

.btn-danger:hover {
    color: #fff;
    background-color: #FF4500;
    border-color: #FF4500;
}

@media only screen and (max-width: 991px) {
    .modifs_design {
        width: 280px !important;
    }
}

@media only screen and (max-width: 1024px) {
    .modifs_design {
        border-bottom: 0px solid #000 !important;
        margin-bottom: 15px !important;
    }
    .modifs {
        margin-bottom: 50px;
    }
    .colour {
        margin-top: 5% !important;
    }
    .slick-carousel1 .slick-slide {
        float: left;
    }
    .slick-carousel1 .slick-list {
        left: -7px;
    }
    .slick-carousel1 {
        margin-bottom: 15px;
        margin-top: 20px;
    }
    .modifs_design li {
        margin: 0px 10px;
    }
}

@media only screen and (max-width:767px) {
    /*     .simulation .side_menu_right {
        display:none;
    } */
    .dev_btn button {
        display: none
    }
}

@media only screen and (min-width:767px) {
    .right_cont {
        display: none;
    }
}

@media only screen and (min-width:767px) and (max-width:992px) {
    /* .simulation .side_menu {
        top: -185% !important;
        left: 0px;
        position: absolute;
    } */
    /* .simulation .side_menu_right {
        top: 40% !important;
        right: 0px !important;
        left: inherit;
        position: absolute;
    } */
    /* .ensemble .simulation .side_menu {
        top: -194% !important;
        left: 0px;
        position: absolute;
    }

    .ensemble .simulation .side_menu_right {
        top: 40% !important;
        right: 0px !important;
        left: inherit;
        position: absolute;
    } */
}

@media only screen and (min-width:992px) and (max-width:1350px) {
    /* .simulation .side_menu {
        top: -10% !important;
        left: 0px;
        position: absolute;
    } */
    .ensemble .simulation .side_menu {
        top: -23% !important;
        left: 0px;
        position: absolute;
    }
    /* .ensemble .simulation .side_menu_right {
        top: 61% !important;
        right: 0px !important;
        left: inherit;
        position: absolute;
    } */
    /* .simulation .side_menu_right {
       /* top: 46% !important;
	   top: 70% !important;
        right: 0px !important;
        left: inherit;
        position: absolute;
    } */
    /* .modifs_design{
        margin-left: 50px !important;
    } */
    .slick-carousel1 .slick-list {
        top: -50px !important;
        left: 0px;
    }
    .left-arrow,
    .right-arrow {
        top: 40px;
        z-index: 999;
    }
    .right-arrow {
        right: -40px;
    }
    .quantity-section h3 {
        font-size: 22px
    }
    .teamcount label,
    .gardien label {
        font-size: 18px !important;
        line-height: 20px !important;
        padding-top: 5px;
    }
}

@media only screen and (min-width:1351px) {
    /*  .simulation .side_menu {
        position: fixed;
        left: 40px;
        top: 36%;
        width: 100px;
        z-index: 999;
    } */
    /* .simulation .side_menu_right {
        left: inherit !important;
        right: 10px;
    } */
    .colour {
        margin-left: 5% !important;
    }
}

@media only screen and (max-width:1400px) {
    /**.side_menu_right {
            display:none;
    }
    .simulation .side_menu {
            left: 0px;
            right: 0px;
            margin: 0px auto;
    }**/
    .simulation .side_menu>ul>li::after {
        right: -15px;
    }
    .modifs_design {
        width: 100%;
        border-right: 0px solid #000;
        border-bottom: 3px solid #000;
        margin-bottom: 60px;
    }
    .modifs_design li {
        display: inline-block;
    }
    /* .colour {
        margin-top:10%;
        margin: 0px auto;
        width: 225px;
        margin-bottom: 28px;
    } */
}

@media only screen and (max-width:1800px) {
    .dev_btn {
        position: inherit;
        right: 0px;
        top: 0px;
        margin-bottom: 30px;
        margin-top: 0px;
    }
}

@media only screen and (min-width: 640px) and (max-width: 1400px) {
    /**.simulation .side_menu {
            position: inherit;
    }**/
    .modifs_design {
        margin-bottom: 90px;
    }
    /* .colour {
        margin-top:10%;
    } */
}

@media only screen and (min-width: 1400px) {
    /**.right_cont {
            display:none;
    }**/
}

@media only screen and (min-width: 992px) {
    .modifs_design li {
        display: block;
    }
    /*  .modifs_design {
        width:100px;
        border-right: 3px solid #000;
        border-bottom: 0px solid #000;
        margin-bottom: 10px;
        margin-left: 50px;
    } */
    /* .colour {
        margin-top:7%;
		margin-left:2%;
    } */
    .h3 {
        text-align: left;
    }
}

@media only screen and (min-width:420px) and (max-width:1200px) {
    .slick-carousel1 li label {
        left: 100%;
    }
}

@media only screen and (max-width:1500px) {
    .color_chooser {
        margin-top: 0px !important
    }
}

.model_name {
    text-transform: uppercase;
    font-size: 30px;
    padding-top: 20%;
}


/* .parralax {
    position: fixed;
    bottom: 0px;
    margin: 0px auto;
    width: 100%;
    background: #e3e3e3;
    left:0px;
} */

.parralax .color_chooser {
    margin-top: 0px;
}

.pack_body {
    height: auto;
}

@media only screen and (max-width:767px) {
    .model_name {
        padding-top: 0%;
        padding-bottom: 20px;
    }
    /*  .parralax {
        position:inherit;
        background:none;
        text-align:center;
    } */
    .pack_body .side_menu>ul>li::after {
        right: -15px;
    }
}

@media only screen and (min-width:767px) and (max-width:1800px) {
    .pack_body .slick-carousel1 {
        margin-bottom: 0px;
        padding-top: 45px;
    }
    .pack_body .dev_btn {
        margin-bottom: 10px;
        margin-top: 0px;
    }
    .pack_body .color_chooser {
        text-align: center;
    }
    .pack_body .left-arrow,
    .pack_body .right-arrow {
        z-index: 9999;
    }
    .model_name {
        padding-top: 0%;
        padding-bottom: 20px;
    }
}

@media only screen and (min-width:767px) and (max-width:1024px) {
    .pack_body .left-arrow {
        top: 10px !important;
    }
    .pack_body .right-arrow {
        top: 10px !important;
    }
}

@media only screen and (min-width:1025px) and (max-width:1400px) {
    .pack_body .left-arrow {
        top: 40px !important;
    }
    .pack_body .right-arrow {
        top: 50px !important;
    }
}

@media only screen and (min-width:1400px) and (max-width:1800px) {
    .pack_body .left-arrow {
        top: 40px !important;
    }
    .pack_body .right-arrow {
        top: 60px !important;
    }
}

@media only screen and (min-width:1400px) {
    .slick-carousel1 .slick-list {
        height: 100px;
        padding-top: 40px;
    }
    .slick-carousel1 .slick-list {
        top: -20px;
    }
    .pack_body .slick-carousel1 {
        padding-top: 0px;
    }
    .pack_body .right-arrow {
        top: 38px !important;
    }
    .pack_body .left-arrow {
        top: 20px !important;
    }
}

@media only screen and (min-width:1800px) {
    .dev_btn {
        top: 30px;
    }
    .slick-carousel1 li label {
        left: 80%;
    }
}


/**@media only screen and (max-width:1800px) {
        .model_name {
                padding-top:0%;
                padding-bottom:20px;
        }
        .parralax {
                position:inherit;
                background:none;
                text-align:center;
        }
        .pack_body .side_menu > ul > li::after {
                right:-15px;
        }
}
@media only screen and (min-width:767px) and (max-width:992px) {
        .pack_body .simulation .side_menu_right {
                top: 50% !important;
                right: 25px !important;
                left: inherit;
                position: absolute;
        }
        .pack_body .side_menu {
                position: absolute;
                top:0px !important;
        }
}
@media only screen and (min-width:992px) and (max-width:1350px) {
        .pack_body .simulation .side_menu_right{
                top: 100% !important;
                right: 25px !important;
                left: inherit;
                position: absolute;
        }
        .pack_body .side_menu {
                position: absolute;
                top:0px !important;
        }
}
@media only screen and (min-width:1800px) {
        .pack_body {
                height:auto;
                padding-bottom:165px;
        }
}**/

.modifs {
    z-index: 999;
}

.jersey_sim .img {
    transition-duration: 1s;
    transition-timing-function: ease;
}

.selected_model {
    transform: scale(1.6);
}

#renderCanvas_single,
#renderCanvas_top,
#renderCanvas_short {
    outline: none;
}

#renderCanvas {
    width: 100%;
    height: 90%;
    touch-action: none;
    position: absolute;
    top: 80px;
    outline: none;
    z-index: -9;
    left: 0px;
}

.sec_chooser li img {
    width: 25px;
    height: 25px;
    vertical-align: baseline;
}

.sec_chooser li.active p,
.sec_chooser li:hover p {
    border: 0px;
}

@media only screen and (min-width:768px) and (max-width:1024px) {
    .pack_body .slick-carousel1 .slick-list {
        padding-top: 45px !important;
    }
    /* .colour {
        margin-top: 0% !important;
    } */
}

@media only screen and (min-width:768px) and (max-width:1024px) and (orientation: portrait) {
    .quantity-section {
        width: 70% !important;
        margin: auto !important
    }
}

@media only screen and (min-width:768px) and (max-width:1400px) {
    .modifs h3 {
        font-size: 20px !important;
    }
    .slick-carousel1 li span {
        height: 65px !important;
    }
    .colour li p {
        width: 20px !important;
        height: 20px !important;
    }
    .pack_body .dev_btn {
        top: -38px !important;
    }
    .pack_body .slick-carousel1 .slick-list {
        padding-top: 30px;
        top: -48px;
    }
    /* .parralax {
		bottom: -35px;
	} */
}

.page_loader {
    position: fixed;
    background: #fff;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    text-align: center;
    padding-top: 20%;
    display: none;
    z-index: 99999;
}

.page_loader1 {
    position: fixed;
    background: rgba(0, 0, 0, 0.20);
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    text-align: center;
    padding-top: 20%;
    display: none;
    z-index: 99999;
}

.type_chooser li img {
    width: 40px;
    height: 31px;
    vertical-align: top;
    margin-top: -4px;
}

.type_chooser li {
    text-transform: uppercase;
    line-height: 25px;
    cursor: pointer;
}

.type_chooser li:hover,
.type_chooser li.active {
    color: #ff4500;
}

.type_chooser li p {
    width: 30px;
    height: 30px;
    margin-right: 15px;
    border-radius: 20px;
    float: left;
    border: 0px solid #ff0000;
    margin-top: 2px;
}

.type_color_chooser li p {
    width: 30px;
    height: 30px;
    margin-right: 15px;
    border-radius: 20px;
    float: left;
    border: 0px solid #ff0000;
    margin-top: 2px;
}

.type_color_chooser li p.yellow {
    background: #ffca1c;
}

.type_color_chooser li p.black {
    background: #000;
}

.type_color_chooser li p.white {
    background: #fff;
}

.type_color_chooser li {
    text-align: left;
    cursor: pointer;
    font-size: 20px;
    text-transform: uppercase;
}

.type_color_chooser li.active p,
.type_color_chooser li:hover p {
    border: 3px solid #ff4500;
}

.type_color_chooser li:hover,
.type_color_chooser li.active {
    color: #ff4500;
}

.slick-carousel2 {
    -webkit-transition-property: transform;
    -moz-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .4s;
    -moz-transition-duration: .4s;
    transition-duration: .4s;
    -webkit-transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    -moz-transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    transform: translateX(0%);
    margin: 0;
    padding: 0;
    padding-top: 2rem;
    white-space: nowrap;
    position: relative;
}

.slick-carousel2 li {
    display: inline-block;
    margin-right: 0.5rem;
    position: relative;
}

.slick-carousel2 li:hover,
.slick-carousel2 li:focus {
    outline: none;
}

.slick-carousel2 li:hover span,
.slick-carousel2 li.active span {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    transform: scaleY(1);
    outline: none;
}

.slick-carousel2 .slick-slide {
    margin: 0px 10px;
}

.slick-carousel2 .slick-list {
    top: -35px;
    left: 0px;
    width: 100%;
}

.slick-carousel2 li div {
    width: 35px;
    height: 80px;
    transition: all .2s ease-in-out;
}

.slick-carousel2 .slick-list {
    height: 150px;
    padding-top: 40px;
}

.slick-carousel2 li:hover div {
    transform: scaleY(2.0);
    transform-origin: bottom;
}

.slick-carousel2 li span {
    position: absolute;
    cursor: pointer;
    height: 100px !important;
    width: 35px !important;
    background-color: currentcolor;
    -webkit-transition-property: transform;
    -moz-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: .1s;
    -moz-transition-duration: .1s;
    transition-duration: .1s;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform-origin: 0 100%;
    -moz-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scaleY(0.8);
    -moz-transform: scaleY(0.8);
    transform: scaleY(0.8);
}

.slick-carousel2 li:hover label {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
    outline: none;
}

.slick-carousel2 li label {
    position: absolute;
    font-size: 13px;
    top: -2rem;
    left: 105%;
    -webkit-transform: translateX(-50%) translateY(1rem);
    -moz-transform: translateX(-50%) translateY(1rem);
    transform: translateX(-50%) translateY(1rem);
    -webkit-transition-property: transform, opacity, visibility;
    -moz-transition-property: transform, opacity, visibility;
    transition-property: transform, opacity, visibility;
    -webkit-transition-duration: .2s;
    -moz-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -moz-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
    text-transform: uppercase;
    opacity: 0;
    visibility: hidden;
    color: black;
}

.slick-carousel2 li:hover span,
.slick-carousel2 li.active span {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    transform: scaleY(1);
    outline: none;
}

.sum {
    padding: 5px 10px;
    margin: 0px 3px;
}

.bottom_color_list.mode_socks .slick-carousel1 {
    width: 50%;
    margin: 0px auto;
}

.bottom_color_list.mode_socks .slick-carousel1 .slick-track {
    transform: translate3d(0, 0, 0) !important;
}

.bottom_color_list.mode_socks .left-arrow,
.bottom_color_list.mode_socks .right-arrow {
    display: none;
}


/* .homebg{
	background:url('../images/homebg1.png') left center no-repeat;
	background-size: contain;
	background-attachment: fixed;
} */

.gender_list.desktop_view .para {
    font-size: 24px !important;
    line-height: 28px;
    padding: 0 70px;
    word-spacing: 0;
}

.gender_list.desktop_view .para strong {
    font-weight: normal;
}

.logo.desktop_view a {
    margin-top: 20px;
}

.quantity-section h3 {
    font-size: 25px;
    line-height: 22px;
}

.teamcount label,
.gardien label {
    font-size: 20px;
    width: 65px;
    line-height: 20px;
    text-align: left;
    float: left;
    padding-top: 6px;
}

.gardien label {
    padding-top: 15px;
}

.teamcount input,
.gardien input {
    float: left;
    width: 83px;
    margin-top: 11px;
    margin-right: 5px;
    padding: 0;
    border: 1px solid #FF6B00;
    height: 35px;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 33px;
    color: #000000;
    border-radius: 5px;
}

.teamcount .sum,
.gardien .sum {
    float: left;
    margin-top: 10px;
}

.teamcount .plus,
.gardien .plus {
    margin-right: 5px;
}

.teamcount .minus,
.gardien .minus {
    margin-right: 5px;
}

.gardien {
    display: block;
    clear: both
}

@media only screen and (max-width:1200px) {
    .homebg {
        background-position: -150px 0
    }
    .gender_list.desktop_view .para {
        padding: 0
    }
}


/** Mobile Desgins **/

@media only screen and (max-width:767px) {
    .desktop_view {
        /* display: none; */
        text-align: center;
    }
    .mobile_view {
        display: block;
    }
    .mobile_header {
        background-color: #000;
    }
    .t-shirts {
        width: 30%;
        margin-bottom: 30px;
    }
    .gender_list h1 {
        font-size: 35px !important;
    }
    .gender_list p {
        font-size: 16px !important;
        padding-top: 10px !important;
        margin-bottom: 0px;
        padding-bottom: 10px;
    }
    .gender_list ul li a {
        font-size: 28px;
    }
    .gender_list ul li {
        line-height: 30px;
    }
    .para {
        font-size: 16px !important;
    }
    .para br {
        display: none;
    }
    .jersey img {
        width: 60% !important;
        float: none !important;
    }
    .jersey h3 a {
        writing-mode: inherit !important;
        font-size: 23px !important;
    }
    .jersey h3 {
        padding-top: 10px !important;
    }
    .jersey {
        margin-bottom: 15px !important;
    }
    .pack_body .side_menu {
        left: 10px !important;
    }
    .gender_body,
    .garments {
        /*background:url('../images/football_bg.jpg') bottom center no-repeat;*/
        background-size: cover;
        background-attachment: fixed;
        background: #fff;
    }
    .pack_body {
        /*background:url('../images/football_bg.jpg') top center no-repeat;*/
        background-size: cover;
        background-attachment: fixed;
        background: #fff;
    }
    .gender_body .container {
        padding: 0px !important;
        width: 100%;
        max-width: 100%;
    }
    .gender_body .row {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    .gender_body header {
        padding-top: 0px !important;
    }
    .para-div.container {
        width: 90%;
        margin: 0px auto;
    }
    .load_jersery {
        background: url('../images/orange_bg.jpg') left center no-repeat;
        background-size: cover;
        background-attachment: fixed;
        background-position: center center;
    }
    .jersey_full {
        min-height: 100%;
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .quantity-section {
        width: 70% !important;
        margin: auto !important
    }
}

@media only screen and (max-width:580px) {
    .quantity-section {
        width: 100% !important;
        margin: auto !important
    }
}

@media only screen and (min-width:768px) {
    .mobile_view {
        display: none;
    }
    .desktop_view {
        display: block;
    }
    .t-shirts {
        width: 75%;
        margin-top: 60px;
    }
    .mobile_header {
        display: none !important;
    }
    #before_load {
        display: none;
    }
}

@media only screen and (min-width:768px) {
    .t-shirts {
        width: 55%;
    }
}

@media only screen and (min-width:992px) {
    .t-shirts {
        width: 35%;
    }
}

@media only screen and (min-width:1024px) {
    .t-shirts {
        width: 30%;
    }
}

.btn-valider,
.btn-continuer {
    border: 1px solid #FF6B00;
    text-transform: capitalize;
    font-size: 20px;
    padding: 2px 15px;
    border-radius: 0px;
    background: #FF6B00;
    border-radius: 4px;
    font-style: normal;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #FFFFFF;
    width: 165px;
    height: 56px;
    font-family: Mulish;
    font-weight: bold;
    text-shadow: none;
}


/*FOR MOBILE - START*/


/*.mobile-cont {
    width: 90%;
    margin: 0px auto;   
}*/

.content_area {
    background-color: #fff;
    padding: 0px 0px;
}

.header {
    padding-bottom: 20px;
}

.prod_sel ul {
    padding-left: 0px;
    list-style-type: none;
}

.prod_sel>ul li {
    width: 16%;
    border: 2px solid #000;
    margin: 0px 7px;
    text-align: center;
    border-radius: 20px;
}

.prod_sel>ul li img {
    width: 35px;
    margin: 0px auto;
}

.prod_sel .nav>li>a {
    display: inline-block !important;
    border: 1px solid transparent !important;
    padding: 5px 0px;
    border-radius: 20px;
}

.prod_sel .nav-tabs>li.active>a,
.prod_sel .nav-tabs>li.active>a:focus,
.prod_sel .nav-tabs>li.active>a:hover {
    border: 1px solid transparent !important;
}

.prod_sel .nav-tabs {
    border: 1px solid transparent !important;
}

.prod_sel .nav>li>a:hover {
    background: #fff !important;
}

.prod_sel .nav>li:hover {
    border: 2px solid #ff4500;
}

.prod_sel>ul li.active {
    border: 2px solid #ff4500;
    -webkit-box-shadow: 0 0 10px #463e3e;
    box-shadow: 0 0 10px #463e3e;
}

.prod_sel .tab-content>.active {
    border: 2px solid #ff4500 !important;
    -webkit-box-shadow: 0 0 10px #463e3e !important;
    box-shadow: 0 0 10px #463e3e !important;
}

.prod_sel .tab-content .tab-pane {
    border: 2px solid #000;
    border-radius: 20px;
    padding: 10px 10px;
}

.prod_sel .tab-content {
    width: 97%;
    margin: 0px auto;
    margin-top: 10px;
}

.prod_sel .tab-content h3 {
    text-align: center;
    font-size: 18px;
    line-height: 35px;
}

#menu ul {
    width: 150px;
    margin: 0px auto;
    margin-top: 30px;
}

#menu ul li img {
    width: 20px;
}

#menu ul li {
    padding-bottom: 15px;
}

.prod_sel .btn {
    color: #000;
    background-color: #ff4500;
    border-color: #ff4500;
    border-radius: 0px;
    text-transform: uppercase;
    width: 85%;
    font-weight: bold;
    padding: 15px 0px;
    font-size: 15px;
}

.prod_sel .tab-pane a {
    color: #000;
    font-weight: bold;
}

.prod_sel .tab-pane a:hover {
    text-decoration: none;
    color: #ff4500;
}

.prod_sel .col-xs-6 {
    width: 50%;
    float: left;
}

.prod_sel .colour {
    margin-top: 5px !important;
    margin-bottom: 0px !important;
}

.prod_sel .modifs {
    margin-bottom: 0px !important;
    text-align: center;
    position: relative;
}

.prod_sel .modifs .top-arrow {
    position: absolute;
    bottom: 9px;
    left: 3px;
}

.prod_sel .modifs_design {
    width: 240px !important;
}

.prod_sel .modifs_design li {
    margin: 0px 12px !important;
}

.prod_sel .modifs .bottom-arrow {
    position: absolute;
    bottom: 3px;
    right: 3px;
}

.prod_sel .modifs .slick-arrow img {
    width: 20px;
    height: 20px;
}

.prod_sel .colour li {
    font-size: 14px !important;
}

.prod_sel .colour li p {
    width: 25px !important;
    height: 18px !important;
    margin-top: 0px !important;
}

.prod_sel .type_chooser li p {
    width: 25px !important;
    height: 18px !important;
    margin-top: 0px !important;
}

.prod_sel .left-arrow,
.prod_sel .right-arrow {
    top: 0px !important;
}

.prod_sel .slick-carousel1 .slick-list {
    padding-top: 0px !important;
    top: 0px !important;
}

.prod_sel .slick-carousel1 {
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    padding-top: 0px !important;
}

.prod_sel .type_color_chooser li {
    font-size: 15px !important;
}

.prod_sel .type_color_chooser li p {
    width: 25px !important;
    height: 18px !important;
    margin-top: 0px !important;
}

.prod_sel ul.slick-carousel2 {
    padding-top: 0px !important;
}

.prod_sel .slick-carousel2 .slick-list {
    padding-top: 0px !important;
    top: -33px !important;
    height: 60px;
}

.prod_sel .slick-carousel2 {
    padding-top: 0px !important;
}

.prod_sel .type_chooser li {
    font-size: 14px;
}

.prod_sel .teamcount {
    width: 85%;
    margin: 0px auto;
}

.prod_sel .modifs_design li {
    width: 40px !important;
    height: 40px !important;
    margin-bottom: 0px !important;
}

.fade:not(.show) {
    opacity: unset;
}

@media only screen and (max-width: 768px) {
    #container {
        position: unset;
    }
    .colour {
        border-left: none;
    }
    .qty {
        text-align: center;
        font-size: 17px;
    }
}

ul.nav.nav-tabs li {
    margin: auto;
}


/*FOR MOBILE - END*/


/*.enjoyhint-step-6 #enjoyhint_label {
	margin-top: 13px;
}*/

.enjoyhint.enjoyhint-step-7 #enjoyhint_label {
    margin-left: 50px;
}

.enjoyhint_prev_btn {
    display: none;
}


/* ============================================ */


/* 24-3-2021 */


/* ============================================ */

@media(min-width: 1150px) {
    body .container {
        max-width: 1170px;
    }
}

@media(min-width: 1200px) {
    body.gender_body.pack_body .container {
        max-width: 1400px;
    }
}

.logo img {
    margin-top: 29px;
}

.logo.desktop_view a {
    margin-left: 13.2%;
}

@media only screen and (max-width: 1300px) {
    .logo img {
        padding-left: 12%;
        margin-top: 29px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1300px) {
    .logo img {
        padding-left: 12%;
        margin-top: 29px;
    }
}

.gender_list h1 {
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 43px;
    line-height: 57px;
    text-align: center;
    color: #000000;
    margin-bottom: 0;
    text-transform: uppercase;
}

.gender_list p {
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 36px;
    line-height: 42px;
    text-align: center;
    color: #000000;
    margin-top: 7px;
}

.gender_list.text-center.foot_bg {
    margin-top: 70px;
}

.orange {
    color: #ff4500;
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 40px;
    line-height: 47px;
    text-align: center;
    color: #FF6B00;
    margin-top: 8%;
    margin-bottom: 50px !important;
}

.gender_list ul li a {
    color: #000;
    text-transform: uppercase;
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 36px;
    line-height: 42px;
}

.gender_list ul li {
    line-height: 29px;
}

.gender_list ul li.active a,
.gender_list ul li a:hover {
    color: #ff4500;
}

div#catalog_container {
    margin-top: 50px !important;
}

ul.active-tab-showing {
    display: flex;
}

.active-tab-showing li {
    transition: all 0.4s;
    text-align: center;
    display: inline-block;
    padding: 1.5rem 3.7rem;
    width: 100%;
    color: #534C4C;
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
    cursor: pointer;
}

.active-tab-showing li.active {
    color: #000000;
}

.active-tab-showing li,
.footer-tab-list ul#sec_chooser li {
    border-top: 1px solid #000000;
}

.active-tab-showing li.active,
.footer-tab-list ul#sec_chooser li.active {
    border-top: 1px solid #FF6B00;
    color: #FF6B00;
    font-size: 20px;
}

.personnaliser-display {
    margin-top: 12px;
    display: inline-block;
}

.design-personnaliser .slick-slide img {
    display: initial;
    cursor: pointer;
}

.personnaliser-title {
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 33px;
    text-align: center;
    text-transform: capitalize;
    color: #000000;
    margin-top: 85px;
    margin-bottom: 57px;
}

#design-tab-list a.left-arrow.slick-arrow {
    top: 180px;
    left: -15px;
}

#design-tab-list a.right-arrow.slick-arrow {
    top: 180px;
    right: -15px;
}

.manches-part .jersey h3 {
    padding-bottom: 30px;
}

.footer-tab-list ul#sec_chooser li {
    padding: 20px 153px;
    transition: all 0.4s;
    text-align: center;
    display: inline-block;
    padding: 1rem 6.1rem;
    width: 100%;
    color: #534C4C;
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
}

.footer-tab-list ul#sec_chooser {
    margin-left: 0 !important;
    border-left: 0;
}

.simulation ul#Colour {
    padding: 0 !important;
    margin: 0 !important;
    text-align: left;
}

.simulation .colour li {
    display: inline-block;
    font-family: 'Open Sans';
}

.modifs {
    position: relative;
    width: 100%;
    float: left;
}

.modifs .left-arrow {
    top: 85px !important;
    left: -34px;
}

.modifs .right-arrow {
    top: 92px !important;
    right: -35px;
}

h4.productPrice {
    text-align: center;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 30px;
    line-height: 41px;
    color: #FF6B00 !important;
    margin-bottom: 0px;
    width: 100%;
    margin-top: 10px;
}

.teamcount label,
.gardien label {
    width: 84px;
    text-align: left;
    float: left;
    padding-top: 6px;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 25px;
    color: #000000;
    margin-right: 20px;
}

#simulator.footer-tab-list {
    background: #fff;
    position: relative;
    z-index: 999;
}

.simulation.padd_top.text-center.pos_rel .h3 {
    font-family: 'FuturaBoldCondensedBT';
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 25px;
    display: flex;
    align-items: center;
    text-align: justify;
    color: #000000;
    margin-bottom: 20px;
    letter-spacing: 1px;
}

a#up_qty,
a#down_qty {
    border: 1px solid #FF6B00;
    font-family: Open Sans;
    font-style: normal;
    font-weight: 600;
    font-size: 36px;
    line-height: 49px;
    display: flex;
    align-items: center;
    color: #000000;
    height: 35px;
    width: 35px;
    margin-left: 15px;
    border-radius: 5px;
}

.side_menu_right.side_menu {
    margin-top: 25px;
}

#parll ul.custom_color_list li,
#parlls ul.gardien_custom_colors li {
    float: left;
    width: 10px;
    height: 10px;
    border: 1px solid #000;
    border-radius: 11px;
    margin-right: 18px;
    margin-bottom: 15px;
    cursor: pointer;
}

#parll ul.custom_color_list li.active,
#parlls ul.custom_color_list li.active {
    box-shadow: 0 0 0 0.2em currentColor inset, 0 0.2em 0.2em rgba(0, 0, 0, 0.2), 0 0.3em 0.2em rgba(0, 0, 0, 0.2) inset;
    display: inline-block;
    vertical-align: top;
    transition: transform 0.2s cubic-bezier(0.5, 0, 0.5, 2), box-shadow 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95), color 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    color: #fff;
    width: 18px;
    height: 18px;
    margin-right: 14px;
    margin-top: -5px;
    margin-bottom: 12px;
    margin-left: -4px;
}

#parll label,
#parlls label {
    display: none;
}

div#parll .container,
div#parlls .container {
    padding: 0;
}

div#parll,
div#parlls {
    width: 100%;
    display: inline-block;
}

#parll .color_chooser ul.custom_color_list,
#parlls .color_chooser ul.custom_color_list {
    width: 93%;
    margin-left: 5px;
}

#step1 ul#Modifs {
    width: 85%;
}

#step1 ul#Modifs li {
    display: inline-block;
    margin: 0 !important;
}

.modifs_design li {
    width: 47px !important;
    height: 47px !important;
}

.simulation.padd_top.text-center.pos_rel .modifs .h3 {
    margin-top: 0px;
}

#step1 ul#Modifs li {
    display: inline-block;
    margin: 7px 2px!important;
}

.modifs #Modifs.slick-slider .slick-track,
.modifs #Modifs.slick-slider .slick-list {
    width: 262px !important;
    transform: unset !important;
}

.simulation ul#Colour li.active {
    height: 170px !important;
}

li#design_color {
    text-align: left;
    cursor: pointer;
    text-transform: uppercase;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    color: #000000;
    margin-bottom: 0px;
    display: inline-block;
}

ul#design_color_patten {
    text-align: left;
}

li#design_color p {
    margin-right: 15px;
    border-radius: 20px;
    float: left;
    border: 0px solid #ff0000;
    margin-top: 2px;
    border: 3px solid #000;
    box-shadow: 0 0 0 0.2em currentColor inset, 0 0.2em 0.2em rgba(0, 0, 0, 0.2), 0 0.3em 0.2em rgba(0, 0, 0, 0.2) inset;
    display: inline-block;
    margin-right: 1.6em;
    vertical-align: bottom;
    width: 1.5em;
    height: 1.5em;
    transition: transform 0.2s cubic-bezier(0.5, 0, 0.5, 2), box-shadow 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95), color 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    color: #fff;
    margin-bottom: 0;
}

li#design_color p {
    background: #fff;
}

li#design_color p.active {
    background: #000;
}

.Modifs-design {
    display: none;
}

.Modifs-design.active {
    display: block;
}

.left-side-option {
    width: 100%;
    float: left;
    margin-top: 33px;
    position: relative;
}

h2.title-maillot {
    text-transform: uppercase;
    margin-bottom: 20px;
    font-family: Gliscor Gothic;
    font-style: normal;
    font-weight: normal;
    font-size: 40px;
    line-height: 47px;
    text-align: center;
    color: #FF6B00;
}

#catalog_container_pack_tab,
#catalog_container_type_tab,
#catalog_container_manches_tab {
    margin-bottom: 150px;
}

#step1 ul#Modifs {
    margin-bottom: 0 !important;
}

.simulation.padd_top.text-center.pos_rel .row.mt-5 {
    margin-top: 2rem!important;
}

.gender_body.pack_body #simulator.footer-tab-list {
    padding-bottom: 30px;
    position: fixed;
    bottom: 0px;
    margin: 0px auto;
    width: 100%;
    background: #fff;
    left: 0px;
}

div#page_loaders img {
    width: 100px;
    height: 100px;
    border-radius: 10px;
    border: 5px solid #fff;
}

div#page_loader_loading {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    text-align: center;
    padding-top: 26%;
    display: block;
    z-index: 9999999;
    font-size: 36px;
    color: rgb(255, 255, 255);
    background: unset;
}

div#page_loaders {
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    text-align: center;
    display: block;
    z-index: 999999;
    padding-top: 20%;
}

.gender_list ul li {
    padding-bottom: 5px;
    box-shadow: rgb(0 0 0 / 25%) 0 0.0625em 0.0625em, rgb(0 0 0 / 25%) 0 0.125em 0.5em, rgb(255 255 255 / 10%) 0 0 0 1px inset;
    border-radius: 16px;
    padding-top: 5px;
    width: 20%;
    margin: 0 auto;
    margin-bottom: 10px;
}

#step3 .quantity-section label {
    display: inline-block;
    margin-bottom: 0;
    font-size: 35px;
    font-family: 'FuturaBoldCondensedBT';
    line-height: 36px;
}

div#for_team_members {
    display: inline-block;
    margin-top: 0px;
}

.qty_alert_info {
    margin-top: 4px;
    font-family: 'FuturaBoldCondensedBT';
}

button#loadGardien {
    margin-top: 33px;
    padding: 10px 24px;
    background-color: #6e17bb;
    border-color: #6e17bb;
}

#step3 .quantity-section .gardien label {
    display: inline-block;
    margin-bottom: .5rem;
    font-size: 35px;
    width: 100%;
    font-family: 'Gliscor Gothic';
    font-weight: normal;
    margin-top: 22px;
    color: #212529;
    text-align: center;
}

a#gardien_up_qty {
    border: 1px solid #FF6B00;
    margin-left: 15px;
    border-radius: 5px;
    width: 35px;
}

a#gardien_down_qty {
    border: 1px solid #FF6B00;
    margin-left: 15px;
    border-radius: 5px;
    width: 35px;
}

button#loadGardien:focus,
.btn-valider:focus,
.btn-continuer:focus {
    outline: none;
    box-shadow: none;
}

button#loadGardien:hover {
    border: 1px solid rgba(255, 255, 255, 0);
    transition: all .5s ease-in-out;
    background: #f44336;
    letter-spacing: 1px;
    color: #fff;
    border-color: #fff;
}

.btn-valider:hover,
.btn-continuer:hover,
#Gardien input#gardien_option_submit:hover,
.goback_Retour:hover {
    background-color: #FF4500;
    border: 1px solid rgba(255, 255, 255, 0);
    transition: all .55s ease-in-out;
    background: #FF4500;
    letter-spacing: 3px;
    color: #fff;
    border-color: #fff;
}

.modal-dialog {
    max-width: 1000px;
}

#Gardien ul#type_color_chooser li.active {
    height: 200px !important;
}

#Gardien #parlls .color_chooser ul.custom_color_list {
    width: 100%;
    margin-left: 5px;
}

#Gardien div#parlls {
    width: 60%;
}

#Gardien form#simulator_devis .modal-body .col-lg-6 {
    padding-left: 9%;
    padding-top: 3%;
    padding-bottom: 3%;
}

#Gardien .type_chooser li {
    font-size: 26px;
    margin-bottom: 33px;
    display: table;
}

#Gardien .type_color_chooser li {
    font-size: 22px;
    display: table;
}

#Gardien form#simulator_devis h4.modal-title {
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    color: #ff4500;
    font-family: 'Gliscor Gothic';
    font-size: 26px;
}

#Gardien .modal-footer {
    align-items: center;
    justify-content: center;
}

#Gardien input#gardien_option_submit {
    color: #fff;
    background-color: #FF6B00;
    border-color: #FF6B00;
    font-size: 20px;
    border-radius: 5px;
    padding: 5px 44px;
}

div#Gardien.modal {
    top: 18%;
    overflow: hidden;
}

#Gardien .type_color_chooser li p {
    border: 1px solid #000;
}

.footer-tab-list ul#sec_chooser li:hover,
.active-tab-showing li:hover {
    transition: all .55s ease-in-out;
    color: #FF4500;
    letter-spacing: 2px;
}

.simulation .colour li:hover {
    color: #FF4500;
}

a#up_qty:hover,
a#down_qty:hover,
a#gardien_up_qty:hover,
a#gardien_down_qty:hover {
    background: #FF6B00;
    color: #fff;
}

#parll ul.custom_color_list li:hover,
#parlls ul.gardien_custom_colors li:hover {
    transform: scale(3);
}

.modifs .slick-slide img:hover {
    transform: scale(1.4);
    transition: all .40s ease-in-out;
}


/* .gender_list ul li:hover {
    transform: scale(1.2);
    transition: all .50s ease-in-out;
} */

#page_loader {
    background: #000000 url("../images/cart_loading.png");
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

#page_loader h2 {
    font-size: 60px;
    color: #fff;
}

#parll ul.custom_color_list li.active:hover {
    transform: scale(1.8);
}

#parlls ul.gardien_custom_colors li.active {
    box-shadow: 0 0 0 0.2em currentColor inset, 0 0.2em 0.2em rgba(0, 0, 0, 0.2), 0 0.3em 0.2em rgba(0, 0, 0, 0.2) inset;
    display: inline-block;
    vertical-align: top;
    transition: transform 0.2s cubic-bezier(0.5, 0, 0.5, 2), box-shadow 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95), color 0.2s cubic-bezier(0.45, 0.05, 0.55, 0.95);
    color: #fff !important;
    width: 18px;
    height: 18px;
    margin-right: 14px;
    margin-top: -5px;
    margin-bottom: 12px;
    margin-left: -4px;
}

.design-personnaliser .slick-slide img:hover {
    opacity: 0.8;
}

.logo.desktop_view img {
    border: 10px solid #e6e6e6bd;
    padding: 20px;
}

.gender_list ul li a:hover {
    transition: all .55s ease-in-out;
    letter-spacing: 2px;
}

.goback_Retour {
    float: left;
    padding: 4px 30px;
    background: #ff6b00;
    border-radius: 5px;
    margin-top: 40px;
    display: none;
}

.goback_Retour a {
    color: #fff;
}

.btn-valider:before {
    background: url(../images/visibility_rounded.png) right center no-repeat;
    width: 25px;
    height: 25px;
    position: absolute;
    left: 23px;
    content: "";
}

.btn-valider:hover {
    letter-spacing: 1px;
}

@media(max-width: 1900px) {
    #parlls ul.gardien_custom_colors li:hover {
        transform: unset;
    }
}

@media (min-width:1025px) and (max-width:1500px) {
    .gender_list.text-center.foot_bg {
        margin-top: 100px;
    }
    .orange {
        margin-top: 6%;
    }
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 50px;
        border: 0;
    }
    div#page_loaders {
        padding-top: 17%;
    }
    .logo img {
        padding-left: 4%;
    }
    body.gender_body.pack_body .container {
        max-width: 1300px;
    }
    .logo img {
        padding-left: 5%;
    }
    .gender_list ul li {
        padding-bottom: 20px;
    }
    div#design-tab-list .personnaliser-title {
        margin-top: 50px;
        margin-bottom: 50px;
    }
    #step1 ul#Modifs {
        border: 0;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        padding-bottom: 72px;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-bottom: 50px;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        left: -25px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        right: -25px;
    }
    .orange {
        margin-top: 2%;
        margin-bottom: 25px !important;
    }
    .garments {
        margin-bottom: 16px;
        margin-top: 0;
    }
    .jersey {
        margin-bottom: 15px;
    }
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 80px;
    }
    .active-tab-showing li.active,
    .footer-tab-list ul#sec_chooser li.active {
        font-size: 23px;
    }
    .active-tab-showing li {
        font-size: 23px;
    }
    ul.active-tab-showing {
        margin-bottom: 0;
    }
    .footer-tab-list ul#sec_chooser li {
        font-size: 23px;
    }
    .personnaliser-display img {
        width: 70%;
    }
    #catalog_container_type_design {
        margin-bottom: 0;
        margin-top: 0;
    }
    .logo.desktop_view img {
        padding: 0px;
    }
    h2.title-maillot {
        margin-bottom: 0;
    }
    .design-personnaliser .slick-slide img {
        width: 80%;
    }
    .personnaliser-display {
        margin-top: 0;
    }
    .qty_alert_info {
        font-size: 17px;
    }
}

@media(max-width: 1370px) {
    .logo img {
        padding-left: 4.2%;
    }
    body.gender_body.pack_body .container {
        max-width: 1250px;
    }
}

@media (min-width: 1360px) and (max-width: 1800px) {
    .pack_body .logo.desktop_view {
        display: none;
    }
    .title {
        font-size: 34px;
    }
    .jersey h3 a {
        font-size: 22px;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        top: 132px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        top: 132px;
    }
    .personnaliser-title {
        font-size: 20px;
    }
    .logo.desktop_view a {
        margin-left: 5%;
    }
    .logo.desktop_view a {
        margin-top: 0;
    }
    .simulation.padd_top.text-center.pos_rel .row.mt-5 {
        margin-top: 35px !important;
    }
    .simulation.padd_top.text-center.pos_rel {
        height: 650px;
    }
    #renderCanvas {
        top: 41px;
    }
    #step3 .quantity-section label {
        font-size: 28px;
    }
    button#loadGardien {
        margin-top: 24px;
    }
    .side_menu_right.side_menu {
        margin-top: 5px;
    }
    #step3 .quantity-section .gardien label {
        font-size: 27px;
        margin-top: 0;
    }
    .goback_Retour {
        display: block;
    }
    .personnaliser-display img {
        width: 61%;
        margin-bottom: 20px;
        margin-top: 15px;
    }
}

@media (min-width: 1501px) and (max-width: 1600px) {
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 100px;
    }
    .personnaliser-title {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .simulation.padd_top.text-center.pos_rel {
        height: 700px;
    }
    div#page_loader_loading {
        padding-top: 28%;
    }
    .logo.desktop_view a {
        margin-left: 6.3%;
    }
}

@media (min-width: 1700px) and (max-width: 1800px) {
    .simulation.padd_top.text-center.pos_rel {
        height: 672px;
    }
}


/* Extra large devices (large laptops and desktops, 1200px and up) */

@media (max-width: 1280px) {
    .logo.desktop_view a {
        margin-left: 0;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        padding-bottom: 20px;
    }
    .teamcount label,
    .gardien label {
        font-size: 26px !important;
    }
    #step3 .quantity-section label {
        font-size: 28px;
    }
    body {
        background-color: unset;
    }
}

@media (min-width: 1100px) and (max-width: 1201px) {
    #catalog_container_type_design {
        margin-bottom: 0;
        margin-top: 0;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        padding-bottom: 0;
    }
    #renderCanvas {
        top: 14px;
    }
    .simulation ul#Colour li.active {
        height: 180px !important;
    }
    .simulation.padd_top.text-center.pos_rel {
        height: 569px;
    }
    .logo.desktop_view a {
        margin-left: 0;
    }
}

@media (max-width:1024px) {
    .orange {
        margin-top: 4%;
        margin-bottom: 20px !important;
    }
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 50px;
    }
    .garments {
        margin-top: 20px;
    }
    .active-tab-showing li {
        padding: 1.5rem 2rem;
    }
    .personnaliser-title {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    #catalog_container_type_design {
        margin-bottom: 0;
        margin-top: 0;
    }
    #design-tab-list .left-arrow,
    #design-tab-list .right-arrow {
        position: absolute;
    }
    .simulation.padd_top.text-center.pos_rel {
        height: 540px;
    }
    .logo.desktop_view a {
        margin-left: 0;
    }
    .gender_list ul li {
        padding-bottom: 20px;
    }
    div#page_loader_loading {
        padding-top: 35%;
    }
    .title {
        font-size: 35px;
        line-height: 30px;
    }
    .garments {
        margin-top: 0;
    }
    .jersey h3 {
        padding-top: 25px;
    }
    .teamcount label,
    .gardien label {
        font-size: 25px !important;
    }
    .simulation ul#Colour li.active {
        height: 180px !important;
    }
    .jersey h3 a {
        font-size: 20px;
    }
    .jersey {
        margin-bottom: 20px;
    }
    .logo.desktop_view img {
        padding: 5px;
    }
    .personnaliser-display .design-garment {
        max-width: 57%;
    }
    .personnaliser-title {
        font-size: 18px;
    }
    h2.title-maillot {
        font-size: 35px;
        margin-bottom: 0;
        line-height: 37px;
    }
    .active-tab-showing li {
        padding: 1rem 2rem;
    }
    .design-personnaliser .slick-slide img {
        width: 70%;
    }
    .logo img {
        margin-top: 12px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        top: 120px;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        top: 120px;
    }
    .footer-tab-list ul#sec_chooser li {
        padding: 1rem 3rem;
        margin-bottom: 0;
    }
    #step3 .quantity-section label {
        font-size: 26px;
    }
    .modifs {
        margin-bottom: 10px;
    }
    .left-side-option {
        margin-top: 0;
    }
    .modifs h3 {
        font-size: 20px !important;
    }
    .colour {
        margin-top: 0% !important;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        padding-bottom: 0;
    }
    .side_menu_right.side_menu {
        margin-top: 0;
    }
    button#loadGardien {
        margin-top: 10px;
    }
    #parlls ul.gardien_custom_colors li.active {
        width: 15px;
        height: 15px;
    }
    #parll ul.custom_color_list li,
    #parlls ul.gardien_custom_colors li {
        margin-bottom: 13px;
    }
    .simulation.padd_top.text-center.pos_rel .row.mt-5 {
        margin-top: 2rem !important;
    }
    .simulation.padd_top.text-center.pos_rel {
        height: 630px;
    }
    #renderCanvas {
        top: 80px;
        width: 70%;
        height: 70%;
        right: 0;
        margin: 0 auto;
    }
    .qty_alert_info {
        font-size: 13px;
    }
    .simulation.padd_top.text-center.pos_rel .h3 {
        margin-bottom: 8px;
    }
    #parll .color_chooser ul.custom_color_list,
    #parlls .color_chooser ul.custom_color_list {
        width: 100%;
    }
    #parll ul.custom_color_list li.active,
    #parlls ul.custom_color_list li.active {
        width: 16px;
        height: 16px;
    }
    .modal-dialog {
        max-width: 800px;
    }
    .page_loader {
        padding-top: 60%;
    }
    #page_loader {
        background-size: cover;
    }
}

@media (max-width:992px) {
    .active-tab-showing li {
        padding: 1.5rem 0rem;
    }
    .active-tab-showing li {
        font-size: 20px;
    }
    div#page_loader_loading {
        padding-top: 35%;
    }
    .footer-tab-list ul#sec_chooser li {
        font-size: 21px;
    }
    .qty_alert_info {
        font-size: 13px;
    }
    .colour li {
        font-size: 16px;
        margin-bottom: 27px;
    }
    li#design_color {
        font-size: 16px;
    }
    .btn-valider,
    .btn-continuer {
        font-size: 20px;
    }
    button#loadGardien {
        font-size: 20px;
    }
    .footer-tab-list ul#sec_chooser li {
        padding: 1rem 2rem;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        padding-bottom: 0;
    }
    .colour li p {
        margin-right: 5px;
    }
    .colour li.active p {
        margin-right: 5px;
    }
    .modifs {
        margin-bottom: 20px;
    }
    .left-side-option {
        margin-top: 6px;
    }
    .modal-dialog {
        max-width: 800px;
    }
    .btn-valider,
    .btn-continuer {
        padding: 2px 10px;
        font-size: 16px;
        width: 137px;
        height: 42px;
    }
    button#loadGardien {
        padding: 5px 11px;
        font-size: 17px;
    }
}

@media (max-width:980px) {
    .gender_list.text-center.foot_bg {
        margin-top: 50px;
    }
    .orange {
        margin-top: 3%;
        font-size: 32px;
    }
    .gender_list ul li {
        padding-bottom: 4px;
    }
    .gender_list ul li a {
        font-size: 33px;
    }
    .jersey h3 a {
        font-size: 16px;
    }
    .active-tab-showing li {
        font-size: 20px;
    }
    .title {
        margin-bottom: 0;
        font-size: 33px;
    }
    .jersey {
        margin-bottom: 20px;
    }
    .personnaliser-title {
        font-size: 19px;
    }
    .gender_list p {
        font-size: 30px;
    }
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 6px;
    }
    div#page_loader_loading {
        padding-top: 31%;
    }
    #renderCanvas {
        width: 100%;
        height: 90%;
        top: 0px;
    }
    .modifs {
        margin-bottom: 6px;
    }
    .simulation.padd_top.text-center.pos_rel {
        height: auto;
    }
    .teamcount label,
    .gardien label {
        font-size: 24px !important;
        margin-top: 0 !important;
    }
    div#page_loader_loading {
        padding-top: 31%;
    }
    .gender_body.pack_body header {
        display: none;
    }
    .goback_Retour {
        display: block;
    }
    div#Gardien.modal {
        top: 6%;
        margin-top: 0;
    }
}

@media (max-width: 768px) {
    .simulation.padd_top div#step2 {
        display: none;
    }
    .simulation.padd_top .left-side-option {
        display: none;
    }
    .simulation.padd_top .goback_Retour {
        display: none;
    }
    li#mobile_design_color {
        transition: all 0.4s;
        text-align: center;
        padding: 0;
        width: 100%;
        color: #fff;
        font-family: Gliscor Gothic;
        font-style: normal;
        font-weight: normal;
        font-size: 18px;
        line-height: 21px;
        float: left;
        width: 47%;
        font-size: 22px;
        background: #000;
        padding: 6px 10px;
        border-radius: 20px;
        border-top: 4px solid #ff6b00;
        margin: 4px;
    }
    div#moble_selection_tab {
        display: block !important;
        position: absolute;
        margin: 0px auto;
        width: 80%;
        left: 0px;
        right: 0;
        top: -81px;
        border-bottom: 1px solid #000;
        padding-bottom: 5px;
    }
    .gender_body.pack_body header {
        display: block;
    }
    .goback_Retour {
        display: none;
    }
    #renderCanvas {
        width: 60%;
        height: 70%;
        top: 200px;
        border: 1px solid #e6e6e6;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        bottom: unset;
        top: 128px;
        position: absolute;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 105%;
    }
    div#step1 {
        background: #ccc;
        margin-bottom: 20px;
    }
    body {
        background-color: unset;
    }
}

@media only screen and (max-width: 768px) {
    .simulation.padd_top.text-center.pos_rel {
        height: 100%;
    }
    .gender_body.pack_body .col-sm-3,
    .gender_body.pack_body .col-sm-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .simulation .colour li {
        display: block;
    }
    .simulation ul#Colour li.active {
        height: 150px !important;
    }
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 100PX;
    }
    #renderCanvas {
        width: 60%;
        height: 50%;
        border: 1px solid #e6e6e6;
    }
    div#parll,
    div#parlls {
        width: 71%;
        margin-top: 0;
    }
    .modifs #Modifs.slick-slider .slick-track,
    .modifs #Modifs.slick-slider .slick-list {
        width: 89% !important;
    }
    #step3 .quantity-section .gardien label {
        font-size: 30px;
    }
    .gender_body.pack_body .col-sm-3,
    .gender_body.pack_body .col-sm-6 {
        flex: 0 0 78%;
        max-width: 78%;
        margin: 0 auto;
    }
    .modal-dialog {
        max-width: 600px;
    }
    div#Gardien.modal {
        top: 6%;
    }
    .modifs_design {
        width: 100% !important;
    }
    .gender_list ul li a {
        font-size: 36px;
    }
    .orange {
        font-size: 34px;
        margin-top: 2%;
    }
    .gender_list ul li {
        padding-bottom: 8px;
    }
    .gender_list ul li a {
        font-size: 31px;
    }
    #parlls ul.gardien_custom_colors li:hover {
        transform: unset;
    }
    .gender_list.text-center.foot_bg {
        margin-top: 0px;
    }
    .title {
        margin-bottom: 45px;
        font-size: 33px;
    }
    .garments {
        margin-top: 120px;
    }
    .personnaliser-title {
        margin-top: 80px;
        margin-bottom: 80px;
    }
    #design-tab-list a.left-arrow.slick-arrow,
    #design-tab-list a.right-arrow.slick-arrow {
        top: 173px;
    }
    div#page_loader_loading h2 {
        font-size: 22px;
    }
    div#page_loader_loading {
        padding-top: 35%;
    }
    .goback_Retour {
        margin-top: 0;
    }
    .side_menu_right.side_menu {
        margin-top: 0;
        margin-bottom: 15%;
    }
    div#page_loader_loading {
        padding-top: 71%;
    }
    div#page_loaders {
        padding-top: 54%;
    }
}

@media only screen and (max-width: 480px) {
    .jersey h3 {
        padding-bottom: 10px;
    }
    .jersey h3 a {
        font-size: 20px !important;
    }
    #catalog_container_pack_tab,
    #catalog_container_type_tab,
    #catalog_container_manches_tab {
        margin-bottom: 50px;
    }
    .active-tab-showing li {
        font-size: 15px;
    }
    .active-tab-showing li.active,
    .footer-tab-list ul#sec_chooser li.active {
        font-size: 15px;
    }
    .title {
        font-size: 27px;
    }
    .garments {
        margin-top: 0;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        top: 120px;
        left: 0px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        top: 120px;
        right: 0px;
    }
    h2.title-maillot {
        font-size: 35px;
    }
    .personnaliser-title {
        margin-top: 50px;
        margin-bottom: 57px;
    }
    div#page_loader_loading h2 {
        font-size: 22px;
    }
    div#page_loader_loading {
        padding-top: 43%;
    }
    .modifs #Modifs.slick-slider .slick-track,
    .modifs #Modifs.slick-slider .slick-list {
        width: 100% !important;
    }
    div#parll,
    div#parlls {
        width: 100%;
        margin-top: 6px;
    }
    .footer-tab-list ul#sec_chooser li {
        font-size: 16px;
    }
    .gender_list p {
        font-size: 36px;
    }
    .gender_list h1 {
        margin-top: 10px;
    }
    .footer-tab-list ul#sec_chooser li:hover,
    .active-tab-showing li:hover {
        letter-spacing: 0;
    }
    #parll ul.custom_color_list li,
    #parlls ul.gardien_custom_colors li {
        margin-right: 16px;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 137%;
    }
    #Gardien .type_chooser li {
        margin-bottom: 0px;
    }
    #Gardien div#parlls {
        width: 96%;
    }
    #Gardien ul#type_color_chooser li.active {
        height: 163px !important;
    }
    #renderCanvas {
        top: 13%;
    }
    #renderCanvas {
        width: 80%;
        height: 80%;
        border: 1px solid #e6e6e6;
    }
    #simulator_devis .modal-body {
        height: 500px;
        min-height: 500px;
        overflow: scroll;
    }
    .personnaliser-title {
        margin-top: 80px;
        margin-bottom: 80px;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        top: 150px;
        left: 0px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        top: 150px;
        right: 0px;
    }
    #parlls ul.gardien_custom_colors li.active {
        width: 16px;
        height: 16px;
    }
    .gender_body.pack_body .col-sm-3,
    .gender_body.pack_body .col-sm-6 {
        flex: 0 0 78%;
        max-width: 78%;
    }
    .gender_list p {
        font-size: 25px !important;
        line-height: 28px;
    }
    .gender_body.pack_body #simulator.footer-tab-list {
        top: 74px;
    }
    div#page_loader_loading {
        padding-top: 98%;
    }
    div#page_loaders {
        padding-top: 74%;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 151%;
    }
    div#moble_selection_tab {
        top: -39px;
    }
    div#step1 {
        margin-top: 20px;
    }
    .simulation.padd_top.text-center.pos_rel .h3 {
        margin-bottom: 14px;
        margin-top: 14px !important;
    }
    div#parll,
    div#parlls {
        margin-top: 27px;
    }
}

@media only screen and (max-width: 414px) {


    .gender_list h1 {
        font-size: 25px !important;
        line-height: 40px !important;
    }
    .personnaliser-title {
        font-size: 16px;
    }
    .personnaliser-title {
        margin-top: 80px;
        margin-bottom: 80px;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        top: 150px;
        left: 0px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        top: 150px;
        right: 0px;
    }
    .footer-tab-list ul#sec_chooser li {
        padding: 1rem 0rem;
    }
    #renderCanvas {
        top: 13%;
    }
    #renderCanvas {
        width: 80%;
        height: 80%;
        border: 1px solid #e6e6e6;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 145%;
    }
    .gender_body.pack_body .col-sm-3,
    .gender_body.pack_body .col-sm-6 {
        flex: 0 0 80%;
        max-width: 80%;
    }
    #simulator_devis .modal-body {
        height: 500px;
        min-height: 500px;
        overflow: scroll;
    }
    div#page_loader_loading {
        padding-top: 50%;
    }
    div#page_loaders {
        padding-top: 60%;
    }
    div#page_loader_loading {
        padding-top: 88%;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 166%;
    }
}

@media only screen and (max-width: 360px) {
    .orange {
        font-size: 30px;
        margin-bottom: 20px !important;
    }
    .gender_list ul li {
        padding-bottom: 10px;
    }
    .active-tab-showing li.active {
        font-size: 13px;
    }
    .footer-tab-list ul#sec_chooser li.active {
        font-size: 14px;
    }
    .active-tab-showing li {
        font-size: 13px;
    }
    .personnaliser-title {
        font-size: 15px;
        line-height: 20px;
    }
    .personnaliser-title {
        margin-top: 50px;
        margin-bottom: 57px;
    }
    .footer-tab-list ul#sec_chooser li {
        padding: 1rem 0rem;
    }
    .gender_body.pack_body .col-sm-3,
    .gender_body.pack_body .col-sm-6 {
        margin-top: 20px;
    }
    #parll .color_chooser ul.custom_color_list,
    #parlls .color_chooser ul.custom_color_list {
        width: 100%;
    }
    .simulation ul#Colour li.active {
        height: 150px !important;
    }
    .btn-valider,
    .btn-continuer {
        font-size: 15px;
    }
    .gender_list p {
        font-size: 15px !important;
    }
    .title {
        font-size: 23px;
    }
    .active-tab-showing li {
        font-size: 13px;
    }
    div#page_loaders {
        padding-top: 40%;
    }
    div#page_loader_loading {
        padding-top: 70%;
    }
    #renderCanvas {
        top: 17%;
    }
    #renderCanvas {
        width: 70%;
        height: 70%;
        border: 1px solid #e6e6e6;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 166%;
    }
    .footer-tab-list ul#sec_chooser li {
        font-size: 13px;
    }
    .simulation ul#Colour li.active {
        height: 150px !important;
    }
    .gender_body.pack_body .col-sm-3,
    .gender_body.pack_body .col-sm-6 {
        flex: 0 0 100%;
        max-width: 100%;
        margin: 0 auto;
    }
    #Gardien div#parlls {
        width: 92%;
    }
    #parll ul.custom_color_list li,
    #parlls ul.gardien_custom_colors li {
        margin-right: 18px;
    }
    #parlls ul.gardien_custom_colors li.active {
        width: 16px;
        height: 16px;
    }
    #Gardien ul#type_color_chooser li.active {
        height: 184px !important;
    }
    #simulator_devis .modal-body {
        height: 500px;
        min-height: 500px;
        overflow: scroll;
    }
    .gender_list p {
        font-size: 22px !important;
        line-height: 33px;
    }
    .gender_list.text-center.foot_bg {
        margin-top: 25px;
    }
}

@media only screen and (max-width: 320px) {
    .gender_list h1 {
        font-size: 27px !important;
    }
    .title {
        font-size: 23px;
    }
    div#page_loader_loading h2 {
        font-size: 18px;
    }
    .gender_list p {
        font-size: 13px !important;
        padding: 0 !important;
    }
    .orange {
        font-size: 21px;
        margin-bottom: 0px !important;
    }
    .gender_list ul li a {
        font-size: 20px;
    }
    .gender_list ul li {
        padding-bottom: 0;
    }
    .active-tab-showing li,
    .active-tab-showing li.active {
        font-size: 11px;
    }
    .personnaliser-title {
        margin-top: 30px;
        margin-bottom: 40px;
    }
    .personnaliser-title {
        font-size: 12px;
    }
    #design-tab-list a.right-arrow.slick-arrow {
        top: 95px;
    }
    #design-tab-list a.left-arrow.slick-arrow {
        top: 90px;
    }
    div#page_loader_loading {
        padding-top: 76%;
    }
    .simulation.padd_top.text-center.pos_rel {
        margin-top: 150%;
    }
    #simulator_devis .modal-body {
        height: 343px;
        min-height: 343px;
        overflow: scroll;
    }
    li#mobile_design_color {
        width: 45%;
        font-size: 14px;
    }
}

@media only screen and (max-width: 480px) {
    .gender_list ul li a {
        font-size: 25px;
    }
    .gender_list ul li {
        padding-bottom: 0px;
        padding-top: 0px;
        width: 30%;
    }
}

@media only screen and (max-width: 767px) {
    .logo.desktop_view img {
        width: 80px;
    }
}

@media only screen and (min-width: 768px) {
    .logo.desktop_view img {
        width: 90px;
    }
    .logo.desktop_view img {
        border: 10px solid #e6e6e6bd;
        padding: 10px;
    }
}