/*
=====================================================================
*   Fichier CSS studio krack
*   url: studiokrack.fr
*   @2021
=====================================================================

MENU

a. Webfonts and Icon fonts
b. Grid
c. Default Styles
   1. Basic
   2. Typography
   3. Links
   4. List
   5. Images
   6. Buttons
   7. Forms
d. Margin
e. Padding

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

/* ------------------------------------------------------------------ */
/* a. Webfonts and Icon fonts
 ------------------------------------------------------------------ */

@import url("fonts.css");

/* ------------------------------------------------------------------ */
/* b. Grid
/* ------------------------------------------------------------------ */

/* desktop
--------------------------------------------------------------- */

.row {
   max-width: 1200px;
   margin: 0 auto;

   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}
.row.full { max-width: 100% }
/* fixed width for IE8 */
.ie .row { width: 1200px ; }

.row .row { width: auto; max-width: 100% }

.col {
   position: relative;
   padding: 0 18px;
   float: left;
}

/* row clearing */
.row:before,
.row:after {
    content: " ";
    display: table;
}
.row:after {
    clear: both;
}
/* For IE 6/7 (trigger hasLayout) */
.row { *zoom: 1; }


/* removed gutters */
.row.collapsed .col,
col.collapsed { padding: 0; }

/* removed nested columns paddings */
.col .col:first-child { padding-left: 0; }
.col .col:last-child { padding-right: 0; }
/* If you'll be using IE8, use class ".last" in nested comlumns.
   ":last-child" is not supported in IE8 */
.ie .row .row .last { padding-right: 0; }

/* column widths */
.row .one-twelfth,     .row .g-1     { width: 8.33333%; }
.row .one-sixth,       .row .g-2     { width: 16.66667%; }
.row .one-fourth,      .row .g-3     { width: 25%; }
.row .one-third,       .row .g-4     { width: 33.33333%; }
.row .five-twelfths,   .row .g-5     { width: 41.66667%; }
.row .half,            .row .g-6     { width: 50%; }
.row .seven-twelfths,  .row .g-7     { width: 58.33333%; }
.row .two-thirds,      .row .g-8     { width: 66.66667%; }
.row .three-fourths,   .row .g-9     { width: 75%; }
.row .five-sixths,     .row .g-10    { width: 83.33333%; }
.row .eleven-twelfths, .row .g-11    { width: 91.66667%; }
.row .full,            .row .g-12    { width: 100%; }

/* Offsets */
.row .offset-1    { margin-left: 8.33333%; }
.row .offset-2    { margin-left: 16.66667%; }
.row .offset-3    { margin-left: 25%; }
.row .offset-4    { margin-left: 33.33333%; }
.row .offset-5    { margin-left: 41.66667%; }
.row .offset-6    { margin-left: 50%; }
.row .offset-7    { margin-left: 58.33333%; }
.row .offset-8    { margin-left: 66.66667%; }
.row .offset-9    { margin-left: 75%; }
.row .offset-10   { margin-left: 83.33333%; }
.row .offset-11   { margin-left: 91.66667%; }


/* smaller screens
--------------------------------------------------------------- */
@media only screen and (max-width: 800px) {

   /*.col { padding: 0 15px; } */

}

/* mobile wide
--------------------------------------------------------------- */
@media only screen and (max-width: 1000px) {

   .row {
	   width: 100%;
	   margin: 0 auto;
      padding: 0;
	}
   .col {
	   width: 100% !important;
	   float: none;
	   margin-left: 0;
	   margin-right: 0;
      padding: 0 15px;
    }
    /* for nested columns */
   .col .row { width: 100%; }
   .col .row .col { padding: 0; }

   /* Offsets */
   .row .offset-1    { margin-left: 0%; }
   .row .offset-2    { margin-left: 0%; }
   .row .offset-3    { margin-left: 0%; }
   .row .offset-4    { margin-left: 0%; }
   .row .offset-5    { margin-left: 0%; }
   .row .offset-6    { margin-left: 0%; }
   .row .offset-7    { margin-left: 0%; }
   .row .offset-8    { margin-left: 0%; }
   .row .offset-9    { margin-left: 0%; }
   .row .offset-10   { margin-left: 0%; }
   .row .offset-11   { margin-left: 0%; }
}

/* mobile narrow
--------------------------------------------------------------- */
@media only screen and (max-width: 480px) {

   .row { width: 100%; }

}

/* larger screens
--------------------------------------------------------------- */
@media screen and (min-width: 1200px) {

   .wide .row { max-width: 1180px; }
   .wide .col { padding: 0 20px; }

}

/* ------------------------------------------------------------------ */
/* c. Default Style
/* ------------------------------------------------------------------ */

/*  1. Basic
--------------------------------------------------------------------- */

*,
*:before,
*:after {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}

body {
   background-color: #454ADE;
	font: 15px/30px gt-regular, sans-serif;
	color: #FFFFFF;
   -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
	margin: 0;
	padding: 0;
}

.align_left {text-align: left;}
.align_center {text-align: center;}
.align_right {text-align: right;}

.grecaptcha-badge {opacity: 0; visibility: hidden;}

.fullheight {height: 100vh;}

.pull-right {float:right;}
.pull-left {float:left;}

/*  2. Typography
--------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {margin: 0 0 10px 0;}
p {margin: 0 0 20px 0;}

/*  3. Links
--------------------------------------------------------------------- */

a, a:visited {
text-decoration: none;
outline: 0;

-webkit-transition:color .3s ease-in-out;
-moz-transition:color .3s ease-in-out;
-o-transition:color .3s ease-in-out;
transition:color .3s ease-in-out;

}

p a, p a:visited { line-height: inherit; }

/*  4. List
--------------------------------------------------------------------- */

ul, ol { margin-bottom: 24px; margin-top: 12px; }
ul { list-style: none outside; }
ol { list-style: decimal; }
ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul.disc { list-style: disc outside; }
ul ul, ul ol,
ol ol, ol ul { margin: 6px 0 6px 30px; }
ul ul li, ul ol li,
ol ol li, ol ul li { margin-bottom: 6px; }
li { line-height: 18px; margin-bottom: 12px; }

/*  5. Images
--------------------------------------------------------------------- */

img {
   max-width: 100%;
   height: auto;
}

img.pull-right { margin: 12px 0px 0px 18px; }
img.pull-left { margin: 12px 18px 0px 0px; }

/*  6. Buttons
--------------------------------------------------------------------- */

.button,
.button:visited,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
   font: 24px/34px gt-medium, sans-serif;
   background: #1B1F3B;
   display: inline-block;
	text-decoration: none;
   letter-spacing: 0;
   color: #fff;
	padding: 14px 28px 14px 24px;
   border: none;
   cursor: pointer;
   height: auto;
	box-shadow: 24px 48px 64px rgba(27,21,59,.3);
    -webkit-transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-o-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;

   -moz-border-radius: 16px;
   -webkit-border-radius: 16px;
   -khtml-border-radius: 16px;
   border-radius: 16px;
	margin-bottom: 10px;
}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
   background: #05060c;
   color: #fff;
}

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
   background: #05060c;
   color: #fff;
}

.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
	width: 100%;
	padding-left: 0 !important;
	padding-right: 0 !important;
	text-align: center;
}

/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*  7. Forms
--------------------------------------------------------------------- */

form { margin-bottom: 24px; }
fieldset { margin-bottom: 24px; }
::placeholder {font-family: gt-regular; color: #454ADE;}
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
  	display: block;
   padding: 18px 18px;
   margin: 0 0 24px 0;
   border: 0;
   outline: none;
   vertical-align: middle;
   min-width: 100%;
	max-width: 100%;
   font-size: 18px;
   line-height: 24px;
	color: #1B1F3B;
	background: rgba(69, 74, 222,0.1);
    border-radius: 10px;
    box-shadow: 3px 4px 4px rgb(27 31 222 / 16%);
    border: 1px solid #454ADE;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
   color: #fff;
	background-color: #454ADE;
}

textarea { min-height: 180px; }

label,
legend {
   font: 14px/24px opensans-bold, sans-serif;
	margin: 12px 0;
   color: #3d4145;
   display: block;
}

input[type="checkbox"],
input[type="radio"] {
   font-size: 15px;
   color: #737373;
}

input[type="checkbox"] { display: inline; }

label span,
legend span {
	color: #8B9798;
   font: 14px/24px opensans-regular, sans-serif;
}

/* ------------------------------------------------------------------ */
/* d. Margin
/* ------------------------------------------------------------------ */

.m0 {margin: 0;}
.m1 {margin: 10px;}
.m2 {margin: 20px;}
.m3 {margin: 30px;}
.m4 {margin: 40px;}
.m5 {margin: 50px;}
.m6 {margin: 60px;}
.m7 {margin: 70px;}
.m8 {margin: 80px;}
.m9 {margin: 90px;}
.m10 {margin: 100px;}

/*  1. Margin top
--------------------------------------------------------------------- */

.mt0 {margin-top: 0;}
.mt1 {margin-top: 10px;}
.mt2 {margin-top: 20px;}
.mt3 {margin-top: 30px;}
.mt4 {margin-top: 40px;}
.mt5 {margin-top: 50px;}
.mt6 {margin-top: 60px;}
.mt7 {margin-top: 70px;}
.mt8 {margin-top: 80px;}
.mt9 {margin-top: 90px;}
.mt10 {margin-top: 100px;}

/*  2. Margin bottom
--------------------------------------------------------------------- */

.mb0 {margin-bottom: 0;}
.mb1 {margin-bottom: 10px;}
.mb2 {margin-bottom: 20px;}
.mb3 {margin-bottom: 30px;}
.mb4 {margin-bottom: 40px;}
.mb5 {margin-bottom: 50px;}
.mb6 {margin-bottom: 60px;}
.mb7 {margin-bottom: 70px;}
.mb8 {margin-bottom: 80px;}
.mb9 {margin-bottom: 90px;}
.mb10 {margin-bottom: 100px;}

/*  3. Margin left
--------------------------------------------------------------------- */

.ml0 {margin-left: 0;}
.ml1 {margin-left: 10px;}
.ml2 {margin-left: 20px;}
.ml3 {margin-left: 30px;}
.ml4 {margin-left: 40px;}
.ml5 {margin-left: 50px;}
.ml6 {margin-left: 60px;}
.ml7 {margin-left: 70px;}
.ml8 {margin-left: 80px;}
.ml9 {margin-left: 90px;}
.ml10 {margin-left: 100px;}

.mpl1 {margin-left: 1%;}
.mpl2 {margin-left: 2%;}
.mpl3 {margin-left: 3%;}
.mpl4 {margin-left: 4%;}
.mpl5 {margin-left: 5%;}
.mpl6 {margin-left: 6%;}
.mpl7 {margin-left: 7%;}
.mpl8 {margin-left: 8%;}
.mpl9 {margin-left: 9%;}
.mpl10 {margin-left: 10%;}
.mpl15 {margin-left: 15%;}
.mpl20 {margin-left: 20%;}
.mpl50 {margin-left: 50%;}


/*  4. Margin right
--------------------------------------------------------------------- */

.mr0 {margin-right: 0;}
.mr1 {margin-right: 10px;}
.mr2 {margin-right: 20px;}
.mr3 {margin-right: 30px;}
.mr4 {margin-right: 40px;}
.mr5 {margin-right: 50px;}
.mr6 {margin-right: 60px;}
.mr7 {margin-right: 70px;}
.mr8 {margin-right: 80px;}
.mr9 {margin-right: 90px;}
.mr10 {margin-right: 100px;}

.mpr1 {margin-right: 1%;}
.mpr2 {margin-right: 2%;}
.mpr3 {margin-right: 3%;}
.mpr4 {margin-right: 4%;}
.mpr5 {margin-right: 5%;}
.mpr6 {margin-right: 6%;}
.mpr7 {margin-right: 7%;}
.mpr8 {margin-right: 8%;}
.mpr9 {margin-right: 9%;}
.mpr10 {margin-right: 10%;}
.mpr15 {margin-right: 15%;}
.mpr20 {margin-right: 20%;}
.mpr50 {margin-right: 50%;}


/* ------------------------------------------------------------------ */
/* e. Padding
/* ------------------------------------------------------------------ */


.p0 {padding: 0;}
.p1 {padding: 10px;}
.p2 {padding: 20px;}
.p3 {padding: 30px;}
.p4 {padding: 40px;}
.p5 {padding: 50px;}
.p6 {padding: 60px;}
.p7 {padding: 70px;}
.p8 {padding: 80px;}
.p9 {padding: 90px;}
.p10 {padding: 100px;}
.p20 {padding: 200px;}

/*  1. Padding top
--------------------------------------------------------------------- */

.pt0 {padding-top: 0;}
.pt1 {padding-top: 10px;}
.pt2 {padding-top: 20px;}
.pt3 {padding-top: 30px;}
.pt4 {padding-top: 40px;}
.pt5 {padding-top: 50px;}
.pt6 {padding-top: 60px;}
.pt7 {padding-top: 70px;}
.pt8 {padding-top: 80px;}
.pt9 {padding-top: 90px;}
.pt10 {padding-top: 100px;}
.pt11 {padding-top: 110px;}
.pt12 {padding-top: 120px;}
.pt16 {padding-top: 160px;}
.pt18 {padding-top: 180px;}
.pt20 {padding-top: 200px;}
.pt22 {padding-top: 220px;}
.pt24 {padding-top: 240px;}
.pt26 {padding-top: 260px;}

/*  2. Padding bottom
--------------------------------------------------------------------- */

.pb0 {padding-bottom: 0;}
.pb1 {padding-bottom: 10px;}
.pb2 {padding-bottom: 20px;}
.pb3 {padding-bottom: 30px;}
.pb4 {padding-bottom: 40px;}
.pb5 {padding-bottom: 50px;}
.pb6 {padding-bottom: 60px;}
.pb7 {padding-bottom: 70px;}
.pb8 {padding-bottom: 80px;}
.pb9 {padding-bottom: 90px;}
.pb10 {padding-bottom: 100px;}
.pb12 {padding-bottom: 120px;}
.pb14 {padding-bottom: 140px;}
.pb16 {padding-bottom: 160px;}
.pb18 {padding-bottom: 180px;}
.pb20 {padding-bottom: 200px;}
.pb22 {padding-bottom: 220px;}
.pb24 {padding-bottom: 240px;}
.pb26 {padding-bottom: 260px;}

/*  3. Padding left
--------------------------------------------------------------------- */

.pl0 {padding-left: 0;}
.pl1 {padding-left: 10px;}
.pl2 {padding-left: 20px;}
.pl3 {padding-left: 30px;}
.pl4 {padding-left: 40px;}
.pl5 {padding-left: 50px;}
.pl6 {padding-left: 60px;}
.pl7 {padding-left: 70px;}
.pl8 {padding-left: 80px;}
.pl9 {padding-left: 90px;}
.pl10 {padding-left: 100px;}
.ppl0 {padding-left: 0;}
.ppl1 {padding-left: 1%;}
.ppl2 {padding-left: 2%;}
.ppl3 {padding-left: 3%;}
.ppl4 {padding-left: 4%;}
.ppl5 {padding-left: 5%}
.ppl6 {padding-left: 6%;}
.ppl7 {padding-left: 7%;}
.ppl8 {padding-left: 8%;}
.ppl9 {padding-left: 9%;}
.ppl10 {padding-left: 10%;}
.ppl15 {padding-left: 15%;}
.ppl20 {padding-left: 20%;}

/*  4. Padding right
--------------------------------------------------------------------- */

.pr0 {padding-right: 0;}
.pr1 {padding-right: 10px;}
.pr2 {padding-right: 20px;}
.pr3 {padding-right: 30px;}
.pr4 {padding-right: 40px;}
.pr5 {padding-right: 50px;}
.pr6 {padding-right: 60px;}
.pr7 {padding-right: 70px;}
.pr8 {padding-right: 80px;}
.pr9 {padding-right: 90px;}
.pr10 {padding-right: 100px;}

.ppr0 {padding-right: 0;}
.ppr1 {padding-right: 1%;}
.ppr2 {padding-right: 2%;}
.ppr3 {padding-right: 3%;}
.ppr4 {padding-right: 4%;}
.ppr5 {padding-right: 5%}
.ppr6 {padding-right: 6%;}
.ppr7 {padding-right: 7%;}
.ppr8 {padding-right: 8%;}
.ppr9 {padding-right: 9%;}
.ppr10 {padding-right: 10%;}
.ppr15 {padding-right: 15%;}
.ppr20 {padding-right: 20%;}