 /*========================================================================
   Use this file to add custom CSS easily


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

/*.tm-hero + .tm-inner-container, .tm-fullscreen + .tm-inner-container {
    margin-top: 38px!important;
}*/

@media screen and (min-width: 601px) and (max-width: 2000px){
  
#tm-top-a {
    margin-top: 19px!important;
}
  #tm-spotlight{
     margin-top: 0px!important;
  }
  
}

@media screen and (min-width: 200px) and (max-width: 300px){
html {
    font: 400 16px / 32px 'Varela Round';
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    background: #ffffff;
    color: #253856;
}
}

@media screen and (min-width: 201px) and (max-width: 400px){
.tm-toolbar a, .tm-toolbar a.uk-button-link, .tm-toolbar .uk-subnav > li > a {
  color:#253856!important;
}
}

.uk-article-meta {
    margin-top: 0px!important;
}

   @media (max-width : 768px) {
  .hidden-phone {
        display: none;
  }
}

.result-category {display: none;}
.categories-list {display: none;}

.uk-article-title{
  display:none!important;
}

#section-id-1626183071222 {
    padding: 30px 0px 0px 0px!important;
}
  

#tm-top-a{
          margin-top: 80px!important;
}

.white-popup-block {
    max-width: 2000px;
    height: auto!important;
}


#sppb-addon-1631525788395{
  display:none!important;
}
#sppb-addon-1631525788400{
  display:none!important;
}
#sppb-addon-1631525788405{
  display:none!important;
}
#sppb-addon-1631525788410{
  display:none!important;
}

.sppb-flipbox-panel {
    /*height: 380px!important;*/
}

#sppb-addon-1631521583439 {
    border-radius: 10px!important;
}

#sppb-addon-1631521583434{
    border-radius: 10px!important;
}


h3.sppb-addon-title{
  color: #de500b!important;
}

#sppb-modal-1631267563318 {
    background: #fff;
    padding: 0px 0px!important;
}

#sppb-modal-1631267563323{
  padding: 0px 0px!important;
}

#sppb-modal-1631220896726{
  padding: 0px 0px!important;
}


.protocole{
  margin-top:15px;
}
.uk-button-danger {
    background-color: #e40135!important;
    color: #ffffff;
}

#section-id-1617100347075 {
    padding: 0px 0px 0px 0px!important;
    margin: 0px 0px -25px 0px!important;
    box-shadow: 0 0 0 0 #ffffff;
}

.uk-button-primary2{
   background-color: #ffffffe8!important;
    color: #d4430d!important;
    font-size: 22px!important;
    padding: 9px 12px 9px 12px!important;
}
.sp-page-builder .page-content #section-id-1617056255045 {
    padding: 7px 5px 0px 7px!important;
    margin: 0px 0px 0px 0px;
    box-shadow: 0 0 0 0 #ffffff;
}

.tm-event-tab-footer {
    position: relative;
    bottom: 0;
    background: #f7faff;
    max-width: 100%;
    left: 0;
    right: 0;
    padding: 12px 1px 14px 29px!important;
}

.tm-slider-title {
    font-weight: 300;
    line-height: 38px;
    color: #428dc9;
    font-size: 27px;
}
@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kumbh+Sans&display=swap');


.parten{
     width: 359px;
    letter-spacing: 1px;
    font-size: 46px!important;
    background: #428dc9!important;
    padding: 23px!important;
    color: #ffffff!important;
    border-radius: 5px!important;
    margin-top: 10px!important;
}


.bgPart{
  background-color: #428dc9;
    padding: 10px 23px 10px 20px;
    color: #fff;
}
.uk-button-danger{
  font-size:19px!important;
}


/*@media (min-width: 300px) and (max-width: 528px) {
.uk-cover-background {
    background-image: url(/images/p4.jpg)!important;
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}
}*/

@media (min-width: 300px) and (max-width: 528px) {
  .serviceDM { display: block; margin-top: 0px; margin-left: 0px; width: 400px; height: 600px; background: url("https://www.elaraki.ac.ma/images/American_Diploma/ServicesMobile.png") no-repeat; 
}
}

@media (min-width: 529px) and (max-width: 1001px) {
  .serviceDM { display: block; margin-top: 0px; margin-left: 0px; width: 2300px; height: 363px; background: url("https://www.elaraki.ac.ma/images/American_Diploma/ServicesDesk2.jpg") no-repeat; 
}
  }
  
@media (min-width: 1000px) and (max-width: 2500px) {
  .serviceDM { display: block; margin-top: 0px; margin-left: 0px; width: 2300px; height: 600px; background: url("https://www.elaraki.ac.ma/images/American_Diploma/ServicesDesk.png") no-repeat; 
}
  }


	.box{
	
    height: 183px;
    padding: 40px 60px;
    color: white;
    font-family: sans-serif;
    text-align: center;
	}


	.section-3{
		background-image: url(http://elaraki.ac.ma/images/diplomaj.jpg);
        background-attachment: fixed;
        background-size: cover;
	}

	.box p{
		font-size: 20px;
		margin-top: 100px;
	}

	.box h1{
      
    background: url("http://elaraki.ac.ma/images/diplomaInter.png") no-repeat; 
	color: #fff;
    font-size: 50px;
  
	}




.bl{
    background: #00a7d9;
    padding: 16px;
    color: #fff;
    border-radius: 6px;
}

.uk-alert2{
   margin-bottom: 20px;
    padding: 19px 0 5px 29px;
    background: rgb(234 70 7 / 2%);
    color: #428dc9;
    box-shadow: inset 0 0 0 1px #ec5700, inset 4px 0 0 #ec4100;
    border-radius: 4px;
    color: #e43500;
    font-size: 18px;

}
   
.tit{
  font-size:48px;
  font-family: 'Kumbh Sans', sans-serif;
  font-weight: 600;
    color: #2d408f
}


.uki-h1 {
    font-size: 37px;
    background: #eaf8fd;
    padding: 23px;
    color: #21658c;
    border-radius: 14px;
    margin-top: 10px;
}

@media (min-width: 460px) and (max-width: 2000px) {
  #tm-top-a {
    margin-top: 70px!important;
}
  
  .uki-h1 {
    font-size: 37px!important;
    background: #eaf8fd!important;
    padding: 23px!important;
    color: #21658c!important;
    border-radius: 14px!important;
    margin-top: 10px!important;
}
  
}

@media (min-width: 290px) and (max-width: 459px) {
#tm-top-a {
    margin-top: 0px!important;
}
    .uki-h1 {
    font-size: 28px!important;
    background: #eaf8fd!important;
    padding: 23px!important;
    color: #21658c!important;
    border-radius: 14px!important;
    margin-top: 10px!important;
}
}

@media (max-width: 450px){
  

.tm-isblog .tm-article {
    padding: 7px!important;
    overflow: hidden;
}
}

.uk-accordion-content {
    padding: 14px 3px 4px 10px!important;
}

.switcherContent {
    display: none!important;
}
.linko{
    padding: 21px;
    border-radius: 5px;
    background: #0f5288;
    color: #fff;
    font-size: 23px;
}
.linko2{
  padding: 21px;
    border-radius: 5px;
    background: #1a790e;
    color: #fff;
    font-size: 23px;
}

.debatH4{
  padding: 12px;
    background: #51a71b;
    color: #fff;
    font-size: 23px;
}

.uk-width-1-1 {
    /*margin-top:12px;*/
}

div.mod-languages li {
    margin-left: 0px;
    margin-right: 4px;
    padding-right: 0px!important;
}

.lang-active{
    padding: 2px 4px 3px 4px;
    border: 2px solid #80b2db;
}
.lin{
background: #d10048;
    padding: 12px 20px 11px 20px;
    border-radius: 6px;
    color: #fff;
}
.lin:hover{
    color: #fff;
}
.itemIntroText{
  display:none!important;
}


.lang-inline > li:nth-child(2){
  padding-right: 4px!important;
}


.uk-float-right > .uk-panel p:nth-child(1) {
            display:none!important; 
     }

.falang-missing{
  display:none;
}


a.flag img {
    vertical-align: middle;
    padding: 0;
    margin: 0;
    border: 0;
    display: inline;
  margin-left:6px;
    height: 20px!important;
    width: 20px!important;
  
}
@media (min-width: 290px) and (max-width: 499px) {
  .ti{
    color: #ffffff;
    margin-bottom: 14px;
    margin-top: 12px;
    background: #1687bd;
    border: 0px solid #d0d8dc;
    padding: 5px 16px 6px 16px;
    border-radius: 16px;
    font-size: 24px;
  }}


@media (min-width: 500px) and (max-width: 2000px) {
.ti{
    color: #ffffff;
    margin-bottom: 8px;
    margin-top: 12px;
    background: #1687bd;
    border: 0px solid #d0d8dc;
    padding: 16px 31px 17px 36px;
    border-radius: 16px;
}
}

.bk{
border: 1px solid #dbe5e4;
    background: #f6f6f6;
    padding: 56px 0px 8px 10px;
    border-radius: 9px;
    margin-top: -42px;
}



.line{
  margin-top: 38px;
    border: 1px solid #00a7d9;
    width: 507px;
}



.AC{
    margin-top: 21px!important;
    background-color: #f35c03;
    padding: 12px;
    border-radius: 4px;
    color: #fff;
}


@font-face{
font-weight: bold;
font-style: normal;
font-family: 'frutigerltarabic55roman';
src: url('http://elaraki.ac.ma/images/font/DINMEDIUM.OTF');
}

@font-face{
font-weight: bold;
font-style: normal;
font-family: 'DINREGULAR';
src: url('http://elaraki.ac.ma/images/font/DINREGULAR.OTF');
}

#jcemediabox-popup-caption > h4 {
      font-size: 15px;
}

[id*='wk-grid'] [class*='uk-animation-'] {  
    -webkit-animation-fill-mode: initial;  
    animation-fill-mode: initial;  
}


@media (min-width: 200px) and (max-width: 440px) {
.bgbg2 {
    position: relative;
    padding-left: 28px;
    background-color: #0404048c;
    width: 373px;
    /* height: 12px; */
    padding-top: 45px;
    padding-bottom: 45px;
    font-size: 18px;
}
}

@media (min-width: 441px) and (max-width: 1200px) {
.bgbg2{
position: relative;
    padding-left: 65px;
    background-color: #0404048c;
    width: 311px;
    /* height: 12px; */
    padding-top: 45px;
    padding-bottom: 45px;
    font-size: 20px;
}
}
.bgbg{
  
  width: 96%;
    height: 94%;
    background: url(http://elaraki.ac.ma/images/MUN/1_3.jpg);
    margin-top: -19px;
    /* margin-bottom: -24px; */
    position: absolute;
    padding-bottom: 0px;
  
  
  /* width: 1781px; height: 651px; background: url("http://elaraki.ac.ma/images/MUN/1_3.jpg") no-repeat; 
    max-width: 100%
    position: absolute;
    margin-top: -20px;*/
}

.isp{
  padding-bottom:12px;
}





.arabic{
   font-family: 'frutigerltarabic55roman';
   text-align: right;
}
.arabic2{
   font-family: 'DINREGULAR';
   text-align: right;
}

#first{
  display:none;
}
#hideslow{
  display:none;
}

#first2{
  display:none;
}
#hideslow2{
  display:none;
}


.cadre2{
  background-color:#fafafa;
  margin: 10px 10px 10px 10px;
  padding: 10px 10px 10px 10px;
  border: 1px rgba(0,0,0,0.2) dashed;
}

.cadre3 {
    font-size: 18px;
    color: #2d408f;
    border: 2px solid #f2f8fd;
    border-radius: 7px;
    background-color: #fefeff;
    margin: 10px 0px 10px 0px;
    padding: 20px 17px 10px 25px;
}

.cadre4 {
    border-radius: 7px;
    color: #fff;
    background-color: #084d80;
    margin: 10px 10px 20px 10px;
    padding: 10px 10px 10px 10px;
}

.cadre5 {
    border-radius: 7px;
    color: #084d80;
    background-color: #eff7fd;
    margin: 10px 10px 10px 10px;
    padding: 10px 45px 10px 10px;
}

.uki-h2 {
    background-color: #eff7fd;
    border-radius: 5px;
    font-size: 27px;
    line-height: 36px;
    padding: 8px 12px 8px 12px;
    color: #084d80;
    margin-top: 0px;
  margin-bottom: 40px;
}

@media (min-width: 200px) and (max-width: 541px) {
.uki-h2 {
    background-color: #eff7fd;
    border-radius: 5px;
    font-size: 24px;
    line-height: 32px;
    padding: 8px 12px 8px 12px;
    color: #084d80;
    margin-top: -8px;
}
}

.uk-nav-offcanvas > li > a {
    color: #ffffff;
    background-color: #162846;
    padding: 10px 20px;
    padding: 5px 40px;
}
html .uk-nav.uk-nav-offcanvas > li.uk-active > a {
    background: rgb(22, 40, 70);
    color: rgba(66, 141, 201, 0.8);
}

.uk-nav-offcanvas ul a {
    color: #ffffff;
}

.uk-nav-offcanvas ul a:before {
  width: 10px;
	height: 10px;
	background: #fff;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
	border-radius: 50px;
}


table.tabdeb {
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}
table.tabdeb caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}
table.tabdeb tr {
  background: #f8f8f8;
  border: 1px solid #ddd;
  padding: .35em;
}
table.tabdeb th,
table.tabdeb td {
  padding: .625em;
  text-align: center;
}
table.tabdeb th {
  font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;
}
@media screen and (max-width: 899px) {
  table.tabdeb {
    border: 0;
  }
  
  .tm-article-featured-image {
    position: relative;
    margin: 10px 0px 10px 24px;
}
  
  .tm-blog > .itemView > .uk-article-title {
    font-size: 25px;
    margin-top: -20px;
    line-height: 34px;
    margin-bottom: 30px;
}
  
  
   table.tabdeb caption {
    font-size: 1.3em;
  }
  table.tabdeb thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  table.tabdeb tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  table.tabdeb td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  table.tabdeb td:before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  table.tabdeb td:last-child {
    border-bottom: 0;
  }
  
  
}






.mm{background-color: #GGG
  font-size:19px;
}







.tm-slideset-gravity .uk-subnav{
  display:none;
}

.tm-article-featured-image {
  position: relative;
  margin: -30px 50px 10px;
}
 

.tm-news-tabs li figcaption {
  font-size: 24px;
  line-height: 36px;
  font-weight: 300;
  font-family: 'Open Sans';
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15);
  padding: 15px 15px 15px;
  -webkit-transform: rotate(90deg);
  transform: rotate(360deg);
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  background-color: rgba(66, 141, 201, 0.75);
  color: #ffffff;
  text-shadow: none;
  -webkit-transition: all cubic-bezier(0.27, 1.5, 0.32, 0.95) 0.5s;
  transition: all cubic-bezier(0.27, 1.5, 0.32, 0.95) 0.5s;
}



@media (min-width: 200px) and (max-width: 541px) {
  
  .tm-news-tabs li figcaption {
  font-size: 20px;
}
  
  
.itemRatingBlock {
    float:left;
    padding-top: 5px;
    /* margin-bottom: 20px; */
}
}

 .itemNext {
    float: right;
    margin-top: 18px;
    color: #34a24d;
    padding: 12px;
    background-color: #e9f5ec;
    border-radius: 10px;
}
    
  .itemPrevious {
    color: #e04848;
    padding: 12px;
    background-color: #fff0f0;
    border-radius: 10px;
}

@media (min-width: 300px) and (max-width: 899px) {
  /*articles*/
  
    .itemNext {
    margin-left: 20px;
    float: left;
    color: #34a24d;
    margin-bottom: 12px;
}
    
  .itemPrevious {
    float: right;
    margin-top: 6px;
    margin-bottom: 10px;
    color: #e04848;
}
  
  .tm-news-tabs li .tm-news-panel .tm-tabs-title {
    margin-bottom: 0px;
    margin-top: 0px;
    font-weight: 300;
    line-height: 41px;
    font-size: 27px;
    color: #428dc9;
}
  
  #k2Container > .itemImageBlock {
    width: 96%;
    margin-left: 12px;
}
  
  .uk-article-title{
    font-size: 22px;
    font-weight: 400;
    margin-bottom: 35px;
    line-height: 27px;
  }
.tm-article-featured-image {
    position: relative;
    margin: 0px -12px 10px 11px;
}
  
  .itemView .tm-article-featured-image {
    width: 100%;
    margin-top: -37px;
    margin-left: 7px;
}

  
 /*fin articles*/

}



#hidd2{
  display:block;
}




/* event pages, articles*/
.uk-article-meta {
  font-size: 16px;
}

.itemView > *:not(.itemImageBlock) {
  margin-left: 48px !important;
}

.tm-blog{
  margin-bottom:30px;
  padding-left:0px;
  
}

.tm-blog > .itemView > .uk-article-title{
   font-size: 31px;
   margin-top: 0px;
  line-height: 34px;
  margin-bottom:30px;
}

@media (min-width: 290px) and (max-width: 400px) {
  
  li.arabic > b{
    font-size: 12px;
    line-height: 0px;
  }
  
/*#tm-fullscreen p{
 display:none;
}*/
  
  b.uk-grid, strong.uk-grid {
    font-size: 14px;
    font-weight: bold;
}
  
  .uk-accordion-title{
    font-size:17px;
  }
  
  .itemView > *:not(.itemImageBlock) {
    margin-left: 15px !important;
    padding-left: 12px;
    font-size: 14px;
}
  
  .uk-article-meta {
    font-size: 14px;
}
  
  .uk-button{
    font-size: 14px;
    
}
  
  .itemRatingBlock {
    margin: 15px 0 10px 0;
    float: right;
    padding-top: 5px;
}
  
  .tm-blog > .itemView > .uk-article-title {
    font-size: 19px;
    font-weight: 400;
    margin-top: 0px;
    line-height: 34px;
    margin-bottom: 30px;
}
}


.tm-blog > .itemView > .uk-article-title:after{
  display:none;
}

.itemImageBlock  {
background-color: rgba(134, 134, 134, 0.1);
  padding: 4px;
}

.itemView{
background-color: rgba(189, 189, 189, 0.1);
  padding: 2px;
  padding: 22px 22px 12px 0px;
}

.tm-blog + .tm-blog {
   margin-top: 0px;
}

.tm-article-featured-image > a:before {
  display:none;
  content: "";
  background: rgba(66, 141, 201, 0.6);
  width: 110px;
  height: 100%;
  position: absolute;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.1);
  z-index: 1;
  -webkit-transition: all cubic-bezier(0.27, 1.5, 0.32, 0.95) 0.5s;
  transition: all cubic-bezier(0.27, 1.5, 0.32, 0.95) 0.5s;
}



.itemNext{
  margin-left:20px;
}

div.ba-gallery-items.category-0.category-1{
  display:none;
}

.ba-caption{
  display:none;
}

.itemBlock > .itemBody > .itemIntroText > .hidethis{
  display:none;
}

.itemBlock > .itemBody > .itemIntroText > .ba-gallery{ 
  display:none;
}


.itemBlock > .itemBody > .itemIntroText > div .ba-gallery{ 
  display:none;
}


.moduleItemIntrotext > .ba-gallery {
  display:none;
}

.ba-gallery p{
  display:none;
}

.itemLinks
{
   display:none;
}

.itemBottom br{
  display:none;
}

.uk-margin-large-top {
  margin-top: 1px !important;
}
/* fin article events*/




table.tabdeb {
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}
table.tabdeb caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}
table.tabdeb tr {
  background: #f8f8f8;
  border: 1px solid #ddd;
  padding: .35em;
}

table.tabdeb tr.ma {
  background: #fff7f7!important;
  border: 1px solid #f93e3e!important;
  padding: .35em;
}
table.tabdeb tr.ly {
  background: #f9fcfa;
  border: 1px solid #396;
  padding: .35em;
}

table.tabdeb th,
table.tabdeb td {
  padding: .625em;
  text-align: left;
}
table.tabdeb th {
  font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;
}
@media screen and (max-width: 899px) {
  table.tabdeb {
    border: 0;
  }
  
  .tm-article-featured-image {
    position: relative;
    margin: 10px 0px 10px 24px;
}
  
  .tm-blog > .itemView > .uk-article-title {
    font-size: 25px;
    margin-top: -20px;
    line-height: 34px;
    margin-bottom: 30px;
}
  
  
   table.tabdeb caption {
    font-size: 1.3em;
  }
  table.tabdeb thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  table.tabdeb tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  table.tabdeb td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  table.tabdeb td:before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  table.tabdeb td:last-child {
    border-bottom: 0;
  }
  
  
}












/*Examens*/


.back2{
  background: #18a74b;
    color: #ffffff;
    font-size: 27px;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-radius: .25em;
    padding: 16px;
}

.back{
  background: #e94b35;
    color: #ffffff;
    font-size: 27px;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-radius: .25em;
    padding: 16px;
}
.cd-form {
  width: 90%;
  max-width: 800px;
  margin: -2em auto;
}
.cd-form::after {
  clear: both;
  content: "";
  display: table;
}
.cd-form fieldset {
  margin: 24px 0;
}
.cd-form legend {
  padding-bottom: 10px;
  margin-bottom: 20px;
  font-size: 2rem;
  border-bottom: 1px solid #ecf0f1;
}
.cd-form div {
  /* form element wrapper */
  position: relative;
  margin: 20px 0;
}
.cd-form h4, .cd-form .cd-label {
  font-size: 1.3rem;
  color: #94aab0;
  margin-bottom: 10px;
}
.cd-form .cd-label {
  display: block;
}
.cd-form input, .cd-form textarea, .cd-form select, .cd-form label {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  color: #2b3e51;
}

.cd-form input[type="text"],
.cd-form input[type="email"],
.cd-form textarea,
.cd-form select,
.cd-form legend {
  display: block;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
}
.cd-form input[type="text"],
.cd-form input[type="email"],
.cd-form textarea,
.cd-form select {
  /* general style for input elements */
  padding: 12px;
  border: 1px solid #cfd9db;
  background-color: #ffffff;
  border-radius: .25em;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
}
.cd-form input[type="text"]:focus,
.cd-form input[type="email"]:focus,
.cd-form textarea:focus,
.cd-form select:focus {
  outline: none;
  border-color: #2c97de;
  box-shadow: 0 0 5px rgba(44, 151, 222, 0.2);
}
.cd-form .cd-select {
  /* select element wapper */
  position: relative;
}
.cd-form .cd-select::after {
  /* arrow icon for select element */
  content: '';
  position: absolute;
  z-index: 1;
  right: 16px;
  top: 50%;
  margin-top: -8px;
  display: block;
  width: 16px;
  height: 16px;
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-arrow.svg") no-repeat center center;
  pointer-events: none;
}
.cd-form select {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  cursor: pointer;
}
.cd-form select::-ms-expand {
  display: none;
}
.cd-form .cd-form-list {
  margin-top: 16px;
}
.cd-form .cd-form-list::after {
  clear: both;
  content: "";
  display: table;
}
.cd-form .cd-form-list li {
  /* wrapper for radio and checkbox input types */
  display: inline-block;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin: 0 26px 16px 0;
  float: left;
}


.cd-form input[type="button"] {
  /* button style */
  border: none;
  background: #2c97de;
  border-radius: .25em;
  padding: 16px 20px;
  color: #ffffff;
  font-weight: bold;
  float: right;
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
}
.no-touch .cd-form input[type="submit"]:hover {
  background: #42a2e1;
}
.cd-form input[type="submit"]:focus {
  outline: none;
  background: #2b3e51;
}
.cd-form input[type="submit"]:active {
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -o-transform: scale(0.9);
  transform: scale(0.9);
}
.cd-form [required] {
  background: url("http://elaraki.ac.ma/images/icone/cd-required.svg") no-repeat top right;
}
.cd-form .error-message p {
  background: #e94b35;
  color: #ffffff;
  font-size: 1.4rem;
  text-align: center;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  border-radius: .25em;
  padding: 16px;
}
.cd-form .error {
  border-color: #e94b35 !important;
}
@media only screen and (min-width: 600px) {
  .cd-form div {
    /* form element wrapper */
    margin: 32px 0;
  }
  .cd-form legend + div {
    /* reduce margin-top for first form element after the legend */
    margin-top: 20px;
  }
  .cd-form h4, .cd-form .cd-label {
    font-size: 1.4rem;
    margin-bottom: 10px;
  }
  .cd-form input[type="text"],
  .cd-form input[type="email"],
  .cd-form textarea,
  .cd-form select {
    padding: 16px;
  }
}

@-webkit-keyframes cd-bounce {
  0%, 100% {
    -webkit-transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.8);
  }
}
@-moz-keyframes cd-bounce {
  0%, 100% {
    -moz-transform: scale(1);
  }
  50% {
    -moz-transform: scale(0.8);
  }
}
@keyframes cd-bounce {
  0%, 100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
}
/* --------------------------------

Custom icons

-------------------------------- */
.cd-form .icon input, .cd-form .icon select, .cd-form .icon textarea {
  padding-left: 54px !important;
}
.cd-form .user {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-user.svg") no-repeat 16px center;
}
.cd-form [required].user {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-user.svg") no-repeat 16px center, url("../img/cd-required.svg") no-repeat top right;
}
.cd-form .company {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-company.svg") no-repeat 16px center;
}
.cd-form [required].company {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-company.svg") no-repeat 16px center, url("../img/cd-required.svg") no-repeat top right;
}
.cd-form .email {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-email.svg") no-repeat 16px center;
}
.cd-form [required].email {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-email.svg") no-repeat 16px center, url("../img/cd-required.svg") no-repeat top right;
}
.cd-form .budget {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-budget.svg") no-repeat 16px center;
}
.cd-form .message {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-message.svg") no-repeat 16px 16px;
}
.cd-form [required].message {
  background: url("http://elaraki.ac.ma/images/icone/cd-icon-message.svg") no-repeat 16px 16px, url("../img/cd-required.svg") no-repeat top right;
}

/* --------------------------------

FLoating labels

-------------------------------- */
.js .floating-labels div {
  margin: 28px 0;
}
.js .floating-labels .cd-label {
  position: absolute;
  top: 16px;
  left: 16px;
  font-size: 1.6rem;
  cursor: text;
  -webkit-transition: top 0.2s, left 0.2s, font-size 0.2s;
  -moz-transition: top 0.2s, left 0.2s, font-size 0.2s;
  transition: top 0.2s, left 0.2s, font-size 0.2s;
}
.js .floating-labels .icon .cd-label {
  left: 56px;
}
.js .floating-labels .cd-label.float {
  /* move label out the input field */
  font-size: 1.2rem;
  top: -16px;
  left: 0 !important;
}
@media only screen and (min-width: 600px) {
  .js .floating-labels legend + div {
    /* reduce margin-top for first form element after the legend */
    margin-top: 16px;
  }
  .js .floating-labels .cd-label {
    top: 20px;
  }
}